Initial commit

src/App.ts

@@ -0,0 +1,94 @@
+import { get_chord_sheet_html } from "./Editor.js";
+
+window.onload = () => {
+    const chord_sheet_html = get_chord_sheet_html(`
+Intro : CM7 
+
+CM7           Em7 Dm7           FM7 CM7 
+Quand le jazz est quand le jazz est là
+CM7     Em7  Dm7     FM7 Em7 
+La java s'en la java s'en va
+FM7          F7        Em7 
+Il y a de l'orage dans l'air
+          Em6        Dm7   
+Il y a de l'eau dans le...
+CM7       Em7 Dm7         G7 C6 
+Gaz entre le  jazz et la  ja-va
+
+Cm                 Fm6            Cm            Bb9 
+Chaque jour un peu plus il y a le jazz qui s'installe
+Cm               Fm6        Cm         AbM7 
+Alors la rage au coeur la java fait la malle
+Bb7                    Eb             Bb7     Eb 
+Ses p'tit' fesses en bataille sous sa jupe fendue
+G7/b9             Cm            G7 Cm   G7 Cm 
+Elle écrase sa gauloise et s'en va dans la rue
+
+CM7           Em7 Dm7           FM7 CM7 
+Quand le jazz est quand le jazz est là
+CM7     Em7  Dm7     FM7 Em7 
+La java s'en la java s'en va
+FM7          F7        Em7 
+Il y a de l'orage dans l'air
+          Em6        Dm7   
+Il y a de l'eau dans le...
+CM7       Em7 Dm7         G7 C6 
+Gaz entre le  jazz et la  ja-va
+
+Cm               Fm6     Cm         Bb9
+Quand j'écoute béat un solo de batt'rie
+Cm               Fm6         Cm      AbM7
+V'la la java qui râle au nom de la patrie
+Bb7                  Eb       Bb7   Eb
+Mais quand je crie bravo à l'accordéoniste
+G7/b9                 Cm               G7   Cm G7 Cm
+C'est le jazz qui m'engueule en me traitant de ra-ciste
+
+CM7           Em7 Dm7           FM7 CM7 
+Quand le jazz est quand le jazz est là
+CM7     Em7  Dm7     FM7 Em7 
+La java s'en la java s'en va
+FM7          F7        Em7 
+Il y a de l'orage dans l'air
+          Em6        Dm7   
+Il y a de l'eau dans le...
+CM7       Em7 Dm7         G7 C6 
+Gaz entre le  jazz et la  ja-va
+
+Cm                 Fm6         Cm        Bb9
+Pour moi jazz et java c'est du pareil au même
+Cm                  Fm6            Cm       AbM7
+Je m'saoule à la Bastille et m'noircis à Harlem
+Bb7                Eb         Bb7             Eb
+Pour moi jazz et java dans le fond c'est tout comme
+G7/b9                 Cm        G7 Cm   G7 Cm
+Quand le jazz dit "go men" la java dit "go home"
+
+CM7           Em7 Dm7           FM7 CM7 
+Quand le jazz est quand le jazz est là
+CM7     Em7  Dm7     FM7 Em7 
+La java s'en la java s'en va
+FM7          F7        Em7 
+Il y a de l'orage dans l'air
+          Em6        Dm7   
+Il y a de l'eau dans le...
+CM7       Em7 Dm7         G7 C6 
+Gaz entre le  jazz et la  ja-va
+
+Cm             Fm6           Cm         Bb9
+Jazz et java copains ça doit pouvoir se faire
+Cm                    Fm6         Cm         AbM7
+Pour qu'il en soit ainsi tiens je partage en frère
+Bb7                  Eb            Bb7        Eb
+Je donne au jazz mes pieds pour marquer le tempo
+G7/b9              Cm     G7                       Cm 
+Et je donne à la java mes mains pour le bas de son dos
+G7/b9              Cm                       G7     Cm CmM7 
+Et je donne à la java mes mains pour le bas de son dos
+
+`);
+    document.getElementById("chord_sheet").innerHTML = chord_sheet_html;
+    document.getElementsByClassName("chord")
+    console.log(chord_sheet_html);
+};
+

src/Editor.js.ts

@@ -0,0 +1,91 @@
+
+import { chordParserFactory, chordRendererFactory } from "../node_modules/chord-symbol/lib/chord-symbol.js"
+import { Chord } from "../node_modules/chord-symbol/types"
+
+class ChordNotation {
+    chord: Chord;
+    spaces_before: number;
+
+    constructor(chord: Chord, spaces_before: number) {
+        this.chord = chord;
+        this.spaces_before = spaces_before;
+    }
+}
+
+class Line {
+    lyrics: string = "";
+    chords: ChordNotation[] = [];
+
+    is_empty(): boolean {
+        return this.lyrics == "" && this.chords.length == 0;
+    }
+}
+
+class Sheet {
+    lines: Line[] = [];
+}
+
+function render_sheet(sheet: Sheet, renderChord:any): string {
+    let result = "<div><p>";
+    for (let line of sheet.lines) {
+        let rendered_line = ''
+        if (line.is_empty()) {
+            rendered_line = "</p><p>"
+        } else {
+            if (line.lyrics != "") {
+                rendered_line = line.lyrics;
+            } else if (line.chords.length > 0) {
+                for (let chord of line.chords) {
+                    rendered_line += "&nbsp;".repeat(chord.spaces_before) + render_chord(chord.chord, renderChord)
+                }
+            }
+            rendered_line += "<br/>"
+        }
+        result += rendered_line
+    }
+    result += "</p></div>";
+    return result
+}
+
+function render_chord(chord: Chord, renderer:any): string {
+    return "<span class='chord' style='cursor: pointer;'>" + renderer(chord) + "</span>"
+}
+
+export function get_chord_sheet_html(normalized_txt: string): string {
+    const parseChord = chordParserFactory();
+    const renderChord = chordRendererFactory({ useShortNamings: true });
+
+    const lines = normalized_txt.split("\n")
+    let sheet = new Sheet();
+    for (const line of lines) {
+        const words = line.split(' ');
+
+        let sheet_line = new Line();
+        if (words.length > 1 || words[0] == '') {
+            let space_before_chord = 0;
+            for (const word of words) {
+                if (word != '') {
+                    if (space_before_chord > 0 || sheet_line.chords.length > 0) {
+                        space_before_chord++;
+                    }
+                    const chord = parseChord(word);
+                    if (chord.error) {
+                        sheet_line.lyrics = line.replace(' ', "&nbsp;");
+                        break;
+                    } else {
+                        sheet_line.chords.push(new ChordNotation(chord, space_before_chord));
+                        space_before_chord = 0;
+                    }
+                } else {
+                    space_before_chord++;
+                }
+            }
+        }
+        if (sheet_line.is_empty() && (sheet.lines.length == 0 || sheet.lines[sheet.lines.length - 1].is_empty())) {
+            continue
+        }
+        sheet.lines.push(sheet_line)
+    }
+    console.log(sheet)
+    return render_sheet(sheet, renderChord)
+}

src/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8" />
+        <title>Webpack App</title>
+    </head>
+    <body>
+        <h1>Hello world!</h1>
+        <h2>Tip: Check your console</h2>
+        <div id="chord_sheet" style="font-family: monospace;"></div>
+        <script type="module" src="App.ts"></script>
+    </body>
+    
+</html>