jenkins-bot has submitted this change and it was merged.
Change subject: Hygiene: Refactor collection flag button to be an actual view
......................................................................
Hygiene: Refactor collection flag button to be an actual view
* Makes use of MobileFrontend new button class
* Correct flagging resource names to reflect paths
Change-Id: I592cd0df9dfcf9bc2c5db4b62e461cbb6ddfe3e0
Dependency: Ib709ada5bd991b74e1c93eb3baa835653dc72dd6
---
M resources/Resources.php
A resources/ext.gather.collection.flag/CollectionFlagButton.js
M resources/ext.gather.collection.flag/CollectionFlagOverlay.js
M resources/ext.gather.special.collection/init.js
M resources/ext.gather.styles/collections.less
5 files changed, 74 insertions(+), 37 deletions(-)
Approvals:
Jdlrobson: Looks good to me, approved
jenkins-bot: Verified
diff --git a/resources/Resources.php b/resources/Resources.php
index 07858d6..951c0c4 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -365,6 +365,7 @@
),
'scripts' => array(
'ext.gather.collection.flag/CollectionFlagOverlay.js',
+ 'ext.gather.collection.flag/CollectionFlagButton.js',
),
),
diff --git a/resources/ext.gather.collection.flag/CollectionFlagButton.js
b/resources/ext.gather.collection.flag/CollectionFlagButton.js
new file mode 100644
index 0000000..fc0d5d5
--- /dev/null
+++ b/resources/ext.gather.collection.flag/CollectionFlagButton.js
@@ -0,0 +1,64 @@
+( function ( M ) {
+
+ var CollectionsApi = M.require( 'ext.gather.api/CollectionsApi' ),
+ CollectionFlagOverlay = M.require(
'ext.gather.collection.flag/CollectionFlagOverlay' ),
+ Button = M.require( 'Button' ),
+ Icon = M.require( 'Icon' ),
+ api = new CollectionsApi(),
+ CollectionFlagButton;
+
+ /**
+ * A button used to flag a collection
+ * @class CollectionFlagButton
+ * @extends Button
+ */
+ CollectionFlagButton = Button.extend( {
+ /** @inheritdoc */
+ defaults: {
+ tagName: 'div',
+ additionalClassNames: new Icon( {
+ name: 'collection-flag',
+ additionalClassNames: 'mw-ui-quiet'
+ } ).getClassName(),
+ title: mw.msg( 'gather-flag-collection-flag-label' )
+ },
+ events: {
+ click: 'onCollectionFlagButtonClick'
+ },
+ /** @inheritdoc */
+ postRender: function () {
+ Button.prototype.postRender.apply( this, arguments );
+ this.$el.attr( 'title', this.options.title );
+ },
+ /**
+ * Click handler for collection flag button
+ * @param {Object} ev Event Object
+ */
+ onCollectionFlagButtonClick: function ( ev ) {
+ var flagOverlay,
+ $flag = this.$el;
+ ev.stopPropagation();
+ ev.preventDefault();
+
+ if ( !$flag.hasClass( 'disabled' ) ) {
+ // Prevent multiple clicks
+ $flag.addClass( 'disabled' );
+ api.getCollection( this.options.collectionId
).done( function ( collection ) {
+ flagOverlay = new
CollectionFlagOverlay( {
+ collection: collection
+ } );
+ flagOverlay.show();
+ flagOverlay.on( 'collection-flagged',
function () {
+ // After flagging, remove flag
icon.
+ $flag.detach();
+ } );
+ flagOverlay.on( 'hide', function () {
+ $flag.removeClass( 'disabled' );
+ } );
+ } );
+ }
+ }
+ } );
+ M.define( 'ext.gather.collection.flag/CollectionFlagButton',
CollectionFlagButton );
+
+}( mw.mobileFrontend ) );
diff --git a/resources/ext.gather.collection.flag/CollectionFlagOverlay.js
b/resources/ext.gather.collection.flag/CollectionFlagOverlay.js
index 76766ae..619b9d8 100644
--- a/resources/ext.gather.collection.flag/CollectionFlagOverlay.js
+++ b/resources/ext.gather.collection.flag/CollectionFlagOverlay.js
@@ -46,6 +46,6 @@
onExit: function () {}
} );
- M.define( 'ext.gather.flag/CollectionFlagOverlay',
CollectionFlagOverlay );
+ M.define( 'ext.gather.collection.flag/CollectionFlagOverlay',
CollectionFlagOverlay );
}( mw.mobileFrontend, jQuery ) );
diff --git a/resources/ext.gather.special.collection/init.js
b/resources/ext.gather.special.collection/init.js
index 908ae9f..1150b0e 100644
--- a/resources/ext.gather.special.collection/init.js
+++ b/resources/ext.gather.special.collection/init.js
@@ -1,45 +1,14 @@
( function ( M, $ ) {
- var CollectionsApi = M.require( 'ext.gather.api/CollectionsApi' ),
- CollectionFlagOverlay = M.require(
'ext.gather.flag/CollectionFlagOverlay' ),
- Icon = M.require( 'Icon' ),
- api = new CollectionsApi();
+ var CollectionFlagButton = M.require(
'ext.gather.collection.flag/CollectionFlagButton' );
$( function () {
- var flagIcon, $flag,
- $collection = $( '.collection' );
+ var $collection = $( '.collection' );
if ( !$collection.data( 'is-owner' ) && mw.config.get( 'skin' )
=== 'minerva' ) {
- flagIcon = new Icon( {
- name: 'collection-flag',
- title: mw.msg(
'gather-flag-collection-flag-label' )
- } );
- // FIXME: See T97077
- $flag = $( flagIcon.toHtmlString() );
- $flag.on( 'click', function ( ev ) {
- var flagOverlay;
- ev.stopPropagation();
- ev.preventDefault();
-
- if ( !$flag.hasClass( 'disabled' ) ) {
- // Prevent multiple clicks
- $flag.addClass( 'disabled' );
- api.getCollection( $collection.data(
'id' ) ).done( function ( collection ) {
- flagOverlay = new
CollectionFlagOverlay( {
- collection: collection
- } );
- flagOverlay.show();
- flagOverlay.on(
'collection-flagged', function () {
- // After flagging,
remove flag icon.
- $flag.detach();
- } );
- flagOverlay.on( 'hide',
function () {
- $flag.removeClass(
'disabled' );
- } );
- } );
- }
- } );
- $flag.prependTo( '.collection-moderation' );
+ new CollectionFlagButton( {
+ collectionId: $collection.data( 'id' )
+ } ).prependTo( '.collection-moderation' );
}
$( '.collection-actions' ).addClass( 'visible' );
diff --git a/resources/ext.gather.styles/collections.less
b/resources/ext.gather.styles/collections.less
index fbd83f0..c110919 100644
--- a/resources/ext.gather.styles/collections.less
+++ b/resources/ext.gather.styles/collections.less
@@ -50,6 +50,9 @@
div {
float: left;
}
+ .mw-ui-icon-element:before {
+ top: 0;
+ }
}
.collection-header {
--
To view, visit https://gerrit.wikimedia.org/r/206973
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I592cd0df9dfcf9bc2c5db4b62e461cbb6ddfe3e0
Gerrit-PatchSet: 11
Gerrit-Project: mediawiki/extensions/Gather
Gerrit-Branch: master
Gerrit-Owner: Robmoen <[email protected]>
Gerrit-Reviewer: Jdlrobson <[email protected]>
Gerrit-Reviewer: Robmoen <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
