diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js index 64d278af9..26f808325 100644 --- a/src/dom_components/model/Component.js +++ b/src/dom_components/model/Component.js @@ -170,6 +170,10 @@ const Component = Backbone.Model.extend(Styleable).extend( ); }); this.init(); + + if (em) { + em.trigger('component:create', this); + } }, /** @@ -868,14 +872,23 @@ const Component = Backbone.Model.extend(Styleable).extend( }, /** - * Get the DOM element of the component. This works only of the - * component is already rendered + * Get the DOM element of the component. + * This works only if the component is already rendered * @return {HTMLElement} */ getEl() { return this.view && this.view.el; }, + /** + * Get the View of the component. + * This works only if the component is already rendered + * @return {ComponentView} + */ + getView() { + return this.view; + }, + /** * Return script in string format, cleans 'function() {..' from scripts * if it's a function diff --git a/src/dom_components/view/ComponentImageView.js b/src/dom_components/view/ComponentImageView.js index f3bd7a394..ff5bf18ff 100644 --- a/src/dom_components/view/ComponentImageView.js +++ b/src/dom_components/view/ComponentImageView.js @@ -78,15 +78,14 @@ module.exports = ComponentView.extend({ }, render() { - this.updateAttributes(); - this.updateClasses(); + this.renderAttributes(); + const { $el, model } = this; + const cls = $el.attr('class') || ''; + !model.get('src') && $el.attr('class', `${cls} ${this.classEmpty}`.trim()); + // Avoid strange behaviours with drag and drop + $el.attr('onmousedown', 'return false'); + this.postRender(); - var actCls = this.$el.attr('class') || ''; - if (!this.model.get('src')) - this.$el.attr('class', (actCls + ' ' + this.classEmpty).trim()); - - // Avoid strange behaviours while try to drag - this.$el.attr('onmousedown', 'return false'); return this; } }); diff --git a/src/dom_components/view/ComponentTableBodyView.js b/src/dom_components/view/ComponentTableBodyView.js index 0f7e29983..36fd59e54 100644 --- a/src/dom_components/view/ComponentTableBodyView.js +++ b/src/dom_components/view/ComponentTableBodyView.js @@ -1,4 +1 @@ -var Backbone = require('backbone'); -var ComponentView = require('./ComponentView'); - -module.exports = ComponentView.extend({}); +module.exports = require('./ComponentView').extend({}); diff --git a/src/dom_components/view/ComponentTableCellView.js b/src/dom_components/view/ComponentTableCellView.js index 0f7e29983..36fd59e54 100644 --- a/src/dom_components/view/ComponentTableCellView.js +++ b/src/dom_components/view/ComponentTableCellView.js @@ -1,4 +1 @@ -var Backbone = require('backbone'); -var ComponentView = require('./ComponentView'); - -module.exports = ComponentView.extend({}); +module.exports = require('./ComponentView').extend({}); diff --git a/src/dom_components/view/ComponentTableFootView.js b/src/dom_components/view/ComponentTableFootView.js index 0f7e29983..36fd59e54 100644 --- a/src/dom_components/view/ComponentTableFootView.js +++ b/src/dom_components/view/ComponentTableFootView.js @@ -1,4 +1 @@ -var Backbone = require('backbone'); -var ComponentView = require('./ComponentView'); - -module.exports = ComponentView.extend({}); +module.exports = require('./ComponentView').extend({}); diff --git a/src/dom_components/view/ComponentTableHeadView.js b/src/dom_components/view/ComponentTableHeadView.js index 0f7e29983..36fd59e54 100644 --- a/src/dom_components/view/ComponentTableHeadView.js +++ b/src/dom_components/view/ComponentTableHeadView.js @@ -1,4 +1 @@ -var Backbone = require('backbone'); -var ComponentView = require('./ComponentView'); - -module.exports = ComponentView.extend({}); +module.exports = require('./ComponentView').extend({}); diff --git a/src/dom_components/view/ComponentTableRowView.js b/src/dom_components/view/ComponentTableRowView.js index 0f7e29983..36fd59e54 100644 --- a/src/dom_components/view/ComponentTableRowView.js +++ b/src/dom_components/view/ComponentTableRowView.js @@ -1,4 +1 @@ -var Backbone = require('backbone'); -var ComponentView = require('./ComponentView'); - -module.exports = ComponentView.extend({}); +module.exports = require('./ComponentView').extend({}); diff --git a/src/dom_components/view/ComponentTableView.js b/src/dom_components/view/ComponentTableView.js index 56e4aa733..c8d62236f 100644 --- a/src/dom_components/view/ComponentTableView.js +++ b/src/dom_components/view/ComponentTableView.js @@ -1,6 +1,3 @@ -var Backbone = require('backbone'); -var ComponentView = require('./ComponentView'); - -module.exports = ComponentView.extend({ +module.exports = require('./ComponentView').extend({ events: {} }); diff --git a/src/dom_components/view/ComponentView.js b/src/dom_components/view/ComponentView.js index f1f19b5d2..1dd8e5540 100644 --- a/src/dom_components/view/ComponentView.js +++ b/src/dom_components/view/ComponentView.js @@ -17,9 +17,10 @@ module.exports = Backbone.View.extend({ initialize(opt = {}) { const model = this.model; const config = opt.config || {}; + const em = config.em; this.opts = opt; this.config = config; - this.em = config.em || ''; + this.em = em || ''; this.pfx = config.stylePrefix || ''; this.ppfx = config.pStylePrefix || ''; this.attr = model.get('attributes'); @@ -345,9 +346,16 @@ module.exports = Backbone.View.extend({ this.renderAttributes(); this.renderChildren(); this.updateScript(); - this.onRender(); + this.postRender(); + return this; }, + postRender() { + const { em, model } = this; + this.onRender(); + em && em.trigger('component:mount', model); + }, + onRender() {} });