From b9b02b35a9c65f8b49208a77fdcbedff7da2cbe4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Morel=20Se=CC=81bastien?= Date: Thu, 21 Sep 2017 18:25:44 -0700 Subject: [PATCH 1/3] Add buttons to the text.js configuration --- Resources/public/js/alloyeditor/toolbars/config/text.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/Resources/public/js/alloyeditor/toolbars/config/text.js b/Resources/public/js/alloyeditor/toolbars/config/text.js index 5fd7c9a0e..40f12ed8c 100644 --- a/Resources/public/js/alloyeditor/toolbars/config/text.js +++ b/Resources/public/js/alloyeditor/toolbars/config/text.js @@ -21,8 +21,7 @@ YUI.add('ez-alloyeditor-toolbar-config-text', function (Y) { */ Y.eZ.AlloyEditorToolbarConfig.Text = { name: 'text', - buttons: ['bold', 'italic', 'underline', 'link'], + buttons: ['bold', 'italic', 'underline', 'subscript', 'superscript', 'quote', 'strike', 'link'], test: AlloyEditor.SelectionTest.text }; }); - From 58586973bdac1a2b66bb6924e852b1325a0b4647 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Morel=20Se=CC=81bastien?= Date: Thu, 21 Sep 2017 18:40:51 -0700 Subject: [PATCH 2/3] Add numbered list to Rich Text --- .../public/js/alloyeditor/buttons/list.js | 59 ++++++++++++++++++- .../public/js/alloyeditor/buttons/list.jsx | 55 ++++++++++++++++- .../js/views/fields/ez-richtext-editview.js | 2 +- 3 files changed, 111 insertions(+), 5 deletions(-) diff --git a/Resources/public/js/alloyeditor/buttons/list.js b/Resources/public/js/alloyeditor/buttons/list.js index db06654bf..fff2b939b 100644 --- a/Resources/public/js/alloyeditor/buttons/list.js +++ b/Resources/public/js/alloyeditor/buttons/list.js @@ -12,7 +12,7 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { var AlloyEditor = Y.eZ.AlloyEditor, React = Y.eZ.React, - ButtonList; + ButtonList, ButtonListIndexed; /** * The ButtonList component represents a button to add an unordered list (ul). @@ -58,8 +58,60 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { var css = "ae-button ez-ae-labeled-button" + this.getStateClasses(); return ( - React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, - React.createElement("span", {className: "ez-ae-icon ae-icon-bulleted-list"}), + React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, + React.createElement("span", {className: "ez-ae-icon ae-icon-bulleted-list"}), + React.createElement("p", {className: "ez-ae-label"}, Y.eZ.trans('list', {}, 'onlineeditor')) + ) + ); + }, + }); + + /** + * The ButtonListIndexed component represents a button to add an ordered list (ol). + * + * @uses AlloyEditor.ButtonCommand + * @uses AlloyEditor.ButtonStateClasses + * + * @class eZ.AlloyEditor.ButtonList + */ + ButtonList = React.createClass({displayName: "ButtonListIndexed", + mixins: [ + AlloyEditor.ButtonCommand, + AlloyEditor.ButtonStateClasses, + ], + + statics: { + key: 'ezlistindexed' + }, + + getDefaultProps: function () { + return { + command: 'eZAddContent', + modifiesSelection: true, + }; + }, + + /** + * Executes the eZAppendContent command to add an unordered list containing + * an empty list item. + * + * @method _addList + * @protected + */ + _addList: function () { + this.execCommand({ + tagName: 'ol', + content: '
  • ', + focusElement: 'li', + }); + }, + + render: function () { + var css = "ae-button ez-ae-labeled-button" + this.getStateClasses(); + + return ( + React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, + React.createElement("span", {className: "ez-ae-icon ae-icon-numbered-list"}), React.createElement("p", {className: "ez-ae-label"}, Y.eZ.trans('list', {}, 'onlineeditor')) ) ); @@ -67,4 +119,5 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { }); AlloyEditor.Buttons[ButtonList.key] = AlloyEditor.ButtonList = ButtonList; + AlloyEditor.Buttons[ButtonListIndexed.key] = AlloyEditor.ButtonListIndexed = ButtonListIndexed; }); diff --git a/Resources/public/js/alloyeditor/buttons/list.jsx b/Resources/public/js/alloyeditor/buttons/list.jsx index bba8ee401..773207b18 100644 --- a/Resources/public/js/alloyeditor/buttons/list.jsx +++ b/Resources/public/js/alloyeditor/buttons/list.jsx @@ -7,7 +7,7 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { var AlloyEditor = Y.eZ.AlloyEditor, React = Y.eZ.React, - ButtonList; + ButtonList, ButtonListIndexed; /** * The ButtonList component represents a button to add an unordered list (ul). @@ -61,5 +61,58 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { }, }); + /** + * The ButtonListIndexed component represents a button to add an ordered list (ol). + * + * @uses AlloyEditor.ButtonCommand + * @uses AlloyEditor.ButtonStateClasses + * + * @class eZ.AlloyEditor.ButtonList + */ + ButtonListIndexed = React.createClass({ + mixins: [ + AlloyEditor.ButtonCommand, + AlloyEditor.ButtonStateClasses, + ], + + statics: { + key: 'ezlistindexed' + }, + + getDefaultProps: function () { + return { + command: 'eZAddContent', + modifiesSelection: true, + }; + }, + + /** + * Executes the eZAppendContent command to add an unordered list containing + * an empty list item. + * + * @method _addList + * @protected + */ + _addList: function () { + this.execCommand({ + tagName: 'ol', + content: '
  • ', + focusElement: 'li', + }); + }, + + render: function () { + var css = "ae-button ez-ae-labeled-button" + this.getStateClasses(); + + return ( + + ); + }, + }); + AlloyEditor.Buttons[ButtonList.key] = AlloyEditor.ButtonList = ButtonList; + AlloyEditor.Buttons[ButtonListIndexed.key] = AlloyEditor.ButtonListIndexed = ButtonListIndexed; }); diff --git a/Resources/public/js/views/fields/ez-richtext-editview.js b/Resources/public/js/views/fields/ez-richtext-editview.js index d66f69c1b..6937703ea 100644 --- a/Resources/public/js/views/fields/ez-richtext-editview.js +++ b/Resources/public/js/views/fields/ez-richtext-editview.js @@ -450,7 +450,7 @@ YUI.add('ez-richtext-editview', function (Y) { tabIndex: 1 }, ezadd: { - buttons: ['ezheading', 'ezparagraph', 'ezlist', 'ezimage', 'ezembed', 'eztable'], + buttons: ['ezheading', 'ezparagraph', 'ezlist', 'ezlistindexed', 'ezimage', 'ezembed', 'eztable'], tabIndex: 2, }, }; From d87f21d1c7106b7dc120c48864988d6d04ecb619 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andre=CC=81=20R?= Date: Wed, 4 Oct 2017 19:07:58 +0200 Subject: [PATCH 3/3] Regnerate js files --- Resources/public/js/alloyeditor/buttons/list.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/Resources/public/js/alloyeditor/buttons/list.js b/Resources/public/js/alloyeditor/buttons/list.js index fff2b939b..956a4eeec 100644 --- a/Resources/public/js/alloyeditor/buttons/list.js +++ b/Resources/public/js/alloyeditor/buttons/list.js @@ -58,8 +58,8 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { var css = "ae-button ez-ae-labeled-button" + this.getStateClasses(); return ( - React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, - React.createElement("span", {className: "ez-ae-icon ae-icon-bulleted-list"}), + React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, + React.createElement("span", {className: "ez-ae-icon ae-icon-bulleted-list"}), React.createElement("p", {className: "ez-ae-label"}, Y.eZ.trans('list', {}, 'onlineeditor')) ) ); @@ -74,7 +74,7 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { * * @class eZ.AlloyEditor.ButtonList */ - ButtonList = React.createClass({displayName: "ButtonListIndexed", + ButtonListIndexed = React.createClass({displayName: "ButtonListIndexed", mixins: [ AlloyEditor.ButtonCommand, AlloyEditor.ButtonStateClasses, @@ -110,8 +110,8 @@ YUI.add('ez-alloyeditor-button-list', function (Y) { var css = "ae-button ez-ae-labeled-button" + this.getStateClasses(); return ( - React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, - React.createElement("span", {className: "ez-ae-icon ae-icon-numbered-list"}), + React.createElement("button", {className: css, onClick: this._addList, tabIndex: this.props.tabIndex}, + React.createElement("span", {className: "ez-ae-icon ae-icon-numbered-list"}), React.createElement("p", {className: "ez-ae-label"}, Y.eZ.trans('list', {}, 'onlineeditor')) ) );