Added option to not add played to database

Added Search for inspiration
Added song for match point

cmd/frontend/src/components/items/InspirationWindow.vue

@@ -1,15 +1,25 @@
 <template>
     <div class="inspirationDiv">
+        <div class="inspirationHeader">
             <div class="inspirationTitle">
                 <h1>Inspiration</h1>
             </div>
+            <div  class="searchInput">
+                <input
+                    v-model="searchInputText"
+                    type="text"
+                    @input="searchGame()"
+                    ref="inputField"
+                />
+            </div>
+        </div>
         <transition-group
             tag="ul"
             name="inspirationList"
             class="inspirationList"
             ref="inspirationList"
         >
-         <li v-for="game in allGamesList" class="inspirationEntry" :key="game">
+            <li v-for="game in showingGamesList" class="inspirationEntry" :key="game">
                 {{ game }}
             </li>
         </transition-group>
@@ -23,7 +33,9 @@ export default {
     data() {
         return {
             allGamesList: [],
+            showingGamesList: [],
             scrollDown: true,
+            searchInputText: "",
         };
     },
     computed: {
@@ -38,6 +50,27 @@ export default {
         }
     },
     methods: {
+        searchGame() {
+            this.showingGamesList = [];
+            for (const game of this.allGamesList) {
+                if (this.searchInputText === "" ||
+                    game.toLowerCase().replace(/\s/g, "")
+                        .includes(this.searchInputText.toLowerCase().replace(/\s/g, ""))) {
+                    this.showingGamesList.push(game);
+                }
+            }
+            if (this.searchInputText.replace(/\s/g, "") !== "") {
+                this.showingGamesList.sort((n1, n2) => {
+                    if (n1 > n2) {
+                        return 1;
+                    }
+                    if (n1 < n2) {
+                        return -1;
+                    }
+                    return 0;
+                });
+            }
+        },
         scrollInspiration() {
             let inspirationListDOM = document.querySelector(".inspirationList");
             let scrollSpeed = 1;
@@ -59,6 +92,8 @@ export default {
             })
                 .then((response) => {
                     this.allGamesList = response.data;
+                    this.searchInputText = "";
+                    this.searchGame();
                     this.$store.dispatch("updateHowManyGames", this.allGamesList.length);
                 })
                 .catch(function(error) {
@@ -83,6 +118,22 @@ export default {
 }
 
 .inspirationTitle {
+    display: flex;
+    flex: auto;
+    align-items: flex-start;
+    justify-content: flex-start;
+    padding: 5px 10px;
+}
+
+.searchInput {
+    display: flex;
+    flex: auto;
+    align-items: flex-end;
+    justify-content: flex-end;
+    padding: 0 10px;
+}
+
+.inspirationHeader {
     display: flex;
     background-color: #333;
     height: 5vh;

cmd/frontend/src/components/items/extraButtons.vue

@@ -19,6 +19,7 @@ export default {
         async resetPoints() {
             this.$store.dispatch("resetPlayerScore");
             this.$store.dispatch("resetPlayerWelcomed");
+            this.$store.dispatch("resetPlayerMatchPoint");
             this.$store.dispatch("setRoundStarted", false);
         },
         async resetPlaylist() {
@@ -32,6 +33,7 @@ export default {
             await this.APIresetPlaylist();
             this.$store.dispatch("resetPlayerScore");
             this.$store.dispatch("resetPlayerWelcomed");
+            this.$store.dispatch("resetPlayerMatchPoint");
             this.$store.dispatch("setRoundStarted", false);
             this.$store.dispatch("updatePlaylistHistory", this.emptyPlaylist);
             this.$store.dispatch("setCurrentlyLoadingTrack", "N/A");

cmd/frontend/src/components/items/playersWindow.vue

@@ -122,6 +122,15 @@ export default {
                     this.$store.dispatch("changePlayerWelcomed", payload);
                     this.$emit("play-welcome-sound");
                 }
+                /* If a player reach match point */
+                if (this.listOfPlayers[i].score === this.winningScore-1) {
+                    let payload = {
+                        playerName: playerName,
+                        matchPointSet: true,
+                    };
+                    this.$store.dispatch("changePlayerMatchPoint", payload);
+                    this.$emit("play-match-point-sound");
+                }
                 /* If a player won */
                 if (this.listOfPlayers[i].score === this.winningScore) {
                     this.$refs.winningModal.openModal(this.listOfPlayers[i].playerName);

cmd/frontend/src/components/items/settingsModal.vue

@@ -32,6 +32,16 @@
                         />
                         <label for="hideTitle">Hide next track</label>
                     </div>
+                    <div class="checkboxDiv">
+                        <input
+                            type="checkbox"
+                            name="addPlayed"
+                            id="addPlayed"
+                            v-model="checkboxAddPlayed"
+                            @change="updateOptionAddPlayed"
+                        />
+                        <label for="addPlayed">Turn on played to database</label>
+                    </div>
                     <div class="checkboxDiv">
                         <input
                             type="checkbox"
@@ -74,11 +84,12 @@ export default {
             show: false,
             checkboxStopAfterCurrent: false,
             checkboxHideTitle: false,
+            checkboxAddPlayed: false,
             checkboxLowPlayed: false,
         };
     },
     computed: {
-        ...mapState(["winningScore", "roundStarted", "stopAfterCurrent", "hideNextTrack", "lowPlayed"]),
+        ...mapState(["winningScore", "roundStarted", "stopAfterCurrent", "hideNextTrack", "addPlayed", "lowPlayed"]),
     },
     methods: {
         closeModal() {
@@ -99,6 +110,13 @@ export default {
                 this.$store.dispatch("updateHideNextTitle", false);
             }
         },
+        updateOptionAddPlayed() {
+            if (this.checkboxAddPlayed) {
+                this.$store.dispatch("updateAddPlayed", true);
+            } else {
+                this.$store.dispatch("updateAddPlayed", false);
+            }
+        },
         updateOptionLowPlayed() {
             if (this.checkboxLowPlayed) {
                 this.$store.dispatch("updateLowPlayed", true);
@@ -124,6 +142,7 @@ export default {
     mounted() {
         this.checkboxStopAfterCurrent = this.stopAfterCurrent;
         this.checkboxHideTitle = this.hideNextTrack;
+        this.checkboxAddPlayed = this.addPlayed;
         this.checkboxLowPlayed = this.lowPlayed;
     },
 };

cmd/frontend/src/components/layout/TheFooter.vue

@@ -44,6 +44,7 @@ export default {
             "hideNextTrack",
             "roundStarted",
             "specialTrackIsPlaying",
+            "addPlayed",
             "lowPlayed",
         ]),
     },
@@ -65,6 +66,9 @@ export default {
                 } else {
                     await this.APIgetRandomizedTrack();
                 }
+                if (this.addPlayed) {
+                    await this.APIaddPlayed();
+                }
                 await this.APIaddToQue();
                 trackAddedToQue = true;
             }
@@ -72,8 +76,9 @@ export default {
             this.currentTrackSrcFile = window.URL.createObjectURL(copyOfPlaylist[0]);
             /*          this.$nextTick(() => {}); */
             if (!trackAddedToQue) {
-                await this.APIaddToQue();
+                await this.APIaddPlayed();
             }
+            await this.APIaddToQue();
             await this.APIgetPlaylistHistory();
 
             this.$refs.audioPlayer.play();
@@ -139,6 +144,15 @@ export default {
                 this.$refs.audioPlayer.play();
             });
         },
+        playMatchSound() {
+            this.$refs.audioPlayer.pause();
+            this.currentTrackSrcFile = "sounds/sound0.mp3";
+            this.$store.dispatch("setSpecialTrackIsPlaying", true);
+            this.$nextTick(() => {
+                this.$refs.audioPlayer.currentTime = 0;
+                this.$refs.audioPlayer.play();
+            });
+        },
         playWinningSound() {
             this.$refs.audioPlayer.pause();
             this.currentTrackSrcFile = "sounds/winning.mp3";
@@ -208,6 +222,21 @@ export default {
                     });
             });
         },
+        APIaddPlayed() {
+            return new Promise((resolve, reject) => {
+                this.axios({
+                    method: "get",
+                    url: `${arne.hostname}/music/addPlayed`,
+                })
+                    .then(() => {
+                        resolve(false);
+                    })
+                    .catch(function(error) {
+                        console.log(error);
+                        reject();
+                    });
+            });
+        },
         APIaddToQue() {
             return new Promise((resolve, reject) => {
                 this.axios({

cmd/frontend/src/components/layout/TheMain.vue

@@ -11,6 +11,7 @@
             ></playlist-history>
             <players-window
                 @play-welcome-sound="playWelcomeSound"
+                @play-match-point-sound="playMatchSound"
                 @play-winning-sound="playWinningSound"
             ></players-window>
         </div>
@@ -56,6 +57,9 @@ export default {
         playWelcomeSound() {
             this.$refs.theFooter.playWelcomeSound();
         },
+        playMatchSound() {
+            this.$refs.theFooter.playMatchSound();
+        },
         playWinningSound() {
             this.$refs.theFooter.playWinningSound();
         },

cmd/frontend/src/main.js

@@ -30,6 +30,7 @@ const store = createStore({
             /* Options */
             stopAfterCurrent: true,
             hideNextTrack: true,
+            addPlayed: true,
             lowPlayed: false,
         };
     },
@@ -67,6 +68,9 @@ const store = createStore({
         changePlayerWelcomed(state, payload) {
             state.listOfPlayers[payload.indexOfPlayer].welcomed = payload.playerWelcomeTrueOrFalse;
         },
+        changePlayerMatchPoint(state, payload) {
+            state.listOfPlayers[payload.indexOfPlayer].matchPoint = payload.playerMatchPointTrueOrFalse;
+        },
         changePlayerProfile(state, payload) {
             state.listOfPlayers[payload.indexOfPlayer].profile = payload.profileSrc;
         },
@@ -76,6 +80,9 @@ const store = createStore({
         resetPlayerWelcomed(state, payload) {
             state.listOfPlayers = payload;
         },
+        resetPlayerMatchPoint(state, payload) {
+            state.listOfPlayers = payload;
+        },
         updateLocalPlaylist(state, payload) {
             state.localPlaylist.push(payload);
         },
@@ -94,6 +101,9 @@ const store = createStore({
         updateHideNextTitle(state, payload) {
             state.hideNextTrack = payload;
         },
+        updateAddPlayed(state, payload) {
+            state.addPlayed = payload;
+        },
         updateLowPlayed(state, payload) {
             state.lowPlayed = payload;
         },
@@ -135,6 +145,7 @@ const store = createStore({
                 playerName: payload,
                 score: 0,
                 welcomed: false,
+                matchPoint: false,
                 profile: "characters/noCharacter.png",
             };
             newPlayerList.push(newPlayer);
@@ -162,6 +173,17 @@ const store = createStore({
                 playerWelcomeTrueOrFalse,
             });
         },
+        changePlayerMatchPoint(context, payload) {
+            let copyOfPlayerList = this.state.listOfPlayers;
+            let indexOfPlayer = copyOfPlayerList.findIndex(
+                (player) => player.playerName === payload.playerName
+            );
+            let playerMatchPointTrueOrFalse = payload.matchPointSet;
+            context.commit("changePlayerMatchPoint", {
+                indexOfPlayer,
+                playerMatchPointTrueOrFalse,
+            });
+        },
         changePlayerProfile(context, payload) {
             let copyOfPlayerList = this.state.listOfPlayers;
             let indexOfPlayer = copyOfPlayerList.findIndex(
@@ -189,6 +211,14 @@ const store = createStore({
             }
             context.commit("resetPlayerWelcomed", copyOfPlayerList);
         },
+        resetPlayerMatchPoint(context) {
+            /* The JSON.parse and JSON.stringify parts are used to make a copy that doesn't affect the original */
+            let copyOfPlayerList = JSON.parse(JSON.stringify(this.state.listOfPlayers));
+            for (let i = 0; i < copyOfPlayerList.length; i++) {
+                copyOfPlayerList[i].matchPoint = false;
+            }
+            context.commit("resetPlayerMatchPoint", copyOfPlayerList);
+        },
         updateLocalPlaylist(context, payload) {
             context.commit("updateLocalPlaylist", payload);
         },
@@ -207,6 +237,9 @@ const store = createStore({
         updateHideNextTitle(context, payload) {
             context.commit("updateHideNextTitle", payload);
         },
+        updateAddPlayed(context, payload) {
+            context.commit("updateAddPlayed", payload);
+        },
         updateLowPlayed(context, payload) {
             context.commit("updateLowPlayed", payload);
         },

pkg/api/music.go

@@ -88,3 +88,8 @@ func (m *Music) AddLatestToQue(ctx *gin.Context) {
 	server.AddLatestToQue()
 	ctx.Status(http.StatusOK)
 }
+
+func (m *Music) AddLatestPlayed(ctx *gin.Context) {
+	server.AddLatestPlayed()
+	ctx.Status(http.StatusOK)
+}

pkg/conf/conf.go

@@ -79,6 +79,7 @@ func SetupRestServer(swagger embed.FS) {
 		musicGroup.GET("all/random", music.GetAllGamesRandom)
 		musicGroup.PUT("played", music.PutPlayed)
 		musicGroup.GET("addQue", music.AddLatestToQue)
+		musicGroup.GET("addPlayed", music.AddLatestPlayed)
 	}
 
 	index := api.NewIndex()

pkg/server/music.go

@@ -36,12 +36,17 @@ func Reset() {
 func AddLatestToQue() {
 	if lastFetched.Path != "" {
 		currentSong = len(songQue)
-		db.AddGamePlayed(lastFetched.GameId)
 		songQue = append(songQue, lastFetched)
 		lastFetched = models.SongData{}
 	}
 }
 
+func AddLatestPlayed() {
+	if lastFetched.Path != "" {
+		db.AddGamePlayed(lastFetched.GameId)
+	}
+}
+
 func GetRandomSong() string {
 	if games == nil || len(games) == 0 {
 		games = db.FindAllGames()