Trevor Parscal has uploaded a new change for review.
https://gerrit.wikimedia.org/r/68612
Change subject: Template and content adding (WIP)
......................................................................
Template and content adding (WIP)
Change-Id: I3478560fb53ba2ccd3fb26bafb6a61e6415565eb
---
M modules/ve/ui/dialogs/ve.ui.MWTransclusionDialog.js
M modules/ve/ui/styles/ve.ui.Icons-raster.css
M modules/ve/ui/styles/ve.ui.Icons-vector.css
M modules/ve/ui/styles/ve.ui.Widget.css
M modules/ve/ui/widgets/ve.ui.OutlineControlsWidget.js
5 files changed, 107 insertions(+), 8 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/VisualEditor
refs/changes/12/68612/1
diff --git a/modules/ve/ui/dialogs/ve.ui.MWTransclusionDialog.js
b/modules/ve/ui/dialogs/ve.ui.MWTransclusionDialog.js
index e50f76b..850f4aa 100644
--- a/modules/ve/ui/dialogs/ve.ui.MWTransclusionDialog.js
+++ b/modules/ve/ui/dialogs/ve.ui.MWTransclusionDialog.js
@@ -53,7 +53,10 @@
// Call parent method
ve.ui.PagedDialog.prototype.initialize.call( this );
- this.outlineControlsWidget.connect( this, { 'move':
'onOutlineControlsMove' } );
+ this.outlineControlsWidget.connect( this, {
+ 'move': 'onOutlineControlsMove',
+ 'add': 'onOutlineControlsAdd',
+ } );
};
/**
@@ -192,7 +195,7 @@
* Handle outline controls move events.
*
* @method
- * @param {number} places Number of places to move the selected item.
+ * @param {number} places Number of places to move the selected item
*/
ve.ui.MWTransclusionDialog.prototype.onOutlineControlsMove = function ( places
) {
var part, index, name,
@@ -210,6 +213,34 @@
};
/**
+ * Handle outline controls add events.
+ *
+ * @method
+ * @param {string} type Type of item to add
+ */
+ve.ui.MWTransclusionDialog.prototype.onOutlineControlsAdd = function ( type ) {
+ var index, part,
+ parts = this.transclusion.getParts(),
+ item = this.outlineWidget.getSelectedItem();
+
+ if ( item ) {
+ index = ve.indexOf( this.transclusion.getPartFromId(
item.getData() ), parts ) + 1;
+ } else {
+ index = parts.length;
+ }
+
+ switch ( type ) {
+ case 'content':
+ part = this.transclusion.addContent( '', index );
+ this.setPageByName( part.getId() );
+ break;
+ case 'template':
+ // TODO: This.
+ break;
+ }
+};
+
+/**
* Set the page by name.
*
* Page names are always the ID of the part or param they represent.
diff --git a/modules/ve/ui/styles/ve.ui.Icons-raster.css
b/modules/ve/ui/styles/ve.ui.Icons-raster.css
index 9d94bd7..f0259d1 100644
--- a/modules/ve/ui/styles/ve.ui.Icons-raster.css
+++ b/modules/ve/ui/styles/ve.ui.Icons-raster.css
@@ -249,3 +249,8 @@
/* @embed */
background-image: url(images/icons/collapse.png);
}
+
+.ve-ui-icon-add-item {
+ /* @embed */
+ background-image: url(images/icons/add-item.png);
+}
diff --git a/modules/ve/ui/styles/ve.ui.Icons-vector.css
b/modules/ve/ui/styles/ve.ui.Icons-vector.css
index 17636ec..74055e3 100644
--- a/modules/ve/ui/styles/ve.ui.Icons-vector.css
+++ b/modules/ve/ui/styles/ve.ui.Icons-vector.css
@@ -249,3 +249,8 @@
/* @embed */
background-image: url(images/icons/collapse.svg);
}
+
+.ve-ui-icon-add-item {
+ /* @embed */
+ background-image: url(images/icons/add-item.svg);
+}
diff --git a/modules/ve/ui/styles/ve.ui.Widget.css
b/modules/ve/ui/styles/ve.ui.Widget.css
index 557c403..537d44a 100644
--- a/modules/ve/ui/styles/ve.ui.Widget.css
+++ b/modules/ve/ui/styles/ve.ui.Widget.css
@@ -217,12 +217,23 @@
background-color: #fff;
}
-.ve-ui-outlineControlsWidget-addButton {
+.ve-ui-outlineControlsWidget-adders .ve-ui-iconButtonWidget {
float: left;
}
-.ve-ui-outlineControlsWidget-upButton,
-.ve-ui-outlineControlsWidget-downButton {
+.ve-ui-outlineControlsWidget-adders .ve-ui-iconButtonWidget:not(:first-child) {
+ display: none;
+}
+
+.ve-ui-outlineControlsWidget-adders:hover
.ve-ui-iconButtonWidget:not(:first-child) {
+ display: block;
+}
+
+.ve-ui-outlineControlsWidget-adders:hover .ve-ui-iconButtonWidget:first-child {
+ opacity: 0.25;
+}
+
+.ve-ui-outlineControlsWidget-movers .ve-ui-iconButtonWidget {
float: right;
}
diff --git a/modules/ve/ui/widgets/ve.ui.OutlineControlsWidget.js
b/modules/ve/ui/widgets/ve.ui.OutlineControlsWidget.js
index c8b1f16..d2eca5b 100644
--- a/modules/ve/ui/widgets/ve.ui.OutlineControlsWidget.js
+++ b/modules/ve/ui/widgets/ve.ui.OutlineControlsWidget.js
@@ -13,13 +13,22 @@
* @constructor
* @param {ve.ui.OutlineWidget} outline Outline to control
* @param {Object} [config] Config options
+ * @cfg {Object[]} [adders] List of icons to show as addable item types, each
an object with
+ * name, title and icon properties
*/
ve.ui.OutlineControlsWidget = function VeUiOutlineControlsWidget( outline,
config ) {
+ // Configuration initialization
+ config = config || {};
+
// Parent constructor
ve.ui.Widget.call( this, config );
// Properties
this.outline = outline;
+ this.adders = {};
+ this.$adders = this.$$( '<div>' );
+ this.$movers = this.$$( '<div>' );
+ this.addButton = new ve.ui.IconButtonWidget( { '$$': this.$$, 'icon':
'add-item' } );
this.upButton = new ve.ui.IconButtonWidget( {
'$$': this.$$, 'icon': 'collapse', 'title': ve.msg(
'visualeditor-outline-control-move-up' )
} );
@@ -38,9 +47,18 @@
// Initialization
this.$.addClass( 've-ui-outlineControlsWidget' );
- this.upButton.$.addClass( 've-ui-outlineControlsWidget-upButton' );
- this.downButton.$.addClass( 've-ui-outlineControlsWidget-downButton' );
- this.$.append( this.upButton.$, this.downButton.$ );
+ this.$adders.addClass( 've-ui-outlineControlsWidget-adders' );
+ this.$movers
+ .addClass( 've-ui-outlineControlsWidget-movers' )
+ .append( this.upButton.$, this.downButton.$ );
+ this.$.append( this.$adders, this.$movers );
+ config.adders = [
+ { 'name': 'template', 'icon': 'template', 'title': 'Add a
template' },
+ { 'name': 'content', 'icon': 'source', 'title': 'Add content' }
+ ];
+ if ( config.adders && config.adders.length ) {
+ this.setupAdders( config.adders );
+ }
};
/* Inheritance */
@@ -56,6 +74,12 @@
/* Methods */
+/**
+ * Handle outline change events.
+ *
+ * @method
+ * @return {[type]} [description]
+ */
ve.ui.OutlineControlsWidget.prototype.onOutlineChange = function () {
var i, len, item, firstMoveable, lastMoveable,
moveable = false,
@@ -79,3 +103,26 @@
this.upButton.setDisabled( !moveable || selectedItem === firstMoveable
);
this.downButton.setDisabled( !moveable || selectedItem === lastMoveable
);
};
+
+/**
+ * Setup adders icons.
+ *
+ * @method
+ * @return {[type]} [description]
+ */
+ve.ui.OutlineControlsWidget.prototype.setupAdders = function ( adders ) {
+ var i, len, addition, button,
+ $buttons = this.$$( [] );
+
+ this.$adders.append( this.addButton.$ );
+ for ( i = 0, len = adders.length; i < len; i++ ) {
+ addition = adders[i];
+ button = new ve.ui.IconButtonWidget( {
+ '$$': this.$$, 'icon': addition.icon, 'title':
addition.title
+ } );
+ button.connect( this, { 'click': ['emit', 'add', addition.name]
} );
+ this.adders[addition.name] = button;
+ this.$adders.append( button.$ );
+ $buttons = $buttons.add( button.$ );
+ }
+};
--
To view, visit https://gerrit.wikimedia.org/r/68612
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I3478560fb53ba2ccd3fb26bafb6a61e6415565eb
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Trevor Parscal <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
