Robmoen has uploaded a new change for review. https://gerrit.wikimedia.org/r/204609
Change subject: Split out dialog from collection delete overlay ...................................................................... Split out dialog from collection delete overlay Introduces new ConfirmationOverlay class Change-Id: Iafc725abdac69597af55f25116e49160853554a5 --- M resources/Resources.php A resources/ext.gather.collection.confirm/ConfirmationOverlay.js A resources/ext.gather.collection.confirm/confirmationOverlay.hogan R resources/ext.gather.collection.confirm/confirmationOverlay.less M resources/ext.gather.collection.delete/CollectionDeleteOverlay.js D resources/ext.gather.collection.delete/content.hogan 6 files changed, 103 insertions(+), 60 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Gather refs/changes/09/204609/1 diff --git a/resources/Resources.php b/resources/Resources.php index a1f6385..f355973 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -63,6 +63,7 @@ 'images' => array( 'collections-read-more' => 'ext.gather.icons/next.svg', 'collection-owner' => 'ext.gather.icons/user.svg', + 'collection-flag' => 'ext.gather.icons/flag.svg', ), ), @@ -96,6 +97,7 @@ ), 'scripts' => array( 'ext.gather.logging/SchemaGather.js', + 'ext.gather.logging/SchemaGatherFlags.js', ), ), @@ -119,6 +121,25 @@ ), 'scripts' => array( 'ext.gather.collection.base/CollectionsContentOverlayBase.js', + ), + ), + + 'ext.gather.collection.confirm' => $wgGatherResourceFileModuleBoilerplate + array( + 'dependencies' => array( + 'ext.gather.collection.base', + ), + 'styles' => array( + 'ext.gather.collection.confirm/confirmationOverlay.less', + ), + 'messages' => array( + 'gather-error-unknown-collection', + 'gather-confirmation-cancel-button-label', + ), + 'templates' => array( + 'confirmationOverlay.hogan' => 'ext.gather.collection.confirm/confirmationOverlay.hogan', + ), + 'scripts' => array( + 'ext.gather.collection.confirm/ConfirmationOverlay.js', ), ), @@ -241,7 +262,7 @@ 'ext.gather.collection.delete' => $wgGatherResourceFileModuleBoilerplate + array( 'dependencies' => array( - 'ext.gather.collection.base', + 'ext.gather.collection.confirm', 'mobile.toast', 'ext.gather.api', 'mediawiki.util' @@ -250,19 +271,11 @@ 'gather-delete-collection-confirm', 'gather-delete-collection-heading', 'gather-delete-collection-delete-label', - 'gather-delete-collection-cancel-label', 'gather-delete-collection-success', 'gather-delete-collection-failed-error', - 'gather-error-unknown-collection', - ), - 'templates' => array( - 'content.hogan' => 'ext.gather.collection.delete/content.hogan', ), 'scripts' => array( 'ext.gather.collection.delete/CollectionDeleteOverlay.js', - ), - 'styles' => array( - 'ext.gather.collection.delete/deleteOverlay.less', ), ), @@ -270,6 +283,7 @@ 'dependencies' => array( 'ext.gather.collection.editor', 'ext.gather.collection.delete', + 'ext.gather.collection.flag', ), 'scripts' => array( 'ext.gather.special/init.js', diff --git a/resources/ext.gather.collection.confirm/ConfirmationOverlay.js b/resources/ext.gather.collection.confirm/ConfirmationOverlay.js new file mode 100644 index 0000000..aa3ee26 --- /dev/null +++ b/resources/ext.gather.collection.confirm/ConfirmationOverlay.js @@ -0,0 +1,54 @@ +( function ( M, $ ) { + + var ConfirmationOverlay, + toast = M.require( 'toast' ), + icons = M.require( 'icons' ), + CollectionsContentOverlayBase = M.require( 'ext.gather.collection.base/CollectionsContentOverlayBase' ); + + /** + * Action confirmation overlay base class + * @extends CollectionsContentOverlayBase + * @class ConfirmationOverlay + */ + ConfirmationOverlay = CollectionsContentOverlayBase.extend( { + /** @inheritdoc */ + className: 'collection-confirmation-overlay content-overlay position-fixed', + /** @inheritdoc */ + defaults: $.extend( {}, CollectionsContentOverlayBase.prototype.defaults, { + fixedHeader: false, + collection: null, + spinner: icons.spinner().toHtmlString(), + unknownCollectionError: mw.msg( 'gather-error-unknown-collection' ), + cancelButtonClass: 'mw-ui-progressive', + cancelButtonLabel: mw.msg( 'gather-confirmation-cancel-button-label' ) + } ), + /** @inheritdoc */ + events: $.extend( {}, CollectionsContentOverlayBase.prototype.events, { + 'click .cancel': 'onCancelClick' + } ), + /** @inheritdoc */ + templatePartials: $.extend( {}, CollectionsContentOverlayBase.prototype.templatePartials, { + content: mw.template.get( 'ext.gather.collection.confirm', 'confirmationOverlay.hogan' ) + } ), + /** @inheritdoc */ + initialize: function ( options ) { + var collection = options.collection; + if ( !collection ) { + // use toast + toast.show( options.unknownCollectionError, 'toast error' ); + } else { + this.id = collection.id; + CollectionsContentOverlayBase.prototype.initialize.apply( this, arguments ); + } + }, + /** + * Event handler when the cancel button is clicked. + */ + onCancelClick: function () { + this.hide(); + } + } ); + + M.define( 'ext.gather.confirm/ConfirmationOverlay', ConfirmationOverlay ); + +}( mw.mobileFrontend, jQuery ) ); diff --git a/resources/ext.gather.collection.confirm/confirmationOverlay.hogan b/resources/ext.gather.collection.confirm/confirmationOverlay.hogan new file mode 100644 index 0000000..a16bb72 --- /dev/null +++ b/resources/ext.gather.collection.confirm/confirmationOverlay.hogan @@ -0,0 +1,9 @@ +{{{spinner}}} +<div class="confirm-collection-content"> + <h3>{{subheading}}</h3> + <span>{{confirmMessage}}</span> + <div class="collection-confirm-actions"> + <button class='mw-ui-button {{confirmButtonClass}} confirm'>{{confirmButtonLabel}}</button> + <button class='mw-ui-button {{cancelButtonClass}} cancel'>{{cancelButtonLabel}}</button> + </div> +</div> diff --git a/resources/ext.gather.collection.delete/deleteOverlay.less b/resources/ext.gather.collection.confirm/confirmationOverlay.less similarity index 78% rename from resources/ext.gather.collection.delete/deleteOverlay.less rename to resources/ext.gather.collection.confirm/confirmationOverlay.less index b1912b8..00e7c5e 100644 --- a/resources/ext.gather.collection.delete/deleteOverlay.less +++ b/resources/ext.gather.collection.confirm/confirmationOverlay.less @@ -1,7 +1,7 @@ @import "minerva.variables"; @import "minerva.mixins"; -.content-overlay.collection-delete-overlay { +.content-overlay.collection-confirmation-overlay { font-size: .9em; text-align: center; @@ -14,7 +14,7 @@ padding: 0.5em; } - .collection-delete-actions { + .collection-confirm-actions { padding: 0.5em; } diff --git a/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js b/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js index 1ce42d4..f54668a 100644 --- a/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js +++ b/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js @@ -4,60 +4,41 @@ SchemaGather = M.require( 'ext.gather.logging/SchemaGather' ), schema = new SchemaGather(), toast = M.require( 'toast' ), - icons = M.require( 'icons' ), CollectionsApi = M.require( 'ext.gather.watchstar/CollectionsApi' ), - CollectionsContentOverlayBase = M.require( 'ext.gather.collection.base/CollectionsContentOverlayBase' ); + ConfirmationOverlay = M.require( 'ext.gather.confirm/ConfirmationOverlay' ); /** * Overlay for deleting a collection - * @extends CollectionsContentOverlayBase + * @extends ConfirmationOverlay * @class CollectionDeleteOverlay */ - CollectionDeleteOverlay = CollectionsContentOverlayBase.extend( { + CollectionDeleteOverlay = ConfirmationOverlay.extend( { /** @inheritdoc */ - className: 'collection-delete-overlay content-overlay position-fixed', - /** @inheritdoc */ - defaults: $.extend( {}, CollectionsContentOverlayBase.prototype.defaults, { - fixedHeader: false, - collection: null, - spinner: icons.spinner().toHtmlString(), + defaults: $.extend( {}, ConfirmationOverlay.prototype.defaults, { deleteSuccessMsg: mw.msg( 'gather-delete-collection-success' ), deleteFailedError: mw.msg( 'gather-delete-collection-failed-error' ), - unknownCollectionError: mw.msg( 'gather-error-unknown-collection' ), - subheadingDeleteCollection: mw.msg( 'gather-delete-collection-heading' ), + subheading: mw.msg( 'gather-delete-collection-heading' ), confirmMessage: mw.msg( 'gather-delete-collection-confirm' ), - deleteButtonLabel: mw.msg( 'gather-delete-collection-delete-label' ), - cancelButtonLabel: mw.msg( 'gather-delete-collection-cancel-label' ) + confirmButtonClass: 'mw-ui-destructive', + confirmButtonLabel: mw.msg( 'gather-delete-collection-delete-label' ) } ), /** @inheritdoc */ - events: $.extend( {}, CollectionsContentOverlayBase.prototype.events, { - 'click .delete-collection': 'onDeleteClick', - 'click .cancel-delete': 'onCancelClick' + events: $.extend( {}, ConfirmationOverlay.prototype.events, { + 'click .confirm': 'onDeleteClick' } ), /** @inheritdoc */ - templatePartials: $.extend( {}, CollectionsContentOverlayBase.prototype.templatePartials, { - content: mw.template.get( 'ext.gather.collection.delete', 'content.hogan' ) - } ), - /** @inheritdoc */ - initialize: function ( options ) { - var collection = options.collection; - if ( !collection ) { - // use toast - toast.show( options.unknownCollectionError, 'toast error' ); - } else { - this.id = collection.id; - this.api = new CollectionsApi(); - CollectionsContentOverlayBase.prototype.initialize.apply( this, arguments ); - } + initialize: function () { + this.api = new CollectionsApi(); + ConfirmationOverlay.prototype.initialize.apply( this, arguments ); }, /** - * Event handler when the save button is clicked. + * Event handler when the delete button is clicked. */ onDeleteClick: function () { var self = this; this.showSpinner(); // disable button and inputs - this.$( '.delete-collection, .cancel-delete' ).prop( 'disabled', true ); + this.$( '.confirm, .cancel' ).prop( 'disabled', true ); this.api.removeCollection( this.id ).done( function () { // Show toast self.$( '.spinner' ).hide(); @@ -74,18 +55,12 @@ toast.show( self.options.deleteFailedError, 'toast error' ); self.hide(); // Make it possible to try again. - self.$( '.delete-collection, .cancel-delete' ).prop( 'disabled', false ); + self.$( '.confirm, .cancel' ).prop( 'disabled', false ); schema.log( { eventName: 'delete-collection-error', errorText: errMsg } ); } ); - }, - /** - * Event handler when the cancel button is clicked. - */ - onCancelClick: function () { - this.hide(); } } ); diff --git a/resources/ext.gather.collection.delete/content.hogan b/resources/ext.gather.collection.delete/content.hogan deleted file mode 100644 index 2870119..0000000 --- a/resources/ext.gather.collection.delete/content.hogan +++ /dev/null @@ -1,9 +0,0 @@ -{{{spinner}}} -<div class="delete-collection-content"> - <h3>{{subheadingDeleteCollection}}</h3> - <span>{{confirmMessage}}</span> - <div class="collection-delete-actions"> - <button class='mw-ui-button mw-ui-destructive delete-collection'>{{deleteButtonLabel}}</button> - <button class='mw-ui-button mw-ui-progressive cancel-delete'>{{cancelButtonLabel}}</button> - </div> -</div> -- To view, visit https://gerrit.wikimedia.org/r/204609 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: Iafc725abdac69597af55f25116e49160853554a5 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/Gather Gerrit-Branch: master Gerrit-Owner: Robmoen <rm...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits