diff --git a/firebase.json b/firebase.json
index da5e83a..b4a76d4 100644
--- a/firebase.json
+++ b/firebase.json
@@ -4,7 +4,7 @@
"indexes": "firestore.indexes.json"
},
"hosting": {
- "public": "dist/wgenerator",
+ "public": "dist/wgenerator/browser",
"ignore": [
"firebase.json",
"**/.*",
diff --git a/src/app/modules/shows/show/show.component.html b/src/app/modules/shows/show/show.component.html
index ac2547f..2f3805b 100644
--- a/src/app/modules/shows/show/show.component.html
+++ b/src/app/modules/shows/show/show.component.html
@@ -52,6 +52,7 @@
[showText]="true"
[show]="show"
>
+ {{next}}
diff --git a/src/app/modules/shows/show/show.component.less b/src/app/modules/shows/show/show.component.less
index 43ac644..f57fde9 100644
--- a/src/app/modules/shows/show/show.component.less
+++ b/src/app/modules/shows/show/show.component.less
@@ -49,3 +49,14 @@
top: 12px;
z-index: 5;
}
+
+.next-song {
+ color: #0008;
+ position: fixed;
+ bottom: 0;
+ right: 10px;
+
+ fa-icon {
+ padding: 6px;
+ }
+}
diff --git a/src/app/modules/shows/show/show.component.ts b/src/app/modules/shows/show/show.component.ts
index f0858d5..98dba68 100644
--- a/src/app/modules/shows/show/show.component.ts
+++ b/src/app/modules/shows/show/show.component.ts
@@ -13,14 +13,15 @@ import {
faArrowUpRightFromSquare,
faBox,
faBoxOpen,
- faExternalLinkAlt,
+ faChevronRight,
faFile,
faFileDownload,
faFileLines,
faLock,
faMagnifyingGlassMinus,
faMagnifyingGlassPlus,
- faSliders, faUnlock,
+ faSliders,
+ faUnlock,
faUser,
faUsers,
} from '@fortawesome/free-solid-svg-icons';
@@ -61,6 +62,7 @@ export class ShowComponent implements OnInit, OnDestroy {
public textSize = 1;
public faFileLines = faFileLines;
public faFile = faFile;
+ public faNextSong = faChevronRight;
private subs: Subscription[] = [];
public constructor(
@@ -198,6 +200,12 @@ export class ShowComponent implements OnInit, OnDestroy {
if (useSwiper) openFullscreen();
else closeFullscreen();
}
+
+ public getNextSong(showSongs: ShowSong[], i: number): string {
+ if (!showSongs || showSongs.length === 0) return '';
+ const song = showSongs[i + 1];
+ return song?.title ?? '';
+ }
}
export interface Swiper {
diff --git a/src/app/widget-modules/components/song-text/song-text.component.html b/src/app/widget-modules/components/song-text/song-text.component.html
index 6d7446c..c42d1e2 100644
--- a/src/app/widget-modules/components/song-text/song-text.component.html
+++ b/src/app/widget-modules/components/song-text/song-text.component.html
@@ -24,8 +24,9 @@
*ngFor="let line of getLines(section)"
[class.chord]="line.type === 0"
[class.disabled]="checkDisabled(i)"
+ [class.comment]="isComment(line.text)"
class="line"
- >{{ line.text }}
+ >{{ transform(line.text) }}
diff --git a/src/app/widget-modules/components/song-text/song-text.component.less b/src/app/widget-modules/components/song-text/song-text.component.less
index 6258c19..993a656 100644
--- a/src/app/widget-modules/components/song-text/song-text.component.less
+++ b/src/app/widget-modules/components/song-text/song-text.component.less
@@ -72,3 +72,10 @@
font-size: 1.2em;
font-weight: bold;
}
+
+.comment {
+ color: #00b;
+ border-left: 2px solid #00b;
+ padding-left: 6px;
+ font-style: italic;
+}
diff --git a/src/app/widget-modules/components/song-text/song-text.component.ts b/src/app/widget-modules/components/song-text/song-text.component.ts
index 5fff08f..5ca1a00 100644
--- a/src/app/widget-modules/components/song-text/song-text.component.ts
+++ b/src/app/widget-modules/components/song-text/song-text.component.ts
@@ -124,4 +124,13 @@ export class SongTextComponent implements OnInit {
return 'show';
}
}
+
+ public transform(text: string): string {
+ if (this.isComment(text)) text = text.slice(1);
+ return text.trim();
+ }
+
+ public isComment(text: string) {
+ return text.startsWith('#');
+ }
}
diff --git a/src/custom-theme.scss b/src/custom-theme.scss
index 185173a..159ee5a 100644
--- a/src/custom-theme.scss
+++ b/src/custom-theme.scss
@@ -1,40 +1,5 @@
@use '@angular/material' as mat;
-// Custom Theming for Angular Material
-// For more information: https://material.angular.io/guide/theming
-// Plus imports for other components in your app.
-
-// Include the common styles for Angular Material. We include this here so that you only
-// have to load a single css file for Angular Material in your app.
-// Be sure that you only ever include this mixin once!
-// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
-// The following line adds:
-// 1. Default typography styles for all components
-// 2. Styles for typography hierarchy classes (e.g. .mat-headline-1)
-// If you specify typography styles for the components you use elsewhere, you should delete this line.
-// If you don't need the default component typographies but still want the hierarchy styles,
-// you can delete this line and instead use:
-// `@include mat.legacy-typography-hierarchy(mat.define-typography-config());`
-@include mat.all-component-typographies();
-@include mat.elevation-classes();
-@include mat.app-background();
-
-// Define the palettes for your theme using the Material Design palettes available in palette.scss
-// (imported above). For each palette, you can optionally specify a default, lighter, and darker
-// hue. Available color palettes: https://material.io/design/color/
-$wgenerator-primary: mat.m2-define-palette(mat.$m2-indigo-palette);
-$wgenerator-accent: mat.m2-define-palette(mat.$m2-pink-palette, A200, A100, A400);
-
-// The warn palette is optional (defaults to red).
-$wgenerator-warn: mat.m2-define-palette(mat.$m2-red-palette);
-
-// Create the theme object (a Sass map containing all of the palettes).
-$wgenerator-theme: mat.m2-define-light-theme($wgenerator-primary, $wgenerator-accent, $wgenerator-warn);
-
-// Include theme styles for core and each component used in your app.
-// Alternatively, you can import and @include the theme mixins for each component
-// that you are using.
-@include mat.all-component-themes($wgenerator-theme);
// Custom Theming for Angular Material