update files view (make file properties editable)

static/js/pandora/filesView.js

@@ -11,63 +11,61 @@ pandora.ui.filesView = function(options, self) {
             })
             .options(options || {});
 
-    self.wasChecked = false;
+    self.filesQuery = {
+        conditions: [{
+            key: 'id',
+            value: self.options.id,
+            operator: '=='
+        }]
+    };
     self.numberOfItems = 0;
     self.selected = [];
+    self.wasChecked = false;
 
     self.$toolbar = Ox.Bar({
         size: 24
     });
 
-    /*
+    self.$deleteButton = Ox.Button({
-    self.$versionSelect = Ox.Select({
+            title: 'Delete ' + pandora.site.itemName.singular + '...',
-            items: [
+            width: 128
-                {id: 'user/volume/version', title: 'Version: user/volume/version'}
-            ],
-            width: 240
         })
         .css({
             float: 'left',
             margin: '4px'
         })
+        .bindEvent({
+            click: deleteItem 
+        })
         .appendTo(self.$toolbar);
-    */
 
-    self.$deleteButton = Ox.Button({
+    self.$saveButton = Ox.Button({
-            disabled: false,
+            disabled: true,
-            title: 'Delete ' + pandora.site.itemName.singular,
+            title: 'Save Changes',
-            width: 116
+            width: 128
         })
         .css({
             float: 'right',
             margin: '4px'
         })
-        .appendTo(self.$toolbar)
         .bindEvent({
-            click: deleteItem 
+            click: saveChanges
-        });
+        })
+        .appendTo(self.$toolbar);
 
     self.$ignoreButton = Ox.Button({
             disabled: 'true',
-            title: 'Ignore Selected Files...'
+            title: 'Ignore Selected Files',
+            width: 128
         })
         .css({
             float: 'right',
             margin: '4px'
         })
-        .appendTo(self.$toolbar)
         .bindEvent({
-            click: function() {
+            click: ignoreFiles
-                var data = {
+        })
-                    ids: self.selected,
+        .appendTo(self.$toolbar);
-                    ignore: true
-                };
-                pandora.api.editFiles(data, function(result) {
-                    Ox.Request.clearCache();
-                    self.$filesList.reloadList();
-                });
-            }
-        });
 
     self.$filesList = Ox.TableList({
             columns: [
@@ -148,6 +146,14 @@ pandora.ui.filesView = function(options, self) {
                     visible: true,
                     width: 60
                 },
+                {
+                    editable: true,
+                    id: 'extension',
+                    operator: '+',
+                    title: 'Extension',
+                    visible: true,
+                    width: 60
+                },
                 {
                     align: 'left',
                     id: 'type',
@@ -207,13 +213,7 @@ pandora.ui.filesView = function(options, self) {
             id: 'files',
             items: function(data, callback) {
                 pandora.api.findFiles(Ox.extend(data, {
-                    query: {
+                    query: self.filesQuery
-                        conditions: [{
-                            key: 'id',
-                            value: self.options.id,
-                            operator: '=='
-                        }]
-                    }
                 }), callback);
             },
             keys: ['wanted', 'instances'],
@@ -251,7 +251,11 @@ pandora.ui.filesView = function(options, self) {
             init: function(data) {
                 self.numberOfItems = data.items;
             },
-            select: selectFiles
+            select: selectFiles,
+            submit: function(data) {
+                self.$saveButton.options({disabled: false});
+                self.$filesList.value(data.id, data.key, data.value || null);
+            }
         });
 
     self.$instancesList = Ox.TableList({
@@ -437,6 +441,18 @@ pandora.ui.filesView = function(options, self) {
         });
     }
 
+    function ignoreFiles() {
+        var data = {
+            files: self.selected.map(function(id) {
+                return {id: id, ignore: true};
+            })
+        };
+        pandora.api.editFiles(data, function(result) {
+            Ox.Request.clearCache();
+            self.$filesList.reloadList();
+        });
+    }
+
     function moveFiles(data) {
         var data = {
             ids: self.selected,
@@ -494,6 +510,29 @@ pandora.ui.filesView = function(options, self) {
         updateForm();
     }
 
+    function saveChanges() {
+        self.$saveButton.options({disabled: true, title: 'Saving Changes...'});
+        pandora.api.findFiles({
+            keys: ['id'],
+            query: self.filesQuery
+        }, function(result) {
+            pandora.api.editFiles({
+                files: result.data.items.map(function(item) {
+                    [
+                        'version', 'part', 'partTitle', 'language', 'extension'
+                    ].forEach(function(key) {
+                        Ox.extend(item, key, self.$filesList.value(item.id, key));
+                    })
+                    return item;
+                })
+            }, function(result) {
+                self.$saveButton.options({title: 'Save Changes'});
+                Ox.Request.clearCache(); // fixme: remove
+                self.$filesList.reloadList();
+            });
+        });
+    }
+
     function updateForm() {
         if (self.selected.length == self.numberOfItems) {
             self.wasChecked = self.$switch.value();