From 163649cb55200724f7efbb169962f48a0a3751c8 Mon Sep 17 00:00:00 2001
From: Jens Ulferts <j.ulferts@finn.de>
Date: Wed, 25 Mar 2015 10:02:42 +0100
Subject: [PATCH] transform jstoolbar help into button

* jstoolbar now takes whatever dom node is provided for the help trigger
---
 app/assets/javascripts/jstoolbar/jstoolbar.js     |  6 +-----
 app/assets/stylesheets/_jstoolbar.sass            |  7 ++++---
 .../stylesheets/content/_in_place_editing.sass    |  5 +++--
 .../app/ui_components/wiki-toolbar-directive.js   |  2 +-
 lib/redmine/wiki_formatting/textile/helper.rb     | 15 ++++++---------
 5 files changed, 15 insertions(+), 20 deletions(-)

diff --git a/app/assets/javascripts/jstoolbar/jstoolbar.js b/app/assets/javascripts/jstoolbar/jstoolbar.js
index f3f30e03e8..a6c58b1352 100644
--- a/app/assets/javascripts/jstoolbar/jstoolbar.js
+++ b/app/assets/javascripts/jstoolbar/jstoolbar.js
@@ -206,10 +206,6 @@ jsToolBar.prototype = {
     }
     this.toolNodes = {}; // vide les raccourcis DOM/**/
 
-    var h = document.createElement('div');
-    h.className = 'jstb_help';
-    h.innerHTML = this.help_link;
-
     // Draw toolbar elements
     var b, tool, newTool;
 
@@ -230,7 +226,7 @@ jsToolBar.prototype = {
         }
       }
     }
-    this.toolbar.appendChild(h);
+    this.toolbar.appendChild(this.help_link);
   },
 
   singleTag: function(stag,etag) {
diff --git a/app/assets/stylesheets/_jstoolbar.sass b/app/assets/stylesheets/_jstoolbar.sass
index 4a5e6d03e8..f6e5538f60 100644
--- a/app/assets/stylesheets/_jstoolbar.sass
+++ b/app/assets/stylesheets/_jstoolbar.sass
@@ -53,7 +53,7 @@ $jstoolbar--icon-active-background: #eee
   margin-bottom: 0.25rem
   line-height: 1.6rem
 
-  button, .jstb_help
+  button
     @include grid-content
     padding: 0.25rem
     margin-left: 0.25rem
@@ -83,9 +83,10 @@ $jstoolbar--icon-active-background: #eee
 
   .jstb_help
     font-size: 0.8125rem
-    padding: 0.125rem
+    padding: 0.35rem
+    line-height: 1rem
 
-    a.icon-help:before
+    &:before
       color: $body-font-color
       padding: 0
 
diff --git a/app/assets/stylesheets/content/_in_place_editing.sass b/app/assets/stylesheets/content/_in_place_editing.sass
index 7034f98d53..c37a8e82b5 100644
--- a/app/assets/stylesheets/content/_in_place_editing.sass
+++ b/app/assets/stylesheets/content/_in_place_editing.sass
@@ -6,7 +6,7 @@ $inplace-edit--color--very-dark: #cacaca
   @extend .form--field.-full-width
 
   &.-preview
-    button, .jstb_help
+    button
       visibility: hidden
     .jstb_preview
       visibility: visible
@@ -34,7 +34,8 @@ $inplace-edit--color--very-dark: #cacaca
     .jstb_del,
     .jstb_ul,
     .jstb_ol,
-    .jstb_preview
+    .jstb_preview,
+    .jstb_help
       display: flex
 
 .inplace-edit--select
diff --git a/frontend/app/ui_components/wiki-toolbar-directive.js b/frontend/app/ui_components/wiki-toolbar-directive.js
index 5042cba247..69ad2636f0 100644
--- a/frontend/app/ui_components/wiki-toolbar-directive.js
+++ b/frontend/app/ui_components/wiki-toolbar-directive.js
@@ -27,7 +27,7 @@
 //++
 
 module.exports = function() {
-  var HELP_LINK_HTML = '<a href="/help/wiki_syntax" title="' + I18n.t('js.inplace.link_formatting_help') + '" class="icon icon-help" onclick="window.open(&quot;/help/wiki_syntax&quot;, &quot;&quot;, &quot;resizable=yes, location=no, width=600, height=640, menubar=no, status=no, scrollbars=yes&quot;); return false;"><span class="hidden-for-sighted">' + I18n.t('js.inplace.link_formatting_help') + '</span></a>',
+  var HELP_LINK_HTML = jQuery('<button title="' + I18n.t('js.inplace.link_formatting_help') + '" class="jstb_help icon icon-help" onclick="window.open(&quot;/help/wiki_syntax&quot;, &quot;&quot;, &quot;resizable=yes, location=no, width=600, height=640, menubar=no, status=no, scrollbars=yes&quot;); return false;"></button>')[0],
       PREVIEW_ENABLE_TEXT = I18n.t('js.inplace.btn_preview_enable'),
       PREVIEW_DISABLE_TEXT = I18n.t('js.inplace.btn_preview_disable'),
       PREVIEW_BUTTON_CLASS = 'jstb_preview',
diff --git a/lib/redmine/wiki_formatting/textile/helper.rb b/lib/redmine/wiki_formatting/textile/helper.rb
index 8b2eae13d0..4b4f764e49 100644
--- a/lib/redmine/wiki_formatting/textile/helper.rb
+++ b/lib/redmine/wiki_formatting/textile/helper.rb
@@ -36,18 +36,15 @@ module Redmine
           url = url_for(controller: '/help', action: 'wiki_syntax')
           open_help = "window.open(\"#{ url }\", \"\", \"resizable=yes, location=no, width=600, " +
                       "height=640, menubar=no, status=no, scrollbars=yes\"); return false;"
-          help_link = link_to(url,
-                              class: 'icon icon-help',
-                              onclick: open_help,
-                              title: l(:setting_text_formatting)) do
-                                content_tag :span, class: 'hidden-for-sighted' do
-                                  l(:setting_text_formatting)
-                                end
-                              end
+          help_button = content_tag :button,
+                                    '',
+                                    class: 'jstb_help icon icon-help',
+                                    onclick: open_help,
+                                    title: l(:setting_text_formatting)
 
           javascript_tag(<<-EOF)
             var wikiToolbar = new jsToolBar($('#{field_id}'));
-            wikiToolbar.setHelpLink('#{escape_javascript help_link}');
+            wikiToolbar.setHelpLink(jQuery('#{escape_javascript help_button}')[0]);
             // initialize the toolbar later, so that i18n-js has a chance to set the translations
             // for the wiki-buttons first.
             jQuery(function(){ wikiToolbar.draw(); });