[Csnd] Latest versions of Csound related javascript (.js) files?

I'm having difficulty finding where the latest versions of the .js files are hosted, such as CsoundAC.js, CsoundAudioNode.js, csound_loader.js & CsoundObj.js.

Also, is there any documentation available for them in regards to which purpose(s) do each specifically address?

TIA,
Scott

Csound mailing list
Csound@listserv.heanet.ie
https://listserv.heanet.ie/cgi-bin/wa?A0=CSOUND
Send bugs reports to
        Issues · csound/csound · GitHub
Discussions of bugs and features can be posted here

There are two releases of Csound compiled for WebAssembly.

The first is the “canonical” release that is hosted in the Csound GitHub repository at https://github.com/csound/csound/tree/master/wasm. This is the home of CsoundObj.js.

The second is my own release that I maintain in the csound-wasm GitHub repository at https://github.com/gogins/csound-wasm. This is the home of CsoundAudioNode.js. This also includes the WebAssembly build of CsoundAC, my C++ library for algorithmic composition.

I would summarize the differences between these as follows.

The “canonical” release is automatically built as part of the Csound repository’s continuous integration. It includes both a “C” style interface (a la csound.h) and a higher-level, object-oriented interface (CsoundObj), which does not have a direct counterpart in Csound’s C or C++ interfaces. This release is built with modern JavaScript tooling, and is available in npm. Victor Lazzarini has a Web site of tutorials demonstrating how to use this release here: https://vlazzarini.github.io/vanilla/index.html.

My release also is automatically built as part of my own continuous integration. It does not have a “C” style interface, but it has a higher-level, object-oriented interface that is a direct counterpart of Csound’s csound.hpp and csound_threaded.hpp interfaces. This release is built with shell scripts, and is available by downloading a release. I find my own interface to be easier to use than CsoundObj because it is a direct port of csound_threaded.hpp.

My csound-wasm release is used, in turn, for libraries in my cloud-5 repository at https://github.com/gogins/cloud-5 which, also in turn, are used in my cloud-music showcase of Csound compositions at https://gogins.github.io/. The cloud-5 repository has examples of using CsoundAudioNode and CsoundAC that go from basic to advanced and show visual music made with shaders, live coding with Strudel that uses Csound for synthesis, and so on. I don’t provide tutorials as Victor does. If you want to know how my stuff works, look at the simple examples first such as https://gogins.github.io/player.html, and then look at the later pieces such as https://gogins.github.io/cloud_music_no_14.html. The later pieces are coded in a somewhat more organized style. You can look at the sources on GitHub or just open the browser’s developer tools.

To get started with the “canonical” release, you can set up a starter NPM project and install @csound/browser. To get started with my release, just fork or download cloud-music, start a local Web server there, and start writing .html pieces.

Hope this helps,
Mike

Thanks for the response Michael.

The issue I’m having is in regards to documentation of which there seems to be little available for those having less experience.

For example, with the vanilla examples that run from Victor’s github.io, if I attempt to run them anywhere else using csound.js (for which I modified the examples to include a full path to the <script src=) they produce a CORS Policy error.

Setting up a webserver on an Android device is a non-trivial issue for one like myself, although finding existing webservers or learning sites that operate as servers is relatively easy.

I attempted to use the NPR @csound/browser:

but couldn’t figure that out and there are no available usage examples that I could find.

I have looked at your examples but frankly they don’t seem accessible to someone attempting to learn from a lower level such as myself. With an example such as the player.html you mention, it works from your .io website. I have tried it elsewhere and get errors such as UncaughtTypeError: cannot read properties of undefined (reading ‘match’) Line 2 and Uncaught ReferenceError: OSC is not defined Line 19.

And, as an aside, the ones you included with the Android app no longer work as of the recent updates, without modification, although that was pretty straightforward to resolve.

It’s not that I have no experience with js (I have used node.js, p5.js, three.js etc.), but I’m self-taught using w3schools, YouTube vids and have completed a few courses from Sololearn. There’s no shortage of available options to learn js, the WebAudio API is also well documented and there are numerous practical examples to be found.

I have been able to get files working locally using js, such as in the Csound for Android app; here’s a short albeit low quality example of one I wrote:

https://youtu.be/d1eVfrhI6i4?si=4x9827EqXdQHBDfl

