Browse Source

Improved EditSong shortcuts a little bit

Kristian Vos 3 years ago
parent
commit
254e0110a3

+ 42 - 30
frontend/src/components/modals/EditSong.vue

@@ -90,7 +90,7 @@
 										type="text"
 										ref="title-input"
 										v-model="song.title"
-										@keyup.ctrl.alt.d="
+										@keyup.shift.enter="
 											getAlbumData('title')
 										"
 									/>
@@ -109,6 +109,7 @@
 										class="input"
 										type="text"
 										v-model.number="song.duration"
+										@keyup.shift.enter="fillDuration()"
 									/>
 									<button
 										class="button duration-fill-button"
@@ -137,7 +138,7 @@
 										class="input"
 										type="text"
 										v-model="song.thumbnail"
-										@keyup.ctrl.alt.d="
+										@keyup.shift.enter="
 											getAlbumData('albumArt')
 										"
 									/>
@@ -162,8 +163,8 @@
 										@blur="blurArtistInput()"
 										@focus="focusArtistInput()"
 										@keydown="keydownArtistInput()"
-										@keyup.enter="addTag('artists')"
-										@keyup.ctrl.alt.d="
+										@keyup.exact.enter="addTag('artists')"
+										@keyup.shift.enter="
 											getAlbumData('artists')
 										"
 									/>
@@ -236,8 +237,8 @@
 										@blur="blurGenreInput()"
 										@focus="focusGenreInput()"
 										@keydown="keydownGenreInput()"
-										@keyup.enter="addTag('genres')"
-										@keyup.ctrl.alt.d="
+										@keyup.exact.enter="addTag('genres')"
+										@keyup.shift.enter="
 											getAlbumData('genres')
 										"
 									/>
@@ -990,9 +991,28 @@ export default {
 			}
 		});
 
