0004-Support-jsToolbar.patch

Takashi Kato, 2022-03-21 22:32

Download (7.77 KB)

View differences:

lib/redmine/wiki_formatting/common_mark/helper.rb
59 59
                "var wikiImageMimeTypes = #{Redmine::MimeType.by_type('image').to_json};" \
60 60
                  "var userHlLanguages = #{lang.to_json};"
61 61
              ) +
62
              stylesheet_link_tag('jstoolbar')
62
              stylesheet_link_tag('jstoolbar') +
63
              preload_icon_link('jstoolbar')
63 64
            end
64 65
            @heads_for_wiki_formatter_included = true
65 66
          end
lib/redmine/wiki_formatting/markdown/helper.rb
53 53
                "var wikiImageMimeTypes = #{Redmine::MimeType.by_type('image').to_json};" \
54 54
                  "var userHlLanguages = #{lang.to_json};"
55 55
              ) +
56
              stylesheet_link_tag('jstoolbar')
56
              stylesheet_link_tag('jstoolbar') +
57
              preload_icon_link('jstoolbar')
57 58
            end
58 59
            @heads_for_wiki_formatter_included = true
59 60
          end
lib/redmine/wiki_formatting/textile/helper.rb
52 52
              javascript_tag(
53 53
                "var wikiImageMimeTypes = #{Redmine::MimeType.by_type('image').to_json};" \
54 54
                  "var userHlLanguages = #{lang.to_json};") +
55
              stylesheet_link_tag('jstoolbar')
55
              stylesheet_link_tag('jstoolbar') +
56
              preload_icon_link('jstoolbar')
56 57
            end
57 58
            @heads_for_wiki_formatter_included = true
58 59
          end
public/javascripts/jstoolbar/jstoolbar.js
34 34
    return;
35 35
    }
36 36

  
37
  var link = document.getElementById('jstoolbar_icon_path');
38
  this.iconUrl = link !== null ? link.getAttribute('href') : null;
37 39
  this.textarea = textarea;
38 40

  
39 41
  this.toolbarBlock = document.createElement('div');
......
132 134
  this.scope = scope || null;
133 135
  this.className = className || null;
134 136
}
135
jsButton.prototype.draw = function() {
137
jsButton.prototype.draw = function(icons = undefined) {
136 138
  if (!this.scope) return null;
137 139

  
138 140
  var button = document.createElement('button');
......
144 146
  span.appendChild(document.createTextNode(this.title));
145 147
  button.appendChild(span);
146 148

  
149
  if (icons) {
150
    var icon = icons[this.className];
151
    if (icon) {
152
      var svgicon = createSVGIcon(icons[this.className]);
153
      button.appendChild(svgicon);
154
    }
155
    button.classList.add('toolbar-svg')
156
  }
157

  
147 158
  if (this.icon != undefined) {
148 159
    button.style.backgroundImage = 'url('+this.icon+')';
149 160
  }
......
284 295
    }
285 296
  },
286 297
  draw: function(mode) {
298
    const This = this
299
    if (this.iconUrl) {
300
      fetch(this.iconUrl, {
301
        method: 'GET'
302
      })
303
      .then(function(res) {
304
        res.json().then(function(data) {
305
          This._draw(mode, data);
306
        })
307
      });
308
    } else {
309
      This._draw(mode);
310
    }
311
  },
312

  
313
  _draw: function(mode, icons = undefined) {
287 314
    this.setMode(mode);
288 315

  
289 316
    // Empty toolbar
......
305 332

  
306 333
      if (!disabled && typeof this[b.type] == 'function') {
307 334
        tool = this[b.type](i);
308
        if (tool) newTool = tool.draw();
335
        if (tool) newTool = tool.draw(icons);
309 336
        if (newTool) {
310 337
          this.toolNodes[i] = newTool; //mémorise l'accès DOM pour usage éventuel ultérieur
311 338
          this.toolbar.appendChild(newTool);
public/stylesheets/jstoolbar.css
98 98

  
99 99
/* Buttons
100 100
-------------------------------------------------------- */
101
.jstb_strong {
101
.jstb_strong:not(.toolbar-svg) {
102 102
    background-image: url(../images/jstoolbar/bt_strong.png);
103 103
}
104
.jstb_em {
104

  
105
.jstb_em:not(.toolbar-svg) {
105 106
    background-image: url(../images/jstoolbar/bt_em.png);
106 107
}
107
.jstb_ins {
108

  
109
.jstb_ins:not(.toolbar-svg) {
108 110
    background-image: url(../images/jstoolbar/bt_ins.png);
109 111
}
110
.jstb_del {
112

  
113
.jstb_del:not(.toolbar-svg) {
111 114
    background-image: url(../images/jstoolbar/bt_del.png);
112 115
}
113
.jstb_code {
116

  
117
.jstb_code:not(.toolbar-svg) {
114 118
    background-image: url(../images/jstoolbar/bt_code.png);
115 119
}
116
.jstb_h1 {
120

  
121
.jstb_h1:not(.toolbar-svg) {
117 122
    background-image: url(../images/jstoolbar/bt_h1.png);
118 123
}
119
.jstb_h2 {
124

  
125
.jstb_h2:not(.toolbar-svg) {
120 126
    background-image: url(../images/jstoolbar/bt_h2.png);
121 127
}
122
.jstb_h3 {
128

  
129
.jstb_h3:not(.toolbar-svg) {
123 130
    background-image: url(../images/jstoolbar/bt_h3.png);
124 131
}
125
.jstb_ul {
132

  
133
.jstb_ul:not(.toolbar-svg) {
126 134
    background-image: url(../images/jstoolbar/bt_ul.png);
127 135
}
128
.jstb_ol {
136

  
137
.jstb_ol:not(.toolbar-svg) {
129 138
    background-image: url(../images/jstoolbar/bt_ol.png);
130 139
}
131
.jstb_tl {
140

  
141
.jstb_tl:not(.toolbar-svg) {
132 142
    background-image: url(../images/jstoolbar/bt_tl.png);
133 143
}
134
.jstb_bq {
144

  
145
.jstb_bq:not(.toolbar-svg) {
135 146
    background-image: url(../images/jstoolbar/bt_bq.png);
136 147
}
137
.jstb_unbq {
148

  
149
.jstb_unbq:not(.toolbar-svg) {
138 150
    background-image: url(../images/jstoolbar/bt_bq_remove.png);
139 151
}
140
.jstb_pre {
152

  
153
.jstb_pre:not(.toolbar-svg) {
141 154
    background-image: url(../images/jstoolbar/bt_pre.png);
142 155
}
143
.jstb_precode {
156

  
157
.jstb_precode:not(.toolbar-svg) {
144 158
    background-image: url(../images/jstoolbar/bt_precode.png);
145 159
}
146
.jstb_link {
160

  
161
.jstb_link:not(.toolbar-svg) {
147 162
    background-image: url(../images/jstoolbar/bt_link.png);
148 163
}
149
.jstb_img {
164

  
165
.jstb_img:not(.toolbar-svg) {
150 166
    background-image: url(../images/jstoolbar/bt_img.png);
151 167
}
152
.jstb_table {
168

  
169
.jstb_table:not(.toolbar-svg) {
153 170
    background-image: url(../images/jstoolbar/bt_table.png);
154 171
}
155
.jstb_help {
172

  
173
.jstb_help:not(.toolbar-svg) {
156 174
    background-image: url(../images/help.png);
157 175
}
176

  
177
.toolbar-svg svg {
178
    fill: #666;
179
    margin-right: 4px;
180
}
181

  
182
button.toolbar-svg {
183
    color: #666;
184
    margin-right: 4px;
185
    padding-left: 1px;
186
}
187

  
188
.jstb_code.toolbar-svg::before {
189
    content: "C";
190
    font-size: 15px;
191
    font-weight: 700;
192
}
193

  
194
.jstb_h1.toolbar-svg::before {
195
    content: "H1";
196
    padding-left: 2px;
197
    font-size: 12px;
198
    font-weight: 700;
199
}
200

  
201
.jstb_h2.toolbar-svg::before {
202
    content: "H2";
203
    padding-left: 2px;
204
    font-size: 12px;
205
    font-weight: 700;
206
}
207

  
208
.jstb_h3.toolbar-svg::before {
209
    content: "H3";
210
    padding-left: 2px;
211
    font-size: 12px;
212
    font-weight: 700;
213
}
214

  
215
.jstb_pre.toolbar-svg::before {
216
    padding: 0px 0px 3px 0px;
217
    content: "pre";
218
    font-size: 12px;
219
    font-weight: 700;
220
}
221

  
158
-