Wikisource:JavaScript Développement/Outils Théâtre

La bibliothèque libre.
Sauter à la navigation Sauter à la recherche

Description[modifier]

Outils JavaScript dédiés au formatage des pièces de théâtre. Il a été enrichi par Hélène et par Matisk. Le code JavaScript est tiré d'un code pour le traitement du Trévoux.
Les outils créés seront présent dans la barre d'outils du mode Page uniquement. Les outils se placeront après l’icône Wynn.svg Modifier la casse qui se trouve à la section Avancé à la fin du groupe Format).
Il faudra sélectionner le texte à formater en premier puis l’outil correspondant.


Outils actuels[modifier]

Pour l'instant neuf outils sont représentés, ils reprennent les modèles suivants :
  • Small caps.svg : {{sc|sélection}} (Petites capitales)
  • Nowiki icon.png : place <nowiki /> suivi de deux retour chariot. À placer en haut de page pour éviter la fusion d'un paragraphe en page précédente avec le texte du haut de page (qui ont un style et un paragraphe distincts). Inutile lorsqu'un paragraphe se poursuit d'une page à l’autre.
  • Perso nu.svg : {{Personnage|sélection|c}} (Nom du personnage, en gras et centré)
Trois outils pour les didascalies : Icon-didascalie-gauche.pngIcon-didascalie-centre.pngIcon-didascalie-droite.png
  • Icon-didascalie-gauche.png : {{di|sélection|2}} (didascalie à gauche avec un alinéa de 2 quadratins)
  • Icon-didascalie-centre.png : {{di|sélection|c}} (didascalie centrée)
  • Icon-didascalie-droite.png : {{di|sélection|d|3}} (didascalie à droite avec un alinéa de 3 quadratins, utilisé pour le formatique des pièces de Shakespeare, traduites par F.-V. Hugo)
  • N in a Circle.png : {{refl}} (syntaxe créée : {{refl|NOTE|num=sélection}})
  • Crochets modèle tiret.png : {{tiret|sélection|suite-césure}} (césure en page précédente seulement)
  • ISO 639 Icon la.svg : {{lang|la|sélection}} (place le code pour permettre, à certains outils, une reconnaissance de la langue utilisée, ici la est pour le latin)
sélection représente la sélection de texte avant de cliquer sur le bouton correspondant.


Raccourcis[modifier]

Voir la discussion sur le Besoin n°7 : Améliorer l’interface d’édition.


Utilisation[modifier]

Navigateurs testés[modifier]

Des difficultés d’affichage existent sur certains navigateurs :
  • Mac OS (10.6, Snow Leopard) :
    • Firefox 12 : fonctionne très bien.
    • Safari 5 : fonctionne assez bien, peut-être parfois il faudra rafraîchir l’affichage.
    • Google Chrome 17 : quelques difficultés d’apparitions des icônes d'outils.
    • Les autres navigateurs n’ont pas été testé.
  • Windows 7 :
    • Internet Explorer 9 : fonctionne très bien.
    • Firefox 12 : semblent fonctionner.
    • Google Chrome 17 : semblent fonctionner.


Bogues rencontrés[modifier]

Si ce même code source, non fonctionnel, se trouve dans les autres pages de votre compte, l’affichage des outils se fera très épisodiques ou inexistants.


