Tutoriel du format abc simplifié
avec la lib abc-ui-1.0.0.min.js

Les liens officiels

Les avantages de la lib abc-ui.js

La lib est utilisable directement dans une page html. Elle étend le format abc :

En supprimant les espaces et les tabs en début et fin de ligne.
En supprimant des instructions prisent en compte par défaut (X:1, L:1/1, K:C). Par défaut la lib ajoute les lignes :
```
X:1
L:1/1
K:C
```
Si l'on veut changer de timing de base il faut alors mettre L:?, pour changer la clef de do il faut ajouter K:?.
En ajoutant des notes colorées, pour une identification visuelle des notes importantes.
En ajoutant des flèches colorées, pour identifier les mouvements obligés.
En ajoutant des directives de structure de clef:
- %%piano, %%piano2, %%piano2C, %%piano2D, %%piano2CD.
- %%piano, %%piano4, %%piano4C, %%piano4D, %%piano4CD.

Le code html minimum

<!DOCTYPE html>
<html>
<head lang="fr">
    <meta charset="UTF-8">
    <title>Le minimum pour abc-ui</title>
    <link rel="stylesheet" href="http://dev.music.free.fr/web-music-tools/css/music.min.css" />
    <script src="http://dev.music.free.fr/web-music-tools/js/harmony-1.0.0.min.js"></script>
    <script src="http://dev.music.free.fr/web-music-tools/js/abc-ui-1.0.0.min.js"></script>
</head>
<body>
<h1>Le minimum pour avoir une partition avec abc-ui</h1>

<div class="abc-source">
    CDEFGABc |]
</div>

<script>
    $ABC_UI.init();
</script>
</body>
</html>

Lien : abc-ui-mini.html.

Introduction

Le nom des notes est celui de la notation anglaise : C do, D ré, E mi, F fa, G sol, A la, B si.

Le minimum

Par exemple pour avoir la gamme du do majeur avec abc-ui :

<div class="abc-source">CDEFGABc</div>

CDEFGABc

Plus besoin de commencer par X:1.
L: définit la durée de la note de base, celle qui est la plus utilisée dans la partition :

L:1/1 la ronde, valeur par défaut,
L:1/2 la blanche,
L:1/4 la noire,
L:1/8 la croche.

<div class="abc-source">
    L:1/2
    CDEFGABc
</div>

L:1/2 CDEFGABc

K: définit l'armure à la clef :

K:C par défaut,
C pour do majeur ou Am pour la mineur,
Cb pour do bémol majeur ou Abm pour la bémol mineur,
C# pour do dièse majeur ou A#m pour la dièse mineur.

<div class="abc-source">
    L:1/4
    K:Am
    A,B,CDEF^GA
</div

L:1/4 K:Am A,B,CDEF^GA

On peut transposer, par exemple pour une partition écrite en do majeur, on transpose en mi bémol majeur avec K:C shift=C_E.

<div class="abc-source">
    K:C shift=C_E
    CDEFGABc
</div

K:C shift=C_E CDEFGABc

La hauteur des notes

Les notes peuvent être en majuscule ou en minuscule, cela détermine l'octave.

On y ajoute une virgule après pour descendre d'une octave (C, C,, C,,,).
On y ajoute une apostrophe après pour monter d'une octave (c' c'' c''').

Exemple de l'ensemble des notes blanches du piano :

<div class="abc-source">
    L:1/4
    A,,,,B,,,, | C,,,D,,,E,,,F,,,G,,,A,,,B,,,| C,,D,,E,,F,,G,,A,,B,,|
    C,D,E,F,G,A,B, | CDEFGAB | cdefgab |
    c'd'e'f'g'a'b' | c''d''e''f''g''a''b'' | c''' |]
</div

Pour simplifier la lecture des notes basses et hautes, il est possible d'ajouter des indications sur les clefs :
[K:C bass_8], [K:C bass], [K:C treble] et [K:C treble^8].

<div class="abc-source">
    L:1/4
    K:C
[K:C bass_8] A,,,,B,,,, | C,,,D,,,E,,,F,,,G,,,A,,,B,,, | [K:C bass] C,,D,,E,,F,,G,,A,,B,, |
    C,D,E,F,G,A,B, | [K:C treble] CDEFGAB | cdefgab |
    c'd'e'f'g'a'b' | [K:C treble^8] c''d''e''f''g''a''b'' | c''' |]
