Robmoen has uploaded a new change for review.
https://gerrit.wikimedia.org/r/202923
Change subject: Use button with spinner for create collection button
......................................................................
Use button with spinner for create collection button
Uses oo-ui button styles for constructive
bug: T93424
Change-Id: I308fea0abbff555fe3f5cebc78c72543de784500
---
M resources/Resources.php
M resources/ext.gather.watchstar/CollectionsContentOverlay.js
M resources/ext.gather.watchstar/content.hogan
3 files changed, 22 insertions(+), 13 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Gather
refs/changes/23/202923/1
diff --git a/resources/Resources.php b/resources/Resources.php
index 85e9d27..1263066 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -123,6 +123,7 @@
'ext.gather.collection.base',
'mobile.settings',
'ext.gather.watchstar.icons',
+ 'mobile.buttonWithSpinner',
),
'styles' => array(
'ext.gather.watchstar/contentOverlay.less',
diff --git a/resources/ext.gather.watchstar/CollectionsContentOverlay.js
b/resources/ext.gather.watchstar/CollectionsContentOverlay.js
index 44e719e..eab8271 100644
--- a/resources/ext.gather.watchstar/CollectionsContentOverlay.js
+++ b/resources/ext.gather.watchstar/CollectionsContentOverlay.js
@@ -7,7 +7,8 @@
user = M.require( 'user' ),
Icon = M.require( 'Icon' ),
CollectionsApi = M.require(
'ext.gather.watchstar/CollectionsApi' ),
- CollectionsContentOverlayBase = M.require(
'ext.gather.collection.base/CollectionsContentOverlayBase' );
+ CollectionsContentOverlayBase = M.require(
'ext.gather.collection.base/CollectionsContentOverlayBase' ),
+ ButtonWithSpinner = M.require( 'ButtonWithSpinner' );
/**
* A clickable watchstar for managing collections
@@ -52,7 +53,6 @@
} ).toHtmlString(),
title: mw.config.get( 'wgTitle' ),
spinner: icons.spinner().toHtmlString(),
- createButtonLabel: mw.msg(
'gather-create-new-button-label' ),
placeholder: mw.msg( 'gather-add-new-placeholder' ),
subheadingNewCollection: mw.msg( 'gather-add-to-new' ),
subheading: mw.msg( 'gather-add-to-existing' ),
@@ -87,6 +87,19 @@
},
/** @inheritdoc */
postRender: function () {
+ var $form = this.$( 'form' );
+
+ this.createButton = new ButtonWithSpinner( {
+ label: mw.msg( 'gather-create-new-button-label'
),
+ flags: 'constructive'
+ } );
+ this.createButton.setDisabled( true );
+ this.createButton.on( 'click', function () {
+ $form.submit();
+ } );
+
+ $form.append( this.createButton.$element );
+ // Hide base overlay's spinner
this.hideSpinner();
},
/**
@@ -168,9 +181,8 @@
*/
onInput: function ( ev ) {
var $input = $( ev.target ),
- val = $input.val(),
- $button = $input.next( 'button' );
- $button.prop( 'disabled', val === '' );
+ val = $input.val();
+ this.createButton.setDisabled( val === '' );
},
/**
* Event handler for setting up a new collection
@@ -182,13 +194,10 @@
ev.preventDefault();
if ( this.isTitleValid( title ) ) {
- this.showSpinner();
this.addCollection( title, page );
schema.log( {
eventName: 'new-collection'
} );
-
- this.addCollection( title, page );
} else {
toast.show( mw.msg(
'gather-add-title-invalid-toast' ), 'toast error' );
}
@@ -292,7 +301,7 @@
schema.log( {
eventName: 'add-collection-error'
} );
- self.hideSpinner();
+ self.createButton.hideSpinner();
toast.show( mw.msg(
'gather-add-to-collection-failed-toast' ), 'toast error' );
} );
},
@@ -305,7 +314,7 @@
var self = this,
api = this.api;
- this.showSpinner();
+ this.createButton.showSpinner();
return api.addCollection( title ).done( function (
collection ) {
api.addPageToCollection( collection.id, page
).done(
$.proxy( self,
'_collectionStateChange', collection, true )
@@ -320,7 +329,7 @@
errorText: errMsg
} );
toast.show( mw.msg(
'gather-new-collection-failed-toast', title ), 'toast error' );
- self.hideSpinner();
+ self.createButton.hideSpinner();
} );
}
} );
diff --git a/resources/ext.gather.watchstar/content.hogan
b/resources/ext.gather.watchstar/content.hogan
index 94b1163..ae3c7f6 100644
--- a/resources/ext.gather.watchstar/content.hogan
+++ b/resources/ext.gather.watchstar/content.hogan
@@ -13,8 +13,7 @@
</div>
<h3>{{subheadingNewCollection}}</h3>
<form>
- <input class="mw-ui-input mw-ui-input-inline"
- placeholder="{{placeholder}}"><button class='mw-ui-button
mw-ui-constructive' disabled>{{createButtonLabel}}</button>
+ <input class="mw-ui-input mw-ui-input-inline"
placeholder="{{placeholder}}">
</form>
<hr/>
<h3>{{subheading}}</h3>
--
To view, visit https://gerrit.wikimedia.org/r/202923
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I308fea0abbff555fe3f5cebc78c72543de784500
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
