diff options
Diffstat (limited to 'module/web/static/js/views')
| -rw-r--r-- | module/web/static/js/views/abstract/modalView.js | 79 | ||||
| -rw-r--r-- | module/web/static/js/views/dashboard/dashboardView.js (renamed from module/web/static/js/views/dashboardView.js) | 2 | ||||
| -rw-r--r-- | module/web/static/js/views/dashboard/fileView.js (renamed from module/web/static/js/views/fileView.js) | 0 | ||||
| -rw-r--r-- | module/web/static/js/views/dashboard/filterView.js (renamed from module/web/static/js/views/filterView.js) | 0 | ||||
| -rw-r--r-- | module/web/static/js/views/dashboard/packageView.js (renamed from module/web/static/js/views/packageView.js) | 0 | ||||
| -rw-r--r-- | module/web/static/js/views/dashboard/selectionView.js (renamed from module/web/static/js/views/selectionView.js) | 0 | ||||
| -rw-r--r-- | module/web/static/js/views/input/inputLoader.js | 7 | ||||
| -rw-r--r-- | module/web/static/js/views/input/inputView.js | 55 | ||||
| -rw-r--r-- | module/web/static/js/views/input/textInput.js | 33 | ||||
| -rw-r--r-- | module/web/static/js/views/queryModal.js | 35 |
10 files changed, 164 insertions, 47 deletions
diff --git a/module/web/static/js/views/abstract/modalView.js b/module/web/static/js/views/abstract/modalView.js index d3ac34bd6..1e45e942b 100644 --- a/module/web/static/js/views/abstract/modalView.js +++ b/module/web/static/js/views/abstract/modalView.js @@ -31,47 +31,57 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone, }, + // TODO: whole modal stuff is not very elegant render: function() { this.$el.html(this.template(this.renderContent())); - this.$el.addClass('modal hide'); - this.$el.css({opacity: 0, scale: 0.7}); - $("body").append(this.el); - - var self = this; - - this.dialog = this.$el.omniWindow({ - overlay: { - selector: '#modal-overlay', - hideClass: 'hide', - animations: { - hide: function(subjects, internalCallback) { - subjects.overlay.transition({opacity: 'hide', delay: 100}, 300, function() { + this.onRender(); + + if (this.dialog === null) { + this.$el.addClass('modal hide'); + this.$el.css({opacity: 0, scale: 0.7}); + + var self = this; + $("body").append(this.el); + this.dialog = this.$el.omniWindow({ + overlay: { + selector: '#modal-overlay', + hideClass: 'hide', + animations: { + hide: function(subjects, internalCallback) { + subjects.overlay.transition({opacity: 'hide', delay: 100}, 300, function() { + internalCallback(subjects); + self.onHide(); + if (self.onHideDestroy) + self.destroy(); + }); + }, + show: function(subjects, internalCallback) { + subjects.overlay.fadeIn(300); internalCallback(subjects); - if (self.onHideDestroy) - self.destroy(); - }); - }, - show: function(subjects, internalCallback) { - subjects.overlay.fadeIn(300); - internalCallback(subjects); - }}}, - modal: { - hideClass: 'hide', - animations: { - hide: function(subjects, internalCallback) { - subjects.modal.transition({opacity: 'hide', scale: 0.7}, 300); - internalCallback(subjects); - }, - - show: function(subjects, internalCallback) { - subjects.modal.transition({opacity: 'show', scale: 1, delay: 100}, 300, function() { + }}}, + modal: { + hideClass: 'hide', + animations: { + hide: function(subjects, internalCallback) { + subjects.modal.transition({opacity: 'hide', scale: 0.7}, 300); internalCallback(subjects); - }); - }} - }}); + }, + + show: function(subjects, internalCallback) { + subjects.modal.transition({opacity: 'show', scale: 1, delay: 100}, 300, function() { + internalCallback(subjects); + }); + }} + }}); + } return this; }, + + onRender: function() { + + }, + renderContent: function() { return {content: $('<h1>Content!</h1>').html()}; }, @@ -91,7 +101,6 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone, hide: function() { this.dialog.trigger('hide'); - this.onHide(); }, onHide: function() { diff --git a/module/web/static/js/views/dashboardView.js b/module/web/static/js/views/dashboard/dashboardView.js index 58a50777c..c888214df 100644 --- a/module/web/static/js/views/dashboardView.js +++ b/module/web/static/js/views/dashboard/dashboardView.js @@ -1,5 +1,5 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/TreeCollection', - 'views/packageView', 'views/fileView', 'views/selectionView', 'views/filterView', 'select2'], + './packageView', './fileView', './selectionView', './filterView', 'select2'], function($, Backbone, _, App, TreeCollection, packageView, fileView, selectionView, filterView) { // Renders whole dashboard diff --git a/module/web/static/js/views/fileView.js b/module/web/static/js/views/dashboard/fileView.js index c673041b5..c673041b5 100644 --- a/module/web/static/js/views/fileView.js +++ b/module/web/static/js/views/dashboard/fileView.js diff --git a/module/web/static/js/views/filterView.js b/module/web/static/js/views/dashboard/filterView.js index 14968f2cc..14968f2cc 100644 --- a/module/web/static/js/views/filterView.js +++ b/module/web/static/js/views/dashboard/filterView.js diff --git a/module/web/static/js/views/packageView.js b/module/web/static/js/views/dashboard/packageView.js index 547c1470d..547c1470d 100644 --- a/module/web/static/js/views/packageView.js +++ b/module/web/static/js/views/dashboard/packageView.js diff --git a/module/web/static/js/views/selectionView.js b/module/web/static/js/views/dashboard/selectionView.js index 546cda847..546cda847 100644 --- a/module/web/static/js/views/selectionView.js +++ b/module/web/static/js/views/dashboard/selectionView.js diff --git a/module/web/static/js/views/input/inputLoader.js b/module/web/static/js/views/input/inputLoader.js new file mode 100644 index 000000000..5ccf07695 --- /dev/null +++ b/module/web/static/js/views/input/inputLoader.js @@ -0,0 +1,7 @@ +define(['./textInput'], function(textInput) { + + // selects appropriate input element + return function(input, value, default_value, description) { + return textInput; + }; +});
\ No newline at end of file diff --git a/module/web/static/js/views/input/inputView.js b/module/web/static/js/views/input/inputView.js new file mode 100644 index 000000000..15dc71aad --- /dev/null +++ b/module/web/static/js/views/input/inputView.js @@ -0,0 +1,55 @@ +define(['jquery', 'backbone', 'underscore'], function($, Backbone, _) { + + // Renders input elements + return Backbone.View.extend({ + + tagName: 'input', + + model: null, + value: null, + default_value: null, + description: null, + + initialize: function(model, value, default_value, description) { + this.model = model; + this.value = value; + this.default_value = default_value; + this.description = description; + }, + + render: function() { + return this; + }, + + destroy: function() { + this.undelegateEvents(); + this.unbind(); + if (this.onDestroy) { + this.onDestroy(); + } + this.$el.removeData().unbind(); + this.remove(); + }, + + // focus the input element + focus: function() { + this.$el.focus(); + }, + + // Clear the input + clear: function() { + + }, + + // retrieve value of the input + getVal: function() { + return this.value; + }, + + // the child class must call this when the value changed + setVal: function(value) { + this.value = value; + this.trigger('change', value); + } + }); +});
\ No newline at end of file diff --git a/module/web/static/js/views/input/textInput.js b/module/web/static/js/views/input/textInput.js new file mode 100644 index 000000000..7252ce289 --- /dev/null +++ b/module/web/static/js/views/input/textInput.js @@ -0,0 +1,33 @@ +define(['jquery', 'backbone', 'underscore', './inputView'], function($, Backbone, _, inputView) { + + return inputView.extend({ + + // TODO + tagName: 'input', + events: { + 'keypress': 'onChange' + }, + + render: function() { + this.$el.attr('type', 'text'); + this.$el.attr('name', 'textInput'); + + if (this.default_value) + this.$el.attr('placeholder', this.default_value); + + if (this.value) + this.$el.val(this.value); + + return this; + }, + + clear: function() { + this.$el.val(''); + }, + + onChange: function(e) { + this.setVal(this.$el.val()); + } + + }); +});
\ No newline at end of file diff --git a/module/web/static/js/views/queryModal.js b/module/web/static/js/views/queryModal.js index 5d1585a0d..86fd5b78b 100644 --- a/module/web/static/js/views/queryModal.js +++ b/module/web/static/js/views/queryModal.js @@ -1,15 +1,18 @@ -define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'text!tpl/default/queryDialog.html'], - function($, _, App, modalView, template) { +define(['jquery', 'underscore', 'app', 'views/abstract/modalView', './input/inputLoader', 'text!tpl/default/queryDialog.html'], + function($, _, App, modalView, load_input, template) { return modalView.extend({ events: { 'click .btn-success': 'submit', 'submit form': 'submit' }, + template: _.compile(template), - model: null, + // the notificationView parent: null, - template: _.compile(template), + + model: null, + input: null, initialize: function() { // Inherit parent events @@ -23,32 +26,42 @@ define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'text!tpl/def description: this.model.get('description') }; + var input = this.model.get('input').data; if (this.model.isCaptcha()) { - var input = this.model.get('input').data; data.captcha = input[0]; data.type = input[1]; } - return data; }, + onRender: function() { + // instantiate the input + var input = this.model.get('input'); + var inputView = load_input(input); + this.input = new inputView(input); + // only renders after wards + this.$('#inputField').append(this.input.render().el); + }, + submit: function(e) { e.stopPropagation(); - // TODO: different input types // TODO: load next task - this.model.set('result', this.$('input').val()); + this.model.set('result', this.input.getVal()); var self = this; this.model.save({success: function() { self.hide(); }}); - this.$('input').val(''); + this.input.clear(); }, onShow: function() { - this.$('input').focus(); - } + this.input.focus(); + }, + onHide: function() { + this.input.destroy(); + } }); });
\ No newline at end of file |