From e9ea61036ffa1a8fc5e69afd022987ea70c5fe37 Mon Sep 17 00:00:00 2001
From: jvoisin <julien.voisin@dustri.org>
Date: Thu, 21 Mar 2019 21:26:03 +0100
Subject: [PATCH] First pass of CSP-compliance for mousetrap
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Since the preference for the keyboard shortcuts
is set server-side, I had to shove them into a non-javascript
context, and then access them via javascript,
in a separate file.

Since I'm not a javascript expert, I'm more than open
to alternatives if this isn't the right way™ to do it.
---
 .../src/main/webapp/WEB-INF/jsp/head.jsp      | 41 +++----------------
 .../main/webapp/script/keyboard_shortcuts.js  | 30 ++++++++++++++
 2 files changed, 36 insertions(+), 35 deletions(-)
 create mode 100644 airsonic-main/src/main/webapp/script/keyboard_shortcuts.js

diff --git a/airsonic-main/src/main/webapp/WEB-INF/jsp/head.jsp b/airsonic-main/src/main/webapp/WEB-INF/jsp/head.jsp
index e2d8caf9..c0c2c711 100644
--- a/airsonic-main/src/main/webapp/WEB-INF/jsp/head.jsp
+++ b/airsonic-main/src/main/webapp/WEB-INF/jsp/head.jsp
@@ -16,39 +16,10 @@
 <link rel="stylesheet" href="<c:url value="/${styleSheet}"/>" type="text/css">
 <title>Airsonic</title>
 
-<!-- Import Mousetrap and enable shortcuts if necessary -->
-<script>
-function isKeyboardShortcutsEnabled() {
-    if (window === parent.frames.top) {
-        return ${model.keyboardShortcutsEnabled ? 'true' : 'false'};
-    } else {
-        return parent.frames.top.isKeyboardShortcutsEnabled();
-    }
-}
-</script>
-
-<!-- Bind shortcuts if enabled -->
-<script type="text/javascript" src="<c:url value="/script/mousetrap-1.6.0.js"/>"></script>
-<script type="text/javascript">
-if (isKeyboardShortcutsEnabled()) {
-    Mousetrap.bind('space', function() { parent.frames.playQueue.onToggleStartStop(); return false; });
-    Mousetrap.bind('left',  function() { parent.frames.playQueue.onPrevious(); });
-    Mousetrap.bind('right', function() { parent.frames.playQueue.onNext(); });
-    Mousetrap.bind('*',     function() { parent.frames.playQueue.onStarCurrent(); });
-    Mousetrap.bind('plus',  function() { parent.frames.playQueue.onGainAdd(+5); });
-    Mousetrap.bind('-',     function() { parent.frames.playQueue.onGainAdd(-5); });
-    Mousetrap.bind('q',     function() { parent.frames.playQueue.onTogglePlayQueue(); });
-
-    Mousetrap.bind('/',     function() { parent.frames.upper.$("#query").focus(); });
-    Mousetrap.bind('m',     function() { parent.frames.upper.toggleLeftFrameVisible(); });
-
-    Mousetrap.bind('g h', function() { parent.frames.main.location.href = "home.view?"; });
-    Mousetrap.bind('g p', function() { parent.frames.main.location.href = "playlists.view?"; });
-    Mousetrap.bind('g o', function() { parent.frames.main.location.href = "podcastChannels.view?"; });
-    Mousetrap.bind('g s', function() { parent.frames.main.location.href = "settings.view?"; });
-    Mousetrap.bind('g t', function() { parent.frames.main.location.href = "starred.view?"; });
-    Mousetrap.bind('g r', function() { parent.frames.main.location.href = "more.view?"; });
-    Mousetrap.bind('g a', function() { parent.frames.main.location.href = "help.view?"; });
-    Mousetrap.bind('?',   function() { parent.frames.main.location.href = "more.view#shortcuts"; });
-}
+<script id="preferencesConfig" type="application/x-configuration">
+  {
+    "keyboardShortcutsEnabled": ${model.keyboardShortcutsEnabled ? 'true' : 'false'}
+  }
 </script>
+<script defer type="text/javascript" src="<c:url value="/script/mousetrap-1.6.0.js"/>"></script>
+<script defer type="text/javascript" src="<c:url value="/script/keyboard_shortcuts.js"/>"></script>
diff --git a/airsonic-main/src/main/webapp/script/keyboard_shortcuts.js b/airsonic-main/src/main/webapp/script/keyboard_shortcuts.js
new file mode 100644
index 00000000..35e73dab
--- /dev/null
+++ b/airsonic-main/src/main/webapp/script/keyboard_shortcuts.js
@@ -0,0 +1,30 @@
+function isKeyboardShortcutsEnabled() {
+  if (window === parent.frames.top) {
+    var config = JSON.parse(document.getElementById('preferencesConfig').textContent)
+    return config['keyboardShortcutsEnabled'];
+  } else {
+    return parent.frames.top.isKeyboardShortcutsEnabled();
+  }
+}
+
+if (isKeyboardShortcutsEnabled()) {
+  Mousetrap.bind('space', function() { parent.frames.playQueue.onToggleStartStop(); return false; });
+  Mousetrap.bind('left',  function() { parent.frames.playQueue.onPrevious(); });
+  Mousetrap.bind('right', function() { parent.frames.playQueue.onNext(); });
+  Mousetrap.bind('*',     function() { parent.frames.playQueue.onStarCurrent(); });
+  Mousetrap.bind('plus',  function() { parent.frames.playQueue.onGainAdd(+5); });
+  Mousetrap.bind('-',     function() { parent.frames.playQueue.onGainAdd(-5); });
+  Mousetrap.bind('q',     function() { parent.frames.playQueue.onTogglePlayQueue(); });
+
+  Mousetrap.bind('/',     function() { parent.frames.upper.$("#query").focus(); });
+  Mousetrap.bind('m',     function() { parent.frames.upper.toggleLeftFrameVisible(); });
+
+  Mousetrap.bind('g h', function() { parent.frames.main.location.href = "home.view?"; });
+  Mousetrap.bind('g p', function() { parent.frames.main.location.href = "playlists.view?"; });
+  Mousetrap.bind('g o', function() { parent.frames.main.location.href = "podcastChannels.view?"; });
+  Mousetrap.bind('g s', function() { parent.frames.main.location.href = "settings.view?"; });
+  Mousetrap.bind('g t', function() { parent.frames.main.location.href = "starred.view?"; });
+  Mousetrap.bind('g r', function() { parent.frames.main.location.href = "more.view?"; });
+  Mousetrap.bind('g a', function() { parent.frames.main.location.href = "help.view?"; });
+  Mousetrap.bind('?',   function() { parent.frames.main.location.href = "more.view#shortcuts"; });
+}