diff --git a/package.json b/package.json index 13cdabddf..e0422c1e9 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "editor" ], "scripts": { - "postinstall": "node_modules/.bin/bower install --config.interactive=false", + "postinstall": "node ./node_modules/bower/bin/bower install --config.interactive=false", "build": "node_modules/.bin/grunt build", "test": "node_modules/.bin/grunt test", "dev": "node_modules/.bin/grunt dev" diff --git a/src/class_manager/config/config.js b/src/class_manager/config/config.js new file mode 100644 index 000000000..afb6bd83e --- /dev/null +++ b/src/class_manager/config/config.js @@ -0,0 +1,7 @@ +define(function () { + return { + + // Default classes + classes : [], + }; +}); \ No newline at end of file diff --git a/src/class_manager/main.js b/src/class_manager/main.js new file mode 100644 index 000000000..c6a0bf657 --- /dev/null +++ b/src/class_manager/main.js @@ -0,0 +1,47 @@ +define(function(require) { + /** + * @class ClassManager + * @param {Object} config Configurations + * + * */ + var ClassManager = function(config) + { + var c = config || {}, + def = require('./config/config'), + Classes = require('./model/Classes'); + + for (var name in def) { + if (!(name in c)) + c[name] = def[name]; + } + + this.classes = new Classes(c.classes); + + this.Classes = Classes; + }; + + ClassManager.prototype = { + + /** + * Get collection of classes + * + * @return {Object} + * */ + getClasses : function() { + return this.classes; + }, + + /** + * Get class by its name + * + * @return {Object|null} + * */ + getClass : function(id) { + var res = this.classes.where({name: id}); + return res.length ? res[0] : null; + }, + }; + + return ClassManager; + +}); \ No newline at end of file diff --git a/src/class_manager/model/Class.js b/src/class_manager/model/Class.js new file mode 100644 index 000000000..3c08ec3cb --- /dev/null +++ b/src/class_manager/model/Class.js @@ -0,0 +1,14 @@ +define(['backbone'], + function (Backbone) { + /** + * @class Class + * */ + return Backbone.Model.extend({ + + defaults: { + label: '', + name: '', + }, + + }); +}); diff --git a/src/class_manager/model/Classes.js b/src/class_manager/model/Classes.js new file mode 100644 index 000000000..a96d33a5b --- /dev/null +++ b/src/class_manager/model/Classes.js @@ -0,0 +1,11 @@ +define(['backbone','./Class'], + function (Backbone, Class) { + /** + * @class Classes + * */ + return Backbone.Collection.extend({ + + model: Class, + + }); +}); diff --git a/src/class_manager/view/ClassItemsView.js b/src/class_manager/view/ClassItemsView.js new file mode 100644 index 000000000..9a1e23d82 --- /dev/null +++ b/src/class_manager/view/ClassItemsView.js @@ -0,0 +1,93 @@ +define(['backbone', 'text!./../template/classItems.html'], + function (Backbone, itemsTemplate) { + /** + * @class ClassItemsView + * */ + return Backbone.View.extend({ + + template: _.template(itemsTemplate), + + events:{ + 'click .add': 'startNewClass', + 'keyup .input' : 'onInputKeyUp' + }, + + initialize: function(o) { + this.events['click #'+this.pfx+'add'] = 'addLayer'; + + if(!this.layers){ + this.layers = new Layers(); + this.model.set('layers', this.layers); + this.$layers = new LayersView({ + collection : this.layers, + stackModel : this.model, + preview : this.model.get('preview'), + config : o.config + }); + } + + this.targetCl = this.target.classes; + + this.listenTo( this.targetCl, 'add', this.addClass); + this.listenTo( this.targetCl, 'reset', this.renderClasses); + + this.delegateEvents(); + }, + + onInputKeyUp: function(e){ + if (e.keyCode === 13) { + this.addItem(); + }else{ + this.searchItem(); + } + }, + + /** + * Add new object to collection + * @param Object Model + * @param Object Fragment collection + * + * @return Object Object created + * */ + addToClasses: function(model, fragmentEl){ + var fragment = fragmentEl || null; + var viewObject = ClassTagView; + + var view = new viewObject({ + model: model, + config: this.config, + }); + var rendered = view.render().el; + + if(fragment) + fragment.appendChild( rendered ); + else + this.$classes.append(rendered); + + return rendered; + }, + + renderClasses: function() { + var fragment = document.createDocumentFragment(); + this.$classes.empty(); + + this.collection.each(function(model){ + this.addToClasses(model, fragment); + },this); + + this.$classes.append(fragment); + return this; + }, + + + /** @inheritdoc */ + render : function(){ + this.renderLabel(); + this.renderField(); + this.renderLayers(); + this.$el.attr('class', this.className); + return this; + }, + + }); +}); diff --git a/src/config/require-config.js b/src/config/require-config.js index 6224512b1..84e6cc784 100644 --- a/src/config/require-config.js +++ b/src/config/require-config.js @@ -35,6 +35,7 @@ require.config({ packages : [ { name: 'AssetManager', location: 'asset_manager', }, { name: 'StyleManager', location: 'style_manager', }, + { name: 'ClassManager', location: 'class_manager', }, { name: 'StorageManager', location: 'storage_manager', }, { name: 'Navigator', location: 'navigator', }, { name: 'DomComponents', location: 'dom_components', }, diff --git a/src/dom_components/main.js b/src/dom_components/main.js index 044f38196..f3e4ee96b 100644 --- a/src/dom_components/main.js +++ b/src/dom_components/main.js @@ -28,7 +28,6 @@ define(function(require) { // If there is no components try to append defaults if(!c.wrapper.components.length && c.defaults.length){ - console.log('Set defaults'); c.wrapper.components = c.defaults; } diff --git a/src/editor/config/config.js b/src/editor/config/config.js index d93722d58..9b06d527b 100644 --- a/src/editor/config/config.js +++ b/src/editor/config/config.js @@ -61,6 +61,9 @@ define(function () { //Configurations for Commands commands : {}, + //Configurations for Class Manager + classManager : {}, + }; return config; }); \ No newline at end of file diff --git a/src/editor/model/Editor.js b/src/editor/model/Editor.js index 6eeed6691..7454377a1 100644 --- a/src/editor/model/Editor.js +++ b/src/editor/model/Editor.js @@ -10,6 +10,7 @@ define([ 'Canvas', 'RichTextEditor', 'DomComponents', + 'ClassManager', 'Panels'], function( Backbone, @@ -23,6 +24,7 @@ define([ Canvas, RichTextEditor, DomComponents, + ClassManager, Panels ){ return Backbone.Model.extend({ @@ -40,6 +42,7 @@ define([ this.compName = this.config.storagePrefix + 'components' + this.config.id; this.set('Config', c); + this.initClassManager(); this.initStorage(); this.initModal(); this.initAssetManager(); @@ -54,6 +57,15 @@ define([ this.on('change:selectedComponent', this.componentSelected, this); }, + /** + * Initialize Class manager + * */ + initClassManager: function() + { + this.clm = new ClassManager(this.config.classManager); + this.set('ClassManager', this.clm); + }, + /** * Initialize components * */