But there seems to be very little documentation to assist in bridging the gap between getting files to work locally, running the (vanilla) examples off of someone else’s github & creating one’s own html pages.

Are there no relatively straightforward templates available that will work outside having to attempt modifications of someone else’s examples that contain few or no relevant comments as to which .js file(s) is/are needed to (and how to) avoid CORS errors?

Best,

Scott

I always refer back to this how-to that Steven and Hloover wrote.

https://kunstmusik.github.io/icsc2022-csound-web/

Thanks for your feedback, which is most appreciated.

At this time in my life, I don’t write software, or maintain it, or document it, except to help myself make music. When I do write software, I make it public just because I use a lot of public software myself and that seems only fair, and I try to provide some minimal documentation so that others can use it if they wish. So, you can understand why I haven’t written tutorials or made tutorial videos, etc. Also, of course something like my cloud-music pieces is, from a software engineering perspective, unavoidably complex.

Then too, on Android we are at the mercy of Google, who is tightening the screws. I would go so far as to suggest that you set up a personal Web server in a GitHub repository, you can do this using “github pages,” my cloud-music repository is an example of this. Then, even on Android, you can log into GitHub and write pieces right in the repository and they will be served as Web pages that will work just fine on any computer or iPhone or Android device. It’s a little more time-consuming because the GitHub pages have to be rebuilt when you make and commit an edit, but that is absolutely guaranteed to work and is not within the purview of Google at all.

I THINK you could get started doing this simply by forking gogins.github.io on GitHub. Then, still on GitHub, edit some file and commit it. I THINK that will create a GitHub pages Web site for your fork.

That said, things should indeed be easier for people who would like to use my software. I’ll try to come up with some sort of “getting started.”

To that end, it would be most helpful if you could answer some questions.

What level of expertise should the documentation expect from the user? Musically? For programming? For understanding the Web protocols?

What topics should be covered?

What are you trying to do with the software, what are the intended uses? (examples would be very helpful, in fact the example you provided is very helpful).

Thanks,
Mike

Hi Scott,

If you need a very simple example you can have look at this workshop material where I introduced Csound on the web:

https://tarmo.uuu.ee/fulda/csound/

demo.html is the one to check out first. It is based on Victor’s vanilla web-csound examples.
What I usually do is to have the downloaded js directory form Vicor’s examples (csound.js and csound.js.map) in my project and write the html file in the root folder. So I can always be sure this is the correct version of Csound and refer to Csound with relative link like

const csoundjs = “./js/csound.js”;

I believe the ‘CORS Policy error.’ comes probably form the fact that you refer to the csound library over https and your own page is on http or just html file opened in your browser. Or something similar.

To get started you can download my demo from:
https://tarmo.uuu.ee/cs/csound-demo.zip

unpack it, sart a web service from the folder of demo.html. If you have python installed, the easiest is:

python3 -m http.server

and you can access the page from localhost:8000/demo.html on your browser (in case of using python server module).

Another good and perhaps simpler approach is, as Michael suggested, to use github pages and host the page there.

Hope it helps!
Tarmo

Michael is right that you need to host the file on some web server

Kontakt Michael Gogins (<michael.gogins@gmail.com>) kirjutas kuupäeval L, 20. jaanuar 2024 kell 16:05:

Thanks for your feedback, which is most appreciated.

At this time in my life, I don’t write software, or maintain it, or document it, except to help myself make music. When I do write software, I make it public just because I use a lot of public software myself and that seems only fair, and I try to provide some minimal documentation so that others can use it if they wish. So, you can understand why I haven’t written tutorials or made tutorial videos, etc. Also, of course something like my cloud-music pieces is, from a software engineering perspective, unavoidably complex.

Then too, on Android we are at the mercy of Google, who is tightening the screws. I would go so far as to suggest that you set up a personal Web server in a GitHub repository, you can do this using “github pages,” my cloud-music repository is an example of this. Then, even on Android, you can log into GitHub and write pieces right in the repository and they will be served as Web pages that will work just fine on any computer or iPhone or Android device. It’s a little more time-consuming because the GitHub pages have to be rebuilt when you make and commit an edit, but that is absolutely guaranteed to work and is not within the purview of Google at all.

I THINK you could get started doing this simply by forking gogins.github.io on GitHub. Then, still on GitHub, edit some file and commit it. I THINK that will create a GitHub pages Web site for your fork.

