diff --git a/VisualEditor.php b/VisualEditor.php
index d927d606c3..5b57241bb2 100644
--- a/VisualEditor.php
+++ b/VisualEditor.php
@@ -106,6 +106,7 @@ $wgResourceModules += array(
'es/tools/es.AnnotationButtonTool.js',
'es/tools/es.ClearButtonTool.js',
'es/tools/es.HistoryButtonTool.js',
+ 'es/tools/es.ListButtonTool.js',
'es/tools/es.DropdownTool.js',
'es/tools/es.FormatDropdownTool.js'
diff --git a/demo/index.html b/demo/index.html
index ef99073120..5a2eaac300 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -139,6 +139,7 @@
+
diff --git a/modules/es/styles/es.ToolbarView.css b/modules/es/styles/es.ToolbarView.css
index 398e62dfcb..a53a6f4dd4 100644
--- a/modules/es/styles/es.ToolbarView.css
+++ b/modules/es/styles/es.ToolbarView.css
@@ -73,10 +73,17 @@
.es-toolbarButtonTool-clear:before {
background-image: url(../images/clear.png);
}
+.es-toolbarButtonTool-number:before {
+ background-image: url(../images/number.png);
+}
+.es-toolbarButtonTool-bullet:before {
+ background-image: url(../images/bullet.png);
+}
.es-toolbarButtonTool-disabled.es-toolbarButtonTool-clear:before {
-moz-opacity: 0.25;
filter:alpha(opacity=25);
opacity: 0.25;
+}
.es-toolbarButtonTool-clear:before {
background-image: url(../images/clear.png);
}
diff --git a/modules/es/tools/es.ListButtonTool.js b/modules/es/tools/es.ListButtonTool.js
new file mode 100644
index 0000000000..e6143f3267
--- /dev/null
+++ b/modules/es/tools/es.ListButtonTool.js
@@ -0,0 +1,41 @@
+es.ListButtonTool = function( toolbar, name, data ) {
+ es.ButtonTool.call( this, toolbar, name );
+ this.data = data;
+};
+
+es.ListButtonTool.prototype.onClick = function() {
+};
+
+es.ListButtonTool.prototype.updateState = function( annotations, nodes ) {
+ function areSameTypeAndStyle( nodes, style ) {
+ for( var i = 0; i < nodes.length; i++ ) {
+ parent = nodes[i].getParent();
+ if ( parent.getElementType() !== 'listItem' ) {
+ return false;
+ }
+ styles = parent.getElementAttribute( 'styles' );
+ if ( styles[ styles.length - 1] !== style ) {
+ return false;
+ }
+ }
+ return true;
+ }
+
+ if ( areSameTypeAndStyle( nodes, this.name ) ) {
+ this.$.addClass( 'es-toolbarButtonTool-down' );
+ } else {
+ this.$.removeClass( 'es-toolbarButtonTool-down' );
+ }
+};
+
+es.Tool.tools.number = {
+ constructor: es.ListButtonTool,
+ name: 'number'
+};
+
+es.Tool.tools.bullet = {
+ constructor: es.ListButtonTool,
+ name: 'bullet'
+};
+
+es.extendClass( es.ListButtonTool, es.ButtonTool );
\ No newline at end of file
diff --git a/modules/es/views/es.ToolbarView.js b/modules/es/views/es.ToolbarView.js
index bce69658ec..06330028d3 100644
--- a/modules/es/views/es.ToolbarView.js
+++ b/modules/es/views/es.ToolbarView.js
@@ -49,7 +49,8 @@ es.ToolbarView = function( $container, surfaceView, config ) {
this.config = config || [
{ 'name': 'textStyle', 'items' : [ 'bold', 'italic', 'link', 'clear', 'format' ] },
- { 'name': 'history', 'items' : [ 'undo', 'redo' ] }
+ { 'name': 'history', 'items' : [ 'undo', 'redo' ] },
+ { 'name': 'list', 'items' : [ 'number', 'bullet' ] }
];
this.setup();
};