Intégration du code[modifier]

  1. Aller sur votre page Utilisateur:VOTRE-PSEUDONYME/common.js
  2. Copier-coller le code en fin de page.
  3. Enregistrer en cliquant sur Publier.
  4. Rafraîchir le navigateur en vidant le cache (c'est expliqué en haut de la page) : généralement majuscule-ctrl-R.
  5. Aller sur la page en cours d'édition en mode page uniquement. Il faudra faire un pré-enregistrement auparavant sur la page (si ce n'est déjà fait). C'est le moment, par exemple, de commencer à dégrossier le formatage en cliquant sur l’outil Toolbaricon regular T.png de correction de la mise en page et de la typographie. Valider puis publier.
  6. Rafraîchir le navigateur en vidant le cache (c'est expliqué en haut de la page) : généralement majuscule-ctrl-R.
  7. Si les icônes des outils n'apparaissent pas, refaire le point 6. Au bout de 3-4 tentatives, refaire le point 4 puis le point 6. Si cela ne fonctionne toujours pas, quitter le navigateur et refaire les points 4 et suivant.


//Boutons : (sc et latin), personnage, didascalie gauche, 
//centrée et à droite, note de fin de volume, 
//tiret de gestion entre deux page

if(typeof $ != 'undefined' && typeof $.fn.wikiEditor != 'undefined') {
  $(function() {
    $('#wpTextbox1').wikiEditor('addToToolbar', {
      section: 'advanced',
      group: 'format',
      tools: {
        'sc': {
          label: 'Small caps',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikipedia/commons/6/6e/Small_caps.svg?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: '{{sc|',
              peri: '',
              post: '}}',
              ownline: false
            }
          } 
        },
        'pe': {
          label: 'Perso',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikipedia/commons/e/eb/Perso_nu.svg?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "{{Personnage|",
              peri: '',
              post: "|c}}",
              ownline: false
            }
          }
        },
         'pe': {
          label: 'nowiki2',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikipedia/commons/8/82/Nowiki_icon.png?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "<nowiki />\n\n",
              peri: '',
              post: "",
              ownline: false
            }
          }
        },
        'di-g': {
          label: 'Didascalie gauche',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikisource/fr/b/b0/Icon-didascalie-gauche.png?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "::{{di|",
              peri: '',
              post: "}}",
              ownline: false
            }
          }
        },
        'di': {
          label: 'Didascalie centrée',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikisource/fr/8/86/Icon-didascalie-centre.png?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "{{di|",
              peri: '',
              post: "|c}}",
              ownline: false
            }
          }
        },
        'di-d': {
          label: 'Didascalie droite',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikisource/fr/c/c2/Icon-didascalie-droite.png?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "{{di|",
              peri: '',
              post: "|d|3}}",
              ownline: false
            }
          }
        },
         'note': {
          label: 'Note',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikipedia/commons/4/4b/N_in_a_Circle.png?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "{{refl|NOTE|num=",
              peri: '',
              post: "}}",
              ownline: false
            }
          }
        },
          'tiret': {
          label: 'Tiret',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikisource/fr/7/71/Crochets_mod%C3%A8le_tiret.png',
          action: {
            type: 'encapsulate',
            options: {
              pre: "{{tiret|",
              peri: '',
              post: "|}}",
              ownline: false
            }
          }
        },
         'la': {
          label: 'Latin',
          type: 'button',
          icon: 'http://upload.wikimedia.org/wikipedia/commons/0/04/ISO_639_Icon_la.svg?size=23px',
          action: {
            type: 'encapsulate',
            options: {
              pre: "''{{lang|la|",
              peri: '',
              post: "}}''",
              ownline: false
            }
          }
        },
      }
    });
  });
} else if (mwCustomEditButtons) {
 mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikipedia/commons/a/a2/SmallcapsButton.png",
    "speedTip": "small caps",
    "tagOpen": '{{sc|',
    "tagClose": '}}',
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikipedia/commons/e/eb/Perso_nu.svg",
    "speedTip": "personnage",
    "tagOpen": "{{Personnage|",
    "tagClose": "|c}}",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikipedia/commons/8/82/Nowiki_icon.png",
    "speedTip": "nowiki2",
    "tagOpen": "<nowiki />\n\n",
    "tagClose": "",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikisource/fr/b/b0/Icon-didascalie-gauche.png",
    "speedTip": "didascalie gauche",
    "tagOpen": "::{{di|",
    "tagClose": "}}",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikisource/fr/8/86/Icon-didascalie-centre.png",
    "speedTip": "didascalie centre",
    "tagOpen": "{{di|",
    "tagClose": "|c}}",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikisource/fr/c/c2/Icon-didascalie-droite.png",
    "speedTip": "didascalie droite",
    "tagOpen": "{{di|",
    "tagClose": "|d|3}}",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikipedia/commons/4/4b/N_in_a_Circle.png",
    "speedTip": "Note",
    "tagOpen": "{{refl|NOTE|num=",
    "tagClose": "}}",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikisource/fr/7/71/Crochets_mod%C3%A8le_tiret.png",
    "speedTip": "Tiret",
    "tagOpen": "{{tiret|",
    "tagClose": "|}}",
    "sampleText": ""};
mwCustomEditButtons[mwCustomEditButtons.length] = {
    "imageFile": "http://upload.wikimedia.org/wikipedia/commons/0/04/ISO_639_Icon_la.svg",
    "speedTip": "latin",
    "tagOpen": "''{{lang|la|",
    "tagClose": "}}''",
    "sampleText": ""};
}