Add keyboard shortcuts help page in more.jsp

libresonic-main/src/main/resources/org/libresonic/player/i18n/ResourceBundle_en.properties

@@ -248,6 +248,27 @@ more.jamstash.text = <p>Jamstash is an HTML5 player for Libresonic. <a href="{0}
                     Also available as a <a href="https://chrome.google.com/webstore/detail/jamstash/jccdpflnecheidefpofmlblgebobbloc" target="_blank">Chrome App</a>.</p>
 more.status.title = Network Status
 more.status.text = <a href="status.view">Monitor</a> the real-time status of all network media streams.
+more.keyboard.title = Keyboard Shortcuts
+more.keyboard.text = Keyboard shortcuts can be enabled in the user preferences page. Supported shortcuts are below.
+more.keyboard.playback = Playback
+more.keyboard.navigation = Navigation
+more.keyboard.general = General
+more.keyboard.playpause = Play or pause music
+more.keyboard.previous = Go to the previous song
+more.keyboard.next = Go to the next song
+more.keyboard.volumedown = Decrease the player volume
+more.keyboard.volumeup = Increase the player volume
+more.keyboard.home = Go to Home
+more.keyboard.playlists = Go to Playlists
+more.keyboard.podcasts = Go to Podcasts
+more.keyboard.settings = Go to Settings
+more.keyboard.starred = Go to Starred
+more.keyboard.more = Go to More
+more.keyboard.about = Go to About
+more.keyboard.search = Search
+more.keyboard.sidebar = Toggle left sidebar
+more.keyboard.shortcuts = Show keyboard shortcuts
+more.keyboard.then = then
 more.mobile.title = Mobile phone
 more.mobile.text = <p>You can control {0} from any WAP-enabled mobile phone or PDA.<br> \
                    Simply visit the following URL from your phone: <b>http://yourhostname/wap</b></p> \

libresonic-main/src/main/resources/org/libresonic/player/theme/default_dark.properties

@@ -21,6 +21,7 @@ helpImage = icons/default_dark/help.png
 helpPopupImage = icons/default_dark/help_small.png
 homeImage = icons/default_dark/home.png
 html5Image = icons/default_dark/html5.png
+keyboardImage = icons/default_dark/keyboard.png
 logImage = icons/default_dark/log.png
 logoImage = icons/default_dark/logo_light.png
 moreImage = icons/default_dark/more.png

libresonic-main/src/main/resources/org/libresonic/player/theme/default_light.properties

@@ -21,6 +21,7 @@ helpImage = icons/default_light/help.png
 helpPopupImage = icons/default_light/help_small.png
 homeImage = icons/default_light/home.png
 html5Image = icons/default_light/html5.png
+keyboardImage = icons/default_light/keyboard.png
 logImage = icons/default_light/log.png
 logoImage = icons/default_light/logo.png
 moreImage = icons/default_light/more.png

libresonic-main/src/main/webapp/WEB-INF/jsp/more.jsp

@@ -182,9 +182,58 @@
     <p class="detail" id="progressText"/>
 
     <div id="progressBar">
-        <div id="progressBarContent"/>
+        <div id="progressBarContent"></div>
     </div>
 
 </c:if>
 
-</body></html>
+<a name="shortcuts"></a>
+<h2>
+    <img src="<spring:theme code="keyboardImage"/>" alt=""/>
+    <span style="vertical-align: middle"><fmt:message key="more.keyboard.title"/></span>
+</h2>
+<fmt:message key="more.keyboard.text"/>
+<table class="indent music" style="width:inherit">
+    <tr>
+        <th colspan="2"><fmt:message key="more.keyboard.playback"/></th>
+        <th colspan="2"><fmt:message key="more.keyboard.navigation"/></th>
+        <th colspan="2"><fmt:message key="more.keyboard.general"/></th>
+    </tr>
+    <tr>
+        <td class="more-shortcut">Space</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.playpause"/></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> h</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.home"/></td>
+        <td class="more-shortcut">/</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.search"/></td>
+    </tr>
+    <tr>
+        <td class="more-shortcut">&#8592;</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.previous"/></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> p</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.playlists"/></td>
+        <td class="more-shortcut">m</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.sidebar"/></td>
+    </tr>
+    <tr>
+        <td class="more-shortcut">&#8593;</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.next"/></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> o</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.podcasts"/></td>
+        <td class="more-shortcut">?</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.shortcuts"/></td>
+    </tr>
+    <tr>
+        <td class="more-shortcut">&ndash;</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.volumedown"/></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> s</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.settings"/></td>
+        <td></td><td></td>
+    </tr>
+    <tr>
+        <td class="more-shortcut">+</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.volumeup"/></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> t</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.starred"/></td>
+        <td></td><td></td>
+    </tr>
+    <tr>
+        <td></td><td></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> r</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.more"/></td>
+        <td></td><td></td>
+    </tr>
+    <tr>
+        <td></td><td></td>
+        <td class="more-shortcut">g <fmt:message key="more.keyboard.then"/> a</td><td class="more-shortcut-descr"><fmt:message key="more.keyboard.about"/></td>
+        <td></td><td></td>
+    </tr>
+</table>
+
+</body></html>