That said, things should indeed be easier for people who would like to use my software. I’ll try to come up with some sort of “getting started.”

To that end, it would be most helpful if you could answer some questions.

What level of expertise should the documentation expect from the user? Musically? For programming? For understanding the Web protocols?

What topics should be covered?

What are you trying to do with the software, what are the intended uses? (examples would be very helpful, in fact the example you provided is very helpful).

Thanks,
Mike

Thanks for the response Michael.

The issue I’m having is in regards to documentation of which there seems to be little available for those having less experience.

For example, with the vanilla examples that run from Victor’s github.io, if I attempt to run them anywhere else using csound.js (for which I modified the examples to include a full path to the <script src=) they produce a CORS Policy error.

Setting up a webserver on an Android device is a non-trivial issue for one like myself, although finding existing webservers or learning sites that operate as servers is relatively easy.

I attempted to use the NPR @csound/browser:

but couldn’t figure that out and there are no available usage examples that I could find.

I have looked at your examples but frankly they don’t seem accessible to someone attempting to learn from a lower level such as myself. With an example such as the player.html you mention, it works from your .io website. I have tried it elsewhere and get errors such as UncaughtTypeError: cannot read properties of undefined (reading ‘match’) Line 2 and Uncaught ReferenceError: OSC is not defined Line 19.

And, as an aside, the ones you included with the Android app no longer work as of the recent updates, without modification, although that was pretty straightforward to resolve.

It’s not that I have no experience with js (I have used node.js, p5.js, three.js etc.), but I’m self-taught using w3schools, YouTube vids and have completed a few courses from Sololearn. There’s no shortage of available options to learn js, the WebAudio API is also well documented and there are numerous practical examples to be found.

I have been able to get files working locally using js, such as in the Csound for Android app; here’s a short albeit low quality example of one I wrote:

https://youtu.be/d1eVfrhI6i4?si=4x9827EqXdQHBDfl

But there seems to be very little documentation to assist in bridging the gap between getting files to work locally, running the (vanilla) examples off of someone else’s github & creating one’s own html pages.

Are there no relatively straightforward templates available that will work outside having to attempt modifications of someone else’s examples that contain few or no relevant comments as to which .js file(s) is/are needed to (and how to) avoid CORS errors?

Best,

Scott

There are two releases of Csound compiled for WebAssembly.

The first is the “canonical” release that is hosted in the Csound GitHub repository at https://github.com/csound/csound/tree/master/wasm. This is the home of CsoundObj.js.

The second is my own release that I maintain in the csound-wasm GitHub repository at https://github.com/gogins/csound-wasm. This is the home of CsoundAudioNode.js. This also includes the WebAssembly build of CsoundAC, my C++ library for algorithmic composition.

I would summarize the differences between these as follows.

The “canonical” release is automatically built as part of the Csound repository’s continuous integration. It includes both a “C” style interface (a la csound.h) and a higher-level, object-oriented interface (CsoundObj), which does not have a direct counterpart in Csound’s C or C++ interfaces. This release is built with modern JavaScript tooling, and is available in npm. Victor Lazzarini has a Web site of tutorials demonstrating how to use this release here: https://vlazzarini.github.io/vanilla/index.html.

My release also is automatically built as part of my own continuous integration. It does not have a “C” style interface, but it has a higher-level, object-oriented interface that is a direct counterpart of Csound’s csound.hpp and csound_threaded.hpp interfaces. This release is built with shell scripts, and is available by downloading a release. I find my own interface to be easier to use than CsoundObj because it is a direct port of csound_threaded.hpp.

My csound-wasm release is used, in turn, for libraries in my cloud-5 repository at https://github.com/gogins/cloud-5 which, also in turn, are used in my cloud-music showcase of Csound compositions at https://gogins.github.io/. The cloud-5 repository has examples of using CsoundAudioNode and CsoundAC that go from basic to advanced and show visual music made with shaders, live coding with Strudel that uses Csound for synthesis, and so on. I don’t provide tutorials as Victor does. If you want to know how my stuff works, look at the simple examples first such as https://gogins.github.io/player.html, and then look at the later pieces such as https://gogins.github.io/cloud_music_no_14.html. The later pieces are coded in a somewhat more organized style. You can look at the sources on GitHub or just open the browser’s developer tools.

To get started with the “canonical” release, you can set up a starter NPM project and install @csound/browser. To get started with my release, just fork or download cloud-music, start a local Web server there, and start writing .html pieces.

