dashboard: move store inline css and js to separate files

circle/dashboard/static/dashboard/dashboard.css

@@ -722,3 +722,35 @@ textarea[name="list-new-namelist"] {
   margin-bottom: 20px;
   margin-bottom: 20px;
 
 
 }
 }
+
+#store-list-list {
+  list-style: none;
+}
+
+.store-list-item {
+  cursor: pointer;
+}
+
+.store-list-item:hover {
+  background: rgba(0, 0, 0, 0.6);
+}
+
+.store-list-item-icon {
+  width: 20px;
+  text-align: center;
+  display: inline-block;
+  margin-right: 15px;
+}
+
+.store-list-item-size {
+  width: 70px;
+  text-align: right;
+  float: right;
+}
+
+.store-list-file-infos {
+  padding: 20px;
+  display: none;
+  border-left: 1px solid #ddd;
+  border-right: 1px solid #ddd;
+}

circle/dashboard/static/dashboard/store.js

+$(function() {
+  $(".store-list-item").click(function() {
+    if($(this).data("item-type") == "D") return true;
+    $(this).next(".store-list-file-infos").stop().slideToggle();
+    return false;
+  });
+
+  /* less js way, but at least works, tho redirection is bad */
+  $('form input[type="submit"]').click(function() {
+    var current_dir = $("form").find('[name="current_dir"]').val();
+    $.get($("form").data("action") + "?current_dir=" + current_dir, function(result) {
+      $("form").get(0).setAttribute("action", result['url']);
+      $("form").submit();
+    });
+
+    return false;
+  });
+  
+  /* click on the "fake" browse button will */
+  $('#store-upload-browse').click(function() {
+    $('#store-upload-form input[type="file"]').click();
+  });
+  
+  $("#store-upload-file").change(function() {
+    var input = $(this);
+    var numFiles = input.get(0).files ? input.get(0).files.length : 1;
+    var label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
+    input.trigger('fileselect', [numFiles, label]);
+  });
+
+  $("#store-upload-file").on("fileselect", function(event, numFiles, label)  {
+        var input = $("#store-upload-filename");
+        var log = numFiles > 1 ? numFiles + ' files selected' : label;
+        
+        if(input.length) {
+            input.val(log);
+        }
+  });
+
+
+  /* this does not work 
+  $('form input[type="submit"]').click(function() {
+    var current_dir = $("form").find('[name="current_dir"]').val();
+    $.get($("form").data("action") + "?current_dir=" + current_dir, function(result) {
+      $.ajax({
+        method: "POST",
+        url: result['url'],
+        data: $("form").serialize(),
+        success: function(re) {
+          console.log(re);
+        }
+      });
+    });
+
+    return false;
+  }); */
+    
+});

circle/dashboard/templates/dashboard/store/list.html

@@ -74,107 +74,12 @@
           </span>
           </span>
         </div>
         </div>
         <input id="store-upload-file" name="data" type="file" style="display:none" multiple>
         <input id="store-upload-file" name="data" type="file" style="display:none" multiple>
- 
-<script type="text/javascript">
-  $('#store-upload-browse').click(function() {
-    $('#store-upload-form input[type="file"]').click();
-  });
-  
-  $("#store-upload-file").change(function() {
-    var input = $(this);
-    var numFiles = input.get(0).files ? input.get(0).files.length : 1;
-    var label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
-    input.trigger('fileselect', [numFiles, label]);
-  });
-
-  $("#store-upload-file").on("fileselect", function(event, numFiles, label)  {
-        var input = $("#store-upload-filename");
-        var log = numFiles > 1 ? numFiles + ' files selected' : label;
-        
-        if( input.length ) {
-            input.val(log);
-        }
-  });
-
-</script>
       </form>
       </form>
     </div>
     </div>
     </div>
     </div>
   </div>
   </div>
 </div>
 </div>
 
 
-<style>
-  #store-list-list {
-    list-style: none;
-  }
-
-  .store-list-item {
-    cursor: pointer;
-  }
-
-  .store-list-item:hover {
-    background: rgba(0, 0, 0, 0.6);
-  }
-
-  .store-list-item-icon {
-    width: 20px;
-    text-align: center;
-    display: inline-block;
-    margin-right: 15px;
-  }
-
-  .store-list-item-size {
-    width: 70px;
-    text-align: right;
-    float: right;
-  }
-
-  .store-list-file-infos {
-    padding: 20px;
-    display: none;
-    border-left: 1px solid #ddd;
-    border-right: 1px solid #ddd;
-  }
-</style>
-<script>
-$(function() {
-  $(".store-list-item").click(function() {
-    if($(this).data("item-type") == "D") return true;
-    $(this).next(".store-list-file-infos").stop().slideToggle();
-    return false;
-  });
-
-  /* less js way, but at least works, tho redirection is bad */
-  $('form input[type="submit"]').click(function() {
-    var current_dir = $("form").find('[name="current_dir"]').val();
-    $.get($("form").data("action") + "?current_dir=" + current_dir, function(result) {
-      $("form").get(0).setAttribute("action", result['url']);
-      $("form").submit();
-    });
-
-    return false;
-  });
-  
-  /* this does not work 
-  $('form input[type="submit"]').click(function() {
-    var current_dir = $("form").find('[name="current_dir"]').val();
-    $.get($("form").data("action") + "?current_dir=" + current_dir, function(result) {
-      $.ajax({
-        method: "POST",
-        url: result['url'],
-        data: $("form").serialize(),
-        success: function(re) {
-          console.log(re);
-        }
-      });
-    });
-
-    return false;
-  }); */
-    
-});
-</script>
-
 {% endblock %}
 {% endblock %}
 
 
 {% block extra_js %}
 {% block extra_js %}