Merge pull request #5920 from kevinansfield/fix-upload-autoscroll

Fix preview scroll jump when adding/removing images
This commit is contained in:
Hannah Wolfe 2015-10-07 12:46:56 +01:00
commit b70c753466
3 changed files with 36 additions and 27 deletions

View File

@ -259,6 +259,7 @@ export default function (options) {
ui;
ui = new UploadUi($dropzone, settings);
$(this).attr('data-uploaderui', true);
this.uploaderUi = ui;
ui.init();
});

View File

@ -6,38 +6,46 @@ export default Ember.Component.extend({
didInsertElement: function () {
this.set('scrollWrapper', this.$().closest('.entry-preview-content'));
this.adjustScrollPosition(this.get('scrollPosition'));
Ember.run.scheduleOnce('afterRender', this, this.dropzoneHandler);
},
adjustScrollPosition: Ember.observer('scrollPosition', function () {
var scrollWrapper = this.get('scrollWrapper'),
scrollPosition = this.get('scrollPosition');
didReceiveAttrs: function (attrs) {
if (!attrs.oldAttrs) { return; }
if (attrs.newAttrs.scrollPosition && attrs.newAttrs.scrollPosition.value !== attrs.oldAttrs.scrollPosition.value) {
this.adjustScrollPosition(attrs.newAttrs.scrollPosition.value);
}
if (attrs.newAttrs.markdown.value !== attrs.oldAttrs.markdown.value) {
Ember.run.scheduleOnce('afterRender', this, this.dropzoneHandler);
}
},
adjustScrollPosition: function (scrollPosition) {
var scrollWrapper = this.get('scrollWrapper');
if (scrollWrapper) {
scrollWrapper.scrollTop(scrollPosition);
}
}),
dropzoneHandler: function () {
var dropzones = $('.js-drop-zone');
uploader.call(dropzones, {
editor: true,
fileStorage: this.get('config.fileStorage')
});
dropzones.on('uploadstart', Ember.run.bind(this, 'sendAction', 'uploadStarted'));
dropzones.on('uploadfailure', Ember.run.bind(this, 'sendAction', 'uploadFinished'));
dropzones.on('uploadsuccess', Ember.run.bind(this, 'sendAction', 'uploadFinished'));
dropzones.on('uploadsuccess', Ember.run.bind(this, 'sendAction', 'uploadSuccess'));
// Set the current height so we can listen
this.sendAction('updateHeight', this.$().height());
},
// fire off 'enable' API function from uploadManager
// might need to make sure markdown has been processed first
reInitDropzones: Ember.observer('markdown', function () {
Ember.run.scheduleOnce('afterRender', this, this.dropzoneHandler);
})
dropzoneHandler: function () {
var dropzones = $('.js-drop-zone[data-uploaderui!="true"]');
if (dropzones.length) {
uploader.call(dropzones, {
editor: true,
fileStorage: this.get('config.fileStorage')
});
dropzones.on('uploadstart', Ember.run.bind(this, 'sendAction', 'uploadStarted'));
dropzones.on('uploadfailure', Ember.run.bind(this, 'sendAction', 'uploadFinished'));
dropzones.on('uploadsuccess', Ember.run.bind(this, 'sendAction', 'uploadFinished'));
dropzones.on('uploadsuccess', Ember.run.bind(this, 'sendAction', 'uploadSuccess'));
// Set the current height so we can listen
this.sendAction('updateHeight', this.$().height());
}
}
});

View File

@ -47,8 +47,8 @@
</header>
<section class="entry-preview-content js-entry-preview-content">
{{gh-ed-preview classNames="rendered-markdown js-rendered-markdown"
markdown=model.scratch scrollPosition=ghEditor.scrollPosition updateHeight="updateHeight"
uploadStarted="disableEditor" uploadFinished="enableEditor" uploadSuccess="handleImgUpload"}}
markdown=model.scratch scrollPosition=ghEditor.scrollPosition updateHeight="updateHeight"
uploadStarted="disableEditor" uploadFinished="enableEditor" uploadSuccess="handleImgUpload"}}
</section>
</section>
</section>