diff options
Diffstat (limited to 'module/web/static/js/views')
| -rw-r--r-- | module/web/static/js/views/linkGrabberModal.js | 31 | ||||
| -rw-r--r-- | module/web/static/js/views/packageTreeView.js | 73 |
2 files changed, 61 insertions, 43 deletions
diff --git a/module/web/static/js/views/linkGrabberModal.js b/module/web/static/js/views/linkGrabberModal.js index b5c91baa6..13900f222 100644 --- a/module/web/static/js/views/linkGrabberModal.js +++ b/module/web/static/js/views/linkGrabberModal.js @@ -1,9 +1,11 @@ -define(['jquery', 'underscore', 'views/abstract/modalView', 'text!tpl/default/linkgrabber.html'], - function($, _, modalView, template) { - +define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'text!tpl/default/linkgrabber.html'], + function($, _, App, modalView, template) { + // Modal dialog for package adding - triggers package:added when package was added return modalView.extend({ events: { + 'click .btn-success': 'addPackage', + 'keypress #inputPackageName': 'addOnEnter' }, template: _.compile(template), @@ -15,6 +17,29 @@ define(['jquery', 'underscore', 'views/abstract/modalView', 'text!tpl/default/li renderContent: function() { return $('<h1>Content!</h1>'); + }, + + addOnEnter: function(e) { + if (e.keyCode != 13) return; + this.addPackage(e); + }, + + addPackage: function(e) { + var self = this; + var settings = { + type: 'POST', + data: { + name: JSON.stringify($('#inputPackageName').val()), + links: JSON.stringify(['http://download.pyload.org/random.bin', 'invalid link']) + }, + success: function() { + App.vent.trigger('package:added'); + self.hide(); + } + }; + + $.ajax('api/addPackage', settings); + $('#inputPackageName').val(''); } }); diff --git a/module/web/static/js/views/packageTreeView.js b/module/web/static/js/views/packageTreeView.js index 92e4d78a0..7491a285e 100644 --- a/module/web/static/js/views/packageTreeView.js +++ b/module/web/static/js/views/packageTreeView.js @@ -1,5 +1,5 @@ -define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/packageView', 'views/fileView'],
- function($, Backbone, _, TreeCollection, packageView, fileView) {
+define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection', 'views/packageView', 'views/fileView'],
+ function($, Backbone, _, App, TreeCollection, packageView, fileView) {
// Renders whole PackageView
return Backbone.View.extend({
@@ -7,20 +7,37 @@ define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/pack el: '#content',
events: {
- 'click #add': 'addPackage',
- 'keypress #name': 'addOnEnter',
'click #show_active': 'filter'
},
+ // <ul> holding the packages
+ packageUL: null,
+
initialize: function() {
+ var self = this;
this.tree = new TreeCollection();
+ // When package is added we reload the data
+ App.vent.on('package:added', function() {
+ console.log('Package tree caught, package:added event');
+ self.tree.fetch();
+ });
+
},
init: function() {
var self = this;
+
+ // TODO: put in separated function
+ // TODO: order of elements?
+ // Init the tree and callback for package added
this.tree.fetch({success: function() {
self.render();
+ self.tree.get('packages').on('add', function(pack) {
+ console.log('Package ' + pack.get('pid') +' added to tree');
+ self.appendPackage(pack);
+
+ })
}});
},
@@ -29,61 +46,37 @@ define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/pack files = this.tree.get('files'),
el = this.$('#dashboard');
- /* el.empty();
- el.append($('<span>Root: ' + this.tree.get('root').get('name') + ' </span>'));
- el.append($('<input id="name" type="text" size="20">'));
- el.append($('<a id="add" href="#"> Add</a><br>'));*/
+ el.empty();
- var ul = $('<ul></ul>');
- packs.each(function(pack) {
- ul.append(new packageView({model: pack}).render().el);
- });
+ this.packageUL = $('<ul></ul>');
+ packs.each(_.bind(this.appendPackage, this));
- el.append(ul);
+ el.append(this.packageUL);
el.append($('<br> Files: ' + files.size() + '<br>'));
- ul = $('<ul></ul>');
+ var ul = $('<ul></ul>');
files.each(function(file) {
ul.append(new fileView({model: file}).render().el);
});
el.append(ul);
- $('#name').focus();
return this;
},
- addOnEnter: function(e) {
- if (e.keyCode != 13) return;
- this.addPackage(e);
- },
-
- addPackage: function(e) {
- var self = this;
- var settings = {
- type: 'POST',
- data: {
- name: JSON.stringify($('#name').val()),
- links: JSON.stringify(['http://download.pyload.org/random.bin', 'invalid link'])
- },
- success: function() {
- self.tree.fetch({success: function() {
- self.render();
- }});
- }
- };
-
- $.ajax('api/addPackage', settings);
- $('#name').val('');
+ // TODO sorting ?!
+ // Append a package to the list
+ appendPackage: function(pack) {
+ this.packageUL.append(new packageView({model: pack}).render().el);
},
toggle: false,
filter: function(e) {
var self = this;
- this.tree.get('packages').each(function(item){
- if(!self.toggle)
- item.trigger('filter:added');
+ this.tree.get('packages').each(function(item) {
+ if (!self.toggle)
+ item.trigger('filter:added');
else
item.trigger('filter:removed');
|