TWC: Using TW as a musical scratchpad with BopLand.org services

681 views
Skip to first unread message

Måns

unread,
Oct 16, 2013, 9:23:02 PM10/16/13
to tiddl...@googlegroups.com
Hi TWafficionados

Just found out how easy it is to write,edit and publish musical notes in a TW* - and wanted to share my new found insight with you:

1) Write: <script src="http://my.bopland.org/render.js"></script>   in your MarkupPostHead tiddler (save & reload)

2) Create a template eg. "Bop" containing: 

<html>
<div class=bopland>
$1
</div>
</html> 

3) Use it like this:

<<tiddler Bop with:"
Your musical code here
">>

My example: BopNotes

Have fun :-)

Cheers Måns Mårtensson

*) You'll need to be connected to the internet to use it.

Tobias Beer

unread,
Oct 17, 2013, 11:42:19 AM10/17/13
to tiddl...@googlegroups.com

Måns

unread,
Oct 17, 2013, 2:13:04 PM10/17/13
to tiddl...@googlegroups.com
Hi Tobias

I had a hunch that you would find a way to put me in the contributor's list some day. You ceased the moment!

Much appreciated - Thanks ;-)

Cheers Måns Mårtensson

Tobias Beer

unread,
Oct 17, 2013, 10:06:04 PM10/17/13
to tiddl...@googlegroups.com

I had a hunch that you would find a way to put me in the contributor's list some day. You ceased the moment!

I believe there's a whole lot of input on your end, I just wouldn't quite know where to look. ;-)

If you find some time, please put some of your "inventions" / mashups / app-type-a-things up there where you see fit. 

Tobias.

Måns

unread,
Jan 15, 2014, 2:58:30 AM1/15/14
to tiddl...@googlegroups.com
Hi TiddlyWikiWizards

Does anyone know how to do the same thing in a new TW (5) ??
Is there something like a MarkupPostHead tiddler in a TW5?

Cheers Måns Mårtensson

Jeremy Ruston

unread,
Jan 15, 2014, 3:32:09 AM1/15/14
to TiddlyWiki
Hi Måns

In TW5 there's a different approach to getting external libraries like bopland integrated.

Instead of using a script tag to include the script, it gets wrapped up into a plugin, and then one or more TW5 modules are used to integrate it.

Have a look for example at the CodeMirror plugin:


Best wishes

Jeremy




--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/groups/opt_out.



--
Jeremy Ruston
mailto:jeremy...@gmail.com

Stephan Hradek

unread,
Jan 15, 2014, 4:12:45 AM1/15/14
to tiddl...@googlegroups.com, jeremy...@gmail.com
Hi Jeremy!

While we are at it: Do you remember that you wanted to change the @@ block to create a classed div instead of applying the class to all child objects?

I think this would also help here as a bopland div is then simply created with

@@bopland
musical notes here
@@


Jeremy Ruston

unread,
Jan 15, 2014, 4:32:40 AM1/15/14
to Stephan Hradek, TiddlyWiki
On Wed, Jan 15, 2014 at 9:12 AM, Stephan Hradek <stephan...@gmail.com> wrote:
While we are at it: Do you remember that you wanted to change the @@ block to create a classed div instead of applying the class to all child objects?

Yes I remember. 

I think this would also help here as a bopland div is then simply created with

@@bopland
musical notes here
@@


Right, I was talking about how to get the script loaded up in the first place, by packaging it into a plugin.

Best wishes

Jeremy 

Måns

unread,
May 20, 2014, 4:55:51 PM5/20/14
to tiddl...@googlegroups.com, Stephan Hradek, jeremy...@gmail.com
Hi TwWizards

BJ just gave me the answer to this question in another thread . 
The simple solution is to create a tiddler eg: $:/_bopland_render_js 
tag it with: $:/core/wiki/rawmarkup 
write: <script src="http://my.bopland.org/render.js"></script>  - 
save wiki and reload page.

Now if you wrap your musical notes inside the bopland class it will render as a playable note sheet, which can be transposed, downloaded as an image or as a mp3 file.

Example:
<div class=bopland>
lick 4/4 g#8 | A7 a c# e g bb c16 bb a8 g | Dm7 f d a g f d a b~ | Dm7 b4 r r2 | 
</div>

It doesn't work with:
@@.bopland
lick 4/4 g#8 | A7 a c# e g bb c16 bb a8 g | Dm7 f d a g f d a b~ | Dm7 b4 r r2 | 
@@


Cheers Måns Mårtensson

Måns

unread,
May 20, 2014, 5:35:42 PM5/20/14
to tiddl...@googlegroups.com, Stephan Hradek, jeremy...@gmail.com
Same thing is possible with jTab from tardate (guitar chords and tab notation)

Create a tiddler eg.: $:/_jTab_render
tag it with: $:/core/wiki/rawmarkup 
write:
<!-- recommended to avoid security warnings with SVG in IE8 -->
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
  <!-- optional: helpers to preset jtab region heights to avoid rendering jitter -->
  <link type="text/css" rel="stylesheet" href="http://jtab.tardate.com/css/jtab-helper.css"/>

  <!-- mandatory script includes for jtab -->
  <script src="http://jtab.tardate.com/javascripts/jquery.js" type="text/javascript"></script>
  <script src="http://jtab.tardate.com/javascripts/raphael.js" type="text/javascript"></script>
  <script src="http://jtab.tardate.com/javascripts/jtab.js" type="text/javascript"></script>

save wiki and reload page.
Now if you wrap your musical notes inside the jtab class it will render as guitar tabs or as simple guitar chord diagrams..

Example: 

<div class="jtab">
C:1 C:2 C:3 C:4 C:5
</div>

or 

@@.jtab
C:1 C:2 C:3 C:4 C:5
@@

which will also work..

It is recommended that you download and refer to the tardate scripts from your own server as the rendition might get a little slow when served from http://jtab.tardate.com/ ...

We have a nice plugin for TWc which doesn't need any external script references. It would be very nice if someone ported it to TW5 :-)

Cheers Måns Mårtensson   

Måns

unread,
May 20, 2014, 6:04:21 PM5/20/14
to tiddl...@googlegroups.com, Stephan Hradek, jeremy...@gmail.com
Forgot to link to a twc jtabplugin example:

Måns

unread,
May 20, 2014, 7:03:12 PM5/20/14
to tiddl...@googlegroups.com, Stephan Hradek, jeremy...@gmail.com

Russ Thomas

unread,
May 22, 2014, 10:35:57 AM5/22/14
to tiddl...@googlegroups.com
Hi Mans

Have you seen http://www.vexflow.com/ ?  When you're there, check out vextab, also.

Russ


--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.

Måns

unread,
May 22, 2014, 5:56:06 PM5/22/14
to tiddl...@googlegroups.com
Hi Russ


>Have you seen http://www.vexflow.com/ ?  When you're there, check out vextab, also.

Nope - I didn't know about it - it seems to render very nice looking musical notation without the need of external libraries! 
Very nice :-)

I wouldn't know how to implement it in TiddlyWiki though...

Måns

unread,
May 22, 2014, 6:04:08 PM5/22/14
to tiddl...@googlegroups.com
seems to be something which could be easily made into a TW5 plugin as all it needs is Html5, Canvas and Raphael...


I'd love to see that happen - is there a musical programmer/developer who'd like to turn TW5 into a standalone musical notebook?

Thank you for sharing Russ :-)

Cheers Måns Mårtensson

Russ Thomas

unread,
May 24, 2014, 10:54:49 AM5/24/14
to tiddl...@googlegroups.com
Hi Mans

I found vextab (and have been following the developer's tweets) a long time ago.  Sadly, I haven't kept up with it from the point of view of reusing it embedded elsewhere (like TW).  I did try around three years ago but didn't get very far... my TW coding skills (read: API knowledge) are thin to say the least.

Somewhere <grin> I have some more related links... I'll try to dig them out and if they're still good/relevant I'll post again.

Russ


--

Yakov

unread,
May 26, 2014, 5:24:20 PM5/26/14
to tiddl...@googlegroups.com
Hi Russ,

if TW API knowledge is the only obstacle to making a plugin using vextab, I'll help you with the API with pleasure; but this applies to TW Classic only, unfortunately.

Best regards,
Yakov.

суббота, 24 мая 2014 г., 18:54:49 UTC+4 пользователь Russ написал:

Jeremy Ruston

unread,
May 26, 2014, 5:44:54 PM5/26/14
to TiddlyWiki
The API of VexTab is nice and flexible and would be particularly easy to turn into a TW5 widget.

There's a TiddlyWiki hangout due tomorrow at 4pm BST, if any interested parties would be able to show up I'd be happy to talk you through what would be involved.

Best wishes

Jeremy.

Måns

unread,
May 26, 2014, 8:05:46 PM5/26/14
to tiddl...@googlegroups.com, jeremy...@gmail.com
Hi Jeremy

I am not able to attend the Hangout tomorrow because I'm busy working. I don't think I have the skills to be able to follow the walktrough and create a widget myself, 

I have however contacted Mohit Muthanna (0xFE) via G+ and invited him to attend the hangout if he is interested in the making of a Vextab TiddlyWiki widget/plugin.

If you want to try out VexTab as a Google Docs extension you can add it from here: https://chrome.google.com/webstore/detail/vextab-music-notation/pjggkphnejbllmmkmmgibonkbbhfjnkk

Cheers Måns Mårtensson

BJ

unread,
May 27, 2014, 7:02:39 PM5/27/14
to tiddl...@googlegroups.com, jeremy...@gmail.com
I'm not sure if redistribution of vextab is allowed, on http://www.vexflow.com/vextab/ it says:
"
VexTab is an open specification and the reference implementation is open source. It is freely available complete and uncrippled for non-commercial use.

If you would like to use this code on commercial websites, products, plugins, or tools, please get in touch with me. (I'm very reasonable.)

Note that the underlying library, VexFlow, is completely open source and distributed under the MIT license.

"
?
BJ

Jeremy Ruston

unread,
May 28, 2014, 10:18:02 AM5/28/14
to BJ, TiddlyWiki
On Wed, May 28, 2014 at 12:02 AM, BJ <bugg...@gmail.com> wrote:
I'm not sure if redistribution of vextab is allowed, on http://www.vexflow.com/vextab/ it says:
"
VexTab is an open specification and the reference implementation is open source. It is freely available complete and uncrippled for non-commercial use.

If you would like to use this code on commercial websites, products, plugins, or tools, please get in touch with me. (I'm very reasonable.)

Note that the underlying library, VexFlow, is completely open source and distributed under the MIT license.

You're right, it does present problems if we can't redistribute VexTab under the same BSD license as TiddlyWiki itself. It sounds like it would be worth talking to the author though.

Best wishes

Jeremy.

PMario

unread,
May 28, 2014, 10:26:16 AM5/28/14
to tiddl...@googlegroups.com, BJ, jeremy...@gmail.com
On Wednesday, May 28, 2014 4:18:02 PM UTC+2, Jeremy Ruston wrote:
You're right, it does present problems if we can't redistribute VexTab under the same BSD license as TiddlyWiki itself. It sounds like it would be worth talking to the author though.

VexFlow is MIT and would works well with BSD. ... but VexTab would need some adjustments.

-m

Måns

unread,
May 28, 2014, 12:32:00 PM5/28/14
to tiddl...@googlegroups.com, BJ, jeremy...@gmail.com
Hi Jeremy


You're right, it does present problems if we can't redistribute VexTab under the same BSD license as TiddlyWiki itself. It sounds like it would be worth talking to the author though.

Mohit Muthanna (0xFE) did not answer when I invited him to the Hangout.
As you know my first language is far from being English - however I wrote this to Mohit a couple of minutes ago:

"Hi Mohit Muthanna (0xFE)

On the TiddlyWIki mail list/google group we are discussing if we are allowed to create a plugin/redistribute VexTab as a plugin for TiddlyWIki.

TiddlyWiki is licensed with BSD. VexFlow is MIT and it should work well with BSD. ... but VexTab however would need some adjustments if we should be able to redistribute it.. 

Jeremy Ruston, the creator of TiddlyWiki, has shown interest in building a VexTab plugin for TiddlyWiki, live in a Google Hangout - because " The API of VexTab is nice and flexible and would be particularly easy to turn into a TW5 widget."

I'm a music teacher, a guitarist and a long time TiddlyWiki end user, and I would love to be able to work with musical scores and write chord diagrams directly in my own personal portable wiki which also happens to be a database and a blog like application which is much more versatile than standard word processors like eg. Google Docs or Office Word... Just to name a few.

Would you be interested in the making of a plugin for TiddlyWiki?

If you are - how do we make it work - regarding the question of license types?

Cheers Måns Mårtensson

Links: 
http://tiddlywiki.com

Hope it's ok..?

Cheers Måns 

Jeremy Ruston

unread,
May 28, 2014, 12:52:14 PM5/28/14
to Måns, TiddlyWiki, BJ
Hi Måns

That looks good, thank you for taking the lead on this, much appreciated,

Best wishes

Jeremy

Måns

unread,
Jun 3, 2014, 6:11:51 AM6/3/14
to tiddl...@googlegroups.com, bugg...@gmail.com, jeremy...@gmail.com
Hi TwAfficionados 

Mohit returned a positive answer yesterday:

>Mohit: "Thanks for the e-mail. I'm okay with someone else building a TiddlyWiki plugin, but I'm not sure that the licenses are compatible. VexTab is free so long as it is not used for commercial purposes and the vexflow.com logo remains visible.
If you can annotate your plugins with some text mentioning that this is for non-commercial use only, then I have no problem with it."

I'm not sure if it's enough to apply with TW's BSD license - if the plugin is distributed "standalone" from Github? If Github is used as an official repository for the plugin - and it's not presented as part of an "official TW5 package" - eg. installed at tiddlywiki.com?? 

Cheers Måns Mårtensson

BJ

unread,
Jun 3, 2014, 7:04:13 AM6/3/14
to tiddl...@googlegroups.com, bugg...@gmail.com, jeremy...@gmail.com
I'll take a look and see if there is a way to use vexflow on its own. On a first glace it seems that vextab is a compiler that produces scripts for vexflow. 

BJ

Jeremy Ruston

unread,
Jun 3, 2014, 7:47:18 AM6/3/14
to BJ, TiddlyWiki
Hi Måns

How frustrating. The license for VexTab definitely prevents us from distributing it under the same licensing terms as TW itself.

I think that rules out making it any kind of official plugin that is distributed from tiddlywiki.com.

I remain very happy to help if anyone else is interested in creating a widget around vextab.

Best wishes

Jeremy

Message has been deleted

BJ

unread,
Jun 3, 2014, 9:42:53 AM6/3/14
to tiddl...@googlegroups.com, bugg...@gmail.com, jeremy...@gmail.com
how would one go about adding an annotation to the plugin for such a third party license?

cheers

BJ

Piotr Świerszcz

unread,
Jul 14, 2014, 8:55:26 AM7/14/14
to tiddl...@googlegroups.com
Any news? Work in progress?

Piotr

Rowan Corbett

unread,
Feb 19, 2016, 10:54:00 AM2/19/16
to TiddlyWiki
I've been trying to get this to work as well. I'm using 5.1.11 but can't seem to get any of the above examples to function.
Has something changed in the way TW deals with rawmarkup tags?

Rowan

Rowan Corbett

unread,
Feb 19, 2016, 12:46:33 PM2/19/16
to TiddlyWiki
Actually, I just figured it out. I just needed to keep at it for a little while. :)

Rowan

Måns Mårtensson

unread,
Feb 19, 2016, 1:34:00 PM2/19/16
to TiddlyWiki
Hi Rowan

The bopland.org service doesn't seem to exist anymore, which is too bad. 
It was very nice to be able to write tabs and musical notation, have it play back and transpose. 
You could even download a mp3 file.

I haven't been able to find out what happened to the service.

We will just have to wait and see if any alternatives show up.

Have you checked out VexTab? It currently works as a plugin in google docs.
Here is a tutorial.

Cheers Måns Mårtenssom

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.

Rowan Corbett

unread,
Feb 21, 2016, 12:37:16 AM2/21/16
to TiddlyWiki
Hey Måns!
Actually, Vextab is what I am most interested in. I've managed to get it working by the same method used for Bopland. My only problem now is that I can't use it without an Internet connection on my mobile devices.
Is there a way to include Vextab within the tiddlywiki itself rather than linking to it?

Rowan

Måns Mårtensson

unread,
Feb 21, 2016, 4:36:32 AM2/21/16
to TiddlyWiki
Hi Rowan

>"Actually, Vextab is what I am most interested in. I've managed to get it working by the same method used for Bopland."

Great :-) 

Does it work on Chrome too? (As I recall BJ's example only worked on FF)
Would you mind sharing a working example on tiddlyspot?

It would be great to have a music scratchpad in a TiddlyWIki again :-)

At the moment I use MuseScore to create guitar tabs on a pc/mac. 
I share interactive scores & videoscores on musescore.org.
It also provides an option to embed scores online. I do this in a TiddlyWiki.
MuseScore can export to pdf, mp3's and images - so It is pretty straight forward to have a collection of offline scores in a usable format. 
 
On mobile devices I use a musescore app to download, store, play and view scores. 
It is very stable and the workflow is seemless - all the way from creating a score in the (free) MuseScore program on a pc/mac/linux box. Here you can save a score directly to musescore.org. (up to 5 scores for free). 

Cheers Måns Mårtensson

Btw. I'm not affiliated with MuseScore in any way - just a happy user/customer :-)

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.

BJ

unread,
Feb 21, 2016, 6:45:41 AM2/21/16
to tiddl...@googlegroups.com, ma...@himmerlands-ungdomsskole.dk
HI folks,

As can be seen from posts earlier in this thread, the license for vextab stops us from including it as a plugin. Having said that, there is nothing stop the writing of a plugin that interfaces to it and requiring the user to download the lib. 

One alternative is the ABC system, which I made a proof of concept demo here:

http://abcmusic.tiddlyspot.com/

there is a thread about it here:

https://groups.google.com/d/msgid/tiddlywiki/e3a8a3d1-29eb-4ec7-84a4-57b491487d12%40googlegroups.com

all the best
BJ

Måns Mårtensson

unread,
Feb 21, 2016, 4:07:01 PM2/21/16
to TiddlyWiki
Ah - sorry BJ. I mixed things up.. I was actually referring to your abc example/prrof of concept, when I asked if Rowan's Vextab macro works on Chrome...

Do you say it is ok to create/publish a plugin which excludes the lib, which has to be downloaded and added to TW by the end user - to make it work offline? ( - not to conflict with the different licenses)

If I was the end user of the lib, a VexTab plugin (and TW of course) - would the differences in licenses prevent me from publishing my personal TW to the public? 

Abc looks promising even though it doesn't seem to be browser agnostic.

Cheers Måns Mårtensson

2016-02-21 12:45 GMT+01:00 BJ <bugg...@gmail.com>:

BJ

unread,
Feb 21, 2016, 5:02:00 PM2/21/16
to TiddlyWiki, ma...@himmerlands-ungdomsskole.dk


On Sunday, February 21, 2016 at 9:07:01 PM UTC, Måns wrote:
Ah - sorry BJ. I mixed things up.. I was actually referring to your abc example/prrof of concept, when I asked if Rowan's Vextab macro works on Chrome...

Do you say it is ok to create/publish a plugin which excludes the lib, which has to be downloaded and added to TW by the end user - to make it work offline? ( - not to conflict with the different licenses)
 
I think thats the way it works, the license is about re-distributing the lib (as well as usage in this case).
 
If I was the end user of the lib, a VexTab plugin (and TW of course) - would the differences in licenses prevent me from publishing my personal TW to the public? 
 
It would be the user (you in this case) who would have to comply with any restrictions of the license. If I remember correctly you would be able to use the license for non-commercial use. As you do want to be re-distributing the source it would be better to keep the lib as a separate file.

Abc looks promising even though it doesn't seem to be browser agnostic.
 
I think ABc works with chrome - its only my demo that's agnostic as chrome doesn't like html pages to download libs from github - as I do in this demo.

Rowan Corbett

unread,
Feb 22, 2016, 12:11:25 AM2/22/16
to TiddlyWiki, ma...@himmerlands-ungdomsskole.dk
Hey Måns,

Here's that example. I primarily use Chrome on Windows, but I can also confirm that it works in Internet Explorer and Safari on iPhone iOS 9.


Rowan

Måns Mårtensson

unread,
Feb 22, 2016, 6:00:37 AM2/22/16
to TiddlyWiki
Hi Rowan

Thank you very much for publishing an example :-)
It doesn't render notes if you go into editmode and back again.
Same problem if you close the sample tiddler and open it again.
It behaves the same way in FF and Chrome.

Does it work on your local TW?

Cheers Måns Mårtensson

Jed Carty

unread,
Feb 22, 2016, 6:13:52 AM2/22/16
to TiddlyWiki
The refresh problem is almost certainly caused by the javascript not having a refresh function that is called when a the div is displayed. I ran into this a few times when trying to add third-party javascript to TiddlyWiki. Unless there is some function given by vextab there isn't much that can be done without some significant work on your part.
Some libraries (like the twitter button scripts) do have built-in refresh functions that you can enable that take care of the problem, I haven't looked at the documentation to see if there is one here or not.

BJ

unread,
Feb 22, 2016, 8:30:58 AM2/22/16
to TiddlyWiki
The javascript api looks pretty simple, and very similar to abc (and both use raphael underneath). At a first glance, it seems they would both have the same problems with width (staying within the confines of a tiddler). The ABC plugin could be easily modified to work with vextab. As ABC uses a permissive license to would seem to be the better options - but both could be developed.

Rowan Corbett

unread,
Feb 22, 2016, 9:19:39 AM2/22/16
to TiddlyWiki
Hi Måns,
Unfortunately it works the same for me locally. I'm not much of a coder, so I was hoping there just something I was doing wrong.
I'll try doing a little research to see if I can find a workaround. :/

Rowan
Reply all
Reply to author
Forward
0 new messages