-		keyboardShortcuts.registerShortcut("editSong.close", {
-			keyCode: 88,
+		keyboardShortcuts.registerShortcut("editSong.saveClose", {
+			keyCode: 83,
+			ctrl: true,
+			alt: true,
+			preventDefault: true,
+			handler: () => {
+				this.save(this.song, true);
+			}
+		});
+
+		keyboardShortcuts.registerShortcut("editSong.saveVerifyClose", {
+			keyCode: 86,
 			ctrl: true,
+			alt: true,
+			preventDefault: true,
+			handler: () => {
+				// alert("not implemented yet");
+			}
+		});
+
+		keyboardShortcuts.registerShortcut("editSong.close", {
+			keyCode: 115,
 			preventDefault: true,
 			handler: () => {
 				this.closeModal("editSong");
@@ -1031,35 +1051,26 @@ export default {
 			}
 		});
 
-		keyboardShortcuts.registerShortcut("editSong.resetDuration", {
-			keyCode: 82,
-			alt: true,
-			ctrl: true,
-			preventDefault: true,
-			handler: () => {
-				this.fillDuration();
-			}
-		});
-
 		/*
 		
 		editSong.pauseResume - Num 5 - Pause/resume song
 		editSong.stopVideo - Ctrl - Num 5 - Stop
 		editSong.skipToLast10Secs - Num 6 - Skip to last 10 seconds
 
-		editSong.volumeDown5 - Num 2 - Volume down by 10
-		editSong.volumeDown1 - Ctrl - Num 2 - Volume down by 1
-		editSong.volumeUp5 - Num 8 - Volume up by 10
-		editSong.volumeUp1 - Ctrl - Num 8 - Volume up by 1
+		editSong.lowerVolumeLarge - Num 2 - Volume down by 10
+		editSong.lowerVolumeSmall - Ctrl - Num 2 - Volume down by 1
+		editSong.increaseVolumeLarge - Num 8 - Volume up by 10
+		editSong.increaseVolumeSmall - Ctrl - Num 8 - Volume up by 1
 
 		editSong.focusTitle - Home - Focus the title input
 		editSong.focusDicogs - End - Focus the discogs input
 
 		editSong.save - Ctrl - S - Saves song
-		editSong.close - Ctrl - X - Closes modal
+		editSong.save - Ctrl - Alt - S - Saves song and closes the modal
+		editSong.save - Ctrl - Alt - V - Saves song, verifies songs and then closes the modal
+		editSong.close - F4 - Closes modal without saving
 
 		editSong.useAllDiscogs - Ctrl - Alt - D - Sets all fields to the Discogs data
-		editSong.resetDuration - Ctrl - Alt - R - Resets the duration
 
 		Inside Discogs inputs: Ctrl - D - Sets this field to the Discogs data
 
@@ -1080,16 +1091,17 @@ export default {
 			"editSong.pauseResume",
 			"editSong.stopVideo",
 			"editSong.skipToLast10Secs",
-			"editSong.volumeDown5",
-			"editSong.volumeDown1",
-			"editSong.volumeUp5",
-			"editSong.volumeUp1",
+			"editSong.lowerVolumeLarge",
+			"editSong.lowerVolumeSmall",
+			"editSong.increaseVolumeLarge",
+			"editSong.increaseVolumeSmall",
 			"editSong.focusTitle",
 			"editSong.focusDicogs",
 			"editSong.save",
+			"editSong.saveClose",
+			"editSong.saveVerifyClose",
 			"editSong.close",
-			"editSong.useAllDiscogs",
-			"editSong.resetDuration"
+			"editSong.useAllDiscogs"
 		];
 
 		shortcutNames.forEach(shortcutName => {

+ 74 - 11
frontend/src/pages/Admin/tabs/VerifiedSongs.vue

@@ -157,6 +157,20 @@
 			<template #body>
 				<div>
 					<div>
+						<span class="biggest"
+							><b>Keyboard shortcuts helper</b></span
+						>
+						<span
+							><b>Ctrl + /</b> - Toggles this keyboard shortcuts
+							helper</span
+						>
+						<span
+							><b>Ctrl + Shift + /</b> - Resets the position of
+							this keyboard shortcuts helper</span
+						>
+						<hr />
+					</div>
+					<!-- <div>
 						<span class="biggest"><b>Songs page</b></span>
 						<span
 							><b>Arrow keys up/down</b> - Moves between
@@ -165,15 +179,20 @@
 						<span><b>E</b> - Edit selected song</span>
 						<span><b>A</b> - Add selected song</span>
 						<span><b>X</b> - Delete selected song</span>
-					</div>
-					<hr />
+						<hr />
+					</div> -->
 					<div>
 						<span class="biggest"><b>Edit song modal</b></span>
 						<span class="bigger"><b>Navigation</b></span>
 						<span><b>Home</b> - Edit</span>
 						<span><b>End</b> - Edit</span>
 						<hr />
+					</div>
+					<div>
 						<span class="bigger"><b>Player controls</b></span>
+						<span class="bigger"
+							><i>Don't forget to turn off numlock!</i></span
+						>
 						<span><b>Numpad up/down</b> - Volume up/down 10%</span>
 						<span
 							><b>Ctrl + Numpad up/down</b> - Volume up/down
@@ -185,26 +204,33 @@
 							><b>Numpad Right</b> - Skip to last 10 seconds</span
 						>
 						<hr />
+					</div>
+					<div>
 						<span class="bigger"><b>Form control</b></span>
 						<span
-							><b>Ctrl + D</b> - Executes purple button in that
+							><b>Enter</b> - Executes blue button in that
 							input</span
 						>
 						<span
-							><b>Ctrl + Alt + D</b> - Fill in all Discogs
-							fields</span
-						>
-						<span
-							><b>Ctrl + R</b> - Executes red button in that
-							input</span
+							><b>Shift + Enter</b> - Executes purple/red button
+							in that input</span
 						>
 						<span
-							><b>Ctrl + Alt + R</b> - Reset duration field</span
+							><b>Ctrl + Alt + D</b> - Fill in all Discogs
+							fields</span
 						>
 						<hr />
+					</div>
+					<div>
 						<span class="bigger"><b>Modal control</b></span>
 						<span><b>Ctrl + S</b> - Save</span>
-						<span><b>Ctrl + X</b> - Exit</span>
+						<span><b>Ctrl + Shift + S</b> - Save and close</span>
+						<span
+							><b>Ctrl + Shift + V</b> - Save, verify and
+							close</span
+						>
+						<span><b>F4</b> - Close without saving</span>
+						<hr />
 					</div>
 				</div>
 			</template>
@@ -217,6 +243,8 @@ import { mapState, mapActions, mapGetters } from "vuex";
 
 import Toast from "toasters";
 
+import keyboardShortcuts from "@/keyboardShortcuts";
+
 import UserIdToUsername from "@/components/UserIdToUsername.vue";
 import FloatingBox from "@/components/FloatingBox.vue";
 import Confirm from "@/components/Confirm.vue";
@@ -352,6 +380,41 @@ export default {
 				}
 			);
 		}
+
+		keyboardShortcuts.registerShortcut(
+			"verifiedSongs.toggleKeyboardShortcutsHelper",
+			{
+				keyCode: 191, // '/' key
+				ctrl: true,
+				preventDefault: true,
+				handler: () => {
+					this.toggleKeyboardShortcutsHelper();
+				}
+			}
+		);
+
+		keyboardShortcuts.registerShortcut(
+			"verifiedSongs.resetKeyboardShortcutsHelper",
+			{
+				keyCode: 191, // '/' key
+				ctrl: true,
+				shift: true,
+				preventDefault: true,
+				handler: () => {
+					this.resetKeyboardShortcutsHelper();
+				}
+			}
+		);
+	},
+	beforeDestroy() {
+		const shortcutNames = [
+			"verifiedSongs.toggleKeyboardShortcutsHelper",
+			"verifiedSongs.resetKeyboardShortcutsHelper"
+		];
+
+		shortcutNames.forEach(shortcutName => {
+			keyboardShortcuts.unregisterShortcut(shortcutName);
+		});
 	},
 	methods: {
 		edit(song) {