From a03ece96ae83e8fedb27fdb297c52a8e6b111d55 Mon Sep 17 00:00:00 2001 From: RaNaN Date: Sat, 1 Sep 2012 21:00:38 +0200 Subject: some functionality for the views --- module/web/static/js/views/fileView.js | 20 ++++ module/web/static/js/views/packageTreeView.js | 134 +++++++++++++++----------- module/web/static/js/views/packageView.js | 45 +++++++++ 3 files changed, 145 insertions(+), 54 deletions(-) create mode 100644 module/web/static/js/views/fileView.js create mode 100644 module/web/static/js/views/packageView.js (limited to 'module/web/static/js/views') diff --git a/module/web/static/js/views/fileView.js b/module/web/static/js/views/fileView.js new file mode 100644 index 000000000..7db8112c8 --- /dev/null +++ b/module/web/static/js/views/fileView.js @@ -0,0 +1,20 @@ +define(['jquery', 'backbone', 'underscore'], function($, Backbone, _) { + + // Renders single file item + return Backbone.View.extend({ + + tagName: 'li', + events: { + + }, + + initialize: function() { + }, + + render: function() { + this.$el.html(this.model.get('name')); + return this; + } + + }); +}); \ No newline at end of file diff --git a/module/web/static/js/views/packageTreeView.js b/module/web/static/js/views/packageTreeView.js index 79527b394..91768ec04 100644 --- a/module/web/static/js/views/packageTreeView.js +++ b/module/web/static/js/views/packageTreeView.js @@ -1,54 +1,80 @@ -define(['jquery', 'backbone', 'underscore', 'models/TreeCollection'], function($, Backbone, _, TreeCollection){ - - // Renders whole PackageView - return Backbone.View.extend({ - - el: '#content', - - events: { - - }, - - initialize: function() { - _.bindAll(this, 'render'); - - this.tree = new TreeCollection(); - - }, - - init: function() { - var self = this; - this.tree.fetch({success: function(){ - self.render(); - }}); - }, - - - render: function() { - - var packs = this.tree.get('packages'), - files = this.tree.get('files'), - html = 'Root: ' + this.tree.get('root').get('name') + '
'; - - html += 'Packages: ' + packs.size(); - html += '

Files: ' + files.size() + '
'; - - - this.$el.html(html); - - return this; - } - - }); -}); \ No newline at end of file +define(['jquery', 'backbone', 'underscore', 'models/TreeCollection', 'views/packageView', 'views/fileView'], + function($, Backbone, _, TreeCollection, packageView, fileView) { + + // Renders whole PackageView + return Backbone.View.extend({ + + el: '#content', + + events: { + 'click #add': 'addPackage', + 'keypress #name': 'addOnEnter' + }, + + initialize: function() { + _.bindAll(this, 'render'); + + this.tree = new TreeCollection(); + + }, + + init: function() { + var self = this; + this.tree.fetch({success: function() { + self.render(); + }}); + }, + + render: function() { + + this.$el.html("
"); + + var packs = this.tree.get('packages'), + files = this.tree.get('files'); + + this.$el.append($('Root: ' + this.tree.get('root').get('name') + ' ')); + this.$el.append($('')); + this.$el.append($(' Add
')); + + var ul = $(''); + packs.each(function(pack) { + ul.append(new packageView({model: pack}).render().el); + }); + + this.$el.append(ul); + this.$el.append($('
Files: ' + files.size() + '
')); + + ul = $(''); + files.each(function(file) { + ul.append(new fileView({model: file}).render().el); + }); + + this.$el.append(ul); + + return this; + }, + + addOnEnter: function(e) { + if (e.keyCode != 13) return; + this.addPackage(e); + }, + + addPackage: function() { + var self = this; + var settings = { + data: { + name: '"' + $('#name').val() + '"', + links: '["some link"]' + }, + success: function() { + self.tree.fetch({success: function() { + self.render(); + }}); + } + }; + + $.ajax('api/addPackage', settings); + $('#name').val(''); + } + }); + }); \ No newline at end of file diff --git a/module/web/static/js/views/packageView.js b/module/web/static/js/views/packageView.js new file mode 100644 index 000000000..a2e0abf31 --- /dev/null +++ b/module/web/static/js/views/packageView.js @@ -0,0 +1,45 @@ +define(['jquery', 'backbone', 'underscore', 'views/fileView'], function($, Backbone, _, fileView) { + + // Renders a single package item + return Backbone.View.extend({ + + tagName: 'li', + events: { + 'click .load': 'load', + 'click .delete': 'delete' + }, + + initialize: function() { + this.model.on('change', this.render, this); + this.model.on('remove', this.unrender, this); + }, + + render: function() { + this.$el.html('Package ' + this.model.get('pid') + ': ' + this.model.get('name')); + this.$el.append($(' Load')); + this.$el.append($(' Delete')); + + if (this.model.isLoaded()) { + var ul = $(''); + this.model.get('files').each(function(file) { + ul.append(new fileView({model: file}).render().el); + }); + this.$el.append(ul); + } + return this; + }, + + unrender: function() { + this.$el.remove(); + }, + + load: function() { + this.model.fetch(); + }, + + delete: function() { + this.model.destroy(); + } + + }); +}); \ No newline at end of file -- cgit v1.2.3