[BUGFIX] RTE: Highlight Image/link button when cursor is in image/link 52/36152/3
authorStanislas Rolland <typo3@sjbr.ca>
Wed, 21 Jan 2015 03:19:05 +0000 (22:19 -0500)
committerStanislas Rolland <typo3@sjbr.ca>
Wed, 21 Jan 2015 03:56:56 +0000 (04:56 +0100)
Toolbar image/link button should be highlighted when cursor is positioned
on image or in link.

Releases: master
Resolves: #64394
Change-Id: I4b9a8a5bf3ef6c369defd25e04ff261bbffb4091
Reviewed-on: http://review.typo3.org/36152
Reviewed-by: Stanislas Rolland <typo3@sjbr.ca>
Tested-by: Stanislas Rolland <typo3@sjbr.ca>
typo3/sysext/rtehtmlarea/Resources/Public/Css/Skin/htmlarea.css
typo3/sysext/rtehtmlarea/Resources/Public/JavaScript/HTMLArea/Toolbar/Button.js
typo3/sysext/rtehtmlarea/Resources/Public/JavaScript/Plugins/DefaultImage.js
typo3/sysext/rtehtmlarea/Resources/Public/JavaScript/Plugins/DefaultLink.js
typo3/sysext/rtehtmlarea/Resources/Public/JavaScript/Plugins/TYPO3Image.js
typo3/sysext/rtehtmlarea/Resources/Public/JavaScript/Plugins/TYPO3Link.js
typo3/sysext/t3skin/rtehtmlarea/htmlarea.css

index 2d9dfaf..d65e72c 100644 (file)
@@ -98,7 +98,6 @@
        background-color: #DCDCDC;
 }
 .htmlarea .toolbar .buttonActive,
-.htmlarea .toolbar .buttonPressed,
 .htmlarea-context-menu .buttonActive {
        border-style: solid;
        border-width: 1px;
index 7a4796a..fcfc1a7 100644 (file)
@@ -176,7 +176,7 @@ define('TYPO3/CMS/Rtehtmlarea/HTMLArea/Toolbar/Button',
                 * Handler invoked when the mouse goes over the button
                 */
                onMouseOver: function (event) {
-                       if (!this.buttonElement.disabled && this.inactive) {
+                       if (!this.disabled && this.inactive) {
                                Dom.addClass(this.el, 'buttonHover');
                        }
                },
index b8a6ac3..c72f5fe 100644 (file)
@@ -510,6 +510,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/DefaultImage',
                 * This function gets called when the toolbar is updated
                 */
                onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
+                       button.setInactive(true);
                        if (mode === 'wysiwyg' && this.editor.isEditable() && button.itemId === 'InsertImage' && !button.disabled) {
                                var image = this.editor.getSelection().getParentElement();
                                if (image && !/^img$/i.test(image.nodeName)) {
@@ -517,6 +518,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/DefaultImage',
                                }
                                if (image) {
                                        button.setTooltip(this.localize('Modify image'));
+                                       button.setInactive(false);
                                } else {
                                        button.setTooltip(this.localize('Insert image'));
                                }
index 7056427..15a242a 100644 (file)
@@ -378,6 +378,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/DefaultLink',
                 * This function gets called when the toolbar is updated
                 */
                onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
+                       button.setInactive(true);
                        if (mode === 'wysiwyg' && this.editor.isEditable()) {
                                switch (button.itemId) {
                                        case 'CreateLink':
@@ -390,6 +391,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/DefaultLink',
                                                        }
                                                        if (node != null && /^a$/i.test(node.nodeName)) {
                                                                button.setTooltip(this.localize('Modify link'));
+                                                               button.setInactive(false);
                                                        } else {
                                                                button.setTooltip(this.localize('Insert link'));
                                                        }
index b365288..790dcfc 100644 (file)
@@ -133,6 +133,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/TYPO3Image',
                 * This function gets called when the toolbar is updated
                 */
                onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
+                       button.setInactive(true);
                        if (mode === 'wysiwyg' && this.editor.isEditable() && button.itemId === 'InsertImage' && !button.disabled) {
                                var image = this.editor.getSelection().getParentElement();
                                if (image && !/^img$/i.test(image.nodeName)) {
@@ -140,6 +141,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/TYPO3Image',
                                }
                                if (image) {
                                        button.setTooltip(this.localize('Modify image'));
+                                       button.setInactive(false);
                                } else {
                                        button.setTooltip(this.localize('Insert image'));
                                }
index 0f78163..f4047ad 100644 (file)
@@ -260,6 +260,9 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/TYPO3Link',
                                                // We may have created multiple links in as many blocks
                                        this.setLinkAttributes(node, range, cur_target, cur_class, cur_title, imageNode, addIconAfterLink, additionalValues);
                                }
+                               // Set the selection on the last link created
+                               var links = node.getElementsByTagName('a');
+                               this.editor.getSelection().selectNodeContents(links[links.length-1]);
                        }
                        this.close();
                },
@@ -452,6 +455,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/TYPO3Link',
                 * This function gets called when the toolbar is updated
                 */
                onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
+                       button.setInactive(true);
                        if (mode === 'wysiwyg' && this.editor.isEditable()) {
                                switch (button.itemId) {
                                        case 'CreateLink':
@@ -464,6 +468,7 @@ define('TYPO3/CMS/Rtehtmlarea/Plugins/TYPO3Link',
                                                        }
                                                        if (node != null && /^a$/i.test(node.nodeName)) {
                                                                button.setTooltip(this.localize('Modify link'));
+                                                               button.setInactive(false);
                                                        } else {
                                                                button.setTooltip(this.localize('Insert link'));
                                                        }
index 7f7eb3d..78f0e7d 100644 (file)
@@ -99,7 +99,6 @@
        background-color: #DCDCDC;
 }
 .htmlarea .toolbar .buttonActive,
-.htmlarea .toolbar .buttonPressed,
 .htmlarea-context-menu .buttonActive {
        border-style: solid;
        border-width: 1px;