A music player that connects to your cloud/distributed storage.
feat: process tracks button input configurator
+41
-13
+41
-1
src/themes/webamp/configurators/input/element.js
+41
-1
src/themes/webamp/configurators/input/element.js
···
91
91
if (processTracksOrchestrator) {
92
92
this.$processTracksOrchestrator.value = processTracksOrchestrator;
93
93
}
94
+
95
+
// EFFECTS
96
+
97
+
let skip = true;
98
+
99
+
this.effect(() => {
100
+
if (skip) {
101
+
skip = false;
102
+
return;
103
+
}
104
+
105
+
const _trigger = sourcesOrchestrator.sources();
106
+
if (output.tracks.state() !== "loaded") return;
107
+
processTracksOrchestrator?.process();
108
+
});
94
109
}
95
110
96
111
// EVENTS
112
+
113
+
#processSources = () => {
114
+
this.$processTracksOrchestrator.value?.process();
115
+
};
97
116
98
117
/**
99
118
* @param {Event} event
···
611
630
*/
612
631
#renderProcessingProgress(html) {
613
632
const orchestrator = this.$processTracksOrchestrator.value;
614
-
if (!orchestrator?.isProcessing()) return nothing;
633
+
if (!orchestrator?.isProcessing()) {
634
+
return html`
635
+
<fieldset>
636
+
<div class="with-icon with-icon--large">
637
+
<img
638
+
src="images/icons/windows_98/gears-0.png"
639
+
width="24"
640
+
/>
641
+
<div>
642
+
<p>
643
+
Go through all the inputs you've added and get the last audio files and
644
+
their metadata.
645
+
</p>
646
+
<p>
647
+
<button @click="${this
648
+
.#processSources}">Process sources</button>
649
+
</p>
650
+
</div>
651
+
</div>
652
+
</fieldset>
653
+
`;
654
+
}
615
655
616
656
const { processed, total } = orchestrator.progress();
617
657
const percentage = total > 0 ? Math.round((processed / total) * 100) : 0;
-12
src/themes/webamp/configurators/input/facet.html.txt
-12
src/themes/webamp/configurators/input/facet.html.txt
···
23
23
<script type="module">
24
24
import foundation from "@diffuse/foundation";
25
25
import InputConfigElement from "./themes/webamp/configurators/input/element.js";
26
-
import { effect } from "./common/signal.js";
27
26
28
27
const inp = foundation.orchestrator.input();
29
28
const out = foundation.orchestrator.output();
···
37
36
el.setAttribute("process-tracks-orchestrator-selector", pro.selector);
38
37
39
38
document.querySelector("#placeholder")?.replaceWith(el);
40
-
41
-
// EFFECTS
42
-
43
-
let initEffect = false;
44
-
45
-
effect(() => {
46
-
const _trigger = sou.sources();
47
-
if (out.tracks.state() !== "loaded") return;
48
-
if (initEffect) pro.process();
49
-
initEffect = true;
50
-
});
51
39
</script>