</div

Les altérations

Pour altérer une note on ajoute devant la note :

(rien) pour ne pas avoir d'altération,
= pour le bécarre,
_ underscore pour le bémol,
__ double underscore pour le double bémol
^ exposant pour le dièse,
^^ double exposant pour le double dièse.

<div class="abc-source">
    __C _C =C ^C ^^C | __D _D =D ^D ^^D |
    __E _E =E ^E ^^E | __F _F =F ^F ^^F |
    __G _G =G ^G ^^G | __A _A =A ^A ^^A |
    __B _B =B ^B ^^B |]
</div

Les barres et les répétitions

Pour ajouter des barres on utilise ces caractères :

| une barre simple,
|| une double barre,
|] une barre de fin,
|: début de répétition,
:| fin de répétition,
|1 premiere fois,
:|2 deuxième fois.

<div class="abc-source">
    C/ |: D | E :| F || G | :A |1 B :|2 c/ |]
</div

Q:1/1=80 C/|:D|E:|F||G|:A|1B:|2c/|]

La durée des mesures

Pour indiquer le temps des mesures à la clef on ajoute M:

M:1/1, M:1/2, M:1/4, M:1/8 pour un temps,
M:2/1, M:2/2, M:2/4, M:2/8 pour deux temps,
M:3/1, M:3/2, M:3/4, M:3/8 pour trois temps,
M:4/1, M:4/2, M:4/4, M:4/8 pour quatre temps, par défaut.

<div class="abc-source">
    L:1/4
    [M:1/1] C4 | [M:1/2] D2 | [M:1/4] E | [M:1/8] F/ |
    [M:2/1] C4D4 | [M:2/2] E2F2 | [M:2/4] GA | [M:2/8] B/c/ |
    [M:3/1] C4D4E4 | [M:3/2] F2G2A2 | [M:3/4] Bcd | [M:3/8] C/D/E/ |
    [M:4/1] C4D4E4F4 | [M:4/2] G2A2B2c2 | [M:4/4] CDEF | [M:4/8] C/D/E/F/ |
    [M:none] C4 | DE | F/G/A/ | [M:C] CDEF |]
</div

L:1/4 [M:1/1] C4 | [M:1/2] D2 | [M:1/4] E | [M:1/8] F/ | [M:2/1] C4D4 | [M:2/2] E2F2 | [M:2/4] GA | [M:2/8] B/c/ | [M:3/1] C4D4E4 | [M:3/2] F2G2A2 | [M:3/4] Bcd | [M:3/8] C/D/E/ | [M:4/1] C4D4E4F4 | [M:4/2] G2A2B2c2 | [M:4/4] CDEF | [M:4/8] C/D/E/F/ | [M:none] C4 | DE | F/G/A/ | [M:C] CDEF |]

Le tempo

Pour indiquer le tempo (pour l'audio) on utilise Q:

Q:1/4=40 lent,
Q:1/4=80 deux fois plus rapide, (valeur par défaut)
Q:1/4=120 encore plus rapide.

<div class="abc-source">
    L:1/4
    Q:1/4=40
    M:4/4
    CDEF | GABc |]
</div

L:1/4 Q:1/4=40 M:4/4 CDEF | GABc |]

La durée des notes

Pour la durée, on l'ajoute après la note si nécessaire, si est ne correspond pas à la durée donnée par le L:? :

si la note à la durée du L, on ajoute rien,
si c'est plus long on ajoute 2 ou 4 ou 8 ou 16 selon la longueur,
si c'est plus court on ajoute / ou // ou /// selon la longueur.

la notion du L: est très importante car on écrire la même partition de plusieurs maniéres :

<div class="abc-source">
    T:A la ronde par défaut
    C/D/E/F/G/A/B/ |
</div

T:A la ronde par défaut C/D/E/F/G/A/B/ |

<div class="abc-source">
    T:A la blanche
    L:1/2
    CDEFGAB |
</div

T:A la blanche L:1/2 CDEFGAB |

