Merge pull request #654 from tf/file-configuration

File configuration
codevise · Oct 21, 2016 · 266ef59 · 266ef59
2 parents e07e473 + 82b1e24
commit 266ef59
Show file tree

Hide file tree

Showing 72 changed files with 1,973 additions and 170 deletions.
diff --git a/app/assets/javascripts/pageflow/editor/api/file_type.js b/app/assets/javascripts/pageflow/editor/api/file_type.js
@@ -7,8 +7,18 @@ pageflow.FileType = pageflow.Object.extend({
     this.paramKey = options.paramKey;
     this.i18nKey = options.i18nKey;
 
+    this.confirmUploadTableColumns = options.confirmUploadTableColumns || [];
+    this.configurationEditorInputs = [].concat(options.configurationEditorInputs || []);
+    this.configurationUpdaters = options.configurationUpdaters || [];
     this.metaDataAttributes = options.metaDataAttributes || [];
 
+    this.settingsDialogTabs = [
+      {
+        name: 'general',
+        view: pageflow.EditFileView
+      }
+    ].concat(options.settingsDialogTabs || []);
+
     if (typeof options.matchUpload === 'function') {
       this.matchUpload = options.matchUpload;
     }

diff --git a/app/assets/javascripts/pageflow/editor/api/file_types.js b/app/assets/javascripts/pageflow/editor/api/file_types.js
@@ -1,6 +1,13 @@
 pageflow.FileTypes = pageflow.Object.extend({
+  modifyableProperties: [
+    'configurationEditorInputs',
+    'configurationUpdaters',
+    'confirmUploadTableColumns'
+  ],
+
   initialize: function() {
     this.clientSideConfigs = [];
+    this.clientSideConfigModifications = {};
   },
 
   register: function(name, config) {
@@ -11,18 +18,52 @@ pageflow.FileTypes = pageflow.Object.extend({
     this.clientSideConfigs[name] = config;
   },
 
+  modify: function(name, config) {
+    if (this._setup) {
+      throw 'File types already set up. Modify file types before initializers run.';
+    }
+
+    this.clientSideConfigModifications[name] = this.clientSideConfigModifications[name] || [];
+    this.clientSideConfigModifications[name].push(config);
+  },
+
   setup: function(serverSideConfigs) {
-    var clientSideConfigs = this.clientSideConfigs;
     this._setup = true;
 
     this.fileTypes = _.map(serverSideConfigs, function(serverSideConfig) {
-      var clientSideConfig = clientSideConfigs[serverSideConfig.collectionName];
+      var clientSideConfig = this.clientSideConfigs[serverSideConfig.collectionName];
 
       if (!clientSideConfig) {
         throw 'Missing client side config for file type "' + serverSideConfig.collectionName + '"';
       }
 
+      _(this.clientSideConfigModifications[serverSideConfig.collectionName])
+        .each(function(modification) {
+          this.lintModifcation(modification, serverSideConfig.collectionName);
+          this.applyModifiaction(clientSideConfig, modification);
+        }, this);
+
       return new pageflow.FileType(_.extend({}, serverSideConfig, clientSideConfig));
+    }, this);
+  },
+
+  lintModifcation: function(modification, collectionName) {
+    var unmodifyableProperties = _.difference(_.keys(modification), this.modifyableProperties);
+
+    if (unmodifyableProperties.length) {
+      throw 'Only the following properties are allowed in FileTypes#modify: ' +
+        this.modifyableProperties.join(', ') +
+        '. Given in modification for ' +
+        collectionName +
+        ': ' +
+        unmodifyableProperties.join(', ') +
+        '.';
+    }
+  },
+
+  applyModifiaction: function(target, modification) {
+    _(this.modifyableProperties).each(function(property) {
+      target[property] = (target[property] || []).concat(modification[property] || []);
     });
   },
 

diff --git a/app/assets/javascripts/pageflow/editor/base.js b/app/assets/javascripts/pageflow/editor/base.js
@@ -48,6 +48,7 @@
 //= require ./initializers/setup_file_types
 //= require ./initializers/setup_widget_types
 //= require ./initializers/setup_collections
+//= require ./initializers/setup_file_uploader
 //= require ./initializers/setup_page_types
 //= require ./initializers/setup_hotkeys
 //= require ./initializers/edit_lock

diff --git a/app/assets/javascripts/pageflow/editor/collections/files_collection.js b/app/assets/javascripts/pageflow/editor/collections/files_collection.js
@@ -16,6 +16,14 @@ pageflow.FilesCollection = Backbone.Collection.extend({
     return '/editor/entries/' + this.getEntry().get('id') + '/files/' + this.name;
   },
 
+  fetch: function(options) {
+    options = _.extend({
+      fileType: this.fileType
+    }, options || {});
+
+    return Backbone.Collection.prototype.fetch.call(this, options);
+  },
+
   getEntry: function() {
     return this.entry || pageflow.entry;
   },
@@ -29,6 +37,20 @@ pageflow.FilesCollection = Backbone.Collection.extend({
         return item.get('state') === 'waiting_for_confirmation';
       },
     });
+  },
+
+  uploadable: function() {
+    this._uploadableSubsetCollection = this._uploadableSubsetCollection ||
+      new pageflow.SubsetCollection({
+        parent: this,
+        watchAttribute: 'state',
+
+        filter: function(item) {
+          return item.get('state') === 'uploadable';
+        },
+      });
+
+    return this._uploadableSubsetCollection;
   }
 });
 

diff --git a/app/assets/javascripts/pageflow/editor/initializers/setup_file_uploader.js b/app/assets/javascripts/pageflow/editor/initializers/setup_file_uploader.js
@@ -0,0 +1,10 @@
+pageflow.app.addInitializer(function(options) {
+  pageflow.fileUploader = new pageflow.FileUploader({
+    entry: pageflow.entry,
+    fileTypes: pageflow.editor.fileTypes
+  });
+
+  pageflow.ConfirmUploadView.watch(pageflow.fileUploader,
+                                   pageflow.editor.fileTypes,
+                                   pageflow.files);
+});
diff --git a/app/assets/javascripts/pageflow/editor/models/entry.js b/app/assets/javascripts/pageflow/editor/models/entry.js
@@ -19,6 +19,7 @@ pageflow.Entry = Backbone.Model.extend({
     this.configuration.parent = this;
 
     this.files = options.files || pageflow.files;
+    this.fileTypes = options.fileTypes || pageflow.editor.fileTypes;
     this.storylines = options.storylines || pageflow.storylines;
     this.storylines.parentModel = this;
     this.chapters = options.chapters || pageflow.chapters;
@@ -29,7 +30,7 @@ pageflow.Entry = Backbone.Model.extend({
     this.videoFiles = pageflow.videoFiles;
     this.audioFiles = pageflow.audioFiles;
 
-    pageflow.editor.fileTypes.each(function(fileType) {
+    this.fileTypes.each(function(fileType) {
       this.watchFileCollection(fileType.collectionName, this.getFileCollection(fileType));
     }, this);
 
@@ -85,18 +86,6 @@ pageflow.Entry = Backbone.Model.extend({
     return this.scaffoldStoryline(_.extend({depth: 'page'}, options)).page;
   },
 
-  addFileUpload: function(upload) {
-    var fileType = pageflow.editor.fileTypes.findByUpload(upload);
-    var file = new fileType.model({
-      state: 'uploading',
-      file_name: upload.name
-    });
-
-    this.getFileCollection(fileType).add(file);
-
-    return file;
-  },
-
   addFileUsage: function(file) {
     var fileUsages = new pageflow.FileUsagesCollection([], {
       entry: this
@@ -126,8 +115,12 @@ pageflow.Entry = Backbone.Model.extend({
     if (response) {
       this.set(_.pick(response, 'published', 'published_until', 'password_protected'));
 
-      pageflow.editor.fileTypes.each(function(fileType) {
-        this.getFileCollection(fileType).set(response[fileType.collectionName], {add: false, remove: false});
+      this.fileTypes.each(function(fileType) {
+        this.getFileCollection(fileType).set(response[fileType.collectionName], {
+          add: false,
+          remove: false,
+          applyConfigurationUpdaters: true
+        });
         delete response[fileType.collectionName];
       }, this);
     }

diff --git a/app/assets/javascripts/pageflow/editor/models/file_configuration.js b/app/assets/javascripts/pageflow/editor/models/file_configuration.js
@@ -0,0 +1,10 @@
+pageflow.FileConfiguration = pageflow.Configuration.extend({
+  defaults: {
+  },
+
+  applyUpdaters: function(updaters, newAttributes) {
+    _(updaters).each(function(updater) {
+      updater(this, newAttributes);
+    }, this);
+  }
+});
diff --git a/app/assets/javascripts/pageflow/editor/models/file_uploader.js b/app/assets/javascripts/pageflow/editor/models/file_uploader.js
@@ -0,0 +1,46 @@
+pageflow.FileUploader = pageflow.Object.extend({
+  initialize: function(options) {
+    this.fileTypes = options.fileTypes;
+    this.entry = options.entry;
+
+    this.deferreds = [];
+  },
+
+  add: function(upload) {
+    var fileType = this.fileTypes.findByUpload(upload);
+    var file = new fileType.model({
+      state: 'uploadable',
+      file_name: upload.name
+    }, {
+      fileType: fileType
+    });
+
+    this.entry.getFileCollection(fileType).add(file);
+
+    var deferred = new $.Deferred();
+    this.deferreds.push(deferred);
+
+    if (this.deferreds.length == 1) {
+      this.trigger('new:batch');
+    }
+
+    return deferred.promise().then(
+      function() {
+        file.set('state', 'uploading');
+        return file;
+      },
+      function() {
+        file.destroy();
+      });
+  },
+
+  submit: function() {
+    _(this.deferreds).invoke('resolve');
+    this.deferreds = [];
+  },
+
+  abort: function() {
+    _(this.deferreds).invoke('reject');
+    this.deferreds = [];
+  }
+});
diff --git a/app/assets/javascripts/pageflow/editor/models/uploaded_file.js b/app/assets/javascripts/pageflow/editor/models/uploaded_file.js
@@ -1,12 +1,37 @@
 pageflow.UploadedFile = Backbone.Model.extend({
   mixins: [pageflow.stageProvider, pageflow.retryable],
 
+  initialize: function(attributes, options) {
+    this.options = options;
+
+    this.configuration = new pageflow.FileConfiguration(
+      this.get('configuration') || {}
+    );
+
+    this.configuration.i18nKey = this.i18nKey;
+
+    this.listenTo(this.configuration, 'change', function() {
+      this.trigger('change:configuration', this);
+
+      if (!this.isNew()) {
+        this.save();
+      }
+    });
+
+    this.listenTo(this, 'change', function(model, options) {
+      if (options.applyConfigurationUpdaters) {
+        this.configuration.applyUpdaters(this.fileType().configurationUpdaters,
+                                         this.attributes.configuration);
+      }
+    });
+  },
+
   urlRoot: function() {
     return this.isNew() ? this.collection.url() : '/editor/files/' + this.fileType().collectionName;
   },
 
   fileType: function() {
-    return this.collection && this.collection.fileType;
+    return this.options.fileType;
   },
 
   title: function() {
@@ -49,6 +74,12 @@ pageflow.UploadedFile = Backbone.Model.extend({
     return false;
   },
 
+  toJSON: function() {
+    return _.extend(_.pick(this.attributes, 'rights'), {
+      configuration: this.configuration.toJSON()
+    });
+  },
+
   cancelUpload: function() {
     if (this.get('state') === 'uploading') {
       this.trigger('uploadCancelled');

diff --git a/app/assets/javascripts/pageflow/editor/templates/confirm_upload.jst.ejs b/app/assets/javascripts/pageflow/editor/templates/confirm_upload.jst.ejs
@@ -0,0 +1,18 @@
+<div class="box">
+  <h1 class="dialog-header"><%= I18n.t('pageflow.editor.templates.confirm_upload.header') %></h1>
+  <p class="dialog-hint"><%= I18n.t('pageflow.editor.templates.confirm_upload.hint') %></p>
+
+  <div class="files_panel">
+  </div>
+
+  <div class="selected_file_panel">
+    <h2><%= I18n.t('pageflow.editor.templates.confirm_upload.edit_file_header') %></h2>
+    <div class="selected_file_region">
+    </div>
+  </div>
+
+  <div class="footer">
+    <button class="upload"><%= I18n.t('pageflow.editor.templates.confirm_upload.upload') %></button>
+    <button class="close"><%= I18n.t('pageflow.editor.templates.confirm_upload.close') %></button>
+  </div>
+</div>
diff --git a/app/assets/javascripts/pageflow/editor/templates/edit_file.jst.ejs b/app/assets/javascripts/pageflow/editor/templates/edit_file.jst.ejs
diff --git a/app/assets/javascripts/pageflow/editor/templates/file_item.jst.ejs b/app/assets/javascripts/pageflow/editor/templates/file_item.jst.ejs
@@ -4,6 +4,7 @@
 <a class="select"><%= I18n.t('pageflow.editor.templates.file_item.select') %></a>
 
 <div class="actions">
+  <a class="settings" title="<%= I18n.t('pageflow.editor.templates.file_item.settings') %>"></a>
   <a class="confirm" title="<%= I18n.t('pageflow.editor.templates.file_item.confirm') %>"></a>
   <a class="retry" title="<%= I18n.t('pageflow.editor.templates.file_item.retry') %>"></a>
   <a class="remove" title="<%= I18n.t('pageflow.editor.templates.file_item.destroy') %>"></a>
@@ -15,12 +16,6 @@
 
   <div class="file_meta_data">
     <table cellpadding="0" cellspacing="0">
-      <tbody>
-        <tr>
-          <th><%= I18n.t('pageflow.editor.templates.file_item.credits') %></th>
-          <td><input type="text" class="rights"/></td>
-        </tr>
-      </tbody>
       <tbody class="attributes">
       </tbody>
       <tbody class="downloads">

diff --git a/app/assets/javascripts/pageflow/editor/templates/file_settings_dialog.jst.ejs b/app/assets/javascripts/pageflow/editor/templates/file_settings_dialog.jst.ejs
@@ -0,0 +1,10 @@
+<div class="box">
+  <div class="content">
+  </div>
+
+  <div class="footer">
+    <a href="" class="close">
+      <%= I18n.t('pageflow.editor.templates.file_settings_dialog.close') %>
+    </a>
+  </div>
+</div>
diff --git a/app/assets/javascripts/pageflow/editor/templates/uploadable_files.jst.ejs b/app/assets/javascripts/pageflow/editor/templates/uploadable_files.jst.ejs
@@ -0,0 +1 @@
+<h2></h2>
diff --git a/app/assets/javascripts/pageflow/editor/utils/form_data_utils.js b/app/assets/javascripts/pageflow/editor/utils/form_data_utils.js
@@ -0,0 +1,17 @@
+pageflow.formDataUtils = {
+  fromModel: function(model) {
+    var object = {};
+    object[model.modelName] = model.toJSON();
+
+    return this.fromObject(object);
+  },
+
+  fromObject: function(object) {
+    return _(decodeURIComponent($.param(object)).split('&')).reduce(function(result, param) {
+      var pair = param.split('=');
+      result[pair[0]] = pair[1];
+
+      return result;
+    }, {});
+  }
+};