diff --git a/addon/components/trumbowyg-editor.js b/addon/components/trumbowyg-editor.js index 2a73539..e99fa3f 100644 --- a/addon/components/trumbowyg-editor.js +++ b/addon/components/trumbowyg-editor.js @@ -18,6 +18,8 @@ export default Ember.Component.extend({ 'removeformatPasted', 'autogrow' ], + + oldOptions: {}, _updateDisabled(){ if (typeof this.get("disabled") === "boolean") { @@ -32,7 +34,7 @@ export default Ember.Component.extend({ options[optionName] = this.get(optionName); return options; }, {}); - + options.svgPath = "/assets/ui/icons.svg"; this.$().attr("placeholder", this.get("placeholder")); this.$().trumbowyg(options); this.$().trumbowyg('html', this.get('html')); @@ -50,29 +52,42 @@ export default Ember.Component.extend({ this.$().trumbowyg('destroy'); }, - _isAttrChanged(attrs, attrName){ - return Ember.get(attrs, `newAttrs.${attrName}.value`) !== Ember.get(attrs, `oldAttrs.${attrName}.value`); + + _isAttrChanged(attrName){ + return this.get(attrName) !== this.get(`oldOptions.${attrName}`); }, didInsertElement(){ this._renderTrumbowyg(); }, - didUpdateAttrs(attrs) { + didReceiveAttrs() { + var oldAttrs = this.get('oldOptions'); + this.get('optionNames').forEach((option) => { + //oldAttrs[option] = this.get(option); + Ember.set(oldAttrs, option, this.get(option)); + }); + Ember.set(oldAttrs, 'placeholder', this.get('placeholder')); + Ember.set(oldAttrs, 'disabled', this.get('disabled')); + this.set('oldOptions', oldAttrs); + }, + + didUpdateAttrs() { const optionsUpdated = this.get('optionNames') - .some(optionName => this._isAttrChanged(attrs, optionName)); - const htmlUpdated = Ember.get(attrs, 'newAttrs.html.value') !== this.$().trumbowyg('html'); - const disabledUpdated = this._isAttrChanged(attrs, 'disabled'); - const placeholderUpdated = this._isAttrChanged(attrs, 'placeholder'); + .some(optionName => this._isAttrChanged(optionName)); + const htmlUpdated = this.get('html') !== this.$().trumbowyg('html'); + const disabledUpdated = this._isAttrChanged('disabled'); + const placeholderUpdated = this._isAttrChanged('placeholder'); + + if (htmlUpdated) { + this.$().trumbowyg('html', this.get('html')); + } if (optionsUpdated || placeholderUpdated) { this._destroyTrumbowyg(); this._renderTrumbowyg(); } - - if (htmlUpdated) { - this.$().trumbowyg('html', this.get('html')); - } + if (disabledUpdated) { this._updateDisabled(); diff --git a/bower.json b/bower.json index 01b649c..392395f 100644 --- a/bower.json +++ b/bower.json @@ -5,6 +5,6 @@ "ember-cli-shims": "0.1.1", "ember-cli-test-loader": "0.2.2", "ember-qunit-notifications": "0.1.0", - "trumbowyg": "~2.1.0" + "trumbowyg": "~2.9.4" } } diff --git a/index.js b/index.js index d38d2b6..6fad75a 100644 --- a/index.js +++ b/index.js @@ -23,7 +23,24 @@ module.exports = { var trumbowygDist = path.join(app.bowerDirectory, 'trumbowyg', 'dist') var trumbowygLangsDist = path.join(trumbowygDist, 'langs'); var trumbowygPluginsDist = path.join(trumbowygDist, 'plugins'); + + [ 'version', 'data', 'disable-selection', 'focusable', 'escape-selector', 'form', + 'ie', 'keycode', 'labels', 'jquery-1-7', 'plugin', 'safe-active-element', + 'safe-blur', 'scroll-parent', 'tabbable', 'unique-id', 'widget' + ].forEach(function(module) { + app.import({ + development: app.bowerDirectory + '/jquery-ui/ui/' + module + '.js', + production: app.bowerDirectory + '/jquery-ui/ui/minified/' + module + '.min.js' + }); + }); + [ 'mouse', 'draggable', 'droppable', 'resizable' ].forEach(function(module) { + app.import({ + development: app.bowerDirectory + '/jquery-ui/ui/widgets/' + module + '.js', + production: app.bowerDirectory + '/jquery-ui/ui/widgets/minified/' + module + '.min.js' + }); + }); + app.import(path.join(trumbowygDist, 'trumbowyg.min.js')); app.import(path.join(trumbowygDist, 'ui/trumbowyg.min.css')); app.import(path.join(trumbowygDist, 'ui/icons.svg'), { destDir: 'assets/ui' }); @@ -55,3 +72,4 @@ module.exports = { }); } }; +