$SEQUENCE_UI


harmonic sequence
editor
with text format

This JavaScript module handles transposable harmonic sequences for html pages.

Files to include in HTML file header
<link rel="stylesheet" href="css/music.min.css" />

<script src="libs/harmony-1.0.0.min.js"></script>
<script src="libs/sequence-ui-1.0.0.min.js"></script>

$SEQUENCE_UI Methods

Method Description
init() Builds all harmonic sequences found in html file.
updateTonality() Updates transposable harmonic sequences with given tonality.
buildSequencesFromList() Shows harmonic sequences from sequence list.
buildHarmonisation() Shows harmonisation in a given mode.

Exemples

Harmonic sequence format

Its an array of chord:

[ chord, chord, chord, ... ]

Chord format

Its an array of five fields:

[ degree, signature, notation, function, options ]

degree

The degree of chord is the degree in main tonality, "P1" stands for the fondamental.

Degree I #I bII II #II bbIII bIII III #III bIV IV #IV
Note C C# Db D D# Ebb Eb E E# Fb F F#
Code "P1" "A1" "m2" "M2" "A2" "D3" "m3" "M3" "A3" "D4" "P4" "A4"

Degree bV V #V bbVI bVI VI #VI bbVII bVII VII
Note Gb G G# Abb Ab A A# Bbb Bb B
Code "D5" "P5" "A5" "D6" "m6" "M6" "A6" "D7" "m7" "M7"

signature

notation

This is the degree notation in roman number.
En chiffre romain suivi optionnellement d'une barre / et du dégre relatif dans l'accord pour la basse en chiffre arabe. Exemples : "F" en C se note 'IV', "F/A" en C se note 'IV/3', "Fm/Ab" en Cm se note 'IV/3', "Fm/Ab" en C se note 'IVm/b3'.

function

T "T" Tonic degree I in fondamental state without sensible.
T "Ts" Tonic degree I in fondamental state with sensible.
T "t" Tonic degré I à l'état de renversement ou autre degré sans la sensible.
T "ts" Tonique degré I à l'état de renversement ou autre degré avec la sensible.
D "d" Dominante avec la sensible mais sans la quarte.
D "D" Dominante avec le triton tonal donc sensible et quarte.
D "Dst" substitution tritonique, subV7 ou bII7 avec quarte et sensible.
"D2" Dominante secondaire, V7/?.
"D2st" substitution tritonique de la dominante secondaire, subV7/?.
SD "SD" Sous-dominante.
SD² "SD2" Sous-dominante secondaire.

options

1 - Static sequence, data in div, non given tone

HTML
<div class="harmonic-sequence">
    ['P4','m','IV','SD'], ['P5','7','V7','D'], ['P1','m','I','T']
</div>

JavaScript
$SEQUENCE_UI.init({"tonality":"mG"});
['P4','m','IV','SD'], ['P5','7','V7','D'], ['P1','m','I','T']

Tone (degree I) is set by the given value in $SEQUENCE_UI.init({"tonality":"mG"}), here it's G.

2 - Static sequence, data in JavaScript variable, non given tone

HTML
<div id="sequence_1" class="harmonic-sequence"></div>

JavaScript
var sequence_1 = [['M2','m','II','SD'],['P5','','V','d'],['P1','','I','T']];
$SEQUENCE_UI.init({"tonality":"mG"});
['M2','m','II','SD'],['P5','','V','d'],['P1','','I','T']

Tone (degree I) is set by the given value in $SEQUENCE_UI.init({"tonality":"mG"}), here it's G.

3 - Static sequence, data in JavaScript variable, given tone D#

HTML
<div align="center">
    <div id="sequence_2" class="harmonic-sequence">D#</div>
</div>

JavaScript
var sequence_2 = sequence_1;
$SEQUENCE_UI.init({"tonality":"mG"});
D#

Tone (degree I) is set by the given value in <div>tone</div>, here it's D#.

4 - Transposable sequence, data in JavaScript variable, non given tone

HTML
<div id="sequence_3" class="harmonic-sequence transposable"></div>

JavaScript
var sequence_3 = [
    ['M2','7','II/V','D2'], ['P5','7','V7','D'], ['P1','M7','I','Ts']
];
$SEQUENCE_UI.init({"tonality":"mC#"});
C#

Tone (degree I) is initially set by the given value in $SEQUENCE_UI.init({"tonality":"mC#"}), here it's C#. It can be updated calling $SEQUENCE_UI.updateTonality(tonality).

$SEQUENCE_UI.updateTonality("MF");

5 - Transposable sequence, data in JavaScript variable, given tone Ab

HTML
<div id="sequence_4" class="harmonic-sequence transposable">Ab</div>

JavaScript
var sequence_4 = [
    ['P5','','V','d'],['P1','','I','T'],['P4','','IV','SD'],['P1','','I','T']
];
Ab

Tone (degree I) is initially set by the given value in $SEQUENCE_UI.init({"tonality":"MAb"}), here it's Ab. It can be updated calling $SEQUENCE_UI.updateTonality(tonality).

$SEQUENCE_UI.updateTonality("MF");
Ab

6 - Available chord notations


7 - Available function notations

Tonics

Dominants

Sub-Dominants

Secondary dominants

8 - Sequence rendered modes

var mySequence = [
    ['P1','','I','T'],['P1','7','V7/IV','D2'],['P4','','IV','SD'],['P5','','V','d'],
    ['P5','7','V7','D'],['M3','m','VI','t'],['M3','7','V7/II','D2'],['M2','m','II','SD'],
    ['M7','°7','VII°7','D'],['P1','','I','T']
];

Harmonic functions only: @

<div id="mySequence" class="harmonic-sequence">@</div>
@

Harmonic functions with degrees: !

<div id="mySequence" class="harmonic-sequence">!</div>
!

Harmonic functions with degrees and signatures: $

<div id="mySequence" class="harmonic-sequence">$</div>
$

Harmonic functions with degrees and colored signatures: $%

<div id="mySequence" class="harmonic-sequence">$%</div>
$%

Harmonic functions with degrees and chords: tone

<div id="mySequence" class="harmonic-sequence">A</div>
A

Harmonic functions with degrees and colored chords: tone%

<div id="mySequence" class="harmonic-sequence">A%</div>
A%