Henning Snater has uploaded a new change for review.
https://gerrit.wikimedia.org/r/80542
Change subject: Implemented movetoolbar widget
......................................................................
Implemented movetoolbar widget
Change-Id: I277c9d05fcd79e74933575919240532d208ad62b
---
M lib/WikibaseLib.hooks.php
M lib/resources/Resources.php
A lib/resources/jquery.wikibase/toolbar/movetoolbar.js
A lib/resources/jquery.wikibase/toolbar/themes/default/movetoolbar.css
M lib/resources/jquery.wikibase/toolbar/themes/default/toolbarbutton.css
M lib/resources/jquery.wikibase/toolbar/toolbarcontroller.js
A lib/tests/qunit/jquery.wikibase/toolbar/movetoolbar.tests.js
M repo/Wikibase.i18n.php
8 files changed, 358 insertions(+), 3 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Wikibase
refs/changes/42/80542/1
diff --git a/lib/WikibaseLib.hooks.php b/lib/WikibaseLib.hooks.php
index 5a01da5..774567a 100644
--- a/lib/WikibaseLib.hooks.php
+++ b/lib/WikibaseLib.hooks.php
@@ -164,6 +164,16 @@
),
);
+ $testModules['qunit']['jquery.wikibase.movetoolbar.tests'] =
$moduleBase + array(
+ 'scripts' => array(
+
'tests/qunit/jquery.wikibase/toolbar/movetoolbar.tests.js',
+ ),
+ 'dependencies' => array(
+ 'jquery.wikibase.movetoolbar',
+ 'jquery.wikibase.listview',
+ ),
+ );
+
$testModules['qunit']['jquery.wikibase.snaklistview.tests'] =
$moduleBase + array(
'scripts' => array(
'tests/qunit/jquery.wikibase/jquery.wikibase.snaklistview.tests.js',
diff --git a/lib/resources/Resources.php b/lib/resources/Resources.php
index 1b70ded..1d24618 100644
--- a/lib/resources/Resources.php
+++ b/lib/resources/Resources.php
@@ -402,6 +402,7 @@
'dependencies' => array(
'jquery.wikibase.addtoolbar',
'jquery.wikibase.edittoolbar',
+ 'jquery.wikibase.movetoolbar',
'jquery.wikibase.removetoolbar',
)
),
@@ -439,6 +440,22 @@
)
),
+ 'jquery.wikibase.movetoolbar' => $moduleTemplate + array(
+ 'scripts' => array(
+ 'jquery.wikibase/toolbar/movetoolbar.js',
+ ),
+ 'styles' => array(
+
'jquery.wikibase/toolbar/themes/default/movetoolbar.css',
+ ),
+ 'dependencies' => array(
+ 'jquery.wikibase.toolbarbase',
+ ),
+ 'messages' => array(
+ 'wikibase-move-up',
+ 'wikibase-move-down',
+ ),
+ ),
+
'jquery.wikibase.removetoolbar' => $moduleTemplate + array(
'scripts' => array(
'jquery.wikibase/toolbar/removetoolbar.js',
diff --git a/lib/resources/jquery.wikibase/toolbar/movetoolbar.js
b/lib/resources/jquery.wikibase/toolbar/movetoolbar.js
new file mode 100644
index 0000000..759098b
--- /dev/null
+++ b/lib/resources/jquery.wikibase/toolbar/movetoolbar.js
@@ -0,0 +1,134 @@
+/**
+ * @file
+ * @ingroup WikibaseLib
+ *
+ * @licence GNU GPL v2+
+ * @author H. Snater < [email protected] >
+ */
+( function( mw, wb, $ ) {
+ 'use strict';
+
+ var PARENT = $.wikibase.toolbarbase;
+
+ /**
+ * "Move" toolbar widget
+ * @since 0.4
+ * @extends jQuery.wikibase.toolbarbase
+ *
+ * This widget offers two buttons to move a referenced object within a
list up or down. With the
+ * corresponding toolbar definition being initialized on a parent item,
the movetoolbar itself
+ * needs to be initialized on every list item.
+ *
+ * @option listView {jQuery.wikibase.listview} The listview widget the
toolbar controls an
+ * element of.
+ *
+ * @event up: Triggered when the "move up" button is hit.
+ * (1) {jQuery.Event}
+ *
+ * @event down: Triggered when the "move down" button is hit.
+ * (1) {jQuery.Event}
+ */
+ $.widget( 'wikibase.movetoolbar', PARENT, {
+ widgetBaseClass: 'wb-movetoolbar',
+
+ /**
+ * Options
+ * @type {Object}
+ */
+ options: {
+ listView: null
+ },
+
+ /**
+ * "Move up" button.
+ * @type {jQuery}
+ */
+ $btnMoveUp: null,
+
+ /**
+ * "Move down" button.
+ * @type {jQuery}
+ */
+ $btnMoveDown: null,
+
+ /**
+ * @see jQuery.Widget._create
+ */
+ _create: function() {
+ var self = this;
+
+ if ( !this.options.listView ) {
+ throw new Error( 'Need reference to listview
widget' );
+ }
+
+ PARENT.prototype._create.call( this );
+
+ var $toolbar = mw.template( 'wikibase-toolbar', '', ''
).toolbar();
+ this.toolbar = $toolbar.data( 'toolbar' );
+
+ this.$btnMoveUp = this._initButton(
+ mw.msg( 'wikibase-move-up' ),
+ 'ui-icon-triangle-1-n'
+ );
+
+ this.$btnMoveDown = this._initButton(
+ mw.msg( 'wikibase-move-down' ),
+ 'ui-icon-triangle-1-s'
+ );
+
+ var btnMoveUp = this.$btnMoveUp.data( 'toolbarbutton' ),
+ btnMoveDown = this.$btnMoveDown.data(
'toolbarbutton' );
+
+ this.$btnMoveUp.on( 'toolbarbuttonaction.' +
this.widgetName, function( event ) {
+ if( btnMoveUp.isEnabled() ) {
+ self._trigger( 'up' );
+ }
+ } );
+
+ this.$btnMoveDown.on( 'toolbarbuttonaction.' +
this.widgetName, function( event ) {
+ if( btnMoveDown.isEnabled() ) {
+ self._trigger( 'down' );
+ }
+ } );
+
+ $toolbar.appendTo(
+ $( '<div/>' ).addClass( 'wb-editsection'
).appendTo( this.$toolbarParent )
+ );
+ },
+
+ /**
+ * @see jQuery.wikibase.toolbarbase.destroy
+ */
+ destroy: function() {
+ this.options.listView.element.off( '.' +
this.widgetName );
+
+ // toolbar's destroy() will tear down the buttons:
+ PARENT.prototype.destroy.call( this );
+ },
+
+ /**
+ * Initializes a toolbar button and adds it to the toolbar.
+ * @since 0.4
+ *
+ * @param {string} title
+ * @param {string} iconClass
+ * @return {jQuery}
+ */
+ _initButton: function( title, iconClass ) {
+ var $btn = mw.template(
+ 'wikibase-toolbarbutton',
+ $( '<span/>', {
+ title: title,
+ 'class': 'ui-icon ' + iconClass
+ } ),
+ 'javascript:void(0);'
+ ).toolbarbutton();
+
+ this.toolbar.addElement( $btn );
+
+ return $btn;
+ }
+
+ } );
+
+}( mediaWiki, wikibase, jQuery ) );
diff --git
a/lib/resources/jquery.wikibase/toolbar/themes/default/movetoolbar.css
b/lib/resources/jquery.wikibase/toolbar/themes/default/movetoolbar.css
new file mode 100644
index 0000000..e3a3d60
--- /dev/null
+++ b/lib/resources/jquery.wikibase/toolbar/themes/default/movetoolbar.css
@@ -0,0 +1,24 @@
+/**
+ * @since 0.4
+ * @file
+ * @ingroup WikibaseLib
+ *
+ * @license GNU GPL v2+
+ * @author H. Snater < [email protected] >
+ */
+
+.wb-movetoolbar .wikibase-toolbarbutton {
+ float: left;
+}
+
+.wb-movetoolbar .ui-icon {
+ width: 8px;
+}
+
+.wb-movetoolbar .ui-icon-triangle-1-n {
+ background-position: -4px -16px;
+}
+
+.wb-movetoolbar .ui-icon-triangle-1-s {
+ background-position: -68px -16px;
+}
diff --git
a/lib/resources/jquery.wikibase/toolbar/themes/default/toolbarbutton.css
b/lib/resources/jquery.wikibase/toolbar/themes/default/toolbarbutton.css
index 880d954..e252834 100644
--- a/lib/resources/jquery.wikibase/toolbar/themes/default/toolbarbutton.css
+++ b/lib/resources/jquery.wikibase/toolbar/themes/default/toolbarbutton.css
@@ -17,3 +17,7 @@
color: grey;
text-decoration: none;
}
+
+.wikibase-toolbarbutton-disabled .ui-icon {
+ background-image:
url(../../../../../../../../resources/jquery.ui/themes/default/images/ui-icons_888888_256x240.png);
+}
diff --git a/lib/resources/jquery.wikibase/toolbar/toolbarcontroller.js
b/lib/resources/jquery.wikibase/toolbar/toolbarcontroller.js
index 9833b97..b3394e2 100644
--- a/lib/resources/jquery.wikibase/toolbar/toolbarcontroller.js
+++ b/lib/resources/jquery.wikibase/toolbar/toolbarcontroller.js
@@ -9,12 +9,12 @@
'use strict';
/**
- * The toolbar types we have.
+ * Supported toolbar types.
* TODO: create a registry for allowing adding additional toolbar types
*
* @type {string[]}
*/
- var TOOLBAR_TYPES = ['addtoolbar', 'edittoolbar', 'removetoolbar'];
+ var TOOLBAR_TYPES = ['addtoolbar', 'edittoolbar', 'removetoolbar',
'movetoolbar'];
/**
* Toolbar controller widget
@@ -46,7 +46,8 @@
options: {
addtoolbar: [],
edittoolbar: [],
- removetoolbar: []
+ removetoolbar: [],
+ movetoolbar: []
},
/**
diff --git a/lib/tests/qunit/jquery.wikibase/toolbar/movetoolbar.tests.js
b/lib/tests/qunit/jquery.wikibase/toolbar/movetoolbar.tests.js
new file mode 100644
index 0000000..9b2fac7
--- /dev/null
+++ b/lib/tests/qunit/jquery.wikibase/toolbar/movetoolbar.tests.js
@@ -0,0 +1,161 @@
+/**
+ * @since 0.4
+ * @file
+ * @ingroup WikibaseLib
+ *
+ * @licence GNU GPL v2+
+ * @author H. Snater < [email protected] >
+ */
+
+( function( mw, wb, $, QUnit ) {
+ 'use strict';
+
+ /**
+ * Generates a listview widget suitable for testing.
+ *
+ * @param {*[]} [value]
+ * @return {jQuery}
+ */
+ function createListview( value ) {
+ var $node = $( '<div/>' ).addClass( 'test_listview' );
+
+ $node.listview( {
+ listItemAdapter: new
$.wikibase.listview.ListItemAdapter( {
+ listItemWidget: $.wikibasetest.valuewidget,
+ listItemWidgetValueAccessor: 'value',
+ newItemOptionsFn: function( value ) {
+ return { value: value || null };
+ }
+ } ),
+ value: ( value ) ? value : null
+ } );
+
+ return $node;
+ }
+
+ /**
+ * Generates a movetoolbar widget suitable for testing.
+ *
+ * @param {*[]} listviewValue
+ * @return {jQuery}
+ */
+ function createListViewWithMovetoolbar( listviewValue ) {
+ var $listview = createListview( listviewValue ),
+ listview = $listview.data( 'listview' );
+
+ listview.items().each( function( i, itemNode ) {
+ $( itemNode ).movetoolbar( { listView: listview } );
+ } );
+
+ return $listview;
+ }
+
+ QUnit.module( 'jquery.wikibase.movetoolbar', QUnit.newWbEnvironment( {
+ setup: function() {
+ /**
+ * Basic widget to be used as list item.
+ */
+ $.widget( 'wikibasetest.valuewidget', {
+ value: function( value ) {
+ if( value ) {
+ this.options.value = value;
+ }
+ return this.options.value;
+ }
+ } );
+ },
+ teardown: function() {
+ $( '.test_listview' ).each( function( i, node ) {
+ var $node = $( node ),
+ listview = $node.data( 'listview' );
+
+ if( listview ) {
+ listview.items().each( function( j,
itemNode ) {
+ var $itemNode = $( itemNode ),
+ movetoolbar =
$itemNode.data( 'movetoolbar' );
+
+ if( movetoolbar ) {
+ movetoolbar.destroy();
+ }
+ } );
+
+ listview.destroy();
+ $node.remove();
+ }
+ } );
+
+ delete( $.wikibasetest.valuewidget );
+ }
+ } ) );
+
+ QUnit.test( 'Initialize and destroy', function( assert ) {
+ var items = ['a', 'b', 'c'],
+ $listview = createListViewWithMovetoolbar( items ),
+ listview = $listview.data( 'listview' ),
+ $toolbar = listview.items().first(),
+ toolbar = $toolbar.data( 'movetoolbar' );
+
+ assert.ok(
+ toolbar !== undefined,
+ 'Initialized widget.'
+ );
+
+ assert.equal(
+ toolbar.toolbar.element.children().length,
+ 2,
+ 'Toolbar features two child nodes.'
+ );
+
+ assert.equal(
+ toolbar.$btnMoveUp.get( 0 ),
+ toolbar.toolbar.element.children().get( 0 ),
+ 'First child node is the "move up" button.'
+ );
+
+ assert.equal(
+ toolbar.$btnMoveDown.get( 0 ),
+ toolbar.toolbar.element.children().get( 1 ),
+ 'Second child node is the "move down" button.'
+ );
+
+ toolbar.destroy();
+
+ assert.equal(
+ $toolbar.data( 'toolbar' ),
+ null,
+ 'Destroyed widget.'
+ );
+
+ assert.strictEqual(
+ listview.items().length,
+ items.length,
+ 'Items in referenced listview widget remain.'
+ );
+ } );
+
+ QUnit.test( 'Button events', 2, function( assert ) {
+ var items = ['a', 'b', 'c'],
+ $listview = createListViewWithMovetoolbar( items ),
+ listview = $listview.data( 'listview' ),
+ $toolbar = listview.items().first(),
+ toolbar = $toolbar.data( 'movetoolbar' );
+
+ $toolbar.on( 'movetoolbarup', function( event ) {
+ assert.ok(
+ true,
+ 'Triggered "up" event.'
+ );
+ } );
+
+ $toolbar.on( 'movetoolbardown', function( event ) {
+ assert.ok(
+ true,
+ 'Triggered "down" event.'
+ );
+ } );
+
+ toolbar.$btnMoveUp.trigger( 'click' );
+ toolbar.$btnMoveDown.trigger( 'click' );
+ } );
+
+}( mediaWiki, wikibase, jQuery, QUnit ) );
diff --git a/repo/Wikibase.i18n.php b/repo/Wikibase.i18n.php
index 8a2f74d..c7b20ba 100644
--- a/repo/Wikibase.i18n.php
+++ b/repo/Wikibase.i18n.php
@@ -47,6 +47,8 @@
'wikibase-sitelinks-empty' => 'No site-link for this item yet.',
'wikibase-sitelinks-input-help-message' => 'Set a link to a page
related to this item.',
'wikibase-remove' => 'remove',
+ 'wikibase-move-up' => 'move up',
+ 'wikibase-move-down' => 'move down',
'wikibase-undo-title' => 'Undoing edit to "$1"',
'wikibase-restore-title' => 'Restoring old revision of "$1"',
'wikibase-partial-undo' => 'The edit can partially be undone.',
@@ -521,6 +523,8 @@
This is a generic text used for a link (fig. 3 on
[[m:Wikidata/Notes/JavaScript ui implementation]]) that removes an element of
some kind, without the the user interface being put in edit mode.',
'wikibase-undo-title' => 'Title shown on the form for undoing edits.
Example is Undoing edit to "Spain". Parameters:
* $1 is the item label.',
+ 'wikibase-move-up' => 'Label of a link to move a list item one step up
within an ordered list. The label should be a rather generic expression since
it is used for lists featuring various content.',
+ 'wikibase-move-down' => 'Label of a link to move a list item one step
down within an ordered list. The label should be a rather generic expression
since it is used for lists featuring various content.',
'wikibase-restore-title' => 'Title shown on the form for restoring old
revisions. Example is Restoring Old Revision of "Spain". Parameters:
* $1 is the item label.',
'wikibase-partial-undo' => 'Message indicating that an edit can only
partially be undone. This happens when the respective value has been changed
again after the edit that is being undone.',
--
To view, visit https://gerrit.wikimedia.org/r/80542
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I277c9d05fcd79e74933575919240532d208ad62b
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Wikibase
Gerrit-Branch: master
Gerrit-Owner: Henning Snater <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits