transform jstoolbar help into button

* jstoolbar now takes whatever dom node is provided for the help trigger

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) {

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
 

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

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',

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,
+          help_button = content_tag :button,
-                              class: 'icon icon-help',
+                                    '',
-                              onclick: open_help,
+                                    class: 'jstb_help icon icon-help',
-                              title: l(:setting_text_formatting)) do
+                                    onclick: open_help,
-                                content_tag :span, class: 'hidden-for-sighted' do
+                                    title: l(:setting_text_formatting)
-                                  l(:setting_text_formatting)
-                                end
-                              end
 
           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(); });