Spaces:

k-l-lambda
/

LilyScript

Running

k-l-lambda commited on 2 days ago

Commit

cc88aa8

1 Parent(s): b2172ef

added author line.

Files changed (3) hide show

app.py CHANGED Viewed

@@ -443,16 +443,12 @@ def build_head ():
 _JS_HELPERS = '''
 function () {
-	// poll until the score player + its #ls-score mount exist, then mount once.
-	const tryMount = () => {
-		const root = document.getElementById('ls-score');
-		if (window.LilyScore && root) { window.LilyScore.mount(root); return true; }
-		return false;
-	};
-	if (!tryMount()) {
-		const iv = setInterval(() => { if (tryMount()) clearInterval(iv); }, 200);
-		setTimeout(() => clearInterval(iv), 20000);
-	}
 	// Initial render on RELOAD/restore. Gradio repopulates the hidden #ls-editor-state
 	// textbox with the previous score on a page reload but does NOT fire a `change`

 _JS_HELPERS = '''
 function () {
+	// NB: mounting the score player into #ls-score is handled by score-player.js
+	// itself (event-driven self-mount via MutationObserver — see web/score-player.js).
+	// We deliberately do NOT poll-and-mount here: on a cold load over a slow link the
+	// 7.6MB verovio.bundle.js ahead of score-player.js in <head> can take well over a
+	// minute to arrive, so any fixed-deadline poll here would expire before LilyScore
+	// is even defined and leave the loading spinner stuck forever.
 	// Initial render on RELOAD/restore. Gradio repopulates the hidden #ls-editor-state
 	// textbox with the previous score on a page reload but does NOT fire a `change`

lilyscript/lang.py CHANGED Viewed

@@ -45,7 +45,7 @@ LANG = _resolve_lang()
 # identical to the original literals).
 _STRINGS = {
 	'en': {
-		'app_title': '## 🎼 LilyScript — symbolic music generation with Lilylet',
 		'compose': '## Compose',
 		'style_options': '- Style Options',
 		'composer': 'composer',
@@ -71,7 +71,7 @@ _STRINGS = {
 		'loading_renderer': 'Loading score renderer…',
 	},
 	'zh': {
-		'app_title': '## 🎼 LilyScript — 基于 Lilylet 的符号音乐生成',
 		'compose': '## 创作',
 		'style_options': '- 风格选项',
 		'composer': '作曲家',

 # identical to the original literals).
 _STRINGS = {
 	'en': {
+		'app_title': '## 🎼 LilyScript — symbolic music generation with Lilylet\n\nBy [K.L. Λ](https://k-l-lambda.github.io/), about [Lilylet](https://github.com/k-l-lambda/lilylet)',
 		'compose': '## Compose',
 		'style_options': '- Style Options',
 		'composer': 'composer',
 		'loading_renderer': 'Loading score renderer…',
 	},
 	'zh': {
+		'app_title': '## 🎼 LilyScript — 基于 Lilylet 的符号音乐生成\n\n作者 [K.L. Λ](https://k-l-lambda.github.io/), 关于 [Lilylet](https://github.com/k-l-lambda/lilylet)',
 		'compose': '## 创作',
 		'style_options': '- 风格选项',
 		'composer': '作曲家',

web/score-player.js CHANGED Viewed

@@ -621,4 +621,31 @@
 		isReady: function () { return state.verovioReady; },
 	};
 	log('score-player.js loaded');
 })();

 		isReady: function () { return state.verovioReady; },
 	};
 	log('score-player.js loaded');
+	// ---- self-mount (event-driven) ------------------------------------------
+	// Mount as soon as BOTH this script has executed (window.LilyScore defined —
+	// which only happens after the 7.6MB verovio.bundle.js ahead of us in <head>
+	// finishes downloading + parsing) AND Gradio has inserted the #ls-score node.
+	// We own the mounting here rather than relying on app.py's injected poller:
+	// on a cold load over a slow link, verovio can take well over a minute, so any
+	// fixed-deadline poll on the app side would have already given up by the time
+	// we run, leaving the loading spinner stuck forever (the bug this replaces).
+	// A MutationObserver has no deadline, so it cannot expire early.
+	function selfMount () {
+		const root = document.getElementById('ls-score');
+		if (root) { mount(root); return true; }
+		return false;
+	}
+	if (!selfMount()) {
+		// #ls-score not in the DOM yet (Gradio still building the UI). Watch for it.
+		const mo = new MutationObserver(function () {
+			if (selfMount()) mo.disconnect();
+		});
+		const startObserving = function () {
+			mo.observe(document.documentElement, { childList: true, subtree: true });
+			selfMount();   // re-check in case it appeared between the miss and observe()
+		};
+		if (document.documentElement) startObserving();
+		else document.addEventListener('DOMContentLoaded', startObserving);
+	}
 })();