Skip to content
This repository has been archived by the owner on May 3, 2022. It is now read-only.

EZP-28030: Alloy editor add support for more builtin buttons #905

Merged
merged 3 commits into from
Oct 10, 2017
Merged

EZP-28030: Alloy editor add support for more builtin buttons #905

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b9b02b3
Add buttons to the text.js configuration
Plopix Sep 22, 2017
5858697
Add numbered list to Rich Text
Plopix Sep 22, 2017
d87f21d
Regnerate js files
andrerom Oct 4, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 56 additions & 3 deletions Resources/public/js/alloyeditor/buttons/list.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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).
Expand Down Expand Up @@ -58,13 +58,66 @@ 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",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think something is wrong with this generated js. I think this should be ButtonListIndexed = ... instead of ButtonList = ...

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: '<li></li>',
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'))
)
);
},
});

AlloyEditor.Buttons[ButtonList.key] = AlloyEditor.ButtonList = ButtonList;
AlloyEditor.Buttons[ButtonListIndexed.key] = AlloyEditor.ButtonListIndexed = ButtonListIndexed;
});
55 changes: 54 additions & 1 deletion Resources/public/js/alloyeditor/buttons/list.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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).
Expand Down Expand Up @@ -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: '<li></li>',
focusElement: 'li',
});
},

render: function () {
var css = "ae-button ez-ae-labeled-button" + this.getStateClasses();

return (
<button className={css} onClick={this._addList} tabIndex={this.props.tabIndex}>
<span className="ez-ae-icon ae-icon-numbered-list"></span>
<p className="ez-ae-label">{Y.eZ.trans('list', {}, 'onlineeditor')}</p>
</button>
);
},
});

AlloyEditor.Buttons[ButtonList.key] = AlloyEditor.ButtonList = ButtonList;
AlloyEditor.Buttons[ButtonListIndexed.key] = AlloyEditor.ButtonListIndexed = ButtonListIndexed;
});
3 changes: 1 addition & 2 deletions Resources/public/js/alloyeditor/toolbars/config/text.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
};
});

2 changes: 1 addition & 1 deletion Resources/public/js/views/fields/ez-richtext-editview.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
},
};
Expand Down