Jdlrobson has uploaded a new change for review.
https://gerrit.wikimedia.org/r/196495
Change subject: WIP: Create a base class for our content overlays
......................................................................
WIP: Create a base class for our content overlays
This will ensure better consistency and make sure the position fixed issues
work on the overlay.
Change-Id: Id1d1436be2adb1d3db4769ebfb13bc07e2c02fc4
---
M resources/Resources.php
A resources/ext.gather.collection.base/CollectionsContentOverlayBase.js
M resources/ext.gather.collection.delete/CollectionDeleteOverlay.js
M resources/ext.gather.collection.editor/CollectionEditOverlay.js
M resources/ext.gather.watchstar/CollectionsContentOverlay.js
5 files changed, 69 insertions(+), 19 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Gather
refs/changes/95/196495/1
diff --git a/resources/Resources.php b/resources/Resources.php
index e36c54e..39e661a 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -89,11 +89,23 @@
),
),
+ 'ext.gather.collection.base' => $wgGatherResourceFileModuleBoilerplate
+ array(
+ 'dependencies' => array(
+ 'mobile.contentOverlays',
+ 'mobile.toast',
+ 'ext.gather.api',
+ 'mediawiki.util'
+ ),
+ 'scripts' => array(
+
'ext.gather.collection.base/CollectionsContentOverlayBase.js',
+ ),
+ ),
+
'ext.gather.watchstar' => $wgGatherResourceFileModuleBoilerplate +
array(
'dependencies' => array(
'mobile.watchstar',
'ext.gather.api',
- 'mobile.contentOverlays',
+ 'ext.gather.collection.base',
'ext.gather.watchstar.icons',
),
'styles' => array(
@@ -146,7 +158,7 @@
'ext.gather.collection.delete' =>
$wgGatherResourceFileModuleBoilerplate + array(
'dependencies' => array(
- 'mobile.overlays',
+ 'ext.gather.collection.base',
'mobile.toast',
'ext.gather.api',
'mediawiki.util'
diff --git
a/resources/ext.gather.collection.base/CollectionsContentOverlayBase.js
b/resources/ext.gather.collection.base/CollectionsContentOverlayBase.js
new file mode 100644
index 0000000..59acecc
--- /dev/null
+++ b/resources/ext.gather.collection.base/CollectionsContentOverlayBase.js
@@ -0,0 +1,42 @@
+( function ( M, $ ) {
+
+ var CollectionsContentOverlayBase,
+ ContentOverlay = M.require( 'modules/tutorials/ContentOverlay'
);
+
+ /**
+ * A clickable watchstar for managing collections
+ * @class CollectionsContentOverlayBase
+ * @extends ContentOverlay
+ */
+ CollectionsContentOverlayBase = ContentOverlay.extend( {
+ /**
+ * FIXME: re-evaluate content overlay default classes/css.
+ * @inheritdoc
+ */
+ appendTo: 'body',
+ /** @inheritdoc */
+ hasFixedHeader: false,
+ /** @inheritdoc */
+ postRender: function () {
+ this.hideSpinner();
+ },
+ /**
+ * Reveal all interface elements and cancel the spinner.
+ */
+ hideSpinner: function () {
+ this.$( '.overlay-content' ).children().show();
+ this.$( '.spinner' ).hide();
+ // For position absolute to work the parent must have a
specified height
+ this.$el.parent().css( 'height', '100%' );
+ },
+ /**
+ * Hide all interface elements and show spinner.
+ */
+ showSpinner: function () {
+ this.$( '.overlay-content' ).children().hide();
+ this.$( '.spinner' ).show();
+ }
+ } );
+ M.define( 'ext.gather.collection.base/CollectionsContentOverlayBase',
CollectionsContentOverlayBase );
+
+}( mw.mobileFrontend, jQuery ) );
diff --git a/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js
b/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js
index e8487e1..86e84ee 100644
--- a/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js
+++ b/resources/ext.gather.collection.delete/CollectionDeleteOverlay.js
@@ -4,20 +4,18 @@
toast = M.require( 'toast' ),
icons = M.require( 'icons' ),
CollectionsApi = M.require(
'ext.gather.watchstar/CollectionsApi' ),
- ContentOverlay = M.require( 'modules/tutorials/ContentOverlay'
);
+ CollectionsContentOverlayBase = M.require(
'ext.gather.collection.base/CollectionsContentOverlayBase' );
/**
* Overlay for deleting a collection
- * @extends ContentOverlay
+ * @extends CollectionsContentOverlayBase
* @class CollectionDeleteOverlay
*/
- CollectionDeleteOverlay = ContentOverlay.extend( {
+ CollectionDeleteOverlay = CollectionsContentOverlayBase.extend( {
/** @inheritdoc */
className: 'collection-delete-overlay content-overlay
position-fixed',
/** @inheritdoc */
- hasFixedHeader: false,
- /** @inheritdoc */
- defaults: $.extend( {}, ContentOverlay.prototype.defaults, {
+ defaults: $.extend( {},
CollectionsContentOverlayBase.prototype.defaults, {
fixedHeader: false,
collection: null,
spinner: icons.spinner().toHtmlString(),
@@ -30,12 +28,12 @@
cancelButtonLabel: mw.msg(
'gather-delete-collection-cancel-label' )
} ),
/** @inheritdoc */
- events: $.extend( {}, ContentOverlay.prototype.events, {
+ events: $.extend( {},
CollectionsContentOverlayBase.prototype.events, {
'click .delete-collection': 'onDeleteClick',
'click .cancel-delete': 'onCancelClick'
} ),
/** @inheritdoc */
- templatePartials: $.extend( {},
ContentOverlay.prototype.templatePartials, {
+ templatePartials: $.extend( {},
CollectionsContentOverlayBase.prototype.templatePartials, {
content: mw.template.get(
'ext.gather.collection.delete', 'content.hogan' )
} ),
/** @inheritdoc */
@@ -47,18 +45,15 @@
} else {
this.id = collection.id;
this.api = new CollectionsApi();
- ContentOverlay.prototype.initialize.apply(
this, arguments );
+
CollectionsContentOverlayBase.prototype.initialize.apply( this, arguments );
}
- },
- postRender: function () {
- this.$( '.spinner' ).hide();
},
/**
* Event handler when the save button is clicked.
*/
onDeleteClick: function () {
var self = this;
- this.$( '.spinner' ).show();
+ this.showSpinner();
// disable button and inputs
this.$( '.delete-collection, .cancel-delete' ).prop(
'disabled', true );
this.api.removeCollection( this.id ).done( function () {
diff --git a/resources/ext.gather.collection.editor/CollectionEditOverlay.js
b/resources/ext.gather.collection.editor/CollectionEditOverlay.js
index 7102fe2..4da970f 100644
--- a/resources/ext.gather.collection.editor/CollectionEditOverlay.js
+++ b/resources/ext.gather.collection.editor/CollectionEditOverlay.js
@@ -54,6 +54,7 @@
*/
onSaveClick: function () {
// disable button and inputs
+ this.showSpinner();
this.$( '.mw-ui-input, .save' ).prop( 'disabled', true
);
this.api.editCollection(
this.id, this.$( '.title' ).val(), this.$(
'.description' ).val()
diff --git a/resources/ext.gather.watchstar/CollectionsContentOverlay.js
b/resources/ext.gather.watchstar/CollectionsContentOverlay.js
index 6b1e155..10b76f2 100644
--- a/resources/ext.gather.watchstar/CollectionsContentOverlay.js
+++ b/resources/ext.gather.watchstar/CollectionsContentOverlay.js
@@ -5,14 +5,14 @@
toast = M.require( 'toast' ),
Icon = M.require( 'Icon' ),
CollectionsApi = M.require(
'ext.gather.watchstar/CollectionsApi' ),
- ContentOverlay = M.require( 'modules/tutorials/ContentOverlay'
);
+ CollectionsContentOverlayBase = M.require(
'ext.gather.collection.base/CollectionsContentOverlayBase' );
/**
* A clickable watchstar for managing collections
* @class CollectionsContentOverlay
- * @extends ContentOverlay
+ * @extends CollectionsContentOverlayBase
*/
- CollectionsContentOverlay = ContentOverlay.extend( {
+ CollectionsContentOverlay = CollectionsContentOverlayBase.extend( {
/**
* FIXME: re-evaluate content overlay default classes/css.
* @inheritdoc
@@ -54,7 +54,7 @@
/** @inheritdoc */
initialize: function () {
this.api = new CollectionsApi();
- ContentOverlay.prototype.initialize.apply( this,
arguments );
+
CollectionsContentOverlayBase.prototype.initialize.apply( this, arguments );
},
/** @inheritdoc */
postRender: function () {
--
To view, visit https://gerrit.wikimedia.org/r/196495
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Id1d1436be2adb1d3db4769ebfb13bc07e2c02fc4
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Gather
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <jrob...@wikimedia.org>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