Hope this helps,
Mike

I’m having difficulty finding where the latest versions of the .js files are hosted, such as CsoundAC.js, CsoundAudioNode.js, csound_loader.js & CsoundObj.js.

Also, is there any documentation available for them in regards to which purpose(s) do each specifically address?

TIA,
Scott

Csound mailing list
Csound@listserv.heanet.ie
https://listserv.heanet.ie/cgi-bin/wa?A0=CSOUND
Send bugs reports to
https://github.com/csound/csound/issues
Discussions of bugs and features can be posted here

Csound mailing list Csound@listserv.heanet.ie https://listserv.heanet.ie/cgi-bin/wa?A0=CSOUND Send bugs reports to https://github.com/csound/csound/issues Discussions of bugs and features can be posted here

Csound mailing list Csound@listserv.heanet.ie https://listserv.heanet.ie/cgi-bin/wa?A0=CSOUND Send bugs reports to https://github.com/csound/csound/issues Discussions of bugs and features can be posted here

Csound mailing list Csound@listserv.heanet.ie https://listserv.heanet.ie/cgi-bin/wa?A0=CSOUND Send bugs reports to https://github.com/csound/csound/issues Discussions of bugs and features can be posted here

Csound mailing list Csound@listserv.heanet.ie https://listserv.heanet.ie/cgi-bin/wa?A0=CSOUND Send bugs reports to https://github.com/csound/csound/issues Discussions of bugs and features can be posted here

Thanks everyone for the suggestions, I really appreciate it.

I’ll do some tinkering later. I did install a webserver app on my Android device:
https://play.google.com/store/apps/details?id=com.phlox.simpleserver

I attached a pic so you can see the available options in case I’m missing something.

It works fine to load pages and runs standard html/js stuff fine, but when I attempt to play anything Csound related it produces no sound. For example, the simple “Ping” (index.html) from Victor’s vanilla tutorials which I downloaded along with the .js file.

I know the csound.js file is in the correct directory as confirmed by the server logs. And if I change the path, it logs file not found. But it will not produce any audio, not locally. The webserver logs a 200 response (page loaded ok) but there is no audio.

For now I guess I’ll attempt going the github route.

As I’m relatively new to using github I do have one question - if I use a forked repository, can I add my own html files to that without it affecting the original files I forked?

And Michael, I do have some suggestions but for now I’ll concentrate on just getting something relatively simple to work so I can build from there. Then I’ll get back to you on your questions. My initial goal is simply some basic interaction between the csd & js, for example note amplitudes affecting rgb colour values.

Once again, thanks to all for the responses.

Best,
Scott

I’ve attached a simple html file that uses @csound/browser that doesn’t need a webserver (since csound.js is served from a site). The code is also posted on Github Gist:

https://gist.github.com/kunstmusik/6e9fe911fbdc65780f0f692358a1599d

(Attachment simple_csound_web.html is missing)

I got a message the attachment didn’t go through as it wasn’t an approved filetype, so downloading the gist should do the job.

Thanks again to everyone for the help!

Steven, very nice example & this works perfectly. It pointed me in the right direction. Much appreciated. Perhaps not “simple” in my case but it’s certainly been pushing me forward towards getting a better understanding of js basics. Async/await are new to me, I had to Google these; I have some homework to do :slight_smile:

And Tarmo, I have yet to get this example to work but I think it just requires a few modifications. The Android rules make life difficult in regards to paths and external file dependencies.

Michael, the examples you included with the app work (to some extent) if the paths are modified although I’m still having difficulty getting the Play etc. buttons to work, I’m not yet sure why. But the code can be “Run” via the standard csd method.

A few quick notes for any Android users. I haven’t been successful in running examples locally in a browser, whether loading directly or via an http server app. And I’m not sure if it’s possible to run a server via python on my device, I still have to look into that.

The good news is that, per Steven and Victor’s vanilla examples (and surely Tarmo’s as well), they can be edited & run directly in the Csound for Android app via the HTML tab. It’s not necessary to “Run” them in the standard way, they can be played using the buttons visible in the HTML tab.

Best,
Scott

thanks so much steven for this wonderful and instructive example!!!

Steven, that’s a neat trick about loading csound.js from a site and so not needing a local Web server. I hadn’t thought of that.

Regards,
Mike