Add loading via URL

[chordpro-web.git] / chordpro-web.js

diff --git a/chordpro-web.js b/chordpro-web.js
index 188646a6b65d9cbfc798a057875d487aceababa9..a37c833a451afb11c28ccc4b9768d60a37ad13c9 100644 (file)
--- a/chordpro-web.js
+++ b/chordpro-web.js
@@ -44,8 +44,9 @@ function renderChordpro(text) {
 
             // split line into parts on chords
             const parts = [];
-            line.split(/(\[[^\]]+\])/).forEach(part => parts.push(
-                part[0] == '[' ? html`<span class="chord">${part.slice(1, -1)}</span>` : part
+            line.split(/(\[[^\]]+\])/).forEach(part => parts.push(part[0] == '['
+                ? html`<span class="chord">${part.slice(1, -1)}</span>`
+                : (part ? html`<span class="text">${part}</span>` : null)
             ));
             verseHasChords ||= parts.length > 1;
             parts.push('\n')
@@ -56,4 +57,23 @@ function renderChordpro(text) {
     render(song, el_song);
 }
 
-document.getElementById('open').addEventListener('change', async ev => renderChordpro(await ev.target.files[0].text()));
+async function main() {
+    document.getElementById('open').addEventListener('change', async ev => renderChordpro(await ev.target.files[0].text()));
+
+    const params = new URLSearchParams(document.location.search);
+    const loadURL = params.get('l');
+    if (loadURL) {
+        try {
+            const response = await fetch(loadURL);
+            if (response.ok) {
+                renderChordpro(await response.text());
+            } else {
+                console.warn('Failed to fetch', loadURL, ':', response.status, response.statusText);
+            }
+        } catch (error) {
+            console.warn('Failed to fetch', loadURL, ':', error);
+        }
+    }
+}
+
+main();