<div class="abc-source">
    T:A la noire
    L:1/4
    C2D2E2F2G2A2B2 |
</div

T:A la noire L:1/4 C2D2E2F2G2A2B2 |

<div class="abc-source">
    T:Mélange
    L:1/2
    C2D3/2EF/G//A///B//// |
</div

T:Mélange L:1/2 C2D3/2EF/G//A///B//// |

Ajout de texte

Pourt ajouter du texte, devant la note on place le texte entre "". On peut avoir du texte au dessus en mettant devant un underscore : _"texte". On peut avoir du texte au dessous en mettant devant un ^ : ^"texte"/

<div class="abc-source">
    "do"C "ré"D "mi"E "fa"F "sol"G "la"A "si"B "do"c |]
</div

"do"C "ré"D "mi"E "fa"F "sol"G "la"A "si"B "do"c |]

<div class="abc-source">
    "_do"C "_ré"D "_mi"E "_fa"F "_sol"G "_la"A "_si"B "_do"c |]
</div

"_do"C "_ré"D "_mi"E "_fa"F "_sol"G "_la"A "_si"B "_do"c |]

<div class="abc-source">
    "^C""do"C "^D""ré"D "^E""mi"E "^F""fa"F "^G""sol"G "^A""la"A "^B""si"B "^C""do"c |]
</div

"^C""do"C "^D""ré"D "^E""mi"E "^F""fa"F "^G""sol"G "^A""la"A "^B""si"B "^C""do"c |]

<div class="abc-source">
    "do"C "ré"D "mi"E "fa"F "sol"G "la"A "si"B "do"c |]
    w:C D E F G A B C
</div

"do"C "ré"D "mi"E "fa"F "sol"G "la"A "si"B "do"c |] w:C D E F G A B C

Pour plus de lisibilité on peut utiliser des voix avec une voix de texte :

<div class="abc-source">
    %%score (N 1)
    [V:N] "do"x "ré"x "mi"x "fa"x "sol"x "la"x "si"x "do"x |]
    [V:1] C D E F G A B c |]
    w:C D E F G A B C
</div

%%score (N 1) [N:t] "do"x "ré"x "mi"x "fa"x "sol"x "la"x "si"x "do"x |] [V:1] C D E F G A B c |] w:C D E F G A B C

Les accords

Pour regrouper des notes on les mets entre crochets. Le crochet de clôture peut être suivi de la durée comme pour une note. Au lieu de [C2E2G2] on écrira [CEG]2.

<div class="abc-source">
    L:1/4
    [C2E2G2] | [CEG]2 | [CEG]-[CEG] | [C2EG][EG] | [CEG][CEG]/[CEG]/ |]
</div

On peut ajouter une voix pour le nom des accords :

<div class="abc-source">
    K:Cm
    %%score (c 1)
    [V:c] "Cm7"x  | "DØ7"x | "Eb+M7"x | "Fm7"x | "G7"x   | "AbM7"x | "B°7"x  |]
    [V:1] [CEG=B] | [DFAc] | [EG=Bd]  | [FAce] | [G=Bdf] | [Aceg]  | [=Bdfa] |]
    w:I II bIII IV V bVI VII
</div

On peut ajouter une voix pour les degrés :

<div class="abc-source">
    %%score (d c 1)
    [V:c] "Cm7"x | "Dm7"x | "Em7"x | "FM7"x | "G7"x  | "Am7"x | "BØ7"x |]
    [V:d] "I"x   | "II"x  | "III"x | "IV"x  | "V"x   | "VI"x  | "VII"x |]
    [V:1] [CEGB] | [DFAc] | [EGBd] | [FAce] | [GBdf] | [Aceg] | [Bdfa] |]
</div

%%score (d c 1) [V:c] "Cm7"x | "Dm7"x | "Em7"x | "FM7"x | "G7"x | "Am7"x | "BØ7"x |] [V:d] "I"x | "II"x | "III"x | "IV"x | "V"x | "VI"x | "VII"x |] [V:1] [CEGB] | [DFAc] | [EGBd] | [FAce] | [GBdf] | [Aceg] | [Bdfa] |]

Tutoriel du format abc simplifiéavec la lib abc-ui-1.0.0.min.js