User talk:Xenwolf: Difference between revisions

Line 960:

: I don't think anything like this exists yet. The person who takes care of the server side installation is [[User:Tyler Henthorn|Tyler Henthorn]], maybe you can share your ideas with him. --[[User:Xenwolf|Xenwolf]] ([[User talk:Xenwolf|talk]]) 21:06, 13 October 2022 (UTC)

== In-browser sound generation ==

Hi Xenwolf!

My in-browser sound generation project ([[User:Plumtree/Sound]]) is essentially ready. Could you review [[User:Plumtree/common.js]] and [[User:Plumtree/common.css]] and, if there're no issues, include those globally?

The best option would've been [[mw:Extension:Gadgets]] for JS and [[mw:Extension:TemplateStyles]] for CSS. Alas, they aren't installed. I've asked [[User:Tyler Henthorn]] for them but his last edit was more than a year ago and it's unlikely he'll answer any time soon.

What does JS do?

* It reacts to clicks on HTML elements with class <code>sequence-audio</code>. When one is clicked, it reads its <code>data-sequence</code> attribute and plays the encoded pattern.

* If <code>data-lock</code> attribute is set, it also adds the <code>sequence-audio-playing</code> class and ignores further clicks for the duration of the sequence.

* Timbres defined by their harmonic spectra are supported. Builtins are <code>sine</code>, <code>flute</code>, <code>violin</code>; you can supply custom ones using <code>data-timbre-X</code> attributes.

* A sequence consists of the following elements, separated by whitespaces:

** <code>wait:DURATION</code> - adds DURATION ms to the global time shift, which starts at 0.

** <code>FREQUENCY:DURATION:GAIN:SHIFT:INSTRUMENT</code> - plays FREQUENCY for DURATION ms with GAIN with timbre specified with INSTRUMENT. It starts at global shift + SHIFT ms, and global shift isn't modified. INSTRUMENT's default is <code>sine</code>; SHIFT's default is <code>0</code>.

* For example, sequences used for interval demonstration look like this: <code>440:1000:0.1 660:1000:0.1:500 wait:2000 660:1000:0.1 440:1000:0.1:500 wait:2000 440:1000:0.1 660:1000:0.1</code>.

* Modern browsers support Web Audio API quite well and I don't expect any compatibility issues.

What does CSS handle?

* Background colour of <code>.sequence-audio-button</code> elements depending on their state.

* Cursor styles upon <code>.sequence-audio-button</code> elements so that they're interpreted as interactive.

* Additionally, <code>.white-key</code> and <code>.black-key</code> elements have the corresponding colours. Those may be used to build interactive keyboards for ETs.

Examples (all require [[User:Plumtree/common.js]] and [[User:Plumtree/common.css]] to be properly viewed):

* [[User:Plumtree/Sound]] - mostly tests of intervals.

* [[User:Plumtree/Sandbox/Interval]] - actually tests of intervals as they're going to be included into [[Template:Infobox Interval]].

* [[User:Plumtree/Audio]] - the template which is currently the main interface for this JS.

[[User:Plumtree|Plumtree]] ([[User talk:Plumtree|talk]]) 17:52, 16 October 2022 (UTC)

@@ Line 960: / Line 960: @@
 : I don't think anything like this exists yet. The person who takes care of the server side installation is [[User:Tyler Henthorn|Tyler Henthorn]], maybe you can share your ideas with him. --[[User:Xenwolf|Xenwolf]] ([[User talk:Xenwolf|talk]]) 21:06, 13 October 2022 (UTC)
+== In-browser sound generation ==
+Hi Xenwolf!
+My in-browser sound generation project ([[User:Plumtree/Sound]]) is essentially ready. Could you review [[User:Plumtree/common.js]] and [[User:Plumtree/common.css]] and, if there're no issues, include those globally?
+The best option would've been [[mw:Extension:Gadgets]] for JS and [[mw:Extension:TemplateStyles]] for CSS. Alas, they aren't installed. I've asked [[User:Tyler Henthorn]] for them but his last edit was more than a year ago and it's unlikely he'll answer any time soon.
+What does JS do?
+* It reacts to clicks on HTML elements with class <code>sequence-audio</code>. When one is clicked, it reads its <code>data-sequence</code> attribute and plays the encoded pattern.
+* If <code>data-lock</code> attribute is set, it also adds the <code>sequence-audio-playing</code> class and ignores further clicks for the duration of the sequence.
+* Timbres defined by their harmonic spectra are supported. Builtins are <code>sine</code>, <code>flute</code>, <code>violin</code>; you can supply custom ones using <code>data-timbre-X</code> attributes.
+* A sequence consists of the following elements, separated by whitespaces:
+** <code>wait:DURATION</code> - adds DURATION ms to the global time shift, which starts at 0.
+** <code>FREQUENCY:DURATION:GAIN:SHIFT:INSTRUMENT</code> - plays FREQUENCY for DURATION ms with GAIN with timbre specified with INSTRUMENT. It starts at global shift + SHIFT ms, and global shift isn't modified. INSTRUMENT's default is <code>sine</code>; SHIFT's default is <code>0</code>.
+* For example, sequences used for interval demonstration look like this: <code>440:1000:0.1 660:1000:0.1:500 wait:2000 660:1000:0.1 440:1000:0.1:500 wait:2000 440:1000:0.1 660:1000:0.1</code>.
+* Modern browsers support Web Audio API quite well and I don't expect any compatibility issues.
+What does CSS handle?
+* Background colour of <code>.sequence-audio-button</code> elements depending on their state.
+* Cursor styles upon <code>.sequence-audio-button</code> elements so that they're interpreted as interactive.
+* Additionally, <code>.white-key</code> and <code>.black-key</code> elements have the corresponding colours. Those may be used to build interactive keyboards for ETs.
+Examples (all require [[User:Plumtree/common.js]] and [[User:Plumtree/common.css]] to be properly viewed):
+* [[User:Plumtree/Sound]] - mostly tests of intervals.
+* [[User:Plumtree/Sandbox/Interval]] - actually tests of intervals as they're going to be included into [[Template:Infobox Interval]].
+* [[User:Plumtree/Audio]] - the template which is currently the main interface for this JS.
+[[User:Plumtree|Plumtree]] ([[User talk:Plumtree|talk]]) 17:52, 16 October 2022 (UTC)