How to implement pre-made scripts in tiddlywiki?

[Michael Evans]

I'm trying to implement jtab in my wiki. It would be used on a good number of pages, so ideally, I want it to be includable in tiddlers as a plugin. It requires the libraries jquery, raphael, and the jtab script. All three can be found here, although from my understanding, jquery is already included in tiddlywiki.

I would like to somehow make this a plug-in if possible, not link to it externally. I've been messing around with no luck. What's the best way for me to do this?

[Eric Shulman]

On Monday, November 18, 2013 3:22:49 PM UTC-8, Michael Evans wrote:

I'm trying to implement jtab in my wiki. It would be used on a good number of pages, so ideally, I want it to be includable in tiddlers as a plugin. It requires the libraries jquery, raphael, and the jtab script. All three can be found here, although from my understanding, jquery is already included in tiddlywiki.

I would like to somehow make this a plug-in if possible, not link to it externally. I've been messing around with no luck. What's the best way for me to do this?

(note: the following is untested and may not work right)

As you've already noted, jQuery is included in the TWCore, so you don't need to add that.

To add Raphael (vector graphics library), copy the contents of the raphael.js source file and paste it into a tiddler.

To add jTab (music notation library), copy the contents of the jtab.js source file and paste it into the same tiddler as before, following the Raphael code.

At the end of the tiddler, add the following code:

config.macros.jtab = {
  handler: function() { jtab.renderimplicit(null); }
}

Make sure to tag the tiddler with "systemConfig" to make it a plugin.  Save and reload your document.  If all goes well, it should load and run the code you just pasted, which will initialize the Raphael and jTab libraries.  Then, create a tiddler containing:

--------------------

{{jTab{

... jtab syntax goes here ...

}}}<<jtab>>

--------------------

The content inside the {{jTab{...}}} wrapper should use jTab syntax.  If the plugin code is working, the <<jTab>> macro that follows after the wrapper causes the content within the wrapper to be displayed as jTab rendered music notation.

enjoy,

-e

Eric Shulman

TiddlyTools / ELS Design Studios

EVERY DONATION IS IMPORTANT!

HELP ME TO HELP YOU - MAKE A CONTRIBUTION TO MY "TIP JAR"...

   http://TiddlyTools.github.com/fundraising.html#MakeADonation

Professional TiddlyWiki Consulting Services...

Analysis, Design, and Custom Solutions:

   http://www.TiddlyTools.com/#Contact

[Michael Evans]

Brilliant. It works great. I would have never concatenated the two scripts or put the macro after the wrapper on my own.

[Måns]

Hi Michael

Example on how to implement it as a transcluded template via the tiddler macro.

Usage <<tiddler jTab with:"jtab syntax goes here">>:

http://jtab.tiddlyspot.com/#jTabUsage

Cheers Måns Mårtensson

[Måns]

Yet another musical scratchpad using same concept (notes and tabs - no chord diagrams)
http://bopland.tiddlyspot.com/

Enjoy Måns Mårtensson