diff --git a/lib/editor/atto/plugins/bold/tests/behat/bold.feature b/lib/editor/atto/plugins/bold/tests/behat/bold.feature index 98b369b01dd..fe5b8619906 100644 --- a/lib/editor/atto/plugins/bold/tests/behat/bold.feature +++ b/lib/editor/atto/plugins/bold/tests/behat/bold.feature @@ -15,7 +15,7 @@ Feature: Atto bold button And I set the field "Text editor" to "Plain text area" And I press "Save changes" And I click on "Edit profile" "link" in the "region-main" "region" - Then I should see "Badger" + Then I should see "Badger" @javascript Scenario: Unbold some text @@ -31,5 +31,5 @@ Feature: Atto bold button And I set the field "Text editor" to "Plain text area" And I press "Save changes" And I click on "Edit profile" "link" in the "region-main" "region" - Then I should not see "Mouse" + Then I should not see "Mouse" And I should see "Mouse" diff --git a/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-debug.js b/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-debug.js index 3736b77776b..c1ae54dd3cf 100644 --- a/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-debug.js +++ b/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-debug.js @@ -35,15 +35,36 @@ YUI.add('moodle-atto_bold-button', function (Y, NAME) { Y.namespace('M.atto_bold').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], { initializer: function() { - this.addBasicButton({ - exec: 'bold', + var bold; + + this.addButton({ + callback: this._toggleBold, + icon: 'e/bold', + buttonName: bold, + inlineFormat: true, // Key code for the keyboard shortcut which triggers this button: keys: '66', // Watch the following tags and add/remove highlighting as appropriate: - tags: 'b, strong' + tags: 'strong, b' }); + }, + /** + * Toggle the bold setting. + * + * @method _toggleBold + * @param {EventFacade} e + */ + _toggleBold: function() { + var host = this.get('host'); + + // Use the "bold" command for simplicity. This will toggle tags off as well. + document.execCommand('bold', false, null); + + // Then change all tags to tags. This will change any existing tags as well. + host.changeToCSS('b', 'bf-editor-bold-strong'); + host.changeToTags('bf-editor-bold-strong', 'strong'); } }); diff --git a/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-min.js b/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-min.js index f71bf5858a4..31c9d635cc1 100644 --- a/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-min.js +++ b/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button-min.js @@ -1 +1 @@ -YUI.add("moodle-atto_bold-button",function(e,t){e.namespace("M.atto_bold").Button=e.Base.create("button",e.M.editor_atto.EditorPlugin,[],{initializer:function(){this.addBasicButton({exec:"bold",keys:"66",tags:"b, strong"})}})},"@VERSION@",{requires:["moodle-editor_atto-plugin"]}); +YUI.add("moodle-atto_bold-button",function(e,t){e.namespace("M.atto_bold").Button=e.Base.create("button",e.M.editor_atto.EditorPlugin,[],{initializer:function(){var e;this.addButton({callback:this._toggleBold,icon:"e/bold",buttonName:e,inlineFormat:!0,keys:"66",tags:"strong, b"})},_toggleBold:function(){var e=this.get("host");document.execCommand("bold",!1,null),e.changeToCSS("b","bf-editor-bold-strong"),e.changeToTags("bf-editor-bold-strong","strong")}})},"@VERSION@",{requires:["moodle-editor_atto-plugin"]}); diff --git a/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button.js b/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button.js index 3736b77776b..c1ae54dd3cf 100644 --- a/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button.js +++ b/lib/editor/atto/plugins/bold/yui/build/moodle-atto_bold-button/moodle-atto_bold-button.js @@ -35,15 +35,36 @@ YUI.add('moodle-atto_bold-button', function (Y, NAME) { Y.namespace('M.atto_bold').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], { initializer: function() { - this.addBasicButton({ - exec: 'bold', + var bold; + + this.addButton({ + callback: this._toggleBold, + icon: 'e/bold', + buttonName: bold, + inlineFormat: true, // Key code for the keyboard shortcut which triggers this button: keys: '66', // Watch the following tags and add/remove highlighting as appropriate: - tags: 'b, strong' + tags: 'strong, b' }); + }, + /** + * Toggle the bold setting. + * + * @method _toggleBold + * @param {EventFacade} e + */ + _toggleBold: function() { + var host = this.get('host'); + + // Use the "bold" command for simplicity. This will toggle tags off as well. + document.execCommand('bold', false, null); + + // Then change all tags to tags. This will change any existing tags as well. + host.changeToCSS('b', 'bf-editor-bold-strong'); + host.changeToTags('bf-editor-bold-strong', 'strong'); } }); diff --git a/lib/editor/atto/plugins/bold/yui/src/button/js/button.js b/lib/editor/atto/plugins/bold/yui/src/button/js/button.js index 7567ffe9842..3215bfe63de 100644 --- a/lib/editor/atto/plugins/bold/yui/src/button/js/button.js +++ b/lib/editor/atto/plugins/bold/yui/src/button/js/button.js @@ -33,14 +33,35 @@ Y.namespace('M.atto_bold').Button = Y.Base.create('button', Y.M.editor_atto.EditorPlugin, [], { initializer: function() { - this.addBasicButton({ - exec: 'bold', + var bold; + + this.addButton({ + callback: this._toggleBold, + icon: 'e/bold', + buttonName: bold, + inlineFormat: true, // Key code for the keyboard shortcut which triggers this button: keys: '66', // Watch the following tags and add/remove highlighting as appropriate: - tags: 'b, strong' + tags: 'strong, b' }); + }, + /** + * Toggle the bold setting. + * + * @method _toggleBold + * @param {EventFacade} e + */ + _toggleBold: function() { + var host = this.get('host'); + + // Use the "bold" command for simplicity. This will toggle tags off as well. + document.execCommand('bold', false, null); + + // Then change all tags to tags. This will change any existing tags as well. + host.changeToCSS('b', 'bf-editor-bold-strong'); + host.changeToTags('bf-editor-bold-strong', 'strong'); } }); diff --git a/lib/editor/atto/tests/behat/customtoolbar.feature b/lib/editor/atto/tests/behat/customtoolbar.feature index 97f8df0d864..02f5665e0aa 100644 --- a/lib/editor/atto/tests/behat/customtoolbar.feature +++ b/lib/editor/atto/tests/behat/customtoolbar.feature @@ -20,7 +20,7 @@ Feature: Atto editor with customised toolbar Scenario: Confirm that both editors have different toolbars but still function Then ".atto_link_button" "css_element" should exist in the ".normaldiv" "css_element" And ".atto_link_button" "css_element" should not exist in the ".specialdiv" "css_element" - And ".atto_bold_button_bold" "css_element" should exist in the ".normaldiv" "css_element" + And ".atto_bold_button" "css_element" should exist in the ".normaldiv" "css_element" And ".atto_italic_button_italic" "css_element" should exist in the ".normaldiv" "css_element" - And ".atto_bold_button_bold" "css_element" should exist in the ".specialdiv" "css_element" + And ".atto_bold_button" "css_element" should exist in the ".specialdiv" "css_element" And ".atto_italic_button_italic" "css_element" should exist in the ".specialdiv" "css_element" diff --git a/lib/editor/atto/tests/behat/disablecontrol.feature b/lib/editor/atto/tests/behat/disablecontrol.feature index 491e6e10362..a3a65909c8d 100644 --- a/lib/editor/atto/tests/behat/disablecontrol.feature +++ b/lib/editor/atto/tests/behat/disablecontrol.feature @@ -21,7 +21,7 @@ Feature: Atto with enable/disable function. When I set the field "mycontrol" to "Disable" Then the "disabled" attribute of "button.atto_collapse_button" "css_element" should contain "disabled" And the "disabled" attribute of "button.atto_title_button" "css_element" should contain "disabled" - And the "disabled" attribute of "button.atto_bold_button_bold" "css_element" should contain "disabled" + And the "disabled" attribute of "button.atto_bold_button" "css_element" should contain "disabled" And the "disabled" attribute of "button.atto_italic_button_italic" "css_element" should contain "disabled" And the "disabled" attribute of "button.atto_unorderedlist_button_insertUnorderedList" "css_element" should contain "disabled" And the "disabled" attribute of "button.atto_orderedlist_button_insertOrderedList" "css_element" should contain "disabled" @@ -35,7 +35,7 @@ Feature: Atto with enable/disable function. When I set the field "mycontrol" to "Enable" Then "button.atto_collapse_button[disabled]" "css_element" should not exist And "button.atto_title_button[disabled]" "css_element" should not exist - And "button.atto_bold_button_bold[disabled]" "css_element" should not exist + And "button.atto_bold_button[disabled]" "css_element" should not exist And "button.atto_italic_button_italic[disabled]" "css_element" should not exist And "button.atto_unorderedlist_button_insertUnorderedList[disabled]" "css_element" should not exist And "button.atto_orderedlist_button_insertOrderedList[disabled]" "css_element" should not exist