Tidal GUI!

(Updated for v.0.0.6)

Hello everyone!

Long post ahead. As you may know, I'm currently working on tidal as part of the haskell summer of code.

In the last month I started working on a custom interface for tidal, that is basically a code editor with a built in interpreter.

A big advantage of this is that it's very easy to install: just download, unzip and you're ready to go!
(You still need to install SuperCollider & SuperDirt though)

The application is still pretty experimental, but is already in a state where it has most of the functionality of the other editors & editor plugins.

It would be very cool if some of you could try it out and give me some feedback / report bugs etc.

I already tested on Ubuntu 20.04.2 and 18, Windows 10 and MacOS High Sierra and at a first glance everything seemed to work fine.

Note to MacOS users: In more recent versions of Mac you might have to work around the maleware protection - I couldn't get it to run on Big Sur because of that. If anyone has experience with writing open source applications for MacOs and has an idea how to do this, please contact me.

Installation

Edit: Much simpler now, thanks to @ndr_brt for pointing me in the right direction with github releases ! :slight_smile:

  • Visit the following link:
  • Select the latest release
  • Under 'Assets' choose the file that is named like your operating system
  • Download
  • Unzip all the files (twice)

You should now have a folder 'binary' that you can put anywhere on your system. Inside the folder are a bunch of files and an executable 'tidal-gui', to run it either double click on it or run it from a terminal (recommended).

Note: Moving the executable to another location will break the application.

Explanation of the interface

Once the application is running, you can open a browser and go to http://127.0.0.1:8023. Note that you still need to start up SuperDirt to hear sound, and you cannot have any other instances of Tidal running at the same time.

Now there is only one editor where you can basically evaluate most expressions you're probably used to from othe editor plugins. Above the editor is a little display of the state of tidal, i.e. the current cps and which channels are playing/muted. Below the editor are two buttons to load or save documents, and below that is a little output box, that displays error messages or other kinds of information.

Highlighting

One new feature that the interface offers is syntax highlighting (like you may have seen in feedforward):
To make a channel that has that feature just use 'h1', 'h2' etc. instead of 'd1', 'd2'. For example:

h1 $ s "bd sn"

Note: The highlighting channels cannot be used in definitions or inside of do-blocks

Type Inference

You can prepend a :t to an expression and evaluate it, to print out the expressions type.
Example: :t rev

Definitions

you can evaluate expressions of the form

let x_1 = e_1
    x_2 = e_2
       ...
    x_n = e_n

Note: If you defined a variable in two blocks and evaluate them both, it will have the value defined by the block evaluated last.

Loading definitions on boot

Inside the static folder is a file called bootDefs.hs, you can write one let expression block inside the file, for definitions you use all the time, to not have to load them again each session.

'Calculator' capability

You can not only evaluate statements of type IO a but also of type Show a => a but you need to lift the latter to IO using return. For example, if you want to print a control pattern like s "bd sn" to the console you can evaluate return $ s "bd sn".

Custom keymaps

There are currently four options for pre defined keymaps: default, vim, emacs and sublime. To configure the keymap open the file tidalConfig in the static folder in a text editor and change the value of the 'keyMap' constant to your liking. Restart the application for the changes to have an effect.

Custom themes

Since the editor is based on the codemirror editor, you can use any codemirror editor theme you want. Here is a nice tool to customize and generate your own themes: https://mkaminsky11.github.io/codemirror-themes/

Once you have a theme you like, save it in a file named theme.css and replace the file of the same name that is currently inside the static/css/ folder. Restart the application for the changes to have an effect.

Hoogle

You can evaluate expressions of the form hoogle x where you can substitute x with the name of a function you want to explore.

Hoogle adds a lot of dependencies and thus increases the final size of the package by about 400mb..don't really know if it's something people really want/need ... it will probably be redundant if the docs are integrated completely... let me know what you think!

List of keyboard shortcuts

  • Ctrl + Enter = Evaluate block of code at the place of the cursor

  • Shift + Enter = Evaluate line of code at the place of the cursor

  • Ctrl + / = toggle comment line of code at the place of the cursor

  • Ctrl + D = open tidal docs, where the word at the current place of the cursor is entered in the search

  • Ctrl + . = hush

  • Ctrl + 1 ... Ctrl + 9 = toggle mute d1 ... d9

  • Shift + Ctrl + 1 ... Shift + Ctrl + 9 = toggle mute h1 ... h9

  • Ctrl + - = decrease font size of editor

  • Shift + Ctrl + - = increase font size of editor

  • Ctrl + O = open file

  • Ctrl + S = save contents

TO DOS

Like I said, the interface is still experimental and missing some features. Here is a short (incomplete) list of things left to do:

  • Make the editor prettier and make it so the look is easily configurable
  • Work on the state display, possibly displaying information from supercollider
  • Automatically fill in blank lines that fit the editors on startup
  • Integrating the SVG pattern visualizer
  • Sound browser
  • Using electron to make a standalone application (without needing a browser)

Some more advanced features that may be possible:

Let me know if you have any ideas!

Help

The application is written in Haskell, but it heavily relies on the threepenny-gui library, that basically allows to write HTML/JavaScript/CSS code in Haskell. Since I (basically) only have programming experience in Haskell, I'm slow at figuring things like how to make a html document pretty etc. out. So if anyone want's to help me with that, I'd be very open to it :slight_smile:

Like I briefly mentioned above, I also need help in figuring out what to do to get the application to run on newer versions of MacOS without having to bypass the malware protection.

And of course I need help in testing the application! So, try it out and if you have any questions / suggestions or encounter unexpected behaviour please let me know in this thread / on discord or open an issue on github.

Have a nice weekend everyone!

19 Likes

you just have to hold fn key while opening a file to bypass the protection

yes, that works to launch the application, but since the application loads library files on runtime it gets stuck there and I don't know how to bypass that

it wants to load one or two files ( HSinteger-gmp-1.0.3.0.o) which you first have to open manually (like with text edit or something) and then it loads ok. I'll test it properly later today.

oh, there's a problem with loading fake_gcc, you're right, sorry

That's awesome ! If I may, please consider a dark theme too.
Nothing else to add, that's super promising.

2 Likes

Pretty excited about this new text editor for Tidal. Just tested it on MacOS Big Sur 11.5:

  • Error when evaluating code: GHC Exception: could not execute: bin/fake_gcc.sh.

I really like Codemirror because it's a nice web browser based text edit that can provide Vim bindings. I would suggest adding an option somewhere to turn on Vim mode. I ended up depending a lot on these bindings to code / livecode, and I am sure that I am not the only one :smile: . Last time I tried, it was only a matter of tweaking an argument value or a variable somewhere.

Can't wait to see how this editor will evolve! I'm sure that a desktop based click and go editor for Tidal will be really helpful for teaching Tidal in the future. Thanks!

2 Likes

Hey!

Nice work - look forward to checking this out.

Do you still need a Haskell install to run it up or did you figure out a way to package the runtime?

1 Like

Just updated the application (you have to redownload) and you can now easily load custom themes, I described how in more detail in my post above to keep everything together nicely :slight_smile:
Currently it will only affect the editors though and not the whole page.. will have to look into how to apply the styling to the whole page, but it shouldn't be too difficult

Yeah I don't really know what to do about that... If you disable your maleware protection completely it should work but I don't actually recommend doing that.

Yes, it was very easy! Just made it configurable. I added how in my original post to keep everything in one place.

1 Like

The application runs without an installation of haskell, it was pretty fiddly to figure out how to pack everything but definitely worth it :slight_smile:

4 Likes

Ah that’s a huge win for wider accessibility! Congrats :clap::clap::clap:

1 Like

Amazing about the install process!
Does the GUI give feedback as to which sounds are playing?

And thanks for your work on this.

1 Like

This is huge, thanks for the detail - I will dive into testing this week :+1:

1 Like

There is a little display on top where you can see which channels are currently playing (after a hush it's broken - still need to fix that) and there are the new highlighting channels that will highlight the names of the samples currently playing

1 Like

I have signed Mac applications which need to invoke scripts and executables stored inside! The key is that both the app and any scripts or dynamic libraries inside need to be signed (any executable code), and also uploaded to Apple's servers for notarization.

This project was very helpful in automating the process: GitHub - EddieCameron/notarize-app: Make and notarise a .app or .dmg outside of Xcode

2 Likes

Wow! Thanks a lot for sharing this. That seems really promising and has a lot of potential. I'll try it out these days and eventually will give share some
feedback.
Already I'd say: great work! :bouquet:

1 Like

i'll be trying this today as part of my re-encounter with tidal (i haven't used it for a long time rn...)
i'll let you know what i make of it ! it sure seems pretty exiting; and i think the project has lots of potential from the idea and description you expressed

1 Like

Hey Raph, this issue may be related, depending on how you're executing:

1 Like

System:
Win8.1, Chrome, Tidal 1.7.8
My main problem was a bug while using the second editor, it was very hard to get the cursor there and when i tried evaluating code there it would evaluate code from the first editor. I checked the cursor was actually in the second editor. The rest was really nice. Also used the extension Dark Reader to get a nice dark theme going lol. I would definitely use it live whenever it gets a bit more stable. Amazing work! The size of it was a little bit concerning too, but not that much.

1 Like