source: spip-zone/_core_/plugins/porte_plume/barre_outils/edition.php

Last change on this file was 123057, checked in by b_b, 4 months ago

icones svg pour le porte plume (!1)

Icône svg un peu plus fidèle à l'ancienne

Tant qu'à faire, une mignonnette icône en svg + les crédits dans paquet.xml

Changement pour l'italique : i → I. Finitions dans le CSS. On supprime les vieux png, remplacés par les svg.

Fallback pour les variables CSS

«G» pour gras, «T» pour intertitres, couleur espace privé en amélioration progressive, handle en svg aussi

Crédits pour certaines icônes

Màj icônes et réorganisation du fichier.

Optimisation svg

svg avec les textes transformés en chemins

un premier jet, à affiner

Co-authored-by: Charles Razack <tcharlss@…>

File size: 15.8 KB
Line 
1<?php
2/**
3 * Déclaration de la barre d'outil d'édition de SPIP
4 *
5 * @plugin Porte Plume pour SPIP
6 * @license GPL
7 * @package SPIP\PortePlume\BarreOutils
8 */
9if (!defined('_ECRIRE_INC_VERSION')) {
10        return;
11}
12
13
14/**
15 * Définition de la barre 'edition' pour markitup
16 *
17 * @return Barre_outils La barre d'outil
18 */
19function barre_outils_edition() {
20        $set = new Barre_outils(array(
21                'nameSpace' => 'edition',
22                #'previewAutoRefresh'=> true,
23                #'previewParserPath' => url_absolue(generer_url_public('preview')),
24                'onShiftEnter' => array('keepDefault' => false, 'replaceWith' => "\n_ "),
25                'onCtrlEnter' => array('keepDefault' => false, 'replaceWith' => "\n\n"),
26                // garder les listes si on appuie sur entree
27                'onEnter' => array('keepDefault' => false, 'selectionType' => 'return', 'replaceWith' => "\n"),
28                // Utile quand on saisi du code, mais pas accessible !
29                #'onTab'             => array('keepDefault'=>false, 'replaceWith'=>"\t"),
30                'markupSet' => array(
31                        // H1 - {{{
32                        array(
33                                'id' => 'header1',
34                                'name' => _T('barreoutils:barre_intertitre'),
35                                'key' => 'H',
36                                'className' => 'outil_header1',
37                                'openWith' => "\n{{{",
38                                'closeWith' => "}}}\n",
39                                'display' => true,
40                                'selectionType' => 'line',
41                        ),
42                        // Bold - {{
43                        array(
44                                'id' => 'bold',
45                                'name' => _T('barreoutils:barre_gras'),
46                                'key' => 'B',
47                                'className' => 'outil_bold',
48                                'replaceWith' => "function(h){ return espace_si_accolade(h, '{{', '}}');}",
49                                //"openWith" => "{{",
50                                //"closeWith" => "}}",
51                                'display' => true,
52                                'selectionType' => 'word',
53                        ),
54                        // Italic - {
55                        array(
56                                'id' => 'italic',
57                                'name' => _T('barreoutils:barre_italic'),
58                                'key' => 'I',
59                                'className' => 'outil_italic',
60                                'replaceWith' => "function(h){ return espace_si_accolade(h, '{', '}');}",
61                                //"openWith" => "{",
62                                //"closeWith" => "}",
63                                'display' => true,
64                                'selectionType' => 'word',
65                        ),
66
67                        // montrer une suppression
68                        array(
69                                'id' => 'stroke_through',
70                                'name' => _T('barreoutils:barre_barre'), // :-)
71                                'className' => 'outil_stroke_through',
72                                'openWith' => '<del>',
73                                'closeWith' => '</del>',
74                                'display' => true,
75                                'selectionType' => 'word',
76                        ),
77
78                        // listes -*
79                        array(
80                                'id' => 'liste_ul',
81                                'name' => _T('barreoutils:barre_liste_ul'),
82                                'className' => 'outil_liste_ul',
83                                'replaceWith' => "function(h){ return outil_liste(h, '*');}",
84                                'display' => true,
85                                'selectionType' => 'line',
86                                'forceMultiline' => true,
87                                'dropMenu' => array(
88                                        // liste -#
89                                        array(
90                                                'id' => 'liste_ol',
91                                                'name' => _T('barreoutils:barre_liste_ol'),
92                                                'className' => 'outil_liste_ol',
93                                                'replaceWith' => "function(h){ return outil_liste(h, '#');}",
94                                                'display' => true,
95                                                'selectionType' => 'line',
96                                                'forceMultiline' => true,
97                                        ),
98                                        // desindenter
99                                        array(
100                                                'id' => 'desindenter',
101                                                'name' => _T('barreoutils:barre_desindenter'),
102                                                'className' => 'outil_desindenter',
103                                                'replaceWith' => 'function(h){return outil_desindenter(h);}',
104                                                'display' => true,
105                                                'selectionType' => 'line',
106                                                'forceMultiline' => true,
107                                        ),
108                                        // indenter
109                                        array(
110                                                'id' => 'indenter',
111                                                'name' => _T('barreoutils:barre_indenter'),
112                                                'className' => 'outil_indenter',
113                                                'replaceWith' => 'function(h){return outil_indenter(h);}',
114                                                'display' => true,
115                                                'selectionType' => 'line',
116                                                'forceMultiline' => true,
117                                        ),
118                                ),
119                        ),
120                        // separation
121                        array(
122                                'id' => 'sepLink', // trouver un nom correct !
123                                'separator' => '---------------',
124                                'display' => true,
125                        ),
126                        // lien spip
127                        array(
128                                'id' => 'link',
129                                'name' => _T('barreoutils:barre_lien'),
130                                'key' => 'L',
131                                'className' => 'outil_link',
132                                'openWith' => '[',
133                                'closeWith' => '->[![' . _T('barreoutils:barre_lien_input') . ']!]]',
134                                'display' => true,
135                        ),
136                        // note en bas de page spip
137                        array(
138                                'id' => 'notes',
139                                'name' => _T('barreoutils:barre_note'),
140                                'className' => 'outil_notes',
141                                'openWith' => '[[',
142                                'closeWith' => ']]',
143                                'display' => true,
144                                'selectionType' => 'word',
145                        ),
146                        // separation
147                        array(
148                                'id' => 'sepGuillemets',
149                                'separator' => '---------------',
150                                'display' => true,
151                        ),
152                        // quote spip
153                        // (affichee dans forum)
154                        array(
155                                'id' => 'quote',
156                                'name' => _T('barreoutils:barre_quote'),
157                                'key' => 'Q',
158                                'className' => 'outil_quote',
159                                'openWith' => "\n<quote>",
160                                'closeWith' => "</quote>\n",
161                                'display' => true,
162                                'selectionType' => 'word',
163                                'dropMenu' => array(
164                                        // poesie spip
165                                        array(
166                                                'id' => 'barre_poesie',
167                                                'name' => _T('barreoutils:barre_poesie'),
168                                                'className' => 'outil_poesie',
169                                                'openWith' => "\n&lt;poesie&gt;",
170                                                'closeWith' => "&lt;/poesie&gt;\n",
171                                                'display' => true,
172                                                'selectionType' => 'line',
173                                        ),
174                                ),
175                        ),
176                        // guillemets
177                        array(
178                                'id' => 'guillemets',
179                                'name' => _T('barreoutils:barre_guillemets'),
180                                'className' => 'outil_guillemets',
181                                'openWith' => '&laquo;',
182                                'closeWith' => '&raquo;',
183                                'display' => true,
184                                'lang' => array('fr', 'eo', 'cpf', 'ar', 'es'),
185                                'selectionType' => 'word',
186                                'dropMenu' => array(
187                                        // guillemets internes
188                                        array(
189                                                'id' => 'guillemets_simples',
190                                                'name' => _T('barreoutils:barre_guillemets_simples'),
191                                                'className' => 'outil_guillemets_simples',
192                                                'openWith' => '&ldquo;',
193                                                'closeWith' => '&rdquo;',
194                                                'display' => true,
195                                                'lang' => array('fr', 'eo', 'cpf', 'ar', 'es'),
196                                                'selectionType' => 'word',
197                                        ),
198                                )
199                        ),
200                        // guillemets de
201                        array(
202                                'id' => 'guillemets_de',
203                                'name' => _T('barreoutils:barre_guillemets'),
204                                'className' => 'outil_guillemets_de',
205                                'openWith' => '&bdquo;',
206                                'closeWith' => '&ldquo;',
207                                'display' => true,
208                                'lang' => array('bg', 'de', 'pl', 'hr', 'src'),
209                                'selectionType' => 'word',
210                                'dropMenu' => array(
211                                        // guillemets de, simples
212                                        array(
213                                                'id' => 'guillemets_de_simples',
214                                                'name' => _T('barreoutils:barre_guillemets_simples'),
215                                                'className' => 'outil_guillemets_de_simples',
216                                                'openWith' => '&sbquo;',
217                                                'closeWith' => '&lsquo;',
218                                                'display' => true,
219                                                'lang' => array('bg', 'de', 'pl', 'hr', 'src'),
220                                                'selectionType' => 'word',
221                                        ),
222                                )
223                        ),
224
225                        // guillemets autres langues
226                        array(
227                                'id' => 'guillemets_autres',
228                                'name' => _T('barreoutils:barre_guillemets'),
229                                'className' => 'outil_guillemets_simples',
230                                'openWith' => '&ldquo;',
231                                'closeWith' => '&rdquo;',
232                                'display' => true,
233                                'lang_not' => array('fr', 'eo', 'cpf', 'ar', 'es', 'bg', 'de', 'pl', 'hr', 'src'),
234                                'selectionType' => 'word',
235                                'dropMenu' => array(
236                                        // guillemets simples, autres langues
237                                        array(
238                                                'id' => 'guillemets_autres_simples',
239                                                'name' => _T('barreoutils:barre_guillemets_simples'),
240                                                'className' => 'outil_guillemets_uniques',
241                                                'openWith' => '&lsquo;',
242                                                'closeWith' => '&rsquo;',
243                                                'display' => true,
244                                                'lang_not' => array('fr', 'eo', 'cpf', 'ar', 'es', 'bg', 'de', 'pl', 'hr', 'src'),
245                                                'selectionType' => 'word',
246                                        ),
247                                )
248                        ),
249                        // separation
250                        array(
251                                'id' => 'sepCaracteres',
252                                'separator' => '---------------',
253                                'display' => true,
254                        ),
255                        // icones clavier
256                        array(
257                                'id' => 'grpCaracteres',
258                                'name' => _T('barreoutils:barre_inserer_caracteres'),
259                                'className' => 'outil_caracteres',
260                                'display' => true,
261                                'dropMenu' => array(
262                                        // A majuscule accent grave
263                                        array(
264                                                'id' => 'A_grave',
265                                                'name' => _T('barreoutils:barre_a_accent_grave'),
266                                                'className' => 'outil_a_maj_grave',
267                                                'replaceWith' => '&Agrave;',
268                                                'display' => true,
269                                                'lang' => array('fr', 'eo', 'cpf'),
270                                        ),
271                                        // E majuscule accent aigu
272                                        array(
273                                                'id' => 'E_aigu',
274                                                'name' => _T('barreoutils:barre_e_accent_aigu'),
275                                                'className' => 'outil_e_maj_aigu',
276                                                'replaceWith' => '&Eacute;',
277                                                'display' => true,
278                                                'lang' => array('fr', 'eo', 'cpf'),
279                                        ),
280                                        // E majuscule accent grave
281                                        array(
282                                                'id' => 'E_grave',
283                                                'name' => _T('barreoutils:barre_e_accent_grave'),
284                                                'className' => 'outil_e_maj_grave',
285                                                'replaceWith' => '&Egrave;',
286                                                'display' => true,
287                                                'lang' => array('fr', 'eo', 'cpf'),
288                                        ),
289                                        // e dans le a
290                                        array(
291                                                'id' => 'aelig',
292                                                'name' => _T('barreoutils:barre_ea'),
293                                                'className' => 'outil_aelig',
294                                                'replaceWith' => '&aelig;',
295                                                'display' => true,
296                                                'lang' => array('fr', 'eo', 'cpf'),
297                                        ),
298                                        // e dans le a majuscule
299                                        array(
300                                                'id' => 'AElig',
301                                                'name' => _T('barreoutils:barre_ea_maj'),
302                                                'className' => 'outil_aelig_maj',
303                                                'replaceWith' => '&AElig;',
304                                                'display' => true,
305                                                'lang' => array('fr', 'eo', 'cpf'),
306                                        ),
307                                        // oe
308                                        array(
309                                                'id' => 'oe',
310                                                'name' => _T('barreoutils:barre_eo'),
311                                                'className' => 'outil_oe',
312                                                'replaceWith' => '&oelig;',
313                                                'display' => true,
314                                                'lang' => array('fr'),
315                                        ),
316                                        // OE
317                                        array(
318                                                'id' => 'OE',
319                                                'name' => _T('barreoutils:barre_eo_maj'),
320                                                'className' => 'outil_oe_maj',
321                                                'replaceWith' => '&OElig;',
322                                                'display' => true,
323                                                'lang' => array('fr'),
324                                        ),
325                                        // c cedille majuscule
326                                        array(
327                                                'id' => 'Ccedil',
328                                                'name' => _T('barreoutils:barre_c_cedille_maj'),
329                                                'className' => 'outil_ccedil_maj',
330                                                'replaceWith' => '&Ccedil;',
331                                                'display' => true,
332                                                'lang' => array('fr', 'eo', 'cpf'),
333                                        ),
334                                        // Transformation en majuscule
335                                        array(
336                                                'id' => 'uppercase',
337                                                'name' => _T('barreoutils:barre_gestion_cr_changercassemajuscules'),
338                                                'className' => 'outil_uppercase',
339                                                'replaceWith' => 'function(markitup) { return markitup.selection.toUpperCase() }',
340                                                'display' => true,
341                                                'lang' => array('fr', 'en'),
342                                        ),
343                                        // Transformation en minuscule
344                                        array(
345                                                'id' => 'lowercase',
346                                                'name' => _T('barreoutils:barre_gestion_cr_changercasseminuscules'),
347                                                'className' => 'outil_lowercase',
348                                                'replaceWith' => 'function(markitup) { return markitup.selection.toLowerCase() }',
349                                                'display' => true,
350                                                'lang' => array('fr', 'en'),
351                                        ),
352                                ),
353                        ),
354
355                        // Groupe de Codes informatiques.
356                        array(
357                                'id' => 'sepCode',
358                                'separator' => '---------------',
359                                'display' => true,
360                        ),
361                        array(
362                                // groupe code et bouton <code>
363                                'id' => 'grpCode',
364                                'name' => _T('barreoutils:barre_inserer_code'),
365                                'className' => 'outil_code',
366                                'openWith' => '<code>',
367                                'closeWith' => '</code>',
368                                'display' => true,
369                                'dropMenu' => array(
370                                        // bouton <cadre>
371                                        array(
372                                                'id' => 'cadre',
373                                                'name' => _T('barreoutils:barre_inserer_cadre'),
374                                                'className' => 'outil_cadre',
375                                                'openWith' => "<cadre>\n",
376                                                'closeWith' => "\n</cadre>",
377                                                'display' => true,
378                                        ),
379                                ),
380                        ),
381
382                        /*      inutile (origine de markitup et non de spip)
383
384                                                // separation
385                                                array(
386                                                        "id" => "sepPreview", // trouver un nom correct !
387                                                        "separator" => "---------------",
388                                                        "display"   => true,
389                                                ),
390                                                // clean
391                                                array(
392                                                        "id"          => 'clean',
393                                                        "name"        => _T('barreoutils:barre_clean'),
394                                                        "className"   => "outil_clean",
395                                                        "replaceWith" => 'function(markitup) { return markitup.selection.replace(/<(.*?)>/g, "") }',
396                                                        "display"     => true,
397                                                ),
398                                                // preview
399                                                array(
400                                                        "id"        => 'preview',
401                                                        "name"      => _T('barreoutils:barre_preview'),
402                                                        "className" => "outil_preview",
403                                                        "call"      => "preview",
404                                                        "display"   => true,
405                                                ),
406                        */
407
408                ),
409
410                'functions' => "
411                                // remplace ou cree -* ou -** ou -# ou -##
412                                function outil_liste(h, c) {
413                                        if ((s = h.selection) && (r = s.match(/^-([*#]+) (.*)\$/)))      {
414                                                r[1] = r[1].replace(/[#*]/g, c);
415                                                s = '-'+r[1]+' '+r[2];
416                                        } else {
417                                                s = '-' + c + ' '+s;
418                                        }
419                                        return s;
420                                }
421
422                                // indente des -* ou -#
423                                function outil_indenter(h) {
424                                        if (s = h.selection) {
425                                                if (s.substr(0,2)=='-*') {
426                                                        s = '-**' + s.substr(2);
427                                                } else if (s.substr(0,2)=='-#') {
428                                                        s = '-##' + s.substr(2);
429                                                } else {
430                                                        s = '-* ' + s;
431                                                }
432                                        }
433                                        return s;
434                                }
435
436                                // desindente des -* ou -** ou -# ou -##
437                                function outil_desindenter(h){
438                                        if (s = h.selection) {
439                                                if (s.substr(0,3)=='-**') {
440                                                        s = '-*' + s.substr(3);
441                                                } else if (s.substr(0,3)=='-* ') {
442                                                        s = s.substr(3);
443                                                } else if (s.substr(0,3)=='-##') {
444                                                        s = '-#' + s.substr(3);
445                                                } else if (s.substr(0,3)=='-# ') {
446                                                        s = s.substr(3);
447                                                }
448                                        }
449                                        return s;
450                                }
451
452                                // ajouter un espace avant, apres un {qqc} pour ne pas que
453                                // gras {{}} suivi de italique {} donnent {{{}}}, mais { {{}} }
454                                function espace_si_accolade(h, openWith, closeWith){
455                                        if (s = h.selection) {
456                                                // accolade dans la selection
457                                                if (s.charAt(0)=='{') {
458                                                        return openWith + ' ' + s + ' ' + closeWith;
459                                                }
460                                                // accolade avant la selection
461                                                else if (c = h.textarea.selectionStart) {
462                                                        if (h.textarea.value.charAt(c-1) == '{') {
463                                                                return ' ' + openWith + s + closeWith + ' ';
464                                                        }
465                                                }
466                                        }
467                                        return openWith + s + closeWith;
468                                }
469                                ",
470        ));
471
472        $set->cacher(array(
473                'stroke_through',
474                'clean',
475                'preview',
476        ));
477
478        return $set;
479}
480
481
482/**
483 * Définitions des liens entre css et icones
484 *
485 * @return array
486 *     Couples identifiant de bouton => nom de l'image (ou tableau nom, position haut, position bas)
487 */
488function barre_outils_edition_icones() {
489        return array(
490                //'outil_header1' => 'text_heading_1.png',
491                'outil_header1' => array('spt-v1.svg', '-2px -2px'), //'intertitre.png'
492                'outil_bold' => array('spt-v1.svg', '-2px -22px'), //'text_bold.png'
493                'outil_italic' => array('spt-v1.svg', '-2px -42px'), //'text_italic.png'
494
495                'outil_stroke_through' => array('spt-v1.svg', '-2px -62px'), //'text_strikethrough.png'
496
497                'outil_liste_ul' => array('spt-v1.svg', '-2px -442px'), //'text_list_bullets.png'
498                'outil_liste_ol' => array('spt-v1.svg', '-2px -462px'), //'text_list_numbers.png'
499                'outil_indenter' => array('spt-v1.svg', '-2px -482px'), //'text_indent.png'
500                'outil_desindenter' => array('spt-v1.svg', '-2px -502px'), //'text_indent_remove.png'
501
502                //'outil_quote' => 'text_indent.png',
503                'outil_quote' => array('spt-v1.svg', '-2px -302px'), //'quote.png'
504                'outil_poesie' => array('spt-v1.svg', '-2px -322px'), //'poesie.png'
505
506                //'outil_link' => 'world_link.png',
507                'outil_link' => array('spt-v1.svg', '-2px -342px'), //'lien.png'
508                'outil_notes' => array('spt-v1.svg', '-2px -362px'), //'notes.png'
509
510
511                'outil_guillemets' => array('spt-v1.svg', '-2px -522px'), //'guillemets.png'
512                'outil_guillemets_simples' => array('spt-v1.svg', '-2px -542px'), //'guillemets-simples.png'
513                'outil_guillemets_de' => array('spt-v1.svg', '-2px -562px'), //'guillemets-de.png'
514                'outil_guillemets_de_simples' => array('spt-v1.svg', '-2px -582px'), //'guillemets-uniques-de.png'
515                'outil_guillemets_uniques' => array('spt-v1.svg', '-2px -602px'), //'guillemets-uniques.png'
516
517                'outil_caracteres' => array('spt-v1.svg', '-2px -282px'), //'keyboard.png'
518                'outil_a_maj_grave' => array('spt-v1.svg', '-2px -162px'), //'agrave-maj.png'
519                'outil_e_maj_aigu' => array('spt-v1.svg', '-2px -202px'), //'eacute-maj.png'
520                'outil_e_maj_grave' => array('spt-v1.svg', '-2px -222px'), //'eagrave-maj.png'
521                'outil_aelig' => array('spt-v1.svg', '-2px -142px'), //'aelig.png'
522                'outil_aelig_maj' => array('spt-v1.svg', '-2px -122px'), //'aelig-maj.png'
523                'outil_oe' => array('spt-v1.svg', '-2px -262px'), //'oelig.png'
524                'outil_oe_maj' => array('spt-v1.svg', '-2px -242px'), //'oelig-maj.png'
525                'outil_ccedil_maj' => array('spt-v1.svg', '-2px -182px'),  //'ccedil-maj.png'
526                'outil_uppercase' => array('spt-v1.svg', '-2px -82px'), //'text_uppercase.png'
527                'outil_lowercase' => array('spt-v1.svg', '-2px -102px'), //'text_lowercase.png'
528
529                'outil_code' => array('spt-v1.svg', '-2px -382px'),
530                'outil_cadre' => array('spt-v1.svg', '-2px -402px'),
531
532                'outil_clean' => array('spt-v1.svg', '-2px -422px'), //'clean.png'
533                'outil_preview' => array('spt-v1.svg', '-2px -622px'), //'eye.png'
534        );
535}
Note: See TracBrowser for help on using the repository browser.