diff options
Diffstat (limited to 'module/web/static')
| -rw-r--r-- | module/web/static/js/utils/animations.js | 2 | ||||
| -rw-r--r-- | module/web/static/js/views/dashboardView.js | 64 | ||||
| -rw-r--r-- | module/web/static/js/views/fileView.js | 6 | ||||
| -rw-r--r-- | module/web/static/js/views/filterView.js | 5 | ||||
| -rw-r--r-- | module/web/static/js/views/packageView.js | 8 | ||||
| -rw-r--r-- | module/web/static/js/views/selectionView.js | 16 | 
6 files changed, 61 insertions, 40 deletions
| diff --git a/module/web/static/js/utils/animations.js b/module/web/static/js/utils/animations.js index 3350dd6ae..5131d3b8a 100644 --- a/module/web/static/js/utils/animations.js +++ b/module/web/static/js/utils/animations.js @@ -43,7 +43,7 @@ define(['jquery', 'underscore', 'transit'], function(jQuery, _) {          return this;      }; -    // calculate the height and write it to data, better used on invisible elements +    // calculate the height and write it to data, should be used on invisible elements      jQuery.fn.calculateHeight = function(setHeight) {          var o = jQuery(this[0]);          var height = o.height(); diff --git a/module/web/static/js/views/dashboardView.js b/module/web/static/js/views/dashboardView.js index 58ca8faf0..d9ea8d444 100644 --- a/module/web/static/js/views/dashboardView.js +++ b/module/web/static/js/views/dashboardView.js @@ -6,6 +6,7 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',          return Backbone.View.extend({              el: '#content', +            active: $('.breadcrumb .active'),              events: {              }, @@ -14,6 +15,8 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',              packageUL: null,              // <ul> displaying the files              fileUL: null, +            // Package tree +            tree: null,              // Current open files              files: null,              // True when loading animation is running @@ -23,7 +26,7 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',                  var self = this;                  this.tree = new TreeCollection(); -                var view = new selectionView(this.tree); +                var view = new selectionView();                  view = new filterView();                  // When package is added we reload the data @@ -33,14 +36,10 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',                  });                  // TODO file:added - -                App.vent.on('dashboard:loading', _.bind(this.loading, this)); -                App.vent.on('dashboard:contentReady', _.bind(this.contentReady, this));              },              init: function() {                  var self = this; -                  // TODO: put in separated function                  // TODO: order of elements?                  // Init the tree and callback for package added @@ -63,8 +62,13 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',                  packs.each(_.bind(this.appendPackage, this));                  this.fileUL = this.$('.file-list'); -                if (this.files.length === 0) -                    this.fileUL.append($('<li>No package selected</li>')); +                if (this.files.length === 0) { +                    // no files are displayed +                    this.files = null; +                    // Open the first package +                    if (packs.length >= 1) +                        this.openPackage(packs.at(0)); +                }                  else                      this.files.each(_.bind(this.appendFile, this)); @@ -83,27 +87,44 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',                  this.fileUL.appendWithAnimation(el, animation);              }, +            // Show content of the packages on main view +            openPackage: function(pack) { +                var self = this; + +                // load animation only when something is shown and its different from current package +                if (this.files && this.files !== pack.get('files')) +                    self.loading(); + +                pack.fetch({silent: true, success: function() { +                    console.log('Package ' + pack.get('pid') + ' loaded'); +                    self.active.text(pack.get('name')); +                    self.contentReady(pack.get('files')); +                }, failure: function() { +                    self.failure(); +                }}); + +            }, +              contentReady: function(files) { +                var old_files = this.files; +                this.files = files; +                App.vent.trigger('dashboard:contentReady'); +                  // show the files when no loading animation is running and not already open -                if (!this.isLoading && this.files !== files) { -                    this.files = files; +                if (!this.isLoading && old_files !== files)                      this.show(); -                } else -                    this.files = files;              }, -            // TODO: better state control of dashboard -            // TODO: elaborate events and reaction -            loading: function(model) { -                // nothing to load when it is already open, or nothing is shown -                if (!this.files || (model && this.files === model.get('files'))) -                    return; - +            // Do load animation, remove the old stuff +            loading: function() {                  this.isLoading = true;                  this.files = null;                  var self = this; -                // Render when the files are already set                  this.fileUL.fadeOut({complete: function() { +                    // All file views should vanish +                    App.vent.trigger('dashboard:destroyContent'); + +                    // Loading was faster than animation                      if (self.files)                          self.show(); @@ -116,10 +137,11 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection',              },              show: function() { -                this.fileUL.empty(); +                // fileUL has to be resetted before                  this.files.each(_.bind(this.appendFile, this)); +                //TODO: show placeholder when nothing is displayed (filtered content empty)                  this.fileUL.fadeIn(); -                App.vent.trigger('dashboard:show', this.files); +                App.vent.trigger('dashboard:updated');              }          });      });
\ No newline at end of file diff --git a/module/web/static/js/views/fileView.js b/module/web/static/js/views/fileView.js index 59a26d7c9..17da74de3 100644 --- a/module/web/static/js/views/fileView.js +++ b/module/web/static/js/views/fileView.js @@ -17,6 +17,7 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes', 'views/abst                  // This will be triggered manually and changed before with silent=true                  this.listenTo(this.model, 'change:visible', this.visibility_changed);                  this.listenTo(this.model, 'remove', this.destroy); +                this.listenTo(App.vent, 'dashboard:destroyContent', this.destroy);              },              onDestroy: function() { @@ -48,8 +49,9 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes', 'views/abst                  if (this.model.get('visible'))                      this.$el.show(); -                else +                else {                      this.$el.hide(); +                }                  return this;              }, @@ -64,7 +66,7 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes', 'views/abst              },              visibility_changed: function(visible) { -                // TODO: improve animation +                // TODO: improve animation, height is not available when element was not visible                  if (visible)                      this.$el.slideOut(true);                  else { diff --git a/module/web/static/js/views/filterView.js b/module/web/static/js/views/filterView.js index a085fdad5..792edfee2 100644 --- a/module/web/static/js/views/filterView.js +++ b/module/web/static/js/views/filterView.js @@ -21,6 +21,10 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'],                  this.stateMenu = this.$('.dropdown-toggle .state');                  this.state = Api.DownloadState.All; + +                // Apply the filter before the content is shown +                App.vent.on('dashboard:contentReady', _.bind(this.apply_filter, this)); +              },              render: function() { @@ -68,6 +72,7 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'],                      }                  }); +                App.vent.trigger('dashboard:filtered');              },              // determine if a file should be visible diff --git a/module/web/static/js/views/packageView.js b/module/web/static/js/views/packageView.js index 9eb1ecf5f..cfd671611 100644 --- a/module/web/static/js/views/packageView.js +++ b/module/web/static/js/views/packageView.js @@ -61,13 +61,7 @@ define(['jquery', 'app', 'views/abstract/itemView', 'underscore'],              open: function(e) {                  e.preventDefault(); -                var self = this; -                // TODO: error case -                App.vent.trigger('dashboard:loading', this.model); -                this.model.fetch({silent: true, success: function() { -                    console.log('Package ' + self.model.get('pid') + ' loaded'); -                    App.vent.trigger('dashboard:contentReady', self.model.get('files')); -                }}); +                App.dashboard.openPackage(this.model);              },              select: function(e) { diff --git a/module/web/static/js/views/selectionView.js b/module/web/static/js/views/selectionView.js index eaed33d59..2237c5f92 100644 --- a/module/web/static/js/views/selectionView.js +++ b/module/web/static/js/views/selectionView.js @@ -13,23 +13,21 @@ define(['jquery', 'backbone', 'underscore', 'app'],                  'click .iconf-refresh': 'restart'              }, -            // available packages -            tree: null,              // Element of the action bar              actionBar: null,              // number of currently selected elements              current: 0, -            initialize: function(tree) { -                this.tree = tree; +            initialize: function() { +                var render = _.bind(this.render, this); -                App.vent.on('dashboard:show', _.bind(this.render, this)); -                App.vent.on('package:selection', _.bind(this.render, this)); -                App.vent.on('file:selection', _.bind(this.render, this)); +                App.vent.on('dashboard:updated', render); +                App.vent.on('dashboard:filtered', render); +                App.vent.on('package:selection', render); +                App.vent.on('file:selection', render);                  this.actionBar = $('.actionbar .btn-check');                  this.actionBar.parent().click(_.bind(this.select_toggle, this)); -                  // TODO when something gets deleted  //                this.tree.get('packages').on('delete', _.bind(this.render, this));              }, @@ -46,7 +44,7 @@ define(['jquery', 'backbone', 'underscore', 'app'],              },              get_packs: function() { -                return this.tree.get('packages').where({selected: true}); +                return App.dashboard.tree.get('packages').where({selected: true});              },              render: function() { | 
