Brion VIBBER has submitted this change and it was merged.
Change subject: Fix photo upload bug when the same image selected twice
......................................................................
Fix photo upload bug when the same image selected twice
Now if the same picture is selected again in photo uploads, the preview
overlay will show up correctly.
There's some refactoring in this commit too, splitting the
PhotoUploader#initialize into initialize and _submit.
Change-Id: Id78376cecc22a892032e086703bcd66d785d2865
---
M javascripts/modules/mf-photo.js
1 file changed, 66 insertions(+), 58 deletions(-)
Approvals:
Brion VIBBER: Verified; Looks good to me, approved
awjrichards: Looks good to me, but someone else must approve
diff --git a/javascripts/modules/mf-photo.js b/javascripts/modules/mf-photo.js
index dfe6b5f..2f56e71 100644
--- a/javascripts/modules/mf-photo.js
+++ b/javascripts/modules/mf-photo.js
@@ -153,7 +153,8 @@
return this.$description.val();
},
- setImage: function( url ) {
+ setImageUrl: function( url ) {
+ this.imageUrl = url;
this.$( '.loading' ).remove();
$( '<img>' ).attr( 'src', url ).prependTo( this.$(
'.photoPreview' ) );
}
@@ -259,75 +260,82 @@
template: M.template.get( 'photoUploader' ),
initialize: function( options ) {
- var self = this, $input = this.$( 'input' ), preview;
+ var self = this, $input = this.$( 'input' );
- this.$input = $input;
-
- function showPreview( ev ) {
- var dataUrl = ev.target.result;
- // add mimetype if not present (some browsers
need it, e.g. Android browser)
- dataUrl = dataUrl.replace( /^data:base64/,
'data:image/jpeg;base64' );
- preview.setImage( dataUrl );
-
- preview.
- on( 'cancel', function() {
- nav.closeOverlay();
- } ).
- on( 'submit', function() {
- var description =
preview.getDescription(),
- api = new PhotoApi(),
- progressPopup = new
PhotoUploadProgress();
-
- self.emit( 'start' );
- nav.closeOverlay();
- popup.show( progressPopup.$el,
'locked noButton loading' );
- progressPopup.on( 'cancel',
function() {
- api.abort();
- } );
-
- api.save( {
- file:
$input[0].files[0],
- description:
description,
- insertInPage:
options.insertInPage,
- pageTitle:
options.pageTitle
- }, function( fileName,
descriptionUrl ) {
- popup.close();
-
- if ( !fileName ) {
- popup.show(
mw.msg( 'mobile-frontend-photo-upload-error' ), 'toast error' );
- self.emit(
'error' );
- return;
- }
-
- self.emit( 'success', {
- fileName:
fileName,
- description:
description,
- descriptionUrl:
descriptionUrl,
- url: dataUrl
- } );
- } );
-
- api.on( 'progress', function(
value ) {
- progressPopup.setValue(
value );
- } );
- } );
- }
+ this.options = options;
$input.
// accept must be set via attr otherwise cannot
use camera on Android
attr( 'accept', 'image/*;' ).
on( 'change', function() {
- var fileReader = new FileReader();
- preview = new PhotoUploaderPreview();
- // FIXME: replace if we make overlay an
object (and inherit from it?)
+ var preview = self.preview = new
PhotoUploaderPreview(),
+ fileReader = new FileReader();
+ self.file = $input[0].files[0];
+ // clear so that change event is fired
again when user selects the same file
+ $input.val( '' );
+
+ preview.
+ on( 'cancel', function() {
+ nav.closeOverlay();
+ } ).
+ on( 'submit', function() {
+ self._submit();
+ } );
+
+ // FIXME: replace if we make overlay an
object (and inherit from it?)
nav.createOverlay( null, preview.$el );
// skip the URL bar if possible
window.scrollTo( 0, 1 );
- fileReader.readAsDataURL(
$input[0].files[0] );
- fileReader.onload = showPreview;
+ fileReader.readAsDataURL( self.file );
+ fileReader.onload = function() {
+ var dataUrl = fileReader.result;
+ // add mimetype if not present
(some browsers need it, e.g. Android browser)
+ dataUrl = dataUrl.replace(
/^data:base64/, 'data:image/jpeg;base64' );
+ preview.setImageUrl( dataUrl );
+ };
} );
+ },
+
+ _submit: function() {
+ var self = this,
+ description = this.preview.getDescription(),
+ api = new PhotoApi(),
+ progressPopup = new PhotoUploadProgress();
+
+ this.emit( 'start' );
+ nav.closeOverlay();
+ popup.show( progressPopup.$el, 'locked noButton
loading' );
+ progressPopup.on( 'cancel', function() {
+ api.abort();
+ } );
+
+ api.save( {
+ file: this.file,
+ description: description,
+ insertInPage: this.options.insertInPage,
+ pageTitle: this.options.pageTitle
+ }, function( fileName, descriptionUrl ) {
+ popup.close();
+
+ if ( !fileName ) {
+ popup.show( mw.msg(
'mobile-frontend-photo-upload-error' ), 'toast error' );
+ self.emit( 'error' );
+ return;
+ }
+
+ self.emit( 'success', {
+ fileName: fileName,
+ description: description,
+ descriptionUrl: descriptionUrl,
+ url: self.preview.imageUrl
+ } );
+ } );
+
+ api.on( 'progress', function( value ) {
+ progressPopup.setValue( value );
+ } );
}
} );
--
To view, visit https://gerrit.wikimedia.org/r/49195
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Id78376cecc22a892032e086703bcd66d785d2865
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: JGonera <[email protected]>
Gerrit-Reviewer: Brion VIBBER <[email protected]>
Gerrit-Reviewer: Yuvipanda <[email protected]>
Gerrit-Reviewer: awjrichards <[email protected]>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
