toggle files sotring

src/js/control-view.js

@@ -53,6 +53,7 @@ module.exports = {
       GCodeNotFound: false,
       filesUploaded: 0,
       totalFiles: 0,
+      files_sortby: "By Date",
     };
   },
 
@@ -216,14 +217,17 @@ module.exports = {
         return [];
       }
       const folder = this.state.gcode_list.find(item => item.name == this.state.folder);
-      if (folder) {
-        return folder.files
-          .filter(item => this.state.files.includes(item.file_name))
-          .map(item => item.file_name)
-          .sort();
-      } else {
+      if (!folder) {
         return [];
       }
+      const files = folder.files.filter(item => this.state.files.includes(item.file_name)).map(item => item.file_name);
+      if (this.files_sortby == "A-Z") {
+        return files.sort();
+      } else if (this.files_sortby == "Z-A") {
+        return files.sort().reverse();
+      } else {
+        return files;
+      }
     },
     gcode_folders: function () {
       return this.state.gcode_list
@@ -231,6 +235,15 @@ module.exports = {
         .filter(element => element !== "default")
         .sort();
     },
+    toggle_sorting: function () {
+      if (this.files_sortby === "By Date") {
+        this.files_sortby = "A-Z";
+      } else if (this.files_sortby === "A-Z") {
+        this.files_sortby = "Z-A";
+      } else if (this.files_sortby === "Z-A") {
+        this.files_sortby = "By Date";
+      }
+    },
   },
 
   events: {

src/pug/templates/control-view.pug

@@ -372,6 +372,10 @@ script#control-view-template(type="text/x-template")
               v-model="state.selected", @change="load", :disabled="!is_ready",
               style="max-width:100%;margin-left:5px")
               option(v-for="file in gcode_files", :value="file") {{file}}
+            
+            button.pure-button(@click="toggle_sorting", :disabled="!is_ready",
+              style="height:100%")
+              | {{files_sortby}}
 
           .progress(v-if="toolpath_progress && toolpath_progress < 1",
             title="Simulating GCode to check for errors, calculate ETA and " +