From ead9f8f36f6c836cb8637003b83b670b8719e252 Mon Sep 17 00:00:00 2001 From: Matt Enlow Date: Tue, 17 Mar 2015 12:03:41 -0600 Subject: [PATCH] Autosave by observing model.scratch in editor No issue - removes keypress handling in the editor component - automated value changes via shortcuts still autosave --- core/client/app/components/gh-ed-editor.js | 31 ------------- .../app/mixins/editor-base-controller.js | 43 +++++++++++++------ core/client/app/mixins/editor-base-route.js | 7 ++- core/client/app/templates/editor/edit.hbs | 5 +-- 4 files changed, 35 insertions(+), 51 deletions(-) diff --git a/core/client/app/components/gh-ed-editor.js b/core/client/app/components/gh-ed-editor.js index 9d6262cb30..eb452d1dd1 100644 --- a/core/client/app/components/gh-ed-editor.js +++ b/core/client/app/components/gh-ed-editor.js @@ -39,38 +39,12 @@ Editor = Ember.TextArea.extend(EditorAPI, EditorShortcuts, EditorScroll, { } }, - /** - * Use keypress events to trigger autosave - */ - changeHandler: function () { - // onChange is sent to trigger autosave - this.sendAction('onChange'); - }, - - /** - * Bind to the keypress event once the element is in the DOM - * Use keypress because it's the most reliable cross browser - */ - attachChangeHandler: function () { - this.$().on('keypress', Ember.run.bind(this, this.changeHandler)); - }.on('didInsertElement'), - - /** - * Unbind from the keypress event when the element is no longer in the DOM - */ - detachChangeHandler: function () { - this.$().off('keypress'); - Ember.run.cancel(this.get('fixHeightThrottle')); - }.on('willDestroyElement'), - /** * Disable editing in the textarea (used while an upload is in progress) */ disable: function () { var textarea = this.get('element'); textarea.setAttribute('readonly', 'readonly'); - - this.detachChangeHandler(); }, /** @@ -79,11 +53,6 @@ Editor = Ember.TextArea.extend(EditorAPI, EditorShortcuts, EditorScroll, { enable: function () { var textarea = this.get('element'); textarea.removeAttribute('readonly'); - - // clicking the trash button on an image dropzone causes this function to fire. - // this line is a hack to prevent multiple event handlers from being attached. - this.detachChangeHandler(); - this.attachChangeHandler(); } }); diff --git a/core/client/app/mixins/editor-base-controller.js b/core/client/app/mixins/editor-base-controller.js index 67abe550a3..84279c91cd 100644 --- a/core/client/app/mixins/editor-base-controller.js +++ b/core/client/app/mixins/editor-base-controller.js @@ -31,6 +31,36 @@ EditorControllerMixin = Ember.Mixin.create({ return self.get('isDirty') ? self.unloadDirtyMessage() : null; }; }, + lastModelId: null, + modelChanged: Ember.computed('model.id', function (key, value) { + var modelId = this.get('model.id'); + + if (arguments.length > 1) { + return value; + } + + if (this.get('lastModelId') === modelId) { + return false; + } + + this.set('lastModelId', modelId); + return true; + }), + autoSave: function () { + // Don't save just because we swapped out models + if (this.get('modelChanged')) { + this.set('modelChanged', false); + } else if (this.get('model.isDraft') && !this.get('model.isNew')) { + var autoSaveId, + timedSaveId; + + timedSaveId = Ember.run.throttle(this, 'send', 'save', {silent: true, disableNProgress: true}, 60000, false); + this.set('timedSaveId', timedSaveId); + + autoSaveId = Ember.run.debounce(this, 'send', 'save', {silent: true, disableNProgress: true}, 3000); + this.set('autoSaveId', autoSaveId); + } + }.observes('model.scratch'), /** * By default, a post will not change its publish state. @@ -332,19 +362,6 @@ EditorControllerMixin = Ember.Mixin.create({ this.set('isPreview', preview); }, - autoSave: function () { - if (this.get('model.isDraft')) { - var autoSaveId, - timedSaveId; - - timedSaveId = Ember.run.throttle(this, 'send', 'save', {silent: true, disableNProgress: true}, 60000, false); - this.set('timedSaveId', timedSaveId); - - autoSaveId = Ember.run.debounce(this, 'send', 'save', {silent: true, disableNProgress: true}, 3000); - this.set('autoSaveId', autoSaveId); - } - }, - autoSaveNew: function () { if (this.get('model.isNew')) { this.send('save', {silent: true, disableNProgress: true}); diff --git a/core/client/app/mixins/editor-base-route.js b/core/client/app/mixins/editor-base-route.js index 775c2b6edb..3a0dabc085 100644 --- a/core/client/app/mixins/editor-base-route.js +++ b/core/client/app/mixins/editor-base-route.js @@ -110,13 +110,12 @@ var EditorBaseRoute = Ember.Mixin.create(styleBody, ShortcutsRoute, loadingIndic }, setupController: function (controller, model) { + model.set('scratch', model.get('markdown')); + model.set('titleScratch', model.get('title')); + this._super(controller, model); var tags = model.get('tags'); - controller.set('model.scratch', model.get('markdown')); - - controller.set('model.titleScratch', model.get('title')); - if (tags) { // used to check if anything has changed in the editor controller.set('previousTagNames', tags.mapBy('name')); diff --git a/core/client/app/templates/editor/edit.hbs b/core/client/app/templates/editor/edit.hbs index dce9752a83..6f379a4bef 100644 --- a/core/client/app/templates/editor/edit.hbs +++ b/core/client/app/templates/editor/edit.hbs @@ -18,9 +18,8 @@
{{gh-ed-editor classNames="markdown-editor js-markdown-editor" tabindex="1" spellcheck="true" value=model.scratch - scrollInfo=view.editorScrollInfo - setEditor="setEditor" openModal="openModal" onChange="autoSave" - focus=shouldFocusEditor focusCursorAtEnd=model.isDirty onFocusIn="autoSaveNew"}} + scrollInfo=view.editorScrollInfo focus=shouldFocusEditor focusCursorAtEnd=model.isDirty + setEditor="setEditor" openModal="openModal" onFocusIn="autoSaveNew"}}