update to webstack

Author: keshavbhatt

web/browse/browse.html

@@ -103,6 +103,42 @@
             <a onclick="back_to_playlists_page()" style="display: block;background-color: rgba(36, 142, 179, 0.5)"  class="ui-mini ui-btn ui-icon-back ui-btn-icon-left ui-corner-all" data-transition="slidefade" href="#">Back to playlists</a>
         </div>
     </div>
+    <div id="recommendation_page" data-role="page" data-theme="b" data-title="RECOMMENDATION">
+        <div role="main" class="ui-content">
+            <input  type="search" id='manual_search' value='' placeholder="Type a song name, ex- the river - aurora">
+            <ul   class="list" id="recommendation_page_suggestions"  data-filter="true" data-input="#manual_search"  data-role="listview" data-split-icon="bars" data-split-theme="b" data-inset="true">
+            <!-- load suggestions here -->
+            </ul>
+                <div id="result_div"  style="visibility:hidden;">
+                    <div id="HEADER_DIV" style="text-align:center;background-position: center;text-shadow: 1px 3px 14px rgb(0, 0, 0);box-shadow:rgb(0, 0, 0) 0px 0px 30px;">
+                        <div id="HEADER_WRAPPER" style="background-color:rgba(0, 0, 0, 0.27);padding-bottom:25px;">
+                            <h2 style="padding:10px;background-color:rgba(0,0,0,0.53)" >Recommendations</h2>
+                            <div id="wrapper" style="margin:0 auto;width:200px;height:200px;" onMouseOver="show_playOriginal()" onMouseOut="hide_playOriginal()">
+                                <img style="max-height:200px;max-width:200px; box-shadow: 3px 2px 95px rgb(0, 0, 0);opacity: 0.8;" id="ALBUM_ART"/>
+                                <a href="#" id="playOriginalButton" style="height:100%;line-height:200px;text-decoration:none;display:block;" >
+                                   <div style="visibility:hidden;" id="playOriginal">
+                                        <p>Add this track</p>
+                                    </div>
+                                </a>
+                            </div>
+                            <br>
+                            <p style="display: block;background-color: rgba(0, 0, 0, 0.53);padding: 12px;bottom: -41px;position: relative;">
+                                <b>Based on : </b><b id="BASETRACK"></b>
+                                <br>
+                            </p>
+                        </div>
+                    </div>
+                    <hr>
+                    <h5 style="margin: 0px 0px -12px 0px;">Tracks:</h5>
+
+                    <ul class="list" id="tracks_result_view" data-role="listview" data-split-icon="bars" data-split-theme="b" data-inset="true">
+                        <!-- load result here -->
+                    </ul>
+
+                </div>
+            <hr>
+        </div>
+    </div>
 
 </body>
 </html>

web/browse/main.css

@@ -77,6 +77,11 @@
   background: transparent !important;
 }
 
+#recommendation_page{
+    background: transparent !important;
+}
+
+
 /*list element*/
 #country {
  background: transparent !important;

web/browse/main.js

@@ -116,7 +116,7 @@ function overview(){
 
 function track_option(track_id){
    // var channelHref = $('#'+track_id).parent().attr("data-channelhref");
-    var searchterm = $('#'+track_id).parent().attr("onclick").split("gettrackinfo(\'")[1].split(");")[0];
+    var searchterm = $('#'+track_id).parent().attr("onclick").split("gettrackinfo(\"")[1].split("\");")[0];
     var arr = searchterm.split("!=-=!")
     title = arr[0];
     artist = arr[1];

web/js/common.js

@@ -41,6 +41,28 @@ $( document ).ajaxError(function( event, request, settings) {
     hideLoading();
 });
 
+
+function msToTime(s) {
+
+  // Pad to 2 or 3 digits, default is 2
+  function pad(n, z) {
+    z = z || 2;
+    return ('00' + n).slice(-z);
+  }
+  var ms = s % 1000;
+  s = (s - ms) / 1000;
+  var secs = s % 60;
+  s = (s - secs) / 60;
+  var mins = s % 60;
+  var hrs = (s - mins) / 60;
+
+  return pad(hrs) + ':' + pad(mins) + ':' + pad(secs);
+}
+
+function quoteEscape(string) {
+  return string.replace(/'/g, '\\\\\"');
+}
+
 function changeBg(rgba){ // sets bg color var in mainwindow and changes bg color of webview
     themeColor = rgba;
     var arr = rgba.split(",");

web/recommendation/main.js

@@ -150,22 +150,6 @@ function hide_playOriginal()
 }
 
 
-function msToTime(s) {
-
-  // Pad to 2 or 3 digits, default is 2
-  function pad(n, z) {
-    z = z || 2;
-    return ('00' + n).slice(-z);
-  }
-  var ms = s % 1000;
-  s = (s - ms) / 1000;
-  var secs = s % 60;
-  s = (s - secs) / 60;
-  var mins = s % 60;
-  var hrs = (s - mins) / 60;
-
-  return pad(hrs) + ':' + pad(mins) + ':' + pad(secs);
-}
 
 function quoteEscape(string) {
   return string.replace(/'/g, '\\\\\"');