wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-11-24 22:35:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge "Isolate links within OO.ui.Tool"

Browse source
This commit is contained in:
jenkins-bot 2013-10-29 05:58:44 +00:00 committed by Gerrit Code Review
parent 678102c7fd 230d88d182
commit 152735294d
5 changed files with 57 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
modules/oojs-ui/OO.ui.Tool.js
View file

@ -30,18 +30,22 @@ OO.ui.Tool = function OoUiTool( toolGroup, config ) {
this.toolGroup = toolGroup; this.toolGroup = toolGroup;
this.toolbar = this.toolGroup.getToolbar(); this.toolbar = this.toolGroup.getToolbar();
this.active = false; this.active = false;
this.$link = this.$$( '<a>' );
// Events // Events
this.toolbar.connect( this, { 'updateState': 'onUpdateState' } ); this.toolbar.connect( this, { 'updateState': 'onUpdateState' } );
// Initialization // Initialization
this.$link
.addClass( 'oo-ui-tool-link' )
.append( this.$icon, this.$label );
this.$ this.$
.data( 'oo-ui-tool', this ) .data( 'oo-ui-tool', this )
.addClass( .addClass(
'oo-ui-tool oo-ui-tool-' + 'oo-ui-tool ' + 'oo-ui-tool-name-' +
this.constructor.static.name.replace( /^([^\/]+)\/([^\/]+).*$/, '$1-$2' ) this.constructor.static.name.replace( /^([^\/]+)\/([^\/]+).*$/, '$1-$2' )
) )
.append( this.$icon, this.$label ); .append( this.$link );
this.setIcon( this.constructor.static.icon ); this.setIcon( this.constructor.static.icon );
this.updateLabel(); this.updateLabel();
}; };
@ -61,7 +65,7 @@ OO.mixinClass( OO.ui.Tool, OO.ui.LabeledElement );
/* Static Properties */ /* Static Properties */
OO.ui.Tool.static.tagName = 'a'; OO.ui.Tool.static.tagName = 'span';
/** /**
* Symbolic name of tool. * Symbolic name of tool.
@ -234,9 +238,9 @@ OO.ui.Tool.prototype.updateLabel = function () {
tooltipParts.push( accel ); tooltipParts.push( accel );
} }
if ( tooltipParts.length ) { if ( tooltipParts.length ) {
this.$.attr( 'title', tooltipParts.join( ' ' ) ); this.$link.attr( 'title', tooltipParts.join( ' ' ) );
} else { } else {
this.$.removeAttr( 'title' ); this.$link.removeAttr( 'title' );
} }
}; };

7
modules/oojs-ui/OO.ui.ToolGroup.js
View file

@ -176,15 +176,18 @@ OO.ui.ToolGroup.prototype.onMouseOut = function ( e ) {
/** /**
* Get the closest tool to a jQuery.Event. * Get the closest tool to a jQuery.Event.
* *
* Only tool links are considered, which prevents other elements in the tool such as popups from
* triggering tool group interactions.
*
* @method * @method
* @private * @private
* @param {jQuery.Event} e * @param {jQuery.Event} e
* @returns {OO.ui.Tool|null} Tool, `null` if none was found * @returns {OO.ui.Tool|null} Tool, `null` if none was found
*/ */
OO.ui.ToolGroup.prototype.getTargetTool = function ( e ) { OO.ui.ToolGroup.prototype.getTargetTool = function ( e ) {
var $item = $( e.target ).closest( '.oo-ui-tool' ); var $item = $( e.target ).closest( '.oo-ui-tool-link' );
if ( $item.length ) { if ( $item.length ) {
return $item.data( 'oo-ui-tool' ); return $item.parent().data( 'oo-ui-tool' );
} }
return null; return null;
}; };

50
modules/oojs-ui/styles/OO.ui.ToolGroup.css
View file

@ -27,11 +27,11 @@
display: none; display: none;
} }
.oo-ui-toolGroup .oo-ui-tool .oo-ui-labeledElement-label { .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-labeledElement-label {
color: #000; color: #000;
} }
.oo-ui-toolGroup .oo-ui-tool .oo-ui-iconedElement-icon { .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
background-position: center center; background-position: center center;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
@ -47,10 +47,14 @@
display: inline-block; display: inline-block;
position: relative; position: relative;
vertical-align: top; vertical-align: top;
height: 1.5em;
padding: 0.25em;
margin: -1px 0 -1px -1px; margin: -1px 0 -1px -1px;
border: solid 1px transparent; border: solid 1px transparent;
}
.oo-ui-barToolGroup .oo-ui-tool-link {
display: block;
height: 1.5em;
padding: 0.25em;
cursor: pointer; cursor: pointer;
} }
@ -80,30 +84,30 @@
border-color: rgba(0,0,0,0.2); border-color: rgba(0,0,0,0.2);
} }
.oo-ui-barToolGroup .oo-ui-tool .oo-ui-iconedElement-icon { .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
display: block; display: block;
height: 1.5em; height: 1.5em;
width: 1.5em; width: 1.5em;
opacity: 0.8; opacity: 0.8;
} }
.oo-ui-barToolGroup .oo-ui-tool .oo-ui-labeledElement-label { .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-labeledElement-label {
display: none; display: none;
} }
.oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled { .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
cursor: default; cursor: default;
} }
.oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconedElement-icon { .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
opacity: 0.2; opacity: 0.2;
} }
.oo-ui-barToolGroup .oo-ui-tool:not(.oo-ui-widget-disabled) .oo-ui-iconedElement-icon { .oo-ui-barToolGroup .oo-ui-tool:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
opacity: 0.8; opacity: 0.8;
} }
.oo-ui-barToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) .oo-ui-iconedElement-icon { .oo-ui-barToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
opacity: 1; opacity: 1;
} }
@ -171,7 +175,7 @@
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.oo-ui-popupToolGroup .oo-ui-tool .oo-ui-iconedElement-icon { .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
height: 2em; height: 2em;
@ -179,7 +183,7 @@
margin-right: 0.5em; margin-right: 0.5em;
} }
.oo-ui-popupToolGroup .oo-ui-tool .oo-ui-labeledElement-label { .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-labeledElement-label {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
line-height: 2em; line-height: 2em;
@ -198,10 +202,14 @@
.oo-ui-listToolGroup .oo-ui-tool { .oo-ui-listToolGroup .oo-ui-tool {
display: block; display: block;
cursor: pointer;
white-space: nowrap;
border: solid 1px transparent; border: solid 1px transparent;
margin: -1px 0 -1px -1px; margin: -1px 0 -1px -1px;
}
.oo-ui-listToolGroup .oo-ui-tool-link {
display: block;
cursor: pointer;
white-space: nowrap;
padding-right: 0.5em; padding-right: 0.5em;
} }
@ -228,15 +236,15 @@
cursor: default; cursor: default;
} }
.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconedElement-icon { .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
opacity: 0.2; opacity: 0.2;
} }
.oo-ui-listToolGroup .oo-ui-tool:not(.oo-ui-widget-disabled) .oo-ui-iconedElement-icon { .oo-ui-listToolGroup .oo-ui-tool:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
opacity: 0.8; opacity: 0.8;
} }
.oo-ui-listToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) .oo-ui-iconedElement-icon { .oo-ui-listToolGroup .oo-ui-tool:hover:not(.oo-ui-widget-disabled) .oo-ui-tool-link .oo-ui-iconedElement-icon {
opacity: 1; opacity: 1;
} }
@ -260,16 +268,20 @@
.oo-ui-menuToolGroup .oo-ui-tool { .oo-ui-menuToolGroup .oo-ui-tool {
display: block; display: block;
}
.oo-ui-menuToolGroup .oo-ui-tool-link {
display: block;
cursor: pointer; cursor: pointer;
white-space: nowrap; white-space: nowrap;
padding: 0.25em 1em 0.25em 0.25em; padding: 0.25em 1em 0.25em 0.25em;
} }
.oo-ui-menuToolGroup .oo-ui-tool .oo-ui-iconedElement-icon { .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
background-image: none; background-image: none;
} }
.oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-iconedElement-icon { .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconedElement-icon {
/* @embed */ /* @embed */
background-image: url(images/icons/check.png); background-image: url(images/icons/check.png);
} }

4
modules/ve-mw/test/browser/features/support/pages/visual_editor_page.rb
View file

@ -6,12 +6,12 @@ class VisualEditorPage
div(:container_disabled, class: 'oo-ui-widget oo-ui-widget-disabled oo-ui-flaggableElement-constructive oo-ui-pushButtonWidget') div(:container_disabled, class: 'oo-ui-widget oo-ui-widget-disabled oo-ui-flaggableElement-constructive oo-ui-pushButtonWidget')
div(:content, class: 've-ce-documentNode ve-ce-branchNode') div(:content, class: 've-ce-documentNode ve-ce-branchNode')
a(:decrease_indentation, class: 'oo-ui-widget oo-ui-tool oo-ui-tool-outdent oo-ui-widget-disabled') a(:decrease_indentation, class: 'oo-ui-widget oo-ui-tool oo-ui-tool-name-outdent oo-ui-widget-disabled')
a(:decrease_indentation_on, title: 'Decrease indentation [SHIFT+TAB]') a(:decrease_indentation_on, title: 'Decrease indentation [SHIFT+TAB]')
span(:downarrow, class: 'oo-ui-iconedElement-icon oo-ui-icon-down') span(:downarrow, class: 'oo-ui-iconedElement-icon oo-ui-icon-down')
a(:edit_ve, title: /Edit this page with VisualEditor/) a(:edit_ve, title: /Edit this page with VisualEditor/)
span(:heading, text: 'Heading') span(:heading, text: 'Heading')
a(:increase_indentation, class: 'oo-ui-widget oo-ui-tool oo-ui-tool-indent oo-ui-widget-disabled') a(:increase_indentation, class: 'oo-ui-widget oo-ui-tool oo-ui-tool-name-indent oo-ui-widget-disabled')
a(:increase_indentation_on, title: 'Increase indentation [TAB]') a(:increase_indentation_on, title: 'Increase indentation [TAB]')
div(:insert_references, class: 'oo-ui-window-title') div(:insert_references, class: 'oo-ui-window-title')
span(:internal_linksuggestion, text: 'Main Page') span(:internal_linksuggestion, text: 'Main Page')

18
modules/ve/ui/styles/ve.ui.Tool.css
View file

@ -5,40 +5,42 @@
* @license The MIT License (MIT); see LICENSE.txt * @license The MIT License (MIT); see LICENSE.txt
*/ */
.oo-ui-menuToolGroup .oo-ui-tool-paragraph .oo-ui-labeledElement-label { /* ve.ui.FormatTool */
.oo-ui-menuToolGroup .oo-ui-tool-name-paragraph .oo-ui-labeledElement-label {
font-weight: normal; font-weight: normal;
} }
.oo-ui-menuToolGroup .oo-ui-tool-heading1 .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-heading1 .oo-ui-labeledElement-label {
font-size: 150%; font-size: 150%;
font-weight: normal; font-weight: normal;
} }
.oo-ui-menuToolGroup .oo-ui-tool-heading2 .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-heading2 .oo-ui-labeledElement-label {
font-size: 120%; font-size: 120%;
font-weight: normal; font-weight: normal;
} }
.oo-ui-menuToolGroup .oo-ui-tool-heading3 .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-heading3 .oo-ui-labeledElement-label {
font-size: 105%; font-size: 105%;
font-weight: bold; font-weight: bold;
} }
.oo-ui-menuToolGroup .oo-ui-tool-heading4 .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-heading4 .oo-ui-labeledElement-label {
font-size: 92%; font-size: 92%;
font-weight: bold; font-weight: bold;
} }
.oo-ui-menuToolGroup .oo-ui-tool-heading5 .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-heading5 .oo-ui-labeledElement-label {
font-size: 80%; font-size: 80%;
font-weight: bold; font-weight: bold;
} }
.oo-ui-menuToolGroup .oo-ui-tool-heading6 .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-heading6 .oo-ui-labeledElement-label {
font-size: 64%; font-size: 64%;
font-weight: bold; font-weight: bold;
} }
.oo-ui-menuToolGroup .oo-ui-tool-preformatted .oo-ui-labeledElement-label { .oo-ui-menuToolGroup .oo-ui-tool-name-preformatted .oo-ui-labeledElement-label {
font-family: monospace, "Courier New"; font-family: monospace, "Courier New";
} }