From 0ee35c99d04104e6d22cadc1713399c76bd5e895 Mon Sep 17 00:00:00 2001 From: Trevor Parscal Date: Thu, 17 Oct 2013 10:33:05 -0700 Subject: [PATCH] Add OO.ui.PopupTool Tool that launches a popup when clicked. Change-Id: Ie35b51f8160ad3fb844491e2799656413d4029c0 --- VisualEditor.php | 2 + demos/ve/index.php | 2 + modules/oojs-ui/styles/OO.ui.Tool.css | 18 +++++++ modules/oojs-ui/tools/OO.ui.PopupTool.js | 65 ++++++++++++++++++++++++ modules/ve/test/index.php | 1 + 5 files changed, 88 insertions(+) create mode 100644 modules/oojs-ui/styles/OO.ui.Tool.css create mode 100644 modules/oojs-ui/tools/OO.ui.PopupTool.js diff --git a/VisualEditor.php b/VisualEditor.php index 86032579dd..741d3dd244 100644 --- a/VisualEditor.php +++ b/VisualEditor.php @@ -123,6 +123,7 @@ $wgResourceModules += array( 'oojs-ui/layouts/OO.ui.PagedOutlineLayout.js', 'oojs-ui/layouts/OO.ui.PanelLayout.js', 'oojs-ui/layouts/OO.ui.StackPanelLayout.js', + 'oojs-ui/tools/OO.ui.PopupTool.js', 'oojs-ui/toolgroups/OO.ui.BarToolGroup.js', 'oojs-ui/toolgroups/OO.ui.PopupToolGroup.js', 'oojs-ui/toolgroups/OO.ui.ListToolGroup.js', @@ -154,6 +155,7 @@ $wgResourceModules += array( 'oojs-ui/styles/OO.ui.Frame.css', 'oojs-ui/styles/OO.ui.Inspector.css', 'oojs-ui/styles/OO.ui.Layout.css', + 'oojs-ui/styles/OO.ui.Tool.css', 'oojs-ui/styles/OO.ui.Toolbar.css', 'oojs-ui/styles/OO.ui.ToolGroup.css', 'oojs-ui/styles/OO.ui.Widget.css', diff --git a/demos/ve/index.php b/demos/ve/index.php index b89dc0d433..4414ff34e1 100644 --- a/demos/ve/index.php +++ b/demos/ve/index.php @@ -32,6 +32,7 @@ $html = file_get_contents( $page ); + @@ -132,6 +133,7 @@ $html = file_get_contents( $page ); + diff --git a/modules/oojs-ui/styles/OO.ui.Tool.css b/modules/oojs-ui/styles/OO.ui.Tool.css new file mode 100644 index 0000000000..0ef74eda17 --- /dev/null +++ b/modules/oojs-ui/styles/OO.ui.Tool.css @@ -0,0 +1,18 @@ +/*! + * ObjectOriented UserInterface Tool styles. + * + * @copyright 2011-2013 OOJS Team and others; see AUTHORS.txt + * @license The MIT License (MIT); see LICENSE.txt + */ + +/* OO.ui.PopupTool */ + +.oo-ui-popupTool .oo-ui-popupWidget { + margin-left: 1.25em; + font-size: 0.8em; +} + +.oo-ui-popupTool .oo-ui-popupWidget-popup, +.oo-ui-popupTool .oo-ui-popupWidget-tail { + z-index: 4; +} diff --git a/modules/oojs-ui/tools/OO.ui.PopupTool.js b/modules/oojs-ui/tools/OO.ui.PopupTool.js new file mode 100644 index 0000000000..f90c38105b --- /dev/null +++ b/modules/oojs-ui/tools/OO.ui.PopupTool.js @@ -0,0 +1,65 @@ +/*! + * ObjectOriented UserInterface PopupTool class. + * + * @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt + * @license The MIT License (MIT); see LICENSE.txt + */ + +/** + * UserInterface popup tool. + * + * @abstract + * @class + * @extends OO.ui.Tool + * @mixins OO.ui.PopuppableElement + * + * @constructor + * @param {OO.ui.Toolbar} toolbar + * @param {Object} [config] Configuration options + */ +OO.ui.PopupTool = function OoUiPopupTool( toolbar, config ) { + // Parent constructor + OO.ui.Tool.call( this, toolbar, config ); + + // Mixin constructors + OO.ui.PopuppableElement.call( this, config ); + + // Initialization + this.$ + .addClass( 'oo-ui-popupTool' ) + .append( this.popup.$ ); +}; + +/* Inheritance */ + +OO.inheritClass( OO.ui.PopupTool, OO.ui.Tool ); + +OO.mixinClass( OO.ui.PopupTool, OO.ui.PopuppableElement ); + +/* Methods */ + +/** + * Handle the tool being selected. + * + * @inheritdoc + */ +OO.ui.PopupTool.prototype.onSelect = function () { + if ( !this.disabled ) { + if ( this.popup.isVisible() ) { + this.hidePopup(); + } else { + this.showPopup(); + } + } + this.setActive( false ); + return false; +}; + +/** + * Handle the toolbar state being updated. + * + * @inheritdoc + */ +OO.ui.PopupTool.prototype.onUpdateState = function () { + this.setActive( false ); +}; diff --git a/modules/ve/test/index.php b/modules/ve/test/index.php index eddc445741..63254db408 100644 --- a/modules/ve/test/index.php +++ b/modules/ve/test/index.php @@ -77,6 +77,7 @@ +