Welcome to TiddlyWiki created by Jeremy Ruston, Copyright © 2007 UnaMesa Association
|''Type:''|file|
|''URL:''|file://H:\game trials\save.html|
|''Workspace:''|(default)|
This tiddler was automatically created to record the details of this server
|''Type:''|file|
|''URL:''|http://rhslibrary.tiddlyspot.com/|
|''Workspace:''|(default)|
This tiddler was automatically created to record the details of this server
*[[How to install a plugin]]
*[[TiddlyVault: your source for macros, plugins and themes]]
Here are the basic elements in a typical ~TiddlyWiki layout (this tutorial uses a modification that places the ~MainMenu at the top in a horizontal fashion). Below the graphic are links to other screen captures with more information.
[img[http://www.giffmex.org/images/mainscreen.GIF]]
[[The header]]
[[The main menu]]
[[The right hand menu]]
[[Anatomy of a Tiddler]]
With these tools you can practically make your ~TiddlyWiki file your command central for your computer!
*[[Use IFrames to embed other webpages in your TiddlyWiki]]
*[[Open the indexes of your hard drive, CD or USB files from inside your TiddlyWiki]]
*[[Browse your files and folders from within TiddlyWiki]]
*[[Launch applications from within TiddlyWiki]]
To align a cell so that its text displays at the top rather than the center, add
{{{vertical-align:top;}}}
at the beginning of the cell.
''~TiddlyWiki'' is © 2006 [[osmosoft|http://www.osmosoft.com]]. ~TiddlyWiki is a free program created under an Open Source License by Jeremy Ruston. (see at http://tiddlywiki.com).
''~TiddlyWiki for the rest of us'' is an instruction manual written by DaveGifford (his website is http://www.giffmex.org) and he can be contacted at //giff (at) giffmex (dot) org//
/***
|''Name:''|CryptoFunctionsPlugin|
|''Description:''|Support for cryptographic functions|
***/
//{{{
if(!version.extensions.CryptoFunctionsPlugin) {
version.extensions.CryptoFunctionsPlugin = {installed:true};
//--
//-- Crypto functions and associated conversion routines
//--
// Crypto "namespace"
function Crypto() {}
// Convert a string to an array of big-endian 32-bit words
Crypto.strToBe32s = function(str)
{
var be = Array();
var len = Math.floor(str.length/4);
var i, j;
for(i=0, j=0; i<len; i++, j+=4) {
be[i] = ((str.charCodeAt(j)&0xff) << 24)|((str.charCodeAt(j+1)&0xff) << 16)|((str.charCodeAt(j+2)&0xff) << 8)|(str.charCodeAt(j+3)&0xff);
}
while (j<str.length) {
be[j>>2] |= (str.charCodeAt(j)&0xff)<<(24-(j*8)%32);
j++;
}
return be;
};
// Convert an array of big-endian 32-bit words to a string
Crypto.be32sToStr = function(be)
{
var str = "";
for(var i=0;i<be.length*32;i+=8)
str += String.fromCharCode((be[i>>5]>>>(24-i%32)) & 0xff);
return str;
};
// Convert an array of big-endian 32-bit words to a hex string
Crypto.be32sToHex = function(be)
{
var hex = "0123456789ABCDEF";
var str = "";
for(var i=0;i<be.length*4;i++)
str += hex.charAt((be[i>>2]>>((3-i%4)*8+4))&0xF) + hex.charAt((be[i>>2]>>((3-i%4)*8))&0xF);
return str;
};
// Return, in hex, the SHA-1 hash of a string
Crypto.hexSha1Str = function(str)
{
return Crypto.be32sToHex(Crypto.sha1Str(str));
};
// Return the SHA-1 hash of a string
Crypto.sha1Str = function(str)
{
return Crypto.sha1(Crypto.strToBe32s(str),str.length);
};
// Calculate the SHA-1 hash of an array of blen bytes of big-endian 32-bit words
Crypto.sha1 = function(x,blen)
{
// Add 32-bit integers, wrapping at 32 bits
add32 = function(a,b)
{
var lsw = (a&0xFFFF)+(b&0xFFFF);
var msw = (a>>16)+(b>>16)+(lsw>>16);
return (msw<<16)|(lsw&0xFFFF);
};
// Add five 32-bit integers, wrapping at 32 bits
add32x5 = function(a,b,c,d,e)
{
var lsw = (a&0xFFFF)+(b&0xFFFF)+(c&0xFFFF)+(d&0xFFFF)+(e&0xFFFF);
var msw = (a>>16)+(b>>16)+(c>>16)+(d>>16)+(e>>16)+(lsw>>16);
return (msw<<16)|(lsw&0xFFFF);
};
// Bitwise rotate left a 32-bit integer by 1 bit
rol32 = function(n)
{
return (n>>>31)|(n<<1);
};
var len = blen*8;
// Append padding so length in bits is 448 mod 512
x[len>>5] |= 0x80 << (24-len%32);
// Append length
x[((len+64>>9)<<4)+15] = len;
var w = Array(80);
var k1 = 0x5A827999;
var k2 = 0x6ED9EBA1;
var k3 = 0x8F1BBCDC;
var k4 = 0xCA62C1D6;
var h0 = 0x67452301;
var h1 = 0xEFCDAB89;
var h2 = 0x98BADCFE;
var h3 = 0x10325476;
var h4 = 0xC3D2E1F0;
for(var i=0;i<x.length;i+=16) {
var j,t;
var a = h0;
var b = h1;
var c = h2;
var d = h3;
var e = h4;
for(j = 0;j<16;j++) {
w[j] = x[i+j];
t = add32x5(e,(a>>>27)|(a<<5),d^(b&(c^d)),w[j],k1);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=16;j<20;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),d^(b&(c^d)),w[j],k1);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=20;j<40;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),b^c^d,w[j],k2);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=40;j<60;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),(b&c)|(d&(b|c)),w[j],k3);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=60;j<80;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),b^c^d,w[j],k4);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
h0 = add32(h0,a);
h1 = add32(h1,b);
h2 = add32(h2,c);
h3 = add32(h3,d);
h4 = add32(h4,e);
}
return Array(h0,h1,h2,h3,h4);
};
}
//}}}
In the right-hand Interface options panel, there are several options with check boxes beside them, and two of them are {{{SaveBackups}}} and {{{AutoSave}}}. When {{{SaveBackups}}} is checked, ~TiddlyWiki automatically makes an entire backup copy of itself in the folder where it is located or in a folder designated by you in AdvancedOptions whenever changes are saved. When {{{AutoSave}}} is checked, ~TiddlyWiki saves changes immediately after they are made.
Below is a chart on the pros and cons of checking and unchecking these items.
|! ''SaveBackups'' |! ''AutoSave'' |! Description |! ''Use these options together...'' |
|vertical-align:top;[X]<<br>>(checked)|vertical-align:top;[X]<<br>>(checked)|vertical-align:top;~TiddlyWiki saves every change immediately to the current file, and also creates an entire backup copy of itself with every change.<<br>><<br>>If you make a mistake, just go to the backup of the previously saved version and rename it to the original file's name. |vertical-align:top;...if you really need a backup copy for every change you make, as a safety net so that you don't lose valuable information because of mistakes.<<br>><<br>>...if you don't want to hit "save changes" yourself but you need to save your data at every step.<<br>><<br>>...if you don't mind the delay in automatic saves and backups as your file gets larger.<<br>><<br>>...if you are willing to manually delete all those backup files (they add up fast!)<<br>><<br>>|
|bgcolor(#eeeeee):vertical-align:top;[_]<<br>>(unchecked)|bgcolor(#eeeeee):vertical-align:top;[_]<<br>>(unchecked)|bgcolor(#eeeeee):vertical-align:top;~TiddlyWiki saves nothing until you click "save changes" in the right-hand sidebar. Changes are saved to the current file. |bgcolor(#eeeeee):vertical-align:top;...if you don't need the safety net of backup copies in case of mistakes, and would prefer changes to be saved to the current file.<<br>><<br>>...if you prefer to save changes manually at regular intervals rather than wait while ~TiddlyWiki saves your changes for you.<<br>><<br>>...if you don't have the hard drive space for multiple backup copes or don't like deleting them.<<br>><<br>>...if you are confident that your computer won't crash between your manual saves.<<br>><<br>>|
|vertical-align:top;[X]<<br>>(checked)|vertical-align:top;[_]<<br>>(unchecked)|vertical-align:top;~TiddlyWiki saves an entire backup copy of itself, but only when you save changes manually.|vertical-align:top;...if you want the safety net of backup copies in case of mistakes, but you don't want one for every single change you make. <<br>><<br>>...if you prefer to save changes manually at regular intervals rather than have ~TiddlyWiki save changes at every step.<<br>><<br>>...if you are willing to manually delete backup files later.<<br>><<br>>...if you are confident that your computer won't crash between your manual saves.<<br>><<br>>|
|vertical-align:top;bgcolor(#eeeeee):[_]<<br>>(unchecked)|bgcolor(#eeeeee):vertical-align:top;[X]<<br>>(checked)|bgcolor(#eeeeee):vertical-align:top;~TiddlyWiki saves every change immediately to the current file, but does not create a backup copy of itself.|bgcolor(#eeeeee):vertical-align:top;...if you prefer changes to be saved to the current file rather than have the safety net of backup copies.<<br>><<br>>...if you prefer ~TiddlyWiki to save your changes automatically rather than have to hit 'save changes' every now and then.<<br>><<br>>...if you don't have the hard drive space for multiple backup copes or don't like deleting them.<<br>><<br>>...if you don't mind waiting for ~TiddlyWiki to save every change, because you want to make sure your changes are saved at every step.<<br>><<br>>...if you are confident that you won't irretrievably lose valuable information by making a mistake.<<br>><<br>>|
/***
|''Name:''|DeprecatedFunctionsPlugin|
|''Description:''|Support for deprecated functions removed from core|
***/
//{{{
if(!version.extensions.DeprecatedFunctionsPlugin) {
version.extensions.DeprecatedFunctionsPlugin = {installed:true};
//--
//-- Deprecated code
//--
// @Deprecated: Use createElementAndWikify and this.termRegExp instead
config.formatterHelpers.charFormatHelper = function(w)
{
w.subWikify(createTiddlyElement(w.output,this.element),this.terminator);
};
// @Deprecated: Use enclosedTextHelper and this.lookaheadRegExp instead
config.formatterHelpers.monospacedByLineHelper = function(w)
{
var lookaheadRegExp = new RegExp(this.lookahead,"mg");
lookaheadRegExp.lastIndex = w.matchStart;
var lookaheadMatch = lookaheadRegExp.exec(w.source);
if(lookaheadMatch && lookaheadMatch.index == w.matchStart) {
var text = lookaheadMatch[1];
if(config.browser.isIE)
text = text.replace(/\n/g,"\r");
createTiddlyElement(w.output,"pre",null,null,text);
w.nextMatch = lookaheadRegExp.lastIndex;
}
};
// @Deprecated: Use <br> or <br /> instead of <<br>>
config.macros.br = {};
config.macros.br.handler = function(place)
{
createTiddlyElement(place,"br");
};
// Find an entry in an array. Returns the array index or null
// @Deprecated: Use indexOf instead
Array.prototype.find = function(item)
{
var i = this.indexOf(item);
return i == -1 ? null : i;
};
// Load a tiddler from an HTML DIV. The caller should make sure to later call Tiddler.changed()
// @Deprecated: Use store.getLoader().internalizeTiddler instead
Tiddler.prototype.loadFromDiv = function(divRef,title)
{
return store.getLoader().internalizeTiddler(store,this,title,divRef);
};
// Format the text for storage in an HTML DIV
// @Deprecated Use store.getSaver().externalizeTiddler instead.
Tiddler.prototype.saveToDiv = function()
{
return store.getSaver().externalizeTiddler(store,this);
};
// @Deprecated: Use store.allTiddlersAsHtml() instead
function allTiddlersAsHtml()
{
return store.allTiddlersAsHtml();
}
// @Deprecated: Use refreshPageTemplate instead
function applyPageTemplate(title)
{
refreshPageTemplate(title);
}
// @Deprecated: Use story.displayTiddlers instead
function displayTiddlers(srcElement,titles,template,unused1,unused2,animate,unused3)
{
story.displayTiddlers(srcElement,titles,template,animate);
}
// @Deprecated: Use story.displayTiddler instead
function displayTiddler(srcElement,title,template,unused1,unused2,animate,unused3)
{
story.displayTiddler(srcElement,title,template,animate);
}
// @Deprecated: Use functions on right hand side directly instead
var createTiddlerPopup = Popup.create;
var scrollToTiddlerPopup = Popup.show;
var hideTiddlerPopup = Popup.remove;
// @Deprecated: Use right hand side directly instead
var regexpBackSlashEn = new RegExp("\\\\n","mg");
var regexpBackSlash = new RegExp("\\\\","mg");
var regexpBackSlashEss = new RegExp("\\\\s","mg");
var regexpNewLine = new RegExp("\n","mg");
var regexpCarriageReturn = new RegExp("\r","mg");
}
//}}}
/***
|!''Name:''|!''E''asily ''A''daptable ''S''ource ''E''ditor|
|''Description:''|this framework allows you to easily create commands that work on the current tiddler text selection in edit mode|
|''Version:''|0.1.0|
|''Date:''|13/01/2007|
|''Source:''|http://yann.perrin.googlepages.com/twkd.html#E.A.S.E|
|''Author:''|[[Yann Perrin|YannPerrin]]|
|''License:''|[[BSD open source license]]|
|''~CoreVersion:''|2.x|
|''Browser:''|Firefox 1.0.4+; Firefox 1.5; InternetExplorer 6.0|
***/
////Messages Definition
//{{{
config.messages.Ease = {
noselection:"nothing selected",
asktitle:"enter the new tiddler title",
exists:" already exists, please enter another title",
askForTagsLabel:"enter the new tiddler tags",
tiddlercreated:" tiddler created"
}
//}}}
////
//{{{
if (!window.TWkd) window.TWkd={context:{}};
if (!TWkd.Ease)
TWkd.Ease = function (text,tooltip){
this.text = text;
this.tooltip = tooltip;
this.modes = [];
this.addMode = function(modeDefinition) {this.modes.push(modeDefinition);};
this.handler = function(event,src,title) {
TWkd.context.command = this;
TWkd.context.selection=this.getSelection(title);
if (this.modes.length==1) {
this.modes[0].operation();
}
else {
var popup = Popup.create(src);
if(popup) {
for (var i=0; i<this.modes.length; i++) {
createTiddlyButton(createTiddlyElement(popup,"li"), this.modes[i].name, this.modes[i].tooltip, this.OperateFromButton, null, 'id'+i, null);
}
Popup.show(popup,false);
event.cancelBubble = true;
if (event.stopPropagation) event.stopPropagation();
return false;
}
}
};
};
TWkd.Ease.prototype.OperateFromButton = function(e){
var commandMode=this.getAttribute('Id').replace('id','');
TWkd.context.command.modes[commandMode].operation();
};
TWkd.Ease.prototype.getTiddlerEditField = function(title,field){
var tiddler = document.getElementById(story.idPrefix + title);
if(tiddler != null){
var children = tiddler.getElementsByTagName("*")
var e = null;
for (var t=0; t<children.length; t++){
var c = children[t];
if(c.tagName.toLowerCase() == "input" || c.tagName.toLowerCase() == "textarea"){
if(!e) {e = c;}
if(c.getAttribute("edit") == field){e = c;}
}
}
if(e){return e;}
}
} // closes getTiddlerEditField function definition
TWkd.Ease.prototype.getSelection = function(title,quiet) {
var tiddlerTextArea = this.getTiddlerEditField(title,"text");
var result = {};
if (document.selection != null && tiddlerTextArea.selectionStart == null) {
tiddlerTextArea.focus();
var range = document.selection.createRange();
var bookmark = range.getBookmark();
var contents = tiddlerTextArea.value;
var originalContents = contents;
var marker = "##SELECTION_MARKER_" + Math.random() + "##";
while(contents.indexOf(marker) != -1) {
marker = "##SELECTION_MARKER_" + Math.random() + "##";
}
var selection = range.text;
range.text = marker + range.text + marker;
contents = tiddlerTextArea.value;
result.start = contents.indexOf(marker);
contents = contents.replace(marker, "");
result.end = contents.indexOf(marker);
tiddlerTextArea.value = originalContents;
range.moveToBookmark(bookmark);
range.select();
}
else {
result.start=tiddlerTextArea.selectionStart;
result.end=tiddlerTextArea.selectionEnd;
}
result.content=tiddlerTextArea.value.substring(result.start,result.end);
result.source=title;
if (!result.content&&!quiet) displayMessage(config.messages.Ease.noselection);
return(result);
}//closes getSelection function definition
// replace selection or insert new content
TWkd.Ease.prototype.putInPlace=function(content,workplace) {
var tiddlerText = this.getTiddlerEditField(workplace.source,"text");
tiddlerText.value = tiddlerText.value.substring(0,workplace.start)+content+tiddlerText.value.substring(workplace.end);
}
// asking for title
TWkd.Ease.prototype.askForTitle = function(suggestion) {
if (!suggestion)
suggestion = "";
var newtitle;
while (!newtitle||store.tiddlerExists(newtitle))
{
if (store.tiddlerExists(newtitle))
displayMessage(newtitle+config.messages.Ease.exists);
newtitle = prompt(config.messages.Ease.asktitle,suggestion);
if (newtitle==null)
{
displayMessage(config.messages.Ease.titlecancel);
return(false);
}
}
return(newtitle);
}//closes askForTitle function definition
// creation of a new tiddler
TWkd.Ease.prototype.newTWkdLibTiddler = function(title,content,from,askForTags){
var tiddler = new Tiddler();
tiddler.title = title;
tiddler.modifier = config.options.txtUserName;
tiddler.text = content;
(from) ? tiddler.tags = [from] : tiddler.tags=[];
if (askForTags)
tiddler.tags = prompt(config.messages.Ease.askForTagsLabel,'[['+from+']]').readBracketedList();
store.addTiddler(tiddler);
//store.notifyAll();
displayMessage(title+config.messages.Ease.tiddlercreated);
}
if (!TWkd.Mode)
TWkd.Mode = function (name,tooltip,ask,operation) {
this.name = name;
this.tooltip = tooltip;
this.ask = ask;
this.operation = operation;
};
//}}}
<div class="toolbar" macro="toolbar +saveTiddler closeOthers -cancelTiddler deleteTiddler"></div>
<div class="title" macro="view title"></div>
<div class="editLabel">Title</div><div class="editor" macro="edit title"></div>
<div class="editLabel">Tags</div><div class="editor" macro="edit tags"></div>
<div class="editorFooter"><span macro="message views.editor.tagPrompt"></span><span macro="tagChooser"></span></div>
<div macro='hideWhen ((tiddler.tags.contains("Contacts"))||(tiddler.title=="New Contact"))'>[[EditToolbar]]<div class='editor' macro='edit text'></div></div>
<div macro='showWhen ((tiddler.tags.contains("Contacts"))||(tiddler.title=="New Contact"))'><div class='editor'>
<table width='100%'>
<tr><th>Name</th><td><span macro='edit ContactFirstName'></span><span macro='edit ContactLastName'></span></td><td rowspan='4' width='50%' macro='edit text'></td></tr>
<tr><th>Adress</th><td><span macro='edit ContactStreetNumber'></span><span macro='edit ContactStreetName'></span><span macro='edit ContactZipCode'></span><span macro='edit ContactCity'></span></td></tr>
<tr><th>Phone</th><td><span macro='edit ContactPhone'></span></td></tr>
<tr><th>Email</th><td><span macro='edit ContactMail'><span></td></tr>
</table>
</div></div>
<div macro='toolbar format slice tongue'></div>
Tables with one narrow column and one long column often force line breaks in the narrow column where words are separated by a space, as in this example:
|narrow column|narrow column|very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column |
To force those narrow cells onto one line, add the following code at the beginning of the cells:
{{{
@@white-space: nowrap;YOUR-TEXT-HERE@@
}}}
Here is the result:
|@@white-space: nowrap;narrow column@@|@@white-space: nowrap;narrow column@@|very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column very wide column |
Morris Gray has very nice lists of how to do ASCII symbols, Greek and Latin symbols, HTML entities and Math symbols at his wonderful TW Help site. To see these lists at his site, [[click here|http://twhelp.tiddlyspot.com/#Entities-Codes]].
''Line-by-line blockquotes:''
{{{>level 1}}}
{{{>level 1}}}
{{{>>level 2}}}
{{{>>level 2}}}
{{{>>>level 3}}}
{{{>>>level 3}}}
{{{>>level 2}}}
{{{>level 1}}}
produces:
>level 1
>level 1
>>level 2
>>level 2
>>>level 3
>>>level 3
>>level 2
>level 1
''Extended blockquotes:''
{{{<<<}}}
{{{Extended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotes}}}
{{{<<<}}}
produces:
<<<
Extended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotesExtended blockquotes
<<<
|bgcolor(#dddddd):Links with wikiwords|EnchiLada (inactive link - no tiddler yet)<br>WikiWord (active link to tiddler)|{{{EnchiLada}}}<br>{{{WikiWord}}}|
|bgcolor(#dddddd):~De-Wikify a ~WikiWord|~WikiWord, ~EnchiLada|{{{~WikiWord, ~EnchiLada}}}|
|bgcolor(#dddddd):Links with brackets|[[How to add background images]]|{{{[[How to add background images]]}}}|
|bgcolor(#dddddd):Pretty links|[[display text|ColorSchemes]] - links to the tiddler of color schemes|{{{[[display text|ColorSchemes]]}}}|
|bgcolor(#dddddd):External links work the same way:|http://groups.google.com/group/TiddlyWiki <br><br>[[TiddlyWiki Google group|http://groups.google.com/group/TiddlyWiki]]|{{{http://groups.google.com/group/TiddlyWiki}}} <br><br> {{{[[TiddlyWiki Google group|http://groups.google.com/group/TiddlyWiki]]}}}|
|bgcolor(#dddddd):Links to local files|To a file on a CD in your D drive: <br><br>To a file on your USB stick on your e drive: <br><br>To a file in your hard drive:|{{{file:///D:/filename.doc/}}}<br><br>{{{file:///E:/filename.doc/}}}<br><br>{{{file:///C:/filepath/filename.doc/}}}|
''Images:''
{{{[img[http://farm1.static.flickr.com/39/122259544_6913ca58f3_m.jpg]]}}} is the formatting for:
[img[http://farm1.static.flickr.com/39/122259544_6913ca58f3_m.jpg]]
''Numbered lists:''
{{{#item one }}}
{{{##Item 1a}}}
{{{###Item 1ai}}}
produces:
#item one
##Item 1a
###Item 1ai
''Bulleted lists:''
{{{*Bullet one}}}
{{{**Bullet two}}}
{{{***Bullet three}}}
produces:
*Bullet one
**Bullet two
***Bullet level three
!This is the formatting:
{{{|!Table header|!Column Two|}}}
{{{|>| colspan |}}}
{{{| rowspan |left aligned|}}}
{{{|~| right aligned|}}}
{{{|bgcolor(#DC1A1A):colored| centered |}}}
{{{||*lists<br>*within<br>*tables<br><br>and double-spaced too|}}}
{{{|caption|c}}}
!This is the result:
|!Table header|!Column Two|
|>| colspan |
| rowspan |left aligned|
|~| right aligned|
|bgcolor(#DC1A1A):colored| centered |
||*lists<br>*within<br>*tables<br><br>and double-spaced too|
|caption|c
[[More information on tables]]
!Format text
|!Format|!It will look like this...|!...if you format it like this...|
|Bold-faced type|''text''|{{{''text''}}}|
|Italic text|//text//|{{{//text//}}}|
|Underlined text|__text__|{{{__text__}}}|
|Strike-through text|--text--|{{{--text--}}}|
|Colored text|@@color(green):green colored@@|{{{@@color(green):green colored@@}}}|
|Text with colored background|@@bgcolor(#ff0000):color(#ffffff):red colored@@|{{{@@bgcolor(#ff0000):color(#ffffff):red colored@@}}}|
|Highlighting|@@text@@|{{{@@text@@}}}|
|Superscript|2^^3^^=8|{{{2^^3^^=8}}}|
|Subscript|a~~ij~~ = -a~~ji~~|{{{a~~ij~~ = -a~~ji~~}}}|
!Make the first letter of a paragraph extra large
(from Morris Gray's TW Help)
''Sample'':
{{firstletter{
@@color:#bbbbbb;O@@}}}kay, so you know how to use ~TiddlyWiki, but now you want more. You want to change the color or layout. You want to add features to it. As the subtitle says, this is an entry-level introduction, so I am not going to show you how to do every possible thing you can do with ~TiddlyWiki. I probably don't know half of what can be done. Advanced documentation such as that found at http://www.tiddlywiki.org/wiki and http://tiddlyspot.com/twhelp/ can hopefully expand your horizons.
''How to do it:''
1. Add the following code to your StyleSheet:
{{{
.firstletter{ float:left; width:0.75em; font-size:400%; font-family:times,arial; line-height:60%; }
}}}
2. Add the following code to your tiddler at the place where your enlarged letter would go (replacing "O" with the appropriate letter):
{{{
{{firstletter{
@@color:#c06;O@@
}}}
}}}
The librarians there can offer the same advice as when you [[ask a teacher-librarian]].
You get to the beautiful school library and see a smart-looking teacher-librarian, cool books and available
computers.
You decide to:
*[[ask a teacher-librarian]]
*[[use Wikipedia]]
*[[go Google]]
/%
|Name|HideTiddlerTags|
|Source|http://www.TiddlyTools.com/#HideTiddlerTags|
|Version|0.0.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <br>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|script|
|Requires|InlineJavascriptPlugin|
|Overrides||
|Description|hide a tiddler's tagged/tagging display elements|
Usage: <<tiddler HideTiddlerTags>>
%/<script>
var t=story.findContainingTiddler(place);
if (!t || t.id=="tiddlerHideTiddlerTags") return;
var nodes=t.getElementsByTagName("div");
for (var i=0; i<nodes.length; i++)
if (hasClass(nodes[i],"tagging")||hasClass(nodes[i],"tagged"))
nodes[i].style.display="none";
</script>
/***
| Name:|HideWhenPlugin|
| Description:|Allows conditional inclusion/exclusion in templates|
| Version:|6.9.3|
| Date:|30-Sep-2006|
| Source:|http://mptw.tiddlyspot.com/#HideWhenPlugin|
| Author:|Simon Baird <simon.baird@gmail.com>|
For use in ViewTemplate and EditTemplate. Eg
{{{<div macro="showWhen tiddler.tags.contains('Task')">[[TaskToolbar]]</div>}}}
{{{<div macro="showWhen tiddler.modifier == 'BartSimpson'"><img src="bart.gif"/></div>}}}
***/
//{{{
merge(config.macros,{
hideWhen: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
if (eval(paramString)) {
removeChildren(place);
place.parentNode.removeChild(place);
}
}},
showWhen: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
config.macros.hideWhen.handler(place,macroName,params,wikifier,'!('+paramString+')',tiddler);
}}
});
//}}}
TiddlyWiki was designed to be a "client-side" wiki - a wiki that you can use while offline, as opposed to an online "server-side" wiki such as Wikipedia. Nevertheless, you may wish to have your TW online, as a blog, or maybe to have it handy to edit from other locations. If so, there are several ways to host your ~TiddlyWiki online.
''If you need free hosting'', check out the following sites:
*''Tiddlyspot'' at http://tiddlyspot.com. They even have several flavors of ~TWs to choose from.
*''~ServerSideWiki'' at http://serversidewiki.com.
''If you have your own website,'' there are at least a couple options:
*~BidiXTW's ''~UploadPlugin'' at http://tiddlywiki.bidix.info/#HowToUpload
*''ccTiddly'' at http://cctiddly.sourceforge.net
*''~MiniTiddlerServer'' at http://www.minitiddlyserver.com
*''~PrinceTiddlyWiki'' at http://ptw.sourceforge.net
*''~PHPTiddlyWiki'' at http://www.patrickcurry.com/tiddly
You'll have to know what you're doing for these last options. The documentation isn't written in everyday language. Maybe someday I'll get around to "~UploadPlugin for the rest of us"...
Let's say you're using a more typical ~TiddlyWiki file, one that has a left-hand ~MainMenu, and you want to have a top menu just like this tutorial does. (You make me blush with pride). Here's how:
!Step one: Add the horizontal menu code to your StyleSheet
There are many style tweaks you could give to your top menu. The following code is from the Monkey Pirate ~TiddlyWiki theme by Simon Baird. Add this code to your StyleSheet tiddler:
/*{{{*/
/* horizontal main menu */
#displayArea { margin: 1em 15.5em 0em 1em; } /* use the full horizontal width */
#topMenu { background: [[ColorPalette::PrimaryMid]]; color: [[ColorPalette::PrimaryPale]]; padding: 0.2em 0.2em 0.2em 0.5em; border-bottom: 2px solid #000000; }
#topMenu br { display: none; }
#topMenu .button, #topMenu .tiddlyLink, #topMenu a { margin-left: 0.25em; margin-right: 0.25em; padding-left: 0.5em; padding-right: 0.5em; color: [[ColorPalette::PrimaryPale]]; font-size: 1.15em; }
#topMenu .button:hover, #topMenu .tiddlyLink:hover { background: [[ColorPalette::PrimaryDark]]; }
/*}}}*/
!Step two: add the horizontal menu rule to the PageTemplate
In PageTemplate, right above this code for your regular MainMenu:
<!--{{{-->
<div id='mainMenu' refresh='content' tiddler='MainMenu'></div>
<!--}}}-->
Add the following three lines:
<!--{{{-->
<!-- horizontal MainMenu -->
<div id='topMenu' refresh='content' tiddler='MainMenu'></div>
<!--original MainMenu menu-->
<!--}}}-->
(The first of the three lines above is the name for the topmenu code. The second is the actual topmenu code. The third is the name for the original mainmenu code, and it should now be right above the original code.
Let's say you're working with a file based on this tutorial or some other ~TiddlyWiki that has a top menu. You will need to do three things to get rid of that top menu and make the left-hand menu visible.
!Step one: remove the top menu lines from the PageTemplate.
Open PageTemplate and delete the following two lines:
<!--{{{-->
<!-- horizontal MainMenu -->
<div id='topMenu' refresh='content' tiddler='MainMenu'></div>
<!--}}}-->
!Step two: remove the 'safety guards' from the original MainMenu code
In PageTemplate still, change this line:
<!--{{{-->
<!--<div id='mainMenu' refresh='content' tiddler='MainMenu'></div>-->
<!--}}}-->
So that it looks like this:
<!--{{{-->
<div id='mainMenu' refresh='content' tiddler='MainMenu'></div>
<!--}}}-->
!Step three: Adjust the MainMenu and display area in the StyleSheet:
In StyleSheet, add this code, which widens the left-hand MainMenu area and narrows the Tiddler display area:
<!--{{{-->
/* Widens the mainmenu and adds padding between right-aligned menu text and the right edge of the menu. */
#mainMenu {
width: 13em;
padding: 4em 2em 2em 0.5 em;
}
/* Moves tiddler display area to the right to account for widened mainmenu */
#displayArea {
margin: 0em 1em 0em 15em;
}
<!--}}}-->
That should be it! If you still have problems, let me know at giff (at) giffmex (dot) org.
{{invisibletable{
|width:25em; When I became acquainted with ~TiddlyWiki in September 2006 I //instantly// realized how useful it would be for me. But at the time there was not much documentation, and what little existed was written by and for computer geniuses. Their documentation assumed that the reader already knew quite a bit about various computer codes and the inner workings of ~TiddlyWiki.<br><br>So I had to learn ~TiddlyWiki the hard, slow way. The people at the ~TiddlyWiki Google group were very helpful in guiding me along. But I knew not every newcomer like me would want to go through such a tedious learning process. So I decided to create this simple tutorial. If you've heard about ~TiddlyWiki but don't know "Tiddly squat" about it, then this tutorial is for you. Enjoy!|''Basic instructions:''<br>[[What in the world is a TiddlyWiki?]]<br>[[For beginners: reading TiddlyWikis on the Internet]]<br>[[Save a TiddlyWiki file to your computer]]<br>[[Browser-specific issues]]<br>[[Printing from a TiddlyWiki file]]<br>[[For medium users: adding your own material to a TiddlyWiki file]]<br>[[For advanced users: Customize your TW experience]]<br>[[Host your TiddlyWiki online]]<br><br>''Also helpful:''<br>[[A visual guide to the TiddlyWiki layout]]<br>[[Version 2.2]]<br>[[Special formatting]]<br>[[Where to go for more information]]<br><br>If you found this tutorial helpful, would you consider helping me buy books via an Amazon gift certificate?<br><br><html><a href="https://www.amazon.com/gp/registry/wishlist/1OTJM9IE7SPVS/ref=wl_web/"><img src="https://images-na.ssl-images-amazon.com/images/G/01/gifts/registries/wishlist/v2/web/wl-btn-74-b._V46774601_.gif" width="74" alt="My Amazon.com Wish List" height="42" border="0" /></a></html>|
}}}
Add the following code to the StyleSheet tiddler, being sure to place your image url inside the paretheses:
<!--{{{-->
body {background-image: url();
background-repeat: repeat; background-position: left; backgound-color: transparent; font-family: Helvetica;}
<!--}}}-->
Obviously if it is an image on the Internet, you will only have access to the image while online.
I honestly don't remember when or where I found the information below. But I've cut-and-pasted it here (with a few minor adjustments) because it is a nice visual explanation of gradients.
<<gradient horiz #bbbbbb #eeeeee #ffffff>>The new GradientMacro allows simple horizontal and vertical coloured gradients. They are constructed from coloured HTML elements, and don't require any images to work.>>
The syntax for the gradient macro looks like this:
{{{
<<gradient vert #ffffff #ffdddd #ff8888>>gradient fill>>
}}}
Inside double angle brackets there are ''four elements:''
#"gradient" tells ~TiddlyWiki what kind of macro this is.
#"vert" is for vertical gradients and "horiz" is for horizontal gradients.
#What follows is a sequence of the code for the two or more colors that you want in your gradient. You may use CSS or RGB ways of indicating colors. For more on colors, see [[here|Changing the colors of a TiddlyWiki]].
#">>gradient fill>>" finishes off your macro.
''Here is another gradient example:''
| <<gradient vert #ffffff #ffdddd #ff8888>>No images were harmed in the making of this gradient fill>> | <<gradient vert #ffffff #ddffdd #88ff88>>No images were harmed in the making of this gradient fill>> | <<gradient vert #ffffff #ddddff #8888ff>>No images were harmed in the making of this gradient fill>> |
Here's the code for the image above.
{{{
| <<gradient vert #ffffff #ffdddd #ff8888>>No images were harmed in the making of this gradient fill>> | <<gradient vert #ffffff #ddffdd #88ff88>>No images were harmed in the making of this gradient fill>> | <<gradient vert #ffffff #ddddff #8888ff>>No images were harmed in the making of this gradient fill>> |
}}}
Inline CSS definitions can be added to gradient fills like this:
<<gradient vert #000000 #660000 #aa2222>>color:#ffffff;font-size:12pt;Darkness>>
Here's the code for the image above.
{{{
<<gradient vert #000000 #660000 #aa2222>>color:#ffffff;font-size:12pt;Darkness>>
}}}
If you create tiddlers with the same information over and over (contacts, quotations, recipes, etc), you are probably going to want a template tiddler to save time. Then you are going to want a macro that creates a new tiddler that includes the information from the template. Here's how:
#''Create the template tiddler.'' Put text and tables and formatting exactly the way you want your new tiddlers based on this template to appear.
#''Create a macro that will open a new tiddler based on your template.''<br>Where I have listed YYYY, insert the words you want to appear in the label for your macro. Where I have listed ZZZZ, insert the exact title of the template tiddler that each new tiddler will be based on. Where I have XXXX insert any tags that you want to be appended to each tiddler that the macro creates.
/*{{{*/
<<newTiddler label:"YYYY" tag:"XXXX" text:{{store.getTiddlerText('ZZZZ')}}>>
/*}}}*/
3. ''Decide where you are going to store your macro.'' You can add it to the SideBarOptions menu under 'new tiddler' and 'new journal.' Or you can add it to a tiddler that you can access from your MainMenu.
Plugins are tiddlers embedded with codes that add special functions to ~TiddlyWiki files. Plugins are easier to install than I thought they would be. Here's how:
*Find the plugin you want and grab the url of the page it's on. (Copy the url from your browser's search window).
*In your own ~TiddlyWiki file, click on ImportTiddlers, found in the backstage area for versions 2.2 and beyond, and on the InterfaceOptions panel in the righthand sidebar of earlier versions.
*Paste the url you've copied into the top window of the import tiddlers tiddler that appears. Then click Fetch.
*A list of all the tiddlers found in the other file will appear. Find the tiddler of the plugin you want, then check the box next to it.
*Below the list is a menu that says "More actions..." Choose "Import these tiddlers."
*Your screen will blink and change several times while your file is being updated. If you have your ~TiddlyWiki configured to automatically save every change (which is default), the box will appear in the top right corner saying it has saved the change. If you have it configured another way, then click on "save changes".
*Hit the 'refresh' or 'reload' button on your browser.
*The plugin should now be installed and usable on your file. That's it!
/***
|Name|InlineJavascriptPlugin|
|Source|http://www.TiddlyTools.com/#InlineJavascriptPlugin|
|Version|1.6.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <<br>>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides||
|Description|Insert Javascript executable code directly into your tiddler content.|
''Call directly into TW core utility routines, define new functions, calculate values, add dynamically-generated TiddlyWiki-formatted output'' into tiddler content, or perform any other programmatic actions each time the tiddler is rendered.
!!!!!Usage
<<<
When installed, this plugin adds new wiki syntax for surrounding tiddler content with {{{<script>}}} and {{{</script>}}} markers, so that it can be treated as embedded javascript and executed each time the tiddler is rendered.
''Deferred execution from an 'onClick' link''
By including a {{{label="..."}}} parameter in the initial {{{<script>}}} marker, the plugin will create a link to an 'onclick' script that will only be executed when that specific link is clicked, rather than running the script each time the tiddler is rendered. You may also include a {{{title="..."}}} parameter to specify the 'tooltip' text that will appear whenever the mouse is moved over the onClick link text
''External script source files:''
You can also load javascript from an external source URL, by including a src="..." parameter in the initial {{{<script>}}} marker (e.g., {{{<script src="demo.js"></script>}}}). This is particularly useful when incorporating third-party javascript libraries for use in custom extensions and plugins. The 'foreign' javascript code remains isolated in a separate file that can be easily replaced whenever an updated library file becomes available.
''Display script source in tiddler output''
By including the keyword parameter "show", in the initial {{{<script>}}} marker, the plugin will include the script source code in the output that it displays in the tiddler.
''Defining javascript functions and libraries:''
Although the external javascript file is loaded while the tiddler content is being rendered, any functions it defines will not be available for use until //after// the rendering has been completed. Thus, you cannot load a library and //immediately// use it's functions within the same tiddler. However, once that tiddler has been loaded, the library functions can be freely used in any tiddler (even the one in which it was initially loaded).
To ensure that your javascript functions are always available when needed, you should load the libraries from a tiddler that will be rendered as soon as your TiddlyWiki document is opened. For example, you could put your {{{<script src="..."></script>}}} syntax into a tiddler called LoadScripts, and then add {{{<<tiddler LoadScripts>>}}} in your MainMenu tiddler.
Since the MainMenu is always rendered immediately upon opening your document, the library will always be loaded before any other tiddlers that rely upon the functions it defines. Loading an external javascript library does not produce any direct output in the tiddler, so these definitions should have no impact on the appearance of your MainMenu.
''Creating dynamic tiddler content''
An important difference between this implementation of embedded scripting and conventional embedded javascript techniques for web pages is the method used to produce output that is dynamically inserted into the document:
* In a typical web document, you use the document.write() function to output text sequences (often containing HTML tags) that are then rendered when the entire document is first loaded into the browser window.
* However, in a ~TiddlyWiki document, tiddlers (and other DOM elements) are created, deleted, and rendered "on-the-fly", so writing directly to the global 'document' object does not produce the results you want (i.e., replacing the embedded script within the tiddler content), and completely replaces the entire ~TiddlyWiki document in your browser window.
* To allow these scripts to work unmodified, the plugin automatically converts all occurences of document.write() so that the output is inserted into the tiddler content instead of replacing the entire ~TiddlyWiki document.
If your script does not use document.write() to create dynamically embedded content within a tiddler, your javascript can, as an alternative, explicitly return a text value that the plugin can then pass through the wikify() rendering engine to insert into the tiddler display. For example, using {{{return "thistext"}}} will produce the same output as {{{document.write("thistext")}}}.
//Note: your script code is automatically 'wrapped' inside a function, {{{_out()}}}, so that any return value you provide can be correctly handled by the plugin and inserted into the tiddler. To avoid unpredictable results (and possibly fatal execution errors), this function should never be redefined or called from ''within'' your script code.//
''Accessing the ~TiddlyWiki DOM''
The plugin provides one pre-defined variable, 'place', that is passed in to your javascript code so that it can have direct access to the containing DOM element into which the tiddler output is currently being rendered.
Access to this DOM element allows you to create scripts that can:
* vary their actions based upon the specific location in which they are embedded
* access 'tiddler-relative' information (use findContainingTiddler(place))
* perform direct DOM manipulations (when returning wikified text is not enough)
<<<
!!!!!Examples
<<<
an "alert" message box:
><script show>
alert('InlineJavascriptPlugin: this is a demonstration message');
</script>
dynamic output:
><script show>
return (new Date()).toString();
</script>
wikified dynamic output:
><script show>
return "link to current user: [["+config.options.txtUserName+"]]";
</script>
dynamic output using 'place' to get size information for current tiddler:
><script show>
if (!window.story) window.story=window;
var title=story.findContainingTiddler(place).id.substr(7);
return title+" is using "+store.getTiddlerText(title).length+" bytes";
</script>
creating an 'onclick' button/link that runs a script:
><script label="click here" title="clicking this link will show an 'alert' box" show>
if (!window.story) window.story=window;
alert("Hello World!\nlinktext='"+place.firstChild.data+"'\ntiddler='"+story.findContainingTiddler(place).id.substr(7)+"'");
</script>
loading a script from a source url:
>http://www.TiddlyTools.com/demo.js contains:
>>{{{function demo() { alert('this output is from demo(), defined in demo.js') } }}}
>>{{{alert('InlineJavascriptPlugin: demo.js has been loaded'); }}}
><script src="demo.js" show>
return "loading demo.js..."
</script>
><script label="click to execute demo() function" show>
demo()
</script>
<<<
!!!!!Installation
<<<
import (or copy/paste) the following tiddlers into your document:
''InlineJavascriptPlugin'' (tagged with <<tag systemConfig>>)
<<<
!!!!!Revision History
<<<
''2007.02.19 [1.6.0]'' added support for title="..." to specify mouseover tooltip when using an onclick (label="...") script
''2006.10.16 [1.5.2]'' add newline before closing '}' in 'function out_' wrapper. Fixes error caused when last line of script is a comment.
''2006.06.01 [1.5.1]'' when calling wikify() on script return value, pass hightlightRegExp and tiddler params so macros that rely on these values can render properly
''2006.04.19 [1.5.0]'' added 'show' parameter to force display of javascript source code in tiddler output
''2006.01.05 [1.4.0]'' added support 'onclick' scripts. When label="..." param is present, a button/link is created using the indicated label text, and the script is only executed when the button/link is clicked. 'place' value is set to match the clicked button/link element.
''2005.12.13 [1.3.1]'' when catching eval error in IE, e.description contains the error text, instead of e.toString(). Fixed error reporting so IE shows the correct response text. Based on a suggestion by UdoBorkowski
''2005.11.09 [1.3.0]'' for 'inline' scripts (i.e., not scripts loaded with src="..."), automatically replace calls to 'document.write()' with 'place.innerHTML+=' so script output is directed into tiddler content. Based on a suggestion by BradleyMeck
''2005.11.08 [1.2.0]'' handle loading of javascript from an external URL via src="..." syntax
''2005.11.08 [1.1.0]'' pass 'place' param into scripts to provide direct DOM access
''2005.11.08 [1.0.0]'' initial release
<<<
!!!!!Credits
<<<
This feature was developed by EricShulman from [[ELS Design Studios|http:/www.elsdesign.com]]
<<<
!!!!!Code
***/
//{{{
version.extensions.inlineJavascript= {major: 1, minor: 6, revision: 0, date: new Date(2007,2,19)};
config.formatters.push( {
name: "inlineJavascript",
match: "\\<script",
lookahead: "\\<script(?: src=\\\"((?:.|\\n)*?)\\\")?(?: label=\\\"((?:.|\\n)*?)\\\")?(?: title=\\\"((?:.|\\n)*?)\\\")?( show)?\\>((?:.|\\n)*?)\\</script\\>",
handler: function(w) {
var lookaheadRegExp = new RegExp(this.lookahead,"mg");
lookaheadRegExp.lastIndex = w.matchStart;
var lookaheadMatch = lookaheadRegExp.exec(w.source)
if(lookaheadMatch && lookaheadMatch.index == w.matchStart) {
if (lookaheadMatch[1]) { // load a script library
// make script tag, set src, add to body to execute, then remove for cleanup
var script = document.createElement("script"); script.src = lookaheadMatch[1];
document.body.appendChild(script); document.body.removeChild(script);
}
if (lookaheadMatch[5]) { // there is script code
if (lookaheadMatch[4]) // show inline script code in tiddler output
wikify("{{{\n"+lookaheadMatch[0]+"\n}}}\n",w.output);
if (lookaheadMatch[2]) { // create a link to an 'onclick' script
// add a link, define click handler, save code in link (pass 'place'), set link attributes
var link=createTiddlyElement(w.output,"a",null,"tiddlyLinkExisting",lookaheadMatch[2]);
link.onclick=function(){try{return(eval(this.code))}catch(e){alert(e.description?e.description:e.toString())}}
link.code="function _out(place){"+lookaheadMatch[5]+"\n};_out(this);"
link.setAttribute("title",lookaheadMatch[3]?lookaheadMatch[3]:"");
link.setAttribute("href","javascript:;");
link.style.cursor="pointer";
}
else { // run inline script code
var code="function _out(place){"+lookaheadMatch[5]+"\n};_out(w.output);"
code=code.replace(/document.write\(/gi,'place.innerHTML+=(');
try { var out = eval(code); } catch(e) { out = e.description?e.description:e.toString(); }
if (out && out.length) wikify(out,w.output,w.highlightRegExp,w.tiddler);
}
}
w.nextMatch = lookaheadMatch.index + lookaheadMatch[0].length;
}
}
} )
//}}}
The ''~LaunchApplicationsPlugin'' allows you to launch other programs (Outlook, Word, etc) from within ~TiddlyWiki.
You can access it either [[here|http://www.Remotely-Helpful.com/TiddlyWiki/LaunchApplication.html]] or [[here|http://www.Remotely-Helpful.com/TiddlyWiki/LaunchApplication.html|]]. Be aware that there are security risks involved with some uses of this plugin. See Morris Gray's help file [[here|http://twhelp.tiddlyspot.com/#%5B%5BLaunch%20Applications%20Plugin%5D%5D]] for more information.
Background: #eeeeff
Foreground: #000
PrimaryPale: #ddccff
PrimaryLight: #eeeeff
PrimaryMid: #330066
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #330066
TertiaryPale: #ddccff
TertiaryLight: #EEC591
TertiaryMid: #000
TertiaryDark: #8B7355
This information taken from Julian Knight's ~TiddlyWiki, which can be [[found here|http://knighjm.googlepages.com/knightnet-default-tw.html]].
Macros let you write tiddlers containing more exotic objects than just text. Here are the built-in macros:
|!Macro|!Description|!Syntax|
|allTags|List all the tags used in the current ~TiddlyWiki file<<br>>Each entry is a button that pops up the list of tiddlers for that tag<<br>><<slider sliderID [[Internal Macros/tags]] 'Click to show example output'>>|{{{<<allTags>>}}}|
|br|Force a line break|{{{<<br>>}}}|
|closeAll|Displays a button to close all displayed Tiddlers<<br>><<closeAll>>|{{{<<closeAll>>}}}|
|gradient|<<gradient [horiz|vert] #bbbbbb #eeeeee #ffffff>>Produces a horizontal or vertical background gradient fill>><<br>>There can be 2 or more colours in the format: #rrggbb (hex), or RGB(r,g,b) (CSS)<<br>>Other CSS formatting can also be added, e.g. {{{<<gradient vert #000000 #660000 #aa2222>>color:#ffffff;font-size:12pt;Darkness>>}}}|{{{<<gradient [horiz|vert] #bbbbbb #eeeeee #ffffff>>Some text here>>}}}|
|list all|List all Tiddlers in a Tiddler|{{{<<list all>>}}}|
|list missing|List all missing tiddlers|{{{<<list missing>>}}}|
|list orphans|List all orphaned tiddlers|{{{<<list orphans>>}}}|
|newJournal|Displays a button to create new date & Time stamped Tiddler (Date/time format optional)<<br>><<newJournal "DD MMM YYYY, hh:mm">> <<br>>You can also add optional tag names after the date format: <<newJournal "DD MMM YYYY, hh:mm" tag1 TagTwo>> |{{{<<newJournal [DateFormatString]>>}}} <<br>> {{{<<newJournal "DD MMM YYYY, hh:mm" tag1 TagTwo>>}}} |
|newTiddler|Displays a button to create new Tiddler<<br>><<newTiddler>>|{{{<<newTiddler>>}}}|
|permaview|Displays a button to change the URL link for all open Tiddlers - or the containing tiddler if used in the command bar (See the ViewTemplate)<<br>><<permaview>>|{{{<<permaview>>}}}|
|saveChanges |Button to save all ~TiddlyWiki changes (or the current tiddler if used in the command bar (see EditTemplate)<<br>><<saveChanges>>|{{{<<saveChanges>>}}}|
|search|Display a Search box<<br>><<search>>|{{{<<search>>}}}|
|slider|Display a Slider (a collapsable display of another tiddler)<<br>>See the allTags entry for an example. Note: Put quotes around the label if needing spaces<<br>>where: ''ID''=cookie name to be used to save the state of the slider, ''Tiddler''=name of the tiddler to include in the slider, ''Label''=label text of the slider button, ''tooltip''=text of the buttons tooltip|{{{<<slider ID Tiddler [Label] [toolTip]>>}}}|
|sparkline|Produces a sparkline graphic<<br>>e.g. <<sparkline 163 218 231 236 232 266 176 249 289 1041 1835 2285 3098 2101 1755 3283 3353 3335 2898 2224 1404 1354 1825 1839 2142 1942 1784 1145 979 1328 1611>>|{{{<<sparkline num1 num2 ... numN>>}}}|
|tabs|Display Tabbed content (contents of tab provided by another tiddler)|{{{<<tabs identifier tabLabel tabName Tiddlername>>}}}|
|tag|Display a Tag ~PopUp<<br>><<tag _Config>>|{{{<<tag tagName>>}}}|
|tagChooser|Used in EditTemplate to add tags to the tags field. Doesn't actually add anything unless in edit mode (though it does show the list)<<br>><<tagChooser>>|{{{<<tagChooser>>}}}|
|tagging|<<tiddler [[Internal Macros/tagging]]>>|{{{<<tagging [TiddlerTitle]>>}}}|
|tiddler|Display contents of another tiddler inline|{{{<<tiddler Tiddler>>}}}|
|timeline|Display a timeline list of tiddlers<<br>>where the sortfield is the sort order ("modified" or "created") and maxentries is the maximum number of entries|{{{<<timeline [sortfield] [maxentries]>>}}}|
|today|Display Today's Date<<br>>e.g. <<today>>|{{{<<today [DateFormatString]>>}}}|
|version|Display ~TiddlyWiki's version<<br>>e.g. <<version>>|{{{<<version>>}}}|
!DateFormatString
Several Macros including the today macro take a DateFormatString as an optional argument. This string can be a combination of ordinary text, with some special characters that get substituted by parts of the date:
* DDD - day of week in full (eg, "Monday")
* DD - day of month, 0DD - adds a leading zero
* MMM - month in full (eg, "July")
* MM - month number, 0MM - adds leading zero
* YYYY - full year, YY - two digit year
* hh - hours
* mm - minutes
* ss - seconds
!Notes
If you need to supply a parameter that should be evaluated (e.g. a JavaScript variable), enclose the parameter in {{{{{}}} and {{{}}}}} rather than quotes. Note however, that the scope used in the evaluation is {{{global}}} rather than {{{local}}}. In other words, the evaluation is done ''before'' the parameter is passed to the macro/plugin so it cannot access any of the variables or functions defined within the macro/plugin.
!Commands supported by the toolbar macro
{{{
config.commands = {
closeTiddler: {text: "close", tooltip: "Close this tiddler"},
closeOthers: {text: "close others", tooltip: "Close all other tiddlers"},
editTiddler: {text: "edit", tooltip: "Edit this tiddler", readOnlyText: "view", readOnlyTooltip: "View the source of this tiddler"},
saveTiddler: {text: "done", tooltip: "Save changes to this tiddler", readOnlyText: "done", readOnlyTooltip: "View this tiddler normally"},
cancelTiddler: {text: "cancel", tooltip: "Undo changes to this tiddler", hideReadOnly: true},
deleteTiddler: {text: "delete", tooltip: "Delete this tiddler", warning: "Are you sure you want to delete '%0'?", hideReadOnly: true},
permalink: {text: "permalink", tooltip: "Permalink for this tiddler"},
references: {text: "references", tooltip: "Show tiddlers that link to this one", popupNone: "No references"},
jump: {text: "jump", tooltip: "Jump to another open tiddler"}
};
}}}
(Julian Knight, 2006-04-06)
<part tagging hidden>
Produces a list (NB: <ul> ''not'' a popup) of links to tiddlers that carry the specified tag. If no tag is specified, it looks for tiddlers tagged with the name of the current tiddler.
In HTML, the list is formatted like so:
{{{
<ul>
<li class="listTitle">List title label</li>
<li><a class="tiddlyLink ..." href="javascript:;" onclick="..."
refresh="link" tiddlyLink="ExampleOne">ExampleOne</a></li>
</ul>
}}}
</part>
<part tags hidden>
<<allTags>>
</part>
/***
|''Name:''|LoadRemoteFileThroughProxy (previous LoadRemoteFileHijack)|
|''Description:''|When the TiddlyWiki file is located on the web (view over http) the content of [[SiteProxy]] tiddler is added in front of the file url. If [[SiteProxy]] does not exist "/proxy/" is added. |
|''Version:''|1.1.0|
|''Date:''|mar 17, 2007|
|''Source:''|http://tiddlywiki.bidix.info/#LoadRemoteFileHijack|
|''Author:''|BidiX (BidiX (at) bidix (dot) info)|
|''License:''|[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D ]]|
|''~CoreVersion:''|2.2.0|
***/
//{{{
version.extensions.LoadRemoteFileThroughProxy = {
major: 1, minor: 1, revision: 0,
date: new Date("mar 17, 2007"),
source: "http://tiddlywiki.bidix.info/#LoadRemoteFileThroughProxy"};
if (!window.bidix) window.bidix = {}; // bidix namespace
if (!bidix.core) bidix.core = {};
bidix.core.loadRemoteFile = loadRemoteFile;
loadRemoteFile = function(url,callback,params)
{
if ((document.location.toString().substr(0,4) == "http") && (url.substr(0,4) == "http")){
url = store.getTiddlerText("SiteProxy", "/proxy/") + url;
}
return bidix.core.loadRemoteFile(url,callback,params);
}
//}}}
Macros are basically shortcuts. If you open up the ImportTiddlers tiddler, you will see an elaborate layout with text boxes and various colors and instructions. But if you double-click on it to go into edit mode, you will see only the following: {{{ <<importTiddlers>> }}}. This is a macro that creates the elaborate Import Tiddlers layout.
Here is Julian Knight's fairly complete list of the macros built into ~TiddlyWiki, and what each macro does. [[List of built-in macros]]
You can add your favorite macros to any tiddler, including the MainMenu and SideBarOptions.
[[Start the Game|Midnight]]
<<tiddler ToggleRightSidebar>>
Background: #ffeedd
Foreground: #000
PrimaryPale: #ddaa99
PrimaryLight: #cc9999
PrimaryMid: #552233
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #cccccc
SecondaryDark: #552233
TertiaryPale: #ddaa99
TertiaryLight: #EEC591
TertiaryMid: #552233
TertiaryDark: #8B7355
The style sheets are the parts of ~TiddlyWiki that control and display the default code for the colors (StyleSheetColors), the page layout (StyleSheetLayout) and printing features (StyleSheetPrint) of a ~TiddlyWiki. You can override these defaults by adding code to the StyleSheet tiddler.
''Note:'' I used to make changes directly to the three original style sheets and in earlier versions of this tutorial I directed others to do the same. Others kindly pointed out the drawbacks of that approach:
*If you make mistakes in the three main style sheets, they can't be undone. They must be restored from a back up copy or another ~TiddlyWiki. Making changes to ~StyleSheet allows you to retain the original code of the three main style sheets.
*If in the future you upgrade to a newer version of ~TiddlyWiki, you will lose the changes you made to the three main style sheets as they are upgraded. So it's better to have your changes saved in ~StyleSheet.
This file already has its own ~StyleSheet. I have provided captions to explain my own tweaks, so that you can see how it is done. Feel free to tweak it as needed.
It is a dark and stormy night. You remember you have a research project to work on.
You have no idea where to start and you have to start in the morning.
What will you do?!
(NOTE: Do NOT use the BACK button. Click [[Start the Game|Midnight]] at the top to restart.)
*[[Go to the school library]]
*[[Go to public library]]
*[[Use home computer]]
''Simple indenting:''
{{{ {{indent{text }}} produces:
{{indent{text
''Headlines'':
{{{!Text}}} produces:
!Text
{{{!!Text}}} produces:
!!Text
{{{!!!Text}}} produces:
!!!Text
and so on.
''Dotted horizontal lines:''
{{{----}}} produces the following line:
----
Background: #eeddaa
Foreground: #000
PrimaryPale: #ddcc99
PrimaryLight: #bb8833
PrimaryMid: #553322
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #cccccc
SecondaryDark: #553322
TertiaryPale: #ddcc99
TertiaryLight: #EEC591
TertiaryMid: #553322
TertiaryDark: #8B7355
*[[Alternate the color of table rows]]
*[[Force the text in a cell not to wrap to the next line at a space]]
*[[Align the text in a cell at the top instead of the center]]
*[[Macros]]
*[[Slider macros]]
*[[The macro for tabbed lists]]
*[[TiddlyVault: your source for macros, plugins and themes]]
As always, you can check the timeline in the tabbed menu to the right to view recent changes. But to save you time, here are the newest changes:
''August 25, 2007''
*[[Access files, folders, etc from within TiddlyWiki]] and the tiddlers contained therein.
*Updated [[The macro for tabbed lists]]
*[[Special note on modifying shadow tiddlers]]
*[[The SelectPaletteMacro]]
*[[TiddlySnip Firefox addon]]
''August 24, 2007''
*[[Use IFrames to embed other webpages in your TiddlyWiki]]
*Large initial letters in [[Format text]]
*[[More information on tables]] and the tiddlers contained therein.
''August 23, 2007''
*Added iframes to show the [[Coloria color names]] and the [[4096 Color wheel]]. Swiped the idea from Morris Gray's tutorial. Good thinking, Morris!
*Added a couple items to the glossary.
*Cleaned up a few tiddlers to make them less cluttered, including [[How do you use a TiddlyWiki?]] and [[For medium users: adding your own material to a TiddlyWiki file]].
*[[Format ASCII symbols, foreign symbols, math symbols]]
*[[Open the indexes of your hard drive, CD or USB files from inside your TiddlyWiki]]
*[[Toggle the right hand menu]]
*[[Changing the look of the basic page layout - understanding the PageTemplate]]
*[[Changing the look of a tiddler in viewing mode - understanding the ViewTemplate]]
*[[Changing the look of a tiddler in editing mode - understanding the EditTemplate]]
*[[Host your TiddlyWiki online]]
''July 4, 2007''
*[[Tips for speeding up performance on large TiddlyWikis]]
''June 8, 2007''
*Upgraded to version 2.2.1, with instructions at [[Version 2.2]]. Most pertinent tiddlers changed, but the guide to the TW screen will need to be adjusted soon to account for the fact that ImportTiddlers has been moved.
''June 4, 2007''
*Basically cleaned up a few texts to simplify and correct what I had written before. I also mention the "My Notes" ~TiddlyWiki I created for more powerful categorization of notes.
''May 26, 2007''
*Added the [[easyFormat]] plugin and the other tiddlers needed to make it work. This allows you to quickly add formatting to selected text within a tiddler. Edit this tiddler and click on the word "Format" to see a dropdown menu of formatting options.
*Changed the layout of the page.
''March 26, 2007''
*Added a plugin to allow users to toggle the sidebar.
''March 5, 2007''
*Finally cleaned up the [[How to Format Text]] tiddler. This is much improved, and adds a few items such as lists in tables and links to local files.
*[[How to create new tiddlers based on a template tiddler]] in the advanced section.
*[[Create forms with editable fields]] in the advanced section.
*[[Some great "power" plugins]] in the advanced section.
*[[Advanced ideas for tags]], includes how to create an index for a tag and how to create an index for all tiddlers by tag. Accessible from the medium and advanced sections.
*Added a few terms to the glossary.
*Adjusted Stylesheet so that topmenu doesn't print.
*Deleted dead links to blogjones.
*Cut and pasted Julian Knight's info on macros in [[List of built-in macros]] just in case that becomes a dead link, too!
''March 2, 2007''
*Added [[greenishgray]] color scheme.
''Feb. 22, 2007''
*Added a section on how to create [[Slider macros]].
*Added a section on [[Top menus versus left hand main menus]], including how to change them back and forth.
*Added a section on [[How to add background images]] and one on [[How to create gradients]].
*Added link to ''~TiddlyWiki in Action'' in [[What are TiddlyWikis being used for?]].
''Feb. 10, 2007''
*Moved the MainMenu to the header and reworded the tiddlers that refer to it.
''Jan. 27 2007''
*Made corrections and clean-up to the section [[Messing with StyleSheets]]
*Added my own StyleSheet with captions
*Added two new color schemes, [[Mauve]] and [[Mocha]], and improved [[Apples]] and [[Blueberry]].
*Added note about our new personal organizer in [[What are TiddlyWikis being used for?]]
''Jan. 24 2007'':
*Added a link to a list of TW macros in [[Macros]].
*Added a link to another TW tutorial in [[Where to go for more information]]
''other recent changes'':
*Double-spacing between items on bulleted and numbered lists
*A tiddler on DaveGifford (information about the author of this tutorial)
*[[How to install a plugin]] and [[My favorite plugins]]
*[[Macros]]
*[[Messing with StyleSheets]] and a description of the tweaks I made to the {{{StyleSheetLayout}}} of this file.
*Link to the Spanish version is in the MainMenu.
*[[TW glossary]] begun.
There are many plugins that expand the usefulness of ~TiddlyWiki.
''Calendars:''
Here are links to three calendars:
{{indent{Two are plugins,
{{indent{http://www.rumsby.org/yatwa/#CalendarPlugin and {{indent{http://www.math.ist.utl.pt/~psoares/addons.html#PlasticCalendarPlugin,
{{indent{and the other is a tool to help you make calendars in table format:
{{indent{http://33ad.org/tools/gtdtwcal.php
''Tag clouds:''
They take your tags and visualize them for you, from most frequent to least frequent. Here is a good one by Clint Checkett: http://15black.bluedepot.com/twtests/tagcloud.htm#%5B%5BtagCloud%20plugin%5D%5D
''Colored boxes:''
I think these are cool, even though I haven't actually used them. http://www.math.ist.utl.pt/~psoares/addons.html#BoxesPlugin
''Light boxes''
Click on a photo, and the photo illuminates while the rest of the screen goes dark. Here is the link: http://solo.dc3.com/tw/#DC3.LightBox
''Check boxes''
http://www.TiddlyTools.com/#CheckboxPlugin
''Contact information plugins''
http://macrolinz.com/macrolinz/tiddlyware/macrolinz.html#ContactInfoPlugin
''Various foreign language translations'' of the TiddlyWiki buttons and menus. See my temporary fix for the Spanish language here: http://www.giffmex.org/twtutorialespanol.html#SpanishLingoGiffmex. There is a permanent version in the works.
I would be remiss if I didn't also mention the HUGE list of plugins at TiddlyTools. http://www.tiddlytools.com/
If you save this ~TiddlyWiki file to your computer and then check out this tiddler, you will see buttons that allow you to access an index of your C, D, E, or F files. Why ever leave your ~TiddlyWiki again? Thanks to Morris Gray whose [[TW Help site|http://twhelp.tiddlyspot.com]] drew this to my attention.
|<html><FORM action="file:///c:/" target="_blank"><INPUT type=submit value="c:\ drive" name="button" class="btn" name=submit2></FORM></html>|<html><FORM action="file:///d:/" target="_blank"><INPUT type=submit value="d:\ drive" name="button" class="btn" name=submit2></FORM></html>|<html><FORM action="file:///e:/" target="_blank"><INPUT type=submit value="e:\ drive" name="button" class="btn" name=submit2></FORM></html>|<html><FORM action="file:///f:/" target="_blank"><INPUT type=submit value="f:\ drive" name="button" class="btn" name=submit2></FORM></html>|
<!--{{{-->
<div class='header' macro='gradient vert [[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
<div class='headerShadow'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
<div class='headerForeground'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
</div>
<!-- horizontal MainMenu -->
<div id='topMenu' refresh='content' tiddler='MainMenu'></div>
<div id='sidebar'>
<div id='sidebarOptions' refresh='content' tiddler='SideBarOptions'></div>
<div id='sidebarTabs' refresh='content' force='true' tiddler='SideBarTabs'></div>
</div>
<div id='displayArea'>
<div id='messageArea'></div>
<div id='tiddlerDisplay'></div>
</div>
<!--}}}-->
|Standard Periodic Table (ref. Wikipedia)|c
|| !1 | !2 |!| !3 | !4 | !5 | !6 | !7 | !8 | !9 | !10 | !11 | !12 | !13 | !14 | !15 | !16 | !17 | !18 |
|!1|bgcolor(#a0ffa0): @@color(red):H@@ |>|>|>|>|>|>|>|>|>|>|>|>|>|>|>|>||bgcolor(#c0ffff): @@color(red):He@@ |
|!2|bgcolor(#ff6666): Li |bgcolor(#ffdead): Be |>|>|>|>|>|>|>|>|>|>||bgcolor(#cccc99): B |bgcolor(#a0ffa0): C |bgcolor(#a0ffa0): @@color(red):N@@ |bgcolor(#a0ffa0): @@color(red):O@@ |bgcolor(#ffff99): @@color(red):F@@ |bgcolor(#c0ffff): @@color(red):Ne@@ |
|!3|bgcolor(#ff6666): Na |bgcolor(#ffdead): Mg |>|>|>|>|>|>|>|>|>|>||bgcolor(#cccccc): Al |bgcolor(#cccc99): Si |bgcolor(#a0ffa0): P |bgcolor(#a0ffa0): S |bgcolor(#ffff99): @@color(red):Cl@@ |bgcolor(#c0ffff): @@color(red):Ar@@ |
|!4|bgcolor(#ff6666): K |bgcolor(#ffdead): Ca ||bgcolor(#ffc0c0): Sc |bgcolor(#ffc0c0): Ti |bgcolor(#ffc0c0): V |bgcolor(#ffc0c0): Cr |bgcolor(#ffc0c0): Mn |bgcolor(#ffc0c0): Fe |bgcolor(#ffc0c0): Co |bgcolor(#ffc0c0): Ni |bgcolor(#ffc0c0): Cu |bgcolor(#ffc0c0): Zn |bgcolor(#cccccc): Ga |bgcolor(#cccc99): Ge |bgcolor(#cccc99): As |bgcolor(#a0ffa0): Se |bgcolor(#ffff99): @@color(green):Br@@ |bgcolor(#c0ffff): @@color(red):Kr@@ |
|!5|bgcolor(#ff6666): Rb |bgcolor(#ffdead): Sr ||bgcolor(#ffc0c0): Y |bgcolor(#ffc0c0): Zr |bgcolor(#ffc0c0): Nb |bgcolor(#ffc0c0): Mo |bgcolor(#ffc0c0): Tc |bgcolor(#ffc0c0): Ru |bgcolor(#ffc0c0): Rh |bgcolor(#ffc0c0): Pd |bgcolor(#ffc0c0): Ag |bgcolor(#ffc0c0): Cd |bgcolor(#cccccc): In |bgcolor(#cccccc): Sn |bgcolor(#cccc99): Sb |bgcolor(#cccc99): Te |bgcolor(#ffff99): I |bgcolor(#c0ffff): @@color(red):Xe@@ |
|!6|bgcolor(#ff6666): Cs |bgcolor(#ffdead): Ba |bgcolor(#ffbfff):^^*1^^|bgcolor(#ffc0c0): Lu |bgcolor(#ffc0c0): Hf |bgcolor(#ffc0c0): Ta |bgcolor(#ffc0c0): W |bgcolor(#ffc0c0): Re |bgcolor(#ffc0c0): Os |bgcolor(#ffc0c0): Ir |bgcolor(#ffc0c0): Pt |bgcolor(#ffc0c0): Au |bgcolor(#ffc0c0): @@color(green):Hg@@ |bgcolor(#cccccc): Tl |bgcolor(#cccccc): Pb |bgcolor(#cccccc): Bi |bgcolor(#cccc99): Po |bgcolor(#ffff99): At |bgcolor(#c0ffff): @@color(red):Rn@@ |
|!7|bgcolor(#ff6666): Fr |bgcolor(#ffdead): Ra |bgcolor(#ff99cc):^^*2^^|bgcolor(#ffc0c0): Lr |bgcolor(#ffc0c0): Rf |bgcolor(#ffc0c0): Db |bgcolor(#ffc0c0): Sq |bgcolor(#ffc0c0): Bh |bgcolor(#ffc0c0): Hs |bgcolor(#ffc0c0): Mt |bgcolor(#ffc0c0): Ds |bgcolor(#ffc0c0): Rg |bgcolor(#ffc0c0): @@color(green):Uub@@ |bgcolor(#cccccc): Uut |bgcolor(#cccccc): Uuq |bgcolor(#cccccc): Uup |bgcolor(#cccccc): Uuh |bgcolor(#fcfecc): @@color(#cccccc):Uus@@ |bgcolor(#ecfefc): @@color(#cccccc):Uuo@@ |
| !Lanthanides^^*1^^|bgcolor(#ffbfff): La |bgcolor(#ffbfff): Ce |bgcolor(#ffbfff): Pr |bgcolor(#ffbfff): Nd |bgcolor(#ffbfff): Pm |bgcolor(#ffbfff): Sm |bgcolor(#ffbfff): Eu |bgcolor(#ffbfff): Gd |bgcolor(#ffbfff): Tb |bgcolor(#ffbfff): Dy |bgcolor(#ffbfff): Ho |bgcolor(#ffbfff): Er |bgcolor(#ffbfff): Tm |bgcolor(#ffbfff): Yb |
| !Actinides^^*2^^|bgcolor(#ff99cc): Ac |bgcolor(#ff99cc): Th |bgcolor(#ff99cc): Pa |bgcolor(#ff99cc): U |bgcolor(#ff99cc): Np |bgcolor(#ff99cc): Pu |bgcolor(#ff99cc): Am |bgcolor(#ff99cc): Cm |bgcolor(#ff99cc): Bk |bgcolor(#ff99cc): Cf |bgcolor(#ff99cc): Es |bgcolor(#ff99cc): Fm |bgcolor(#ff99cc): Md |bgcolor(#ff99cc): No |
*Chemical Series of the Periodic Table
**@@bgcolor(#ff6666): Alkali metals@@
**@@bgcolor(#ffdead): Alkaline earth metals@@
**@@bgcolor(#ffbfff): Lanthanides@@
**@@bgcolor(#ff99cc): Actinides@@
**@@bgcolor(#ffc0c0): Transition metals@@
**@@bgcolor(#cccccc): Poor metals@@
**@@bgcolor(#cccc99): Metalloids@@
**@@bgcolor(#a0ffa0): Nonmetals@@
**@@bgcolor(#ffff99): Halogens@@
**@@bgcolor(#c0ffff): Noble gases@@
*State at standard temperature and pressure
**those in @@color(red):red@@ are gases
**those in @@color(green):green@@ are liquids
**those in black are solids
Printing from a ~TiddlyWiki file is just like printing any webpage using the print function of your browser. Wow, that was easy to explain! For an extra tip, try this:
[[Printing just tiddler titles and text without all the TiddlyWiki stuff around it]]
You may find you don't want to print your file's ''header'', ''main menu'', the right hand ''sidebar'', or elements within the tiddlers such as its ''subtitle, buttons toolbar, and tags''. If so, well, here is your first chance to foray into the world of ~TiddlyWiki behind-the-scenes code. Here are the instructions:
# Double-click this tiddler to go into edit mode..
# Each line below represents a part of ~TiddlyWiki that you don't want to print. Decide what you want and don't want to print, then insert the appropriate lines of code from below into the StyleSheet tiddler.
<!--{{{-->
@media print {#mainMenu {display: none ! important;}}
@media print {#topMenu {display: none ! important;}}
@media print {#sidebar {display: none ! important;}}
@media print {#messageArea {display: none ! important;}}
@media print {#toolbar {display: none ! important;}}
@media print {.header {display: none ! important;}}
@media print {.tiddler .subtitle {display: none ! important;}}
@media print {.tiddler .toolbar {display; none ! important; }}
@media print {.tiddler .tagging {display; none ! important; }}
@media print {.tiddler .tagged {display; none ! important; }}
<!--}}}-->
3. Open the StyleSheet tiddler and doubleclick on it to put it into edit mode. Paste the code you copied into it.
4. Close both tiddlers. Now use your browser's print preview function to see what will be printed. Did you remove all the elements that you wanted to? I hope so.
Background: #FFcc00
Foreground: #000
PrimaryPale: #FF8C69
PrimaryLight: #cc66ff
PrimaryMid: #440044
PrimaryDark: #410
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #440044
TertiaryPale: #ffff99
TertiaryLight: #EEC591
TertiaryMid: #440044
TertiaryDark: #8B7355
Background: #ccaabb
Foreground: #000
PrimaryPale: #eeaaff
PrimaryLight: #ff0033
PrimaryMid: #464544
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #eeaaff
TertiaryLight: #EEC591
TertiaryMid: #000
TertiaryDark: #8B7355
I have no salsa recipes for you. Try "Salsa recipes for the rest of us."
How to install a plugin
churu1, 8 June 2007(created 18 January 2007)
not tagging
no tags
Plugins are tiddlers embedded with codes that add special functions to TiddlyWiki files. Plugins are easier to install than I thought they would be. Here's how:
Find the plugin you want and grab the url of the page it's on. (Copy the url from your browser's search window).
In your own TiddlyWiki file, click on ImportTiddlers, found in the backstage area for versions 2.2 and beyond, and on the InterfaceOptions panel in the righthand sidebar of earlier versions.
Paste the url you've copied into the top window of the import tiddlers tiddler that appears. Then click Fetch.
A list of all the tiddlers found in the other file will appear. Find the tiddler of the plugin you want, then check the box next to it.
Below the list is a menu that says "More actions..." Choose "Import these tiddlers."
Your screen will blink and change several times while your file is being updated. If you have your TiddlyWiki configured to automatically save every change (which is default), the box will appear in the top right corner saying it has saved the change. If you have it configured another way, then click on "save changes".
Hit the 'refresh' or 'reload' button on your browser.
The plugin should now be installed and usable on your file. That's it!
~TiddlyWikis should not be saved to your computer using the conventional "save" methods. To save this ~TiddlyWiki to your computer, go to the menu above, {{italic{right-click}}} where it says "save this file", and select "save target as" or "save link as". Give the file whatever name you want to give it, and save it in a convenient place on your computer.
After you do this, then close your browser, and open your saved version of the document from Start button > Documents. Your saved version will have the name you just gave it.
! Customizing your newly saved ~TiddlyWiki file
# ''Change the SiteTitle and SiteSubtitle Tiddlers'' to reflect the content of the Tiddly you are creating. Your new title and subtitle will appear in the header at the top.
# ''Open the MainMenu Tiddler'', doubleclick on it, and remove any undesired items. Then add items to the main menu with double brackets. Example: {{{[[Car maintenance]]}}}
# If you want certain Tiddlers to appear every time you open the file, go to [[DefaultTiddlers]] and edit it to include the Tiddlers you want to appear at startup.
# Also you will definitely want to [[Decide on saving options]].
<<tabs txtMainTab Timeline Timeline TabTimeline All 'All tiddlers' TabAll Tags 'All tags' TabTags More 'More lists' TabMore>>
/***
|Name|SinglePageModePlugin|
|Source|http://www.TiddlyTools.com/#SinglePageModePlugin|
|Documentation|http://www.TiddlyTools.com/#SinglePageModePluginInfo|
|Version|2.6.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <br>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides|Story.prototype.displayTiddler(), Story.prototype.displayTiddlers()|
|Description|Show tiddlers one at a time with automatic permalink, or always open tiddlers at top/bottom of page.|
This plugin allows you to configure TiddlyWiki to navigate more like a traditional multipage web site with only one tiddler displayed at a time.
!!!!!Documentation
>see [[SinglePageModePluginInfo]]
!!!!!Configuration
<<<
<<option chkSinglePageMode>> Display one tiddler at a time
<<option chkSinglePagePermalink>> Automatically permalink current tiddler
<<option chkSinglePageAutoScroll>> Automatically scroll tiddler into view (if needed)
<<option chkTopOfPageMode>> Always open tiddlers at the top of the page
<<option chkBottomOfPageMode>> Always open tiddlers at the bottom of the page
//Note: if both 'top' and 'bottom' settings are selected, "top of page" will be used. Also, in Apple's Safari browser, automatically setting the permalink causes an error and is disabled.//
<<<
!!!!!Revisions
<<<
2008.03.01 [2.6.0] in hijack of displayTiddler(), added 'title' argument to closeAllTiddlers() so that target tiddler isn't closed-and-reopened if it was already displayed. Also, added config.options.chkSinglePageAutoScrolloption to bypass automatic 'scroll into view' logic (note: core still does it's own ensureVisible() handling)
| Please see [[SinglePageModePluginInfo]] for previous revision details |
2005.08.15 [1.0.0] Initial Release. Support for BACK/FORWARD buttons adapted from code developed by Clint Checketts.
<<<
!!!!!Code
***/
//{{{
version.extensions.SinglePageMode= {major: 2, minor: 6, revision: 0, date: new Date(2008,3,1)};
if (config.options.chkSinglePageMode==undefined) config.options.chkSinglePageMode=false;
if (config.options.chkSinglePagePermalink==undefined) config.options.chkSinglePagePermalink=true;
if (config.options.chkTopOfPageMode==undefined) config.options.chkTopOfPageMode=false;
if (config.options.chkBottomOfPageMode==undefined) config.options.chkBottomOfPageMode=false;
if (config.options.chkSinglePageAutoScroll==undefined) config.options.chkSinglePageAutoScroll=true;
if (config.optionsDesc) {
config.optionsDesc.chkSinglePageMode="Display one tiddler at a time";
config.optionsDesc.chkSinglePagePermalink="Automatically permalink current tiddler";
config.optionsDesc.chkSinglePageAutoScroll="Automatically scroll tiddler into view (if needed)";
config.optionsDesc.chkTopOfPageMode="Always open tiddlers at the top of the page";
config.optionsDesc.chkBottomOfPageMode="Always open tiddlers at the bottom of the page";
} else {
config.shadowTiddlers.AdvancedOptions += "\
\n<<option chkSinglePageMode>> Display one tiddler at a time \
\n<<option chkSinglePagePermalink>> Automatically permalink current tiddler \
\n<<option chkSinglePageAutoScroll>> Automatically scroll tiddler into view (if needed) \
\n<<option chkTopOfPageMode>> Always open tiddlers at the top of the page \
\n<<option chkBottomOfPageMode>> Always open tiddlers at the bottom of the page";
}
config.SPMTimer = 0;
config.lastURL = window.location.hash;
function checkLastURL()
{
if (!config.options.chkSinglePageMode)
{ window.clearInterval(config.SPMTimer); config.SPMTimer=0; return; }
if (config.lastURL == window.location.hash)
return;
var tiddlerName = convertUTF8ToUnicode(decodeURIComponent(window.location.hash.substr(1)));
tiddlerName=tiddlerName.replace(/\[\[/,"").replace(/\]\]/,""); // strip any [[ ]] bracketing
if (tiddlerName.length) story.displayTiddler(null,tiddlerName,1,null,null);
}
if (Story.prototype.SPM_coreDisplayTiddler==undefined) Story.prototype.SPM_coreDisplayTiddler=Story.prototype.displayTiddler;
Story.prototype.displayTiddler = function(srcElement,title,template,animate,slowly)
{
if (config.options.chkSinglePageMode)
story.closeAllTiddlers(title);
else if (config.options.chkTopOfPageMode)
arguments[0]=null;
else if (config.options.chkBottomOfPageMode)
arguments[0]="bottom";
if (config.options.chkSinglePageMode && config.options.chkSinglePagePermalink && !config.browser.isSafari) {
window.location.hash = encodeURIComponent(convertUnicodeToUTF8(String.encodeTiddlyLink(title)));
config.lastURL = window.location.hash;
document.title = wikifyPlain("SiteTitle") + " - " + title;
if (!config.SPMTimer) config.SPMTimer=window.setInterval(function() {checkLastURL();},1000);
}
this.SPM_coreDisplayTiddler.apply(this,arguments); // let CORE render tiddler
var tiddlerElem=document.getElementById(story.idPrefix+title);
if (tiddlerElem&&config.options.chkSinglePageAutoScroll) {
var yPos=ensureVisible(tiddlerElem); // scroll to top of tiddler
var isTopTiddler=(tiddlerElem.previousSibling==null);
if (config.options.chkSinglePageMode||config.options.chkTopOfPageMode||isTopTiddler)
yPos=0; // scroll to top of page instead of top of tiddler
if (config.options.chkAnimate) // defer scroll until 200ms after animation completes
setTimeout("window.scrollTo(0,"+yPos+")",config.animDuration+200);
else
window.scrollTo(0,yPos); // scroll immediately
}
}
if (Story.prototype.SPM_coreDisplayTiddlers==undefined) Story.prototype.SPM_coreDisplayTiddlers=Story.prototype.displayTiddlers;
Story.prototype.displayTiddlers = function(srcElement,titles,template,unused1,unused2,animate,slowly)
{
// suspend single-page mode (and/or top/bottom display options) when showing multiple tiddlers
var saveSPM=config.options.chkSinglePageMode; config.options.chkSinglePageMode=false;
var saveTPM=config.options.chkTopOfPageMode; config.options.chkTopOfPageMode=false;
var saveBPM=config.options.chkBottomOfPageMode; config.options.chkBottomOfPageMode=false;
this.SPM_coreDisplayTiddlers.apply(this,arguments);
config.options.chkBottomOfPageMode=saveBPM;
config.options.chkTopOfPageMode=saveTPM;
config.options.chkSinglePageMode=saveSPM;
}
//}}}
/***
|Name|SinglePageModePluginInfo|
|Source|http://www.TiddlyTools.com/#SinglePageModePlugin|
|Documentation|http://www.TiddlyTools.com/#SinglePageModePluginInfo|
|Version|2.6.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <br>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|documentation|
|Requires||
|Overrides||
|Description|Documentation for SinglePageModePlugin|
Normally, as you click on the links in TiddlyWiki, more and more tiddlers are displayed on the page. The order of this tiddler display depends upon when and where you have clicked. Some people like this non-linear method of reading the document, while others have reported that when many tiddlers have been opened, it can get somewhat confusing. SinglePageModePlugin allows you to configure TiddlyWiki to navigate more like a traditional multipage web site with only one item displayed at a time.
!!!!!Usage
<<<
When the plugin is enabled, only one tiddler will be displayed at a time and the browser window's titlebar is updated to include the current tiddler title. The browser's location URL is also updated with a 'permalink' for the current tiddler so that it is easier to create a browser 'bookmark' for the current tiddler. Alternatively, even when displaying multiple tiddlers //is// permitted, you can still reduce the potential for confusion by forcing tiddlers to always open at the top (or bottom) of the page instead of being displayed following the tiddler containing the link that was clicked.
<<<
!!!!!Configuration
<<<
When installed, this plugin automatically adds checkboxes in the AdvancedOptions tiddler so you can enable/disable the plugin behavior. For convenience, these checkboxes are also included here:
<<option chkSinglePageMode>> Display one tiddler at a time
<<option chkSinglePagePermalink>> Automatically permalink current tiddler
<<option chkSinglePageAutoScroll>> Automatically scroll tiddler into view (if needed)
<<option chkTopOfPageMode>> Always open tiddlers at the top of the page
<<option chkBottomOfPageMode>> Always open tiddlers at the bottom of the page
//Note: if both 'top' and 'bottom' settings are selected, "top of page" will be used. Also, in Apple's Safari browser, automatically setting the permalink causes an error and is disabled.//
When installed, this plugin automatically adds checkboxes in the ''shadow'' AdvancedOptions tiddler so you can enable/disable this behavior. However, if you have customized your AdvancedOptions, you may need to ''manually add these checkboxes to your customized tiddler.''
<<<
!!!!!Revisions
<<<
2008.03.01 [2.6.0] in hijack of displayTiddler(), added 'title' argument to closeAllTiddlers() so that target tiddler isn't closed-and-reopened if it was already displayed. Also, added config.options.chkSinglePageAutoScrolloption to bypass automatic 'scroll into view' logic (note: core still does it's own ensureVisible() handling)
2007.12.22 [2.5.3] in checkLastURL(), use decodeURIComponent() instead of decodeURI so that tiddler titles with commas (and/or other punctuation) are correctly handled.
2007.10.26 [2.5.2] documentation cleanup
2007.10.08 [2.5.1] in displayTiddler(), when using single-page or top-of-page mode, scrollTo(0,0) to ensure that page header is in view.
2007.09.13 [2.5.0] for TPM/BPM modes, don't force tiddler to redisplay if already shown. Allows transition between view/edit or collapsed/view templates, without repositioning displayed tiddler.
2007.09.12 [2.4.0] added option to disable automatic permalink feature. Also, Safari is now excluded from permalinking action to avoid bug where tiddlers don't display after hash is updated.
2007.03.03 [2.3.1] fix typo when adding BPM option to AdvancedOptions (prevented checkbox from appearing)
2007.03.03 [2.3.0] added support for BottomOfPageMode (BPM) based on request from DaveGarbutt
2007.02.06 [2.2.3] in Story.prototype.displayTiddler(), use convertUnicodeToUTF8() for correct I18N string handling when creating URL hash string from tiddler title (based on bug report from BidiX)
2007.01.08 [2.2.2] use apply() to invoke hijacked core functions
2006.07.04 [2.2.1] in hijack for displayTiddlers(), suspend TPM as well as SPM so that DefaultTiddlers displays in the correct order.
2006.06.01 [2.2.0] added chkTopOfPageMode (TPM) handling
2006.02.04 [2.1.1] moved global variable declarations to config.* to avoid FireFox 1.5.0.1 crash bug when assigning to globals
2005.12.27 [2.1.0] hijack displayTiddlers() so that SPM can be suspended during startup while displaying the DefaultTiddlers (or #hash list). Also, corrected initialization for undefined SPM flag to "false", so default behavior is to display multiple tiddlers
2005.12.27 [2.0.0] Update for TW2.0
2005.11.24 [1.1.2] When the back and forward buttons are used, the page now changes to match the URL. Based on code added by Clint Checketts
2005.10.14 [1.1.1] permalink creation now calls encodeTiddlyLink() to handle tiddler titles with spaces in them
2005.10.14 [1.1.0] added automatic setting of window title and location bar ('auto-permalink'). feature suggestion by David Dickens.
2005.10.09 [1.0.1] combined documentation and code in a single tiddler
2005.08.15 [1.0.0] Initial Release
<<<
An easy-to-use research simulation by RHS Library
Research-- Live the Adventure
Background: #cccccc
Foreground: #000
PrimaryPale: #999999
PrimaryLight: #667788
PrimaryMid: #334444
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #555566
TertiaryPale: #999999
TertiaryLight: #EEC591
TertiaryMid: #000
TertiaryDark: #8B7355
Sliders are macros that create expandable and collapsible text, such as dropdown menus or information you only want exposed when the user clicks on it.
For the power version of sliders, you might need the Nested Sliders plugin ([[here is the link|http://www.tiddlytools.com/#NestedSlidersPlugin]]). Nevertheless, slider macros are nice easy solutions for simple expandable text. Below is an example of a slider. Click on it to see the items that appear:
<<slider fortabTags TabTags TabTags>>
The ''syntax'' for the slider macro above looks like this:
{{{<<slider fortabTags TabTags TabTags>>}}}
''There are four elements to the syntax,'' enclosed by double angle brackets, each divided by a space:
#The word 'slider' so that ~TiddlyWiki knows what kind of macro it is
#A name for your slider so that ~TiddlyWiki distinguishes it from other sliders.
#The name of the Tiddler that you want to open by clicking on the slider. Clicking the macro above opens the tiddler that lists all the tags in this ~TiddlyWiki file.
#The label for your slider - in other words, the text you want to appear in your slider box. For example, you could change the slider above to say 'Spaghetti'.
''You can customize the look of your slider with some knowledge of CSS.''
For example, ocat has created a nice custom slider that uses gray horizontal three-dimensional bars rather than a gold box. Below is an image of his customization with the top bar opening the GettingStarted tiddler.
[img[http://www.giffmex.org/images/ocat.GIF]]
If you want to try out this style on a slider, add the text below to your StyleSheet Tiddler:
/*{{{*/
/*AccordionEffect, Designed by oc ( http://b-oo-k.net/blog/ ). */
.viewer .button{ display: block; color: #fff; text-align: left;
font-weight: bold;
border-top: solid 1px #bbb;
border-left: solid 1px #bbb;
border-right: solid 1px #888;
border-bottom: solid 1px #888;
background: #999;
margin-left: -0.3em;
padding: 0 1px 1px 20px;
}
.viewer .button:hover{
border-top: solid 1px #777;
border-left: solid 1px #777;
border-right: solid 1px #bbb;
border-bottom: solid 1px #bbb;
background: #888;
padding: 1px 0 0 21px;
}
/*}}}*/
These plugins are for extra ~TiddlyWiki mileage. They increase your filesize significantly, but they also add significantly to your file's capabilities.
!Favorites from [[Abego Extensions|http://tiddlywiki.abego-software.de/]]
*''~ForEachTiddlerPlugin'' lets you sort tiddlers and portions of tiddlers in many clever and helpful ways. I use it to index tags and tiddler titles. See [[Advanced ideas for tags]].
*''~FormTiddlerPlugin'' and ''~DataTiddlerPlugin'' work together to [[Create forms with editable fields]].
*The ''~IncludePlugin'' allows you to create a portal TW that accesses tiddlers from multiple other TiddlyWiki files as read-only tiddlers. Very nice for having a lot of data in one file without bloating the file.
!Favorites from [[Lewcid Extensions|http://tw.lewcid.org/]]
*''~FontsizePlugin'' lets you adjust the font size in a tiddler with + and - buttons.
*''~IconMacro'' and ''~ToolbarIconsPluigin'' let you replace the usual TW features with icons.
*''~SplashScreenPlugin'' calls up an introductory message while users wait for your file to open.
!Favorites from [[TiddlyTools|http://www.tiddlytools.com/]]
*''~NestedSlidersPlugin'' is a plugin for more advanced sliders than you can get from the [[Slider macros]].
*''~SearchOptionsPlugin''. When this plugin is loaded and you do a search, you get a list of tiddlers containing the word you are searching for, rather than having all those tiddlers open. I don't have it installed here, because I want newbies to see what happens normally with searching. But I think this plugin is a must.
*''~CoreTweaks'' adds some helpful tweaks to the TW core.
!From [[MonkeyPirate (old beta site)|http://mptw-beta.tiddlyspot.com/]]
*''~SelectPaletteMacro'' is technically a macro, but I'm including it here. It lets you select from a dropdown list of color palettes, and automatically reconfigures your color scheme based on your selection.
!From [[MonkeyPirate|http://mptw.tiddlyspot.com/]]
*''~TagglyTagging'' is a unique and handy way to use tags for organizing information. It's easier to use than it is to explain.
!From [[Yann Perrin|http://yann.perrin.googlepages.com/twkd.html]]
*The ''easyFormat'' plugin is included in this tutorial. It allows you to format selected text by using a dropdown list. Edit this tiddler and click on "Format" to see which styles I have included in my adapted version of this plugin.
!~LaunchApplicationPlugin
*The ''~LaunchApplicationsPlugin'' allows you to launch other programs (Outlook, Word, etc) from within ~TiddlyWiki. You can access it either [[here|http://www.Remotely-Helpful.com/TiddlyWiki/LaunchApplication.html]] or [[here|http://www.Remotely-Helpful.com/TiddlyWiki/LaunchApplication.html|]]. Be aware that there are security risks involved with some uses of this plugin. See Morris Gray's help file [[here|http://twhelp.tiddlyspot.com/#%5B%5BLaunch%20Applications%20Plugin%5D%5D]] for more information.
''Soup recipe''
*Buy Ramen Pride.
*Boil water and mix.
/***
|''Name:''|SparklinePlugin|
|''Description:''|Sparklines macro|
***/
//{{{
if(!version.extensions.SparklinePlugin) {
version.extensions.SparklinePlugin = {installed:true};
//--
//-- Sparklines
//--
config.macros.sparkline = {};
config.macros.sparkline.handler = function(place,macroName,params)
{
var data = [];
var min = 0;
var max = 0;
var v;
for(var t=0; t<params.length; t++) {
v = parseInt(params[t]);
if(v < min)
min = v;
if(v > max)
max = v;
data.push(v);
}
if(data.length < 1)
return;
var box = createTiddlyElement(place,"span",null,"sparkline",String.fromCharCode(160));
box.title = data.join(",");
var w = box.offsetWidth;
var h = box.offsetHeight;
box.style.paddingRight = (data.length * 2 - w) + "px";
box.style.position = "relative";
for(var d=0; d<data.length; d++) {
var tick = document.createElement("img");
tick.border = 0;
tick.className = "sparktick";
tick.style.position = "absolute";
tick.src = "data:image/gif,GIF89a%01%00%01%00%91%FF%00%FF%FF%FF%00%00%00%C0%C0%C0%00%00%00!%F9%04%01%00%00%02%00%2C%00%00%00%00%01%00%01%00%40%02%02T%01%00%3B";
tick.style.left = d*2 + "px";
tick.style.width = "2px";
v = Math.floor(((data[d] - min)/(max-min)) * h);
tick.style.top = (h-v) + "px";
tick.style.height = v + "px";
box.appendChild(tick);
}
};
}
//}}}
*[[Format text]]
*[[Format links and images]]
*[[Format lists]]
*[[Format tables]]
*[[Format blockquotes]]
*[[Miscellaneous formats]]
*[[Format ASCII symbols, foreign symbols, math symbols]]
If you are using Internet Explorer (IE) to open this document, please keep in mind the following items:
# For reading ~TiddlyWikis, any browser will do. But for editing a TW file or creating your own, Mozilla's free Firefox browser is optimal, whereas Internet Explorer will require you to take the steps below. You can download Firefox for free from [[here|http://www.mozilla.com/firefox/]]. It really is a great browser. Think about it!
# However, ''if you prefer to continue using Internet Explorer'', you will need version 6.x or higher, preferably version 7. If you want to upgrade to the latest version of IE, you can do so [[here|http://www.microsoft.com/windows/ie/downloads/default.mspx]].
# If you are using anything less than version 7, you will just need to ''enable active content''. Go to Tools >> Internet Options >> Advanced >> and check the boxes that say "Allow active content to run on files in My Computer", "Java logging enabled" and "Java Console enabled." Also you will want to click on the options link on the right-hand side of ~TiddlyWiki and check the "Auto Save" option.
# The ''only known issues with Internet Explorer'' itself have to do with gradients and series of consecutive spaces in Tiddler titles, neither of which should be on this version.
# ''If you have Micrososft XP Service Pack 2'', there is one hiccup. Internet Explorer Windows XP SP2 keeps track of html files saved from the internet, and stores saved changes in an 'Internet' zone regardless of attempts to rename or modify the file. But, in order to be able to save changes, ~TiddlyWiki needs to run in the 'My Computer' zone. The solution is to right-click on the ~TiddlyWiki html file and choose Properties. If the file is blocked, you'll see an 'Unblock' button on the resulting property sheet that removes the protection and allows the file to open in the 'My Computer' zone. Then open the file in Internet Explorer - it might put up its information bar asking you whether you want to run it. You need to 'Allow blocked content' to let ~TiddlyWiki do its stuff.
Shadow tiddlers are the behind the scenes tiddlers found in the tiddler TabMoreShadowed and which appear in the "Shadowed" tab in the "more" section in the righthand sidebar tabs. Technically speaking, when you modify these tiddlers, you are not actually modifying them. You are creating a "twin" tiddler that overrides the original shadowed tiddler.
So if you ever feel the need to revert to the default settings of a shadow tiddler such as StyleSheet or PageTemplate, all you have to do is open the tiddler and delete it. The "twin" tiddler you modified will be deleted and the original shadowed tiddler will return once again to take its place.
Background: #FFBCAD
Foreground: #000
PrimaryPale: #F67276
PrimaryLight: #FF6633
PrimaryMid: #A73853
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #FFBCAD
TertiaryLight: #EEC591
TertiaryMid: #000
TertiaryDark: #8B7355
/*{{{*/
/* horizontal main menu */
#displayArea { margin: 1em 15.5em 0em 1em; } /* use the full horizontal width */
#topMenu { background: [[ColorPalette::PrimaryMid]]; color: [[ColorPalette::PrimaryPale]]; padding: 0.2em 0.2em 0.2em 0.5em; border-bottom: 2px solid #000000; }
#topMenu br { display: none; }
#topMenu .button, #topMenu .tiddlyLink, #topMenu a { margin-left: 0.25em; margin-right: 0.25em; padding-left: 0.5em; padding-right: 0.5em; color: [[ColorPalette::PrimaryPale]]; font-size: 1.15em; }
#topMenu .button:hover, #topMenu .tiddlyLink:hover { background: [[ColorPalette::PrimaryDark]]; }
.firstletter{ float:left; width:0.75em; font-size:400%; font-family:times,arial; line-height:60%; }
.viewer .FOO table tr.oddRow { background-color: #bbbbbb; }
.viewer .FOO table tr.evenRow { background-color: #fff; }
/*Invisible table*/
.viewer .invisibletable table {
border-color: white;
}
.viewer .invisibletable table td {
font-size: 1em;
font-family: Verdana;
border-color: white;
padding: 10px 20px 10px 0px;
text-align: left;
vertical-align: top;
}
.viewer .invisibletable table th {
color: #005566;
background-color: white;
border-color: white;
font-family: Verdana;
font-size: 1.2em;
font-weight: bold;
padding: 10px 20px 10px 0px;
text-align: left;
vertical-align: top;
}
/* GIFFMEX TWEAKS TO STYLESHEETPRINT (so that nothing but tiddler title and text are printed) */
@media print {#mainMenu {display: none ! important;}}
@media print {#topMenu {display: none ! important;}}
@media print {#sidebar {display: none ! important;}}
@media print {#messageArea {display: none ! important;}}
@media print {#toolbar {display: none ! important;}}
@media print {.header {display: none ! important;}}
@media print {.tiddler .subtitle {display: none ! important;}}
@media print {.tiddler .toolbar {display; none ! important; }}
@media print {.tiddler .tagging {display; none ! important; }}
@media print {.tiddler .tagged {display; none ! important; }}
@media print {#displayArea {margin: 1em 1em 0em 1em;}}
@media print {.pageBreak {page-break-before: always;}}
a.button{
border: 0;
}
/*Color changes*/
#sidebarOptions input {
border: 1px solid [[ColorPalette::TertiaryPale]];
}
#sidebarOptions .sliderPanel {
background: [[ColorPalette::TertiaryPale]];
}
#sidebarOptions .sliderPanel a {
border: none;
color: [[ColorPalette::PrimaryMid]];
}
#sidebarOptions .sliderPanel a:hover {
color: [[ColorPalette::Background]];
background: [[ColorPalette::TertiaryPale]];
}
#sidebarOptions .sliderPanel a:active {
color: [[ColorPalette::PrimaryMid]];
background: [[ColorPalette::TertiaryPale]];
}
/*Makes sliders bold*/
.tuduSlider .button{font-weight: bold;
}
/* (2) Adjusts the color for all headlines so they are both readable and match my color schemes. */
h1,h2,h3,h4,h5 {
color: #000;
background: [[ColorPalette::TertiaryPale]];
}
.title {
color: [[ColorPalette::PrimaryMid]];
}
/* (2) Makes text verdana. */
body {
font-family: verdana;
font-size: 9pt;
}
/* (4) Allows for Greek - one way */
.greek {
font-family: Palatino Linotype;
font-style: normal;
font-size: 150%;
}
/* (5) Shortens the height of the Header */
.headerShadow {
padding: 1.5em 0em 1em 1em;
}
.headerForeground {
padding: 2em 0em 1em 1em;
}
/* (8) Makes ordered and unordered lists double-spaced between items but single-spaced within items. */
.viewer li {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
/*Makes block quotes line-less*/
.viewer blockquote {
border-left: 0px;
margin-top:0em;
margin-bottom:0em;
}
/* Cosmetic fixes that probably should be included in a future TW... */
.viewer .listTitle { list-style-type:none; margin-left:-2em; }
.editorFooter .button { padding-top: 0px; padding-bottom:0px; }
Important stuff. See TagglyTaggingStyles and HorizontalMainMenuStyles
[[Styles TagglyTagging]]
[[Styles HorizontalMainMenu]]
Just colours, fonts, tweaks etc. See MessageTopRight and SideBarWhiteAndGrey
body {
background: #eee; }
.headerForeground a {
color: #6fc;}
.headerShadow {
left: 2px;
top: 2px; }
.siteSubtitle {
padding-left: 1.5em; }
.shadow .title {
color: #999; }
.viewer pre {
background-color: #f8f8ff;
border-color: #ddf }
.tiddler {
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 3px solid #ccc;
border-right: 3px solid #ccc;
margin: 0.5em;
background:#fff;
padding: 0.5em;
-moz-border-radius: 1em; }
#messageArea {
background-color: #eee;
border-color: #8ab;
border-width: 4px;
border-style: dotted;
font-size: 90%;
padding: 0.5em;
-moz-border-radius: 1em; }
#messageArea .button { text-decoration:none; font-weight:bold; background:transparent; border:0px; }
#messageArea .button:hover {background: #acd; }
.editorFooter .button {
padding-top: 0px;
padding-bottom:0px;
background: #fff;
color: #000;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 2px solid #ccc;
border-right: 2px solid #ccc;
margin-left: 3px;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 5px;
padding-right: 5px; }
.editorFooter .button:hover {
border-top: 2px solid #ccc;
border-left: 2px solid #ccc;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
margin-left: 3px;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 5px;
padding-right: 5px; }
.tagged {
padding: 0.5em;
background-color: #eee;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 3px solid #ccc;
border-right: 3px solid #ccc;
-moz-border-radius: 1em; }
.selected .tagged {
padding: 0.5em;
background-color: #eee;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 3px solid #ccc;
border-right: 3px solid #ccc;
-moz-border-radius: 1em; }
Clint's fix for weird IE behaviour
body {position:static;}
.tagClear{margin-top:1em;clear:both;}
/*}}}*/
/*{{{*/
/* text alignments */
.left
{ display:block;text-align:left; }
.center
{ display:block;text-align:center; }
.right
{ display:block;text-align:right; }
.justify
{ display:block;text-align:justify; }
.indent
{ margin:0;padding:0;border:0;margin-left:2em; }
.floatleft
{ float:left; }
.floatright
{ float:right; }
.clear
{ clear:both; }
.wrap
{ white-space:normal; }
.nowrap
{ white-space:nowrap; }
.hidden
{ display:none; }
.span
{ display:span; }
.block
{ display:blockquote; }
/* font sizes */
.big
{ font-size:14pt;line-height:120% }
.medium
{ font-size:12pt;line-height:120% }
.normal
{ font-size:9pt;line-height:120% }
.small
{ font-size:8pt;line-height:120% }
.fine
{ font-size:7pt;line-height:120% }
.tiny
{ font-size:6pt;line-height:120% }
.larger
{ font-size:120%; }
.smaller
{ font-size:80%; }
/* font styles */
.bold
{ font-weight:bold; }
.italics
{ font-style:italics; }
.underline
{ text-decoration:underline; }
/* multi-column tiddler content (not supported in Internet Explorer) */
.twocolumns
{ display:block; -moz-column-count:2; -moz-column-gap:1em; -moz-column-width:50%;}
.threecolumns
{ display:block; -moz-column-count:3; -moz-column-gap:1em; -moz-column-width:33%}
.fourcolumns
{ display:block; -moz-column-count:4; -moz-column-gap:1em; -moz-column-width:25%}
/* borderless tables */
.borderless, .borderless table, .borderless td, .borderless tr, .borderless th, .borderless tbody
{ border:0 !important; margin:0 !important; padding:0 !important; }
/* thumbnail images (fixed-sized scaled images) */
.thumbnail img { height:5em !important; }
/* grouped content */
.outline
{ display:block; padding:1em; -moz-border-radius:1em; border:1px solid; }
.menubox
{ display:block; padding:1em; -moz-border-radius:1em; border:1px solid; background:#ccccff; color:#000; }
.menubox .button, .menubox .tiddlyLinkExisting, .menubox .tiddlyLinkNonExisting
{ color:#009 !important; }
.groupbox
{ display:block; padding:1em; -moz-border-radius:1em; border:1px solid; background:#ffe; color:#000; }
.groupbox a, .groupbox .button, .groupbox .tiddlyLinkExisting, .groupbox .tiddlyLinkNonExisting
{ color:#009 !important; }
.groupbox code
{ color:#333 !important; }
.borderleft
{ margin:0;padding:0;border:0;margin-left:1em; border-left:1px dotted; padding-left:.5em; }
.borderright
{ margin:0;padding:0;border:0;margin-right:1em; border-right:1px dotted; padding-right:.5em; }
.borderbottom
{ margin:0;padding:1px 0;border:0;border-bottom:1px dotted; margin-bottom:1px; padding-bottom:1px; }
.bordertop
{ margin:0;padding:0;border:0;border-top:1px dotted; margin-top:1px; padding-top:1px; }
/* compact form */
.smallform
{ white-space:nowrap; }
.smallform input, .smallform textarea, .smallform button, .smallform checkbox, .smallform radio, .smallform select
{ font-size:8pt; }
/* colors */
.green { color:#6f6 !important }
.red { color:#f66 !important }
.blue { color:#99f !important }
/*}}}*/
|bgcolor(#dddddd):''Case-senstive search''|A function of ~TiddlyWiki whereby the user can search for a word or phrase with precise upper and lowercase specifications.|
|bgcolor(#dddddd):''Client-side''|A ~TiddlyWiki file that is edited offline by the user or client, hence "On the client's side." These cannot be edited through the Internet when the file is located on a web server.|
|bgcolor(#dddddd):''CSS''|CSS is the computer code used to create custom style sheets. Style sheets are pages that control the look of html webpages. The style sheets for a ~TiddlyWiki file are internal. They are the three default style sheets [[StyleSheetColors]], [[StyleSheetLayout]], [[StyleSheetPrint]] and the one you use to override the other three, named simply [[StyleSheet]].<br><br>To learn more about CSS, see [[here|http://www.htmldog.com/reference/cssproperties/]]. |
|bgcolor(#dddddd):''Default Tiddlers''|This is a tiddler that contains the tiddlers that are viewed when your file opens up. You can customize this tiddler or empty it out if you wish.|
|bgcolor(#dddddd):''HTML''|HTML is the computer language used to create webpages. A ~TiddlyWiki file is a modified HTML file.|
|bgcolor(#dddddd):''~JavaScript''|~JavaScript is a computer language used for special functions. It is made of up scripts or instructions that tell a webpage what to do under certain conditions. Java scripts are used to create and run many ~TiddlyWiki plugins.|
|bgcolor(#dddddd):''Macro''|See [[this tiddler|Macros]]|
|bgcolor(#dddddd):''~MainMenu''|The menu normally found on the left hand side of the screen. In the present file it is found in the header. It acts as a table of contents.|
|bgcolor(#dddddd):''Options panel''|The menu in the middle of the right hand menu. Sometimes it is hidden, and you can open it by clicking "options >>".|
|bgcolor(#dddddd):''Permalink''|A ~TiddlyWiki button on the tiddlers that places the exact url of the tiddler in your browser search window. Helpful for placing links to a specific tiddler in e-mails and webpages. |
|bgcolor(#dddddd):''Permaview''|A ~TiddlyWiki option on the right hand menu that places the exact url of the present file when all the currently open tiddlers are open. Helpful for placing links to a specific combination of tiddlers in e-mails and webpages.|
|bgcolor(#dddddd):''Plugin''|A tiddler with a special code that adds extra functionality to a ~TiddlyWiki file. For more information, see [[this tiddler|How to install a plugin]]|
|bgcolor(#dddddd):''Server-side''|A ~TiddlyWiki file that is able to be edited while the file is located on a web server. This gives users the ability to edit it from any online computer. |
|bgcolor(#dddddd):''Shadow tiddlers''|Tiddlers that work in the background and affect the functioning of ~TiddlyWiki. See also [[Special note on modifying shadow tiddlers]]|
|bgcolor(#dddddd):''~SideBar''|The options at the top of the right hand menu.|
|bgcolor(#dddddd):''Slider''|An expandable-and-collapsible menu that you can place in any tiddler. See [[here (external link)|]] for a helpful showcase of four sliders and what to use them for.|
|bgcolor(#dddddd):''~StyleSheet''|A tiddler with the code that controls the appearance, layout and printing properties of a ~TiddlyWiki file. For more information, see [[this tiddler|Messing with StyleSheets]]|
|bgcolor(#dddddd):''systemConfig tag''| A tag that tells ~TiddlyWiki that the tiddler contains Javascript that should be run when the file opens. Usually appended to plugins.|
|bgcolor(#dddddd):''Tabs''|The menu at the bottom of the right hand menu. They are called tabs because they have what looks like the tabs on file folders protruding from the top of them. |
|bgcolor(#dddddd):''Tag''|A label that a user adds to a tiddler to index it according to topic. In other words, the tag is the topic or category by which you want to index and search for your tiddler. This provides an extra way to find tiddlers, because the user can go to the Tags tab in the right hand tabbed menu and browse his or her personal list of tags. See [[this tidder|through tags]]|
|bgcolor(#dddddd):''Tiddler''|A 'window' containing text or code in ~TiddlyWiki. Tiddlers are like 3x5 note cards to which the user adds content and links with other tiddlers using tags and hyperlinks. For more on tiddlers, see [[this tiddler|Anatomy of a Tiddler]]. |
|bgcolor(#dddddd):''~WikiWord''|See [[this tiddler|WikiWord]]|
Simon Baird has a wonderful macro that displays a dropdown menu of various color palettes. You select the palette you desire from the list, and the colors of your ~TiddlyWiki instantly change!
Get the ~SelectPaletteMacro [[here|http://mptw-beta.tiddlyspot.com/#SelectPaletteMacro]].
The header contains the Title and Subtitle of your document. After downloading a ~TiddlyWiki file to your computer, you can alter these by opening and editing the Tiddlers SiteTitle and SiteSubtitle.
[img[http://www.giffmex.org/images/headerimage.GIF]]
Tabbed lists, like the ones to the right listing all tiddlers and tags, are a macro. Here is what the macro looks like:
//{{{
<<tabs identifier tabLabel tabName Tiddlername>>
//}}}
*You leave "tabs" alone. That tells ~TiddlyWiki that this macro is a tabs macro.
*Replace "identifier" with the name that you want to give your //macro//.
*Replace "tabLabel" with the text you want to appear on the tab.
*Replace "tabName" with the name you want to give to that tab.
*Replace "Tiddlername" with the tiddler whose contents will appear when you open that tab.
*For each new tab, insert "tabLabel tabName Tiddlername" within the macro and edit to reflect the contents of the new tab.
Here is a sample tabbed list, and its code. I have placed the sections of the code on separate lines to make it easier to see the separate sections.
<<tabs salsas "Salsa recipes" "Salsa recipes" SalsaRecipes "Soup recipes" "Soup recipes" SoupRecipes>>
{{{
<<tabs salsas
"Salsa recipes" "Salsa recipes" SalsaRecipes
"Soup recipes" "Soup recipes" SoupRecipes>>
}}}
The ~MainMenu is basically a table of contents by which you can quickly access the main contents of your file. You can edit any and all aspects of the ~MainMenu by opening and editing the MainMenu Tiddler. Below is a main menu of another of my ~TiddlyWiki documents ([[link here|http://www.giffmex.org/philemontiddlywiki.html]]). In the present tutorial file, the ~MainMenu has been placed in the header to allow more room for the text.
[img[http://www.giffmex.org/images/mainmenu.GIF]]
What I call the right hand menu or sidebar menu is filled with tools.
!The top of the menu
At the top of the right hand menu there are several features:
[img[http://www.giffmex.org/images/rhtop.GIF]]
!Interface options
Clicking the ''options >>'' link opens up the Interface Options menu:
[img[http://www.giffmex.org/images/interfaceoptions.GIF]]
(Note: in version 2.2, Plugin Manager and Import Tiddlers have been moved to the backstage area.)
!Lists of Tiddlers and tags
At the bottom of the right hand menu are lists of all the Tiddlers and tags in your ~TiddlyWiki file:
[img[http://www.giffmex.org/images/tidlist.GIF]]
/***
|Name|TiddlerTweakerPlugin|
|Source|http://www.TiddlyTools.com/#TiddlerTweakerPlugin|
|Version|2.2.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <br>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides||
|Description|select multiple tiddlers and modify author, created, modified and/or tag values|
TiddlerTweaker is a tool for TiddlyWiki authors. It allows you to select multiple tiddlers from a listbox, either by direct interaction or automatically matching specific criteria. You can then modify the creator, author, created, modified and/or tag values of those tiddlers using a compact set of form fields. The values you enter into the fields simultantously overwrite the existing values in all tiddlers you have selected.
!!!!!Usage
<<<
{{{<<tiddlerTweaker>>}}}
{{smallform{<<tiddlerTweaker>>}}}
By default, any tags you enter into the TiddlerTweaker will //replace// the existing tags in all the tiddlers you have selected. However, you can also use TiddlerTweaker to quickly filter specified tags from the selected tiddlers, while leaving any other tags assigned to those tiddlers unchanged:
>Any tag preceded by a "+" (plus) or "-" (minus), will be added or removed from the existing tags //instead of replacing the entire tag definition// of each tiddler (e.g., enter "-excludeLists" to remove that tag from all selected tiddlers. When using this syntax, care should be taken to ensure that //every// tag is preceded by "+" or "-", to avoid inadvertently overwriting any other existing tags on the selected tiddlers. (note: the "+" or "-" prefix on each tag value is NOT part of the tag value, and is only used by TiddlerTweaker to control how that tag value is processed)
Important Notes:
* Inasmuch as TiddlerTweaker is a 'power user' tool that can perform 'batch' functions (operating on many tiddlers at once), you should always have a recent backup of your document (or "save changes" just *before* tweaking the tiddlers), just in case you "shoot yourself in the foot".
* By design, TiddlerTweaker does NOT update the 'modified' date of tiddlers simply by making changes to the tiddler's values. A tiddler's dates are ONLY updated when the corresponding 'created' and/or 'modified' checkboxes are selected and you enter new values for those dates. As a general rule, after using TiddlerTweaker, always ''//remember to save your document//'' when you are done, even though the tiddler timeline tab may not show any recently modified tiddlers.
* Because you may be changing the values on many tiddlers simultaneously, selecting and updating all tiddlers in a document operation may take a while and your browser might warn about an "unresponsive script"... you should give it a whole bunch of time to 'continue'... it should complete the processing... eventually.
<<<
!!!!!Revisions
<<<
2008.01.13 [2.2.0] added "auto-selection" links: all, changed, tags, title, text
2007.12.26 [2.1.0] added support for managing 'creator' custom field (see [[CoreTweaks]])
2007.11.01 [2.0.3] added config.options.txtTweakerSortBy for cookie-based persistence of list display order preference setting.
2007.09.28 [2.0.2] in settiddlers() and deltiddlers(), added suspend/resume notification handling (improves performance when operating on multiple tiddlers)
2007.08.03 [2.0.1] added shadow definition for [[TiddlerTweaker]] tiddler for use as parameter references with {{{<<tiddler>>, <<slider>> or <<tabs>>}}} macros.
2007.08.03 [2.0.0] converted from inline script
2006.01.01 [1.0.0] initial release
<<<
!!!!!Code
***/
//{{{
version.extensions.tiddlerTweaker= {major: 2, minor: 2, revision: 0, date: new Date(2008,1,13)};
config.shadowTiddlers.TiddlerTweaker="<<tiddlerTweaker>>";
if (config.options.txtTweakerSortBy==undefined) config.options.txtTweakerSortBy="title";
config.macros.tiddlerTweaker = {
html: '<form style="display:inline"><!--\
--><table style="padding:0;margin:0;border:0;width:100%"><tr valign="top" style="padding:0;margin:0;border:0"><!--\
--><td style="text-align:center;white-space:nowrap;width:99%;padding:0;margin:0;border:0"><!--\
--><font size=-2><div style="text-align:left;"><span style="float:right"><!--\
--> <a href="javascript:;" \
title="select all tiddlers"\
onclick="\
var f=this; while (f&&f.nodeName.toLowerCase()!=\'form\')f=f.parentNode;\
for (var t=0; t<f.list.options.length; t++)\
if (f.list.options[t].value.length) f.list.options[t].selected=true;\
config.macros.tiddlerTweaker.selecttiddlers(f.list);\
return false">all</a><!--\
--> <a href="javascript:;" \
title="select tiddlers that are new/changed since the last file save"\
onclick="\
var lastmod=new Date(document.lastModified);\
var f=this; while (f&&f.nodeName.toLowerCase()!=\'form\')f=f.parentNode;\
for (var t=0; t<f.list.options.length; t++) {\
var tid=store.getTiddler(f.list.options[t].value);\
f.list.options[t].selected=tid&&tid.modified>lastmod;\
}\
config.macros.tiddlerTweaker.selecttiddlers(f.list);\
return false">changed</a><!--\
--> <a href="javascript:;" \
title="select tiddlers with at least one matching tag"\
onclick="\
var t=prompt(\'Enter space-separated tags (match ONE)\');\
if (!t||!t.length) return false;\
var tags=t.readBracketedList();\
var f=this; while (f&&f.nodeName.toLowerCase()!=\'form\')f=f.parentNode;\
for (var t=0; t<f.list.options.length; t++) {\
f.list.options[t].selected=false;\
var tid=store.getTiddler(f.list.options[t].value);\
if (tid&&tid.tags.containsAny(tags)) f.list.options[t].selected=true;\
}\
config.macros.tiddlerTweaker.selecttiddlers(f.list);\
return false">tags</a><!--\
--> <a href="javascript:;" \
title="select tiddlers whose titles include matching text"\
onclick="\
var txt=prompt(\'Enter a title (or portion of a title) to match\');\
if (!txt||!txt.length) return false;\
var f=this; while (f&&f.nodeName.toLowerCase()!=\'form\')f=f.parentNode;\
for (var t=0; t<f.list.options.length; t++) {\
f.list.options[t].selected=f.list.options[t].value.indexOf(txt)!=-1;\
}\
config.macros.tiddlerTweaker.selecttiddlers(f.list);\
return false">titles</a><!--\
--> <a href="javascript:;" \
title="select tiddlers containing matching text"\
onclick="\
var txt=prompt(\'Enter tiddler text (content) to match\');\
if (!txt||!txt.length) return false;\
var f=this; while (f&&f.nodeName.toLowerCase()!=\'form\')f=f.parentNode;\
for (var t=0; t<f.list.options.length; t++) {\
var tt=store.getTiddlerText(f.list.options[t].value,\'\');\
f.list.options[t].selected=(tt.indexOf(txt)!=-1);\
}\
config.macros.tiddlerTweaker.selecttiddlers(f.list);\
return false">text</a> <!--\
--></span><span>select tiddlers</span><!--\
--></div><!--\
--></font><select multiple name=list size="10" style="width:99.99%" \
title="use click, shift-click and/or ctrl-click to select multiple tiddler titles" \
onclick="config.macros.tiddlerTweaker.selecttiddlers(this)" \
onchange="config.macros.tiddlerTweaker.setfields(this)"><!--\
--></select><br><!--\
-->show<input type=text size=1 value="10" \
onchange="this.form.list.size=this.value; this.form.list.multiple=(this.value>1);"><!--\
-->by<!--\
--><select name=sortby size=1 \
onchange="config.macros.tiddlerTweaker.init(this.form,this.value)"><!--\
--><option value="title">title</option><!--\
--><option value="size">size</option><!--\
--><option value="modified">date</option><!--\
--></select><!--\
--><input type="button" value="refresh" \
onclick="config.macros.tiddlerTweaker.init(this.form,this.form.sortby.value)"<!--\
--> <input type="button" name="stats" disabled value="totals..." \
onclick="config.macros.tiddlerTweaker.stats(this)"><!--\
--></td><td style="white-space:nowrap;padding:0;margin:0;border:0;width:1%"><!--\
--><div style="text-align:left"><font size=-2> modify values</font></div><!--\
--><table border=0 style="width:100%;padding:0;margin:0;border:0;"><tr style="padding:0;border:0;"><!--\
--><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=checkbox name=settitle unchecked \
title="allow changes to tiddler title (rename tiddler)" \
onclick="this.form.title.disabled=!this.checked">title<!--\
--></td><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=text name=title size=35 style="width:98%" disabled><!--\
--></td></tr><tr style="padding:0;border:0;"><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=checkbox name=setcreator unchecked \
title="allow changes to tiddler creator" \
onclick="this.form.creator.disabled=!this.checked">created by<!--\
--></td><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=text name=creator size=35 style="width:98%" disabled><!--\
--></td></tr><tr style="padding:0;border:0;"><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=checkbox name=setwho unchecked \
title="allow changes to tiddler author" \
onclick="this.form.who.disabled=!this.checked">modified by<!--\
--></td><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=text name=who size=35 style="width:98%" disabled><!--\
--></td></tr><tr style="padding:0;border:0;"><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=checkbox name=setcdate unchecked \
title="allow changes to created date" \
onclick="var f=this.form; f.cm.disabled=f.cd.disabled=f.cy.disabled=f.ch.disabled=f.cn.disabled=!this.checked"><!--\
-->created on<!--\
--></td><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=text name=cm size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--> / <input type=text name=cd size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--> / <input type=text name=cy size=4 style="width:3em;padding:0;text-align:center" disabled><!--\
--> at <input type=text name=ch size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--> : <input type=text name=cn size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--></td></tr><tr style="padding:0;border:0;"><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=checkbox name=setmdate unchecked \
title="allow changes to modified date" \
onclick="var f=this.form; f.mm.disabled=f.md.disabled=f.my.disabled=f.mh.disabled=f.mn.disabled=!this.checked"><!--\
-->modified on<!--\
--></td><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=text name=mm size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--> / <input type=text name=md size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--> / <input type=text name=my size=4 style="width:3em;padding:0;text-align:center" disabled><!--\
--> at <input type=text name=mh size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--> : <input type=text name=mn size=2 style="width:2em;padding:0;text-align:center" disabled><!--\
--></td></tr><tr style="padding:0;border:0;"><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=checkbox name=settags checked \
title="allow changes to tiddler tags" \
onclick="this.form.tags.disabled=!this.checked">tags<!--\
--></td><td style="padding:1px;border:0;white-space:nowrap"><!--\
--><input type=text name=tags size=35 value="" style="width:98%" \
title="enter new tags or use \'+tag\' and \'-tag\' to add/remove tags from existing tags"><!--\
--></td></tr></table><!--\
--><div style="margin-top:.8em;text-align:center"><!--\
--><nobr><input type=button name=display disabled style="width:32%" value="display tiddlers" \
onclick="config.macros.tiddlerTweaker.displaytiddlers(this)"><!--\
--> <input type=button name=del disabled style="width:32%" value="delete tiddlers" \
onclick="config.macros.tiddlerTweaker.deltiddlers(this)"><!--\
--> <input type=button name=set disabled style="width:32%" value="update tiddlers" \
onclick="config.macros.tiddlerTweaker.settiddlers(this)"></nobr><!--\
--></div><!--\
--></td></tr></table><!--\
--></form><span style="display:none"><!--content replaced by tiddler "stats"--></span>\
',
handler: function(place,macroName,params,wikifier,paramString,tiddler) {
var span=createTiddlyElement(place,"span");
span.innerHTML=this.html;
this.init(span.firstChild,config.options.txtTweakerSortBy);
},
init: function(f,sortby) { // initialize form controls
if (!f) return; // form might not be rendered yet...
while (f.list.options[0]) f.list.options[0]=null; // empty current list content
var tids=store.getTiddlers(sortby);
if (sortby=="size") // descending order (largest tiddlers listed first)
tids.sort(function(a,b) {return a.text.length > b.text.length ? -1 : (a.text.length == b.text.length ? 0 : +1);});
for (i=0; i<tids.length; i++) {
var label=tids[i].title; var value=tids[i].title;
if (sortby=="modified") {
label=tids[tids.length-i-1].modified.formatString("YY.0MM.0DD 0hh:0mm ")+tids[tids.length-i-1].title;
value=tids[tids.length-i-1].title;
}
if (sortby=="size") label="["+tids[i].text.length+"] "+label;
f.list.options[f.list.length]=new Option(label,value,false,false);
}
f.title.value=f.who.value=f.creator.value=f.tags.value="";
f.cm.value=f.cd.value=f.cy.value=f.ch.value=f.cn.value="";
f.mm.value=f.md.value=f.my.value=f.mh.value=f.mn.value="";
f.stats.disabled=f.set.disabled=f.del.disabled=f.display.disabled=true;
f.settitle.disabled=false;
config.options.txtTweakerSortBy=sortby; // remember current setting
f.sortby.value=sortby; // sync droplist selection with current setting
if (sortby!="title") // non-default preference... save cookie
saveOptionCookie("txtTweakerSortBy");
else { // default preference... clear cookie
var ex=new Date(); ex.setTime(ex.getTime()-1000);
document.cookie = "txtTweakerSortBy=null; path=/; expires="+ex.toGMTString();
}
},
selecttiddlers: function(here) { // enable/disable tweaker fields based on number of items selected
// count how many tiddlers are selected
var f=here.form; var list=f.list;
var c=0; for (i=0;i<list.length;i++) if (list.options[i].selected) c++;
if (c>1) f.title.disabled=true;
if (c>1) f.settitle.checked=false;
f.set.disabled=(c==0);
f.del.disabled=(c==0);
f.display.disabled=(c==0);
f.settitle.disabled=(c>1);
f.stats.disabled=(c==0);
var msg=(c==0)?'select tiddlers':(c+' tiddler'+(c!=1?'s':'')+' selected');
here.previousSibling.firstChild.firstChild.nextSibling.innerHTML=msg;
if (c) clearMessage(); else displayMessage("no tiddlers selected");
},
setfields: function(here) { // set tweaker edit fields from first selected tiddler
var f=here.form;
if (!here.value.length) {
f.title.value=f.who.value=f.creator.value=f.tags.value="";
f.cm.value=f.cd.value=f.cy.value=f.ch.value=f.cn.value="";
f.mm.value=f.md.value=f.my.value=f.mh.value=f.mn.value="";
return;
}
var tid=store.getTiddler(here.value); if (!tid) return;
f.title.value=tid.title;
f.who.value=tid.modifier;
f.creator.value=tid.fields['creator']||''; // custom field - might not exist
f.tags.value=tid.tags.join(' ');
var c=tid.created; var m=tid.modified;
f.cm.value=c.getMonth()+1;
f.cd.value=c.getDate();
f.cy.value=c.getFullYear();
f.ch.value=c.getHours();
f.cn.value=c.getMinutes();
f.mm.value=m.getMonth()+1;
f.md.value=m.getDate();
f.my.value=m.getFullYear();
f.mh.value=m.getHours();
f.mn.value=m.getMinutes();
},
settiddlers: function(here) {
var f=here.form; var list=f.list;
var tids=[];
for (i=0;i<list.length;i++) if (list.options[i].selected) tids.push(list.options[i].value);
if (!tids.length) { alert("please select at least one tiddler"); return; }
var cdate=new Date(f.cy.value,f.cm.value-1,f.cd.value,f.ch.value,f.cn.value);
var mdate=new Date(f.my.value,f.mm.value-1,f.md.value,f.mh.value,f.mn.value);
if (tids.length>1 && !confirm("Are you sure you want to update these tiddlers:\n\n"+tids.join(', '))) return;
store.suspendNotifications();
for (t=0;t<tids.length;t++) {
var tid=store.getTiddler(tids[t]); if (!tid) continue;
var title=!f.settitle.checked?tid.title:f.title.value;
var who=!f.setwho.checked?tid.modifier:f.who.value;
var tags=tid.tags
if (f.settags.checked) {
var intags=f.tags.value.readBracketedList();
var addtags=[]; var deltags=[]; var reptags=[];
for (i=0;i<intags.length;i++) {
if (intags[i].substr(0,1)=='+')
addtags.push(intags[i].substr(1));
else if (intags[i].substr(0,1)=='-')
deltags.push(intags[i].substr(1));
else
reptags.push(intags[i]);
}
if (reptags.length)
tags=reptags;
if (addtags.length)
tags=Array.concat(tags,addtags);
if (deltags.length)
for (i=0;i<deltags.length;i++)
{ var pos=tags.indexOf(deltags[i]); if (pos!=-1) tags.splice(pos,1); }
}
if (!f.setcdate.checked) cdate=tid.created;
if (!f.setmdate.checked) mdate=tid.modified;
store.saveTiddler(tid.title,title,tid.text,who,mdate,tags,tid.fields);
if (f.setcreator.checked) store.setValue(tid.title,'creator',f.creator.value); // set creator
if (f.setcdate.checked) tid.assign(null,null,null,null,null,cdate); // set create date
}
store.resumeNotifications();
this.init(f,f.sortby.value);
},
displaytiddlers: function(here) {
var f=here.form; var list=f.list;
var tids=[];
for (i=0; i<list.length;i++) if (list.options[i].selected) tids.push(list.options[i].value);
if (!tids.length) { alert("please select at least one tiddler"); return; }
story.displayTiddlers(story.findContainingTiddler(f),tids)
},
deltiddlers: function(here) {
var f=here.form; var list=f.list;
var tids=[];
for (i=0;i<list.length;i++) if (list.options[i].selected) tids.push(list.options[i].value);
if (!tids.length) { alert("please select at least one tiddler"); return; }
if (!confirm("Are you sure you want to delete these tiddlers:\n\n"+tids.join(', '))) return;
store.suspendNotifications();
for (t=0;t<tids.length;t++) {
var tid=store.getTiddler(tids[t]); if (!tid) continue;
if (tid.tags.contains("systemConfig"))
if (!confirm("'"+tid.title+"' is tagged with 'systemConfig'.\n\nRemoving this tiddler may cause unexpected results. Are you sure?"))
continue;
store.removeTiddler(tid.title);
}
store.resumeNotifications();
this.init(f,f.sortby.value);
},
stats: function(here) {
var f=here.form; var list=f.list; var tids=[]; var out=''; var tot=0;
var target=f.nextSibling;
for (i=0;i<list.length;i++) if (list.options[i].selected) tids.push(list.options[i].value);
if (!tids.length) { alert("please select at least one tiddler"); return; }
for (t=0;t<tids.length;t++) {
var tid=store.getTiddler(tids[t]); if (!tid) continue;
out+='[['+tid.title+']] '+tid.text.length+'\n'; tot+=tid.text.length;
}
var avg=tot/tids.length;
out=tot+' bytes in '+tids.length+' selected tiddlers ('+avg+' bytes/tiddler)\n<<<\n'+out+'<<<\n';
removeChildren(target);
target.innerHTML="<hr><font size=-2><a href='javascript:;' style='float:right' onclick='this.parentNode.parentNode.style.display=\"none\"'>close</a></font>";
wikify(out,target);
target.style.display="block";
}
};
//}}}
~TiddlySnip is a Firefox add-on that allows you to quickly "snip" selected text from webpages and paste it directly into a ~TiddlyWiki file. You can even specify categories and when you snip the text, and ~TiddlySnip will add a tag with the category you specify. Check it out at http://tiddlysnip.com/#About.
Not too crazy about the default colors and layout, but you're not ready to tinker behind the scenes with your ~TiddlyWiki? Try out one of the many themes at http://tiddlythemes.com. They even have themes that look like blogs.
Want a calendar plugin? A tag cloud plugin? A plugin for an address book? There is now a growing index of over 100 ~TiddlyWiki plugins, macros, scripts and themes, organized by categories. Check it out at http://www.giffmex.org/twvault.html.
Why reinvent the wheel? Morris Gray has a number of tips [[here|http://tiddlyspot.com/twhelp/#%5B%5BFireFox%20Tips%5D%5D]] at his excellent tutorial.
*''Disable the animations.'' It may be cute to have tiddlers open with cool animation, but the animation slows performance way down. Open the OptionsPanel and uncheck ~EnableAnimations.
*''Save less often.'' Uncheck 'Autosave' and 'Save backups', and save manually every few minutes instead of saving every single change.
*''Hide the growing tabbed lists in your SideBarTabs.'' Every time you create a new tiddler, TabAll and TabTimeline have to refresh to add the new tiddler's title. As the list of tiddlers gets longer, these tabs take longer to refresh, slowing down your ~TiddlyWiki. There are three ways I know of to hide these lists:
##The easiest way is to click on the More tab. The lists in More don't grow like the other lists. This should be a good enough solution for most users.
##You can use the ToggleRightSidebar plugin to hide the entire right hand sidebar of your ~TiddlyWiki screen. This plugin happens to be included in this tutorial.
##I don't necessarily recommend the following for newer users, but to remove the right hand sidebar tabs from view altogether, open PageTemplate and delete the following:
<!--{{{-->
<div id='sidebarTabs' refresh='content' force='true' tiddler='SideBarTabs'></div>
<!--}}}-->
*''Michael Cimino offered this suggestion by e-mail:''
"...(1) add the following to the end of SidebarOptions: {{{<<slider chkSliderContents [[TabContents]] 'contents »' 'contents'>>}}}
(2) cut out the text from SidebarTabs and save it, leaving it blank.
(3) create a new tiddler TabContents and paste the text that used to be in SidebarTabs, which should be:
{{{<<tabs txtMainTab "Timeline" "Timeline" TabTimeline "All" "All tiddlers" TabAll "Tags" "All tags" TabTags "More" "More lists" TabMore>>}}}
Now, you can collapse that area of the Sidebar whenever you wish, and its state will be saved in a cookie! I hope this helps!"
Look at our top menu. The last item says, (depending on what you have or haven't done with it), either "Hide Sidebar", "Need more room?" or "Need the sidebar?" When you click on those words, the right hand sidebar disappears and reappears. This is done with the ToggleRightSidebar script from ~TiddlyTools. See [[here|http://www.TiddlyTools.com/#ToggleRightSidebar]] for more details. ~TiddlyTools also offers a ~ToggleLeftSidebar script for ~TWs with left hand main menus.
/%
|Name|ToggleRightSidebar|
|Source|http://www.TiddlyTools.com/#ToggleRightSidebar|
|Version|0.0.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <<br>>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|script|
|Requires||
|Overrides||
|Description||
%/<script label="show/hide right sidebar">
var show=document.getElementById('sidebar').style.display=='none';
if (!show) {
document.getElementById('sidebar').style.display='none';
var margin='1em';
}
else {
document.getElementById('sidebar').style.display='block';
var margin=config.options.txtDisplayAreaRightMargin?config.options.txtDisplayAreaRightMargin:"";
}
place.innerHTML=(show?"Need More Room?":"Need the Sidebar?"); // SET LINK TEXT
place.title=show?"hide sidebar":"show sidebar"; // SET TOOLTIP
document.getElementById('displayArea').style.marginRight=margin;
config.options.chkShowRightSidebar=show;
saveOptionCookie('chkShowRightSidebar');
var sm=document.getElementById("storyMenu"); if (sm) config.refreshers.content(sm);
return false;
</script><script>
if (config.options.chkShowRightSidebar==undefined)
config.options.chkShowRightSidebar=true;
if (!config.options.txtDisplayAreaRightMargin||!config.options.txtDisplayAreaRightMargin.length)
config.options.txtDisplayAreaRightMargin="15em";
var show=config.options.chkShowRightSidebar;
document.getElementById('sidebar').style.display=show?"block":"none";
document.getElementById('displayArea').style.marginRight=show?config.options.txtDisplayAreaRightMargin:"1em";
place.lastChild.innerHTML=(show?"Hide Sidebar":"Show Sidebar"); // SET LINK TEXT
place.lastChild.title=show?"hide sidebar":"show sidebar"; // SET TOOLTIP
place.lastChild.style.fontWeight="normal";
</script>
If you compare this tutorial with Jeremy Ruston's original ~TiddlyWiki file ([[here|http://www.tiddlywiki.com]]), you will notice that his file has the ~MainMenu in a left-hand sidebar, while I have the ~MainMenu built into the header. Mine is called a ~TopMenu. Top menus have the advantage of saving horizontal space. Tiddlers can get pretty squished inbetween a left-hand ~MainMenu and a right hand options sidebar. So to free up room for wider tiddlers, I moved the menu to the top.
The way I see it, there are three things you might want to know about moving the ~MainMenu from one place to another:
[[How do I remove the top menu and have a normal left-hand menu?]]
[[How do I remove the left-hand menu of a typical TiddlyWiki and create a top menu for it?]]
[[Can I have both a left-hand menu AND a top menu, each with different items?]]
/***
Contains the stuff you need to use Tiddlyspot
Note you must also have UploadPlugin installed
***/
//{{{
// edit this if you are migrating sites or retrofitting an existing TW
config.tiddlyspotSiteId = 'riverbend';
// make it so you can by default see edit controls via http
config.options.chkHttpReadOnly = false;
window.readOnly = false; // make sure of it (for tw 2.2)
// disable autosave in d3
if (window.location.protocol != "file:")
config.options.chkGTDLazyAutoSave = false;
// tweak shadow tiddlers to add upload button, password entry box etc
with (config.shadowTiddlers) {
SiteUrl = 'http://'+config.tiddlyspotSiteId+'.tiddlyspot.com';
SideBarOptions = SideBarOptions.replace(/(<<saveChanges>>)/,"$1<<tiddler TspotSidebar>>");
OptionsPanel = OptionsPanel.replace(/^/,"<<tiddler TspotOptions>>");
DefaultTiddlers = DefaultTiddlers.replace(/^/,"[[WelcomeToTiddlyspot]] ");
MainMenu = MainMenu.replace(/^/,"[[WelcomeToTiddlyspot]] ");
}
// create some shadow tiddler content
merge(config.shadowTiddlers,{
'WelcomeToTiddlyspot':[
"This document is a ~TiddlyWiki from tiddlyspot.com. A ~TiddlyWiki is an electronic notebook that is great for managing todo lists, personal information, and all sorts of things.",
"",
"@@font-weight:bold;font-size:1.3em;color:#444; //What now?// @@ Before you can save any changes, you need to enter your password in the form below. Then configure privacy and other site settings at your [[control panel|http://" + config.tiddlyspotSiteId + ".tiddlyspot.com/controlpanel]] (your control panel username is //" + config.tiddlyspotSiteId + "//).",
"<<tiddler TspotControls>>",
"See also GettingStarted.",
"",
"@@font-weight:bold;font-size:1.3em;color:#444; //Working online// @@ You can edit this ~TiddlyWiki right now, and save your changes using the \"save to web\" button in the column on the right.",
"",
"@@font-weight:bold;font-size:1.3em;color:#444; //Working offline// @@ A fully functioning copy of this ~TiddlyWiki can be saved onto your hard drive or USB stick. You can make changes and save them locally without being connected to the Internet. When you're ready to sync up again, just click \"upload\" and your ~TiddlyWiki will be saved back to tiddlyspot.com.",
"",
"@@font-weight:bold;font-size:1.3em;color:#444; //Help!// @@ Find out more about ~TiddlyWiki at [[TiddlyWiki.com|http://tiddlywiki.com]]. Also visit [[TiddlyWiki Guides|http://tiddlywikiguides.org]] for documentation on learning and using ~TiddlyWiki. New users are especially welcome on the [[TiddlyWiki mailing list|http://groups.google.com/group/TiddlyWiki]], which is an excellent place to ask questions and get help. If you have a tiddlyspot related problem email [[tiddlyspot support|mailto:support@tiddlyspot.com]].",
"",
"@@font-weight:bold;font-size:1.3em;color:#444; //Enjoy :)// @@ We hope you like using your tiddlyspot.com site. Please email [[feedback@tiddlyspot.com|mailto:feedback@tiddlyspot.com]] with any comments or suggestions."
].join("\n"),
'TspotControls':[
"| tiddlyspot password:|<<option pasUploadPassword>>|",
"| site management:|<<upload http://" + config.tiddlyspotSiteId + ".tiddlyspot.com/store.cgi index.html . . " + config.tiddlyspotSiteId + ">>//(requires tiddlyspot password)//<<br>>[[control panel|http://" + config.tiddlyspotSiteId + ".tiddlyspot.com/controlpanel]], [[download (go offline)|http://" + config.tiddlyspotSiteId + ".tiddlyspot.com/download]]|",
"| links:|[[tiddlyspot.com|http://tiddlyspot.com/]], [[FAQs|http://faq.tiddlyspot.com/]], [[announcements|http://announce.tiddlyspot.com/]], [[blog|http://tiddlyspot.com/blog/]], email [[support|mailto:support@tiddlyspot.com]] & [[feedback|mailto:feedback@tiddlyspot.com]], [[donate|http://tiddlyspot.com/?page=donate]]|"
].join("\n"),
'TspotSidebar':[
"<<upload http://" + config.tiddlyspotSiteId + ".tiddlyspot.com/store.cgi index.html . . " + config.tiddlyspotSiteId + ">><html><a href='http://" + config.tiddlyspotSiteId + ".tiddlyspot.com/download' class='button'>download</a></html>"
].join("\n"),
'TspotOptions':[
"tiddlyspot password:",
"<<option pasUploadPassword>>",
""
].join("\n")
});
//}}}
| !date | !user | !location | !storeUrl | !uploadDir | !toFilename | !backupdir | !origin |
| 11/03/2008 06:07:42 | YourName | [[/|http://riverbend.tiddlyspot.com/]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . |
| 11/03/2008 10:29:44 | JK | [[riverbend.html|file:///E:/riverbend.html]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . | ok |
| 11/03/2008 13:22:03 | jk | [[riverbend.html|file:///G:/riverbend.html]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . | ok |
| 11/03/2008 13:24:27 | jk | [[riverbend.html|file:///G:/riverbend.html#SinglePageModePlugin]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . |
| 11/03/2008 17:10:37 | JK | [[/|http://riverbend.tiddlyspot.com/#SinglePageModePlugin]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . |
| 11/03/2008 20:24:32 | JK | [[riverbend.html|file:///C:/Documents%20and%20Settings/Owner/Desktop/riverbend.html#%5B%5Buse%20databases%2C%20NoodleBib%20and%20Google%5D%5D]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . |
| 12/03/2008 08:42:12 | JK | [[riverbend.html|file:///C:/Documents%20and%20Settings/SCS/My%20Documents/riverbend.html#Midnight]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . |
| 12/03/2008 21:02:53 | JK | [[riverbend.html|file:///C:/Documents%20and%20Settings/Owner/Desktop/riverbend.html#%5B%5Buse%20Wikipedia%5D%5D]] | [[store.cgi|http://riverbend.tiddlyspot.com/store.cgi]] | . | [[index.html | http://riverbend.tiddlyspot.com/index.html]] | . |
/***
|''Name:''|PasswordOptionPlugin|
|''Description:''|Extends TiddlyWiki options with non encrypted password option.|
|''Version:''|1.0.2|
|''Date:''|Apr 19, 2007|
|''Source:''|http://tiddlywiki.bidix.info/#PasswordOptionPlugin|
|''Author:''|BidiX (BidiX (at) bidix (dot) info)|
|''License:''|[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D ]]|
|''~CoreVersion:''|2.2.0 (Beta 5)|
***/
//{{{
version.extensions.PasswordOptionPlugin = {
major: 1, minor: 0, revision: 2,
date: new Date("Apr 19, 2007"),
source: 'http://tiddlywiki.bidix.info/#PasswordOptionPlugin',
author: 'BidiX (BidiX (at) bidix (dot) info',
license: '[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D]]',
coreVersion: '2.2.0 (Beta 5)'
};
config.macros.option.passwordCheckboxLabel = "Save this password on this computer";
config.macros.option.passwordInputType = "password"; // password | text
setStylesheet(".pasOptionInput {width: 11em;}\n","passwordInputTypeStyle");
merge(config.macros.option.types, {
'pas': {
elementType: "input",
valueField: "value",
eventName: "onkeyup",
className: "pasOptionInput",
typeValue: config.macros.option.passwordInputType,
create: function(place,type,opt,className,desc) {
// password field
config.macros.option.genericCreate(place,'pas',opt,className,desc);
// checkbox linked with this password "save this password on this computer"
config.macros.option.genericCreate(place,'chk','chk'+opt,className,desc);
// text savePasswordCheckboxLabel
place.appendChild(document.createTextNode(config.macros.option.passwordCheckboxLabel));
},
onChange: config.macros.option.genericOnChange
}
});
merge(config.optionHandlers['chk'], {
get: function(name) {
// is there an option linked with this chk ?
var opt = name.substr(3);
if (config.options[opt])
saveOptionCookie(opt);
return config.options[name] ? "true" : "false";
}
});
merge(config.optionHandlers, {
'pas': {
get: function(name) {
if (config.options["chk"+name]) {
return encodeCookie(config.options[name].toString());
} else {
return "";
}
},
set: function(name,value) {config.options[name] = decodeCookie(value);}
}
});
// need to reload options to load passwordOptions
loadOptionsCookie();
/*
if (!config.options['pasPassword'])
config.options['pasPassword'] = '';
merge(config.optionsDesc,{
pasPassword: "Test password"
});
*/
//}}}
/***
|''Name:''|UploadPlugin|
|''Description:''|Save to web a TiddlyWiki|
|''Version:''|4.1.0|
|''Date:''|May 5, 2007|
|''Source:''|http://tiddlywiki.bidix.info/#UploadPlugin|
|''Documentation:''|http://tiddlywiki.bidix.info/#UploadPluginDoc|
|''Author:''|BidiX (BidiX (at) bidix (dot) info)|
|''License:''|[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D ]]|
|''~CoreVersion:''|2.2.0 (#3125)|
|''Requires:''|PasswordOptionPlugin|
***/
//{{{
version.extensions.UploadPlugin = {
major: 4, minor: 1, revision: 0,
date: new Date("May 5, 2007"),
source: 'http://tiddlywiki.bidix.info/#UploadPlugin',
author: 'BidiX (BidiX (at) bidix (dot) info',
coreVersion: '2.2.0 (#3125)'
};
//
// Environment
//
if (!window.bidix) window.bidix = {}; // bidix namespace
bidix.debugMode = false; // true to activate both in Plugin and UploadService
//
// Upload Macro
//
config.macros.upload = {
// default values
defaultBackupDir: '', //no backup
defaultStoreScript: "store.php",
defaultToFilename: "index.html",
defaultUploadDir: ".",
authenticateUser: true // UploadService Authenticate User
};
config.macros.upload.label = {
promptOption: "Save and Upload this TiddlyWiki with UploadOptions",
promptParamMacro: "Save and Upload this TiddlyWiki in %0",
saveLabel: "save to web",
saveToDisk: "save to disk",
uploadLabel: "upload"
};
config.macros.upload.messages = {
noStoreUrl: "No store URL in parmeters or options",
usernameOrPasswordMissing: "Username or password missing"
};
config.macros.upload.handler = function(place,macroName,params) {
if (readOnly)
return;
var label;
if (document.location.toString().substr(0,4) == "http")
label = this.label.saveLabel;
else
label = this.label.uploadLabel;
var prompt;
if (params[0]) {
prompt = this.label.promptParamMacro.toString().format([this.destFile(params[0],
(params[1] ? params[1]:bidix.basename(window.location.toString())), params[3])]);
} else {
prompt = this.label.promptOption;
}
createTiddlyButton(place, label, prompt, function() {config.macros.upload.action(params);}, null, null, this.accessKey);
};
config.macros.upload.action = function(params)
{
// for missing macro parameter set value from options
var storeUrl = params[0] ? params[0] : config.options.txtUploadStoreUrl;
var toFilename = params[1] ? params[1] : config.options.txtUploadFilename;
var backupDir = params[2] ? params[2] : config.options.txtUploadBackupDir;
var uploadDir = params[3] ? params[3] : config.options.txtUploadDir;
var username = params[4] ? params[4] : config.options.txtUploadUserName;
var password = config.options.pasUploadPassword; // for security reason no password as macro parameter
// for still missing parameter set default value
if ((!storeUrl) && (document.location.toString().substr(0,4) == "http"))
storeUrl = bidix.dirname(document.location.toString())+'/'+config.macros.upload.defaultStoreScript;
if (storeUrl.substr(0,4) != "http")
storeUrl = bidix.dirname(document.location.toString()) +'/'+ storeUrl;
if (!toFilename)
toFilename = bidix.basename(window.location.toString());
if (!toFilename)
toFilename = config.macros.upload.defaultToFilename;
if (!uploadDir)
uploadDir = config.macros.upload.defaultUploadDir;
if (!backupDir)
backupDir = config.macros.upload.defaultBackupDir;
// report error if still missing
if (!storeUrl) {
alert(config.macros.upload.messages.noStoreUrl);
clearMessage();
return false;
}
if (config.macros.upload.authenticateUser && (!username || !password)) {
alert(config.macros.upload.messages.usernameOrPasswordMissing);
clearMessage();
return false;
}
bidix.upload.uploadChanges(false,null,storeUrl, toFilename, uploadDir, backupDir, username, password);
return false;
};
config.macros.upload.destFile = function(storeUrl, toFilename, uploadDir)
{
if (!storeUrl)
return null;
var dest = bidix.dirname(storeUrl);
if (uploadDir && uploadDir != '.')
dest = dest + '/' + uploadDir;
dest = dest + '/' + toFilename;
return dest;
};
//
// uploadOptions Macro
//
config.macros.uploadOptions = {
handler: function(place,macroName,params) {
var wizard = new Wizard();
wizard.createWizard(place,this.wizardTitle);
wizard.addStep(this.step1Title,this.step1Html);
var markList = wizard.getElement("markList");
var listWrapper = document.createElement("div");
markList.parentNode.insertBefore(listWrapper,markList);
wizard.setValue("listWrapper",listWrapper);
this.refreshOptions(listWrapper,false);
var uploadCaption;
if (document.location.toString().substr(0,4) == "http")
uploadCaption = config.macros.upload.label.saveLabel;
else
uploadCaption = config.macros.upload.label.uploadLabel;
wizard.setButtons([
{caption: uploadCaption, tooltip: config.macros.upload.label.promptOption,
onClick: config.macros.upload.action},
{caption: this.cancelButton, tooltip: this.cancelButtonPrompt, onClick: this.onCancel}
]);
},
refreshOptions: function(listWrapper) {
var uploadOpts = [
"txtUploadUserName",
"pasUploadPassword",
"txtUploadStoreUrl",
"txtUploadDir",
"txtUploadFilename",
"txtUploadBackupDir",
"chkUploadLog",
"txtUploadLogMaxLine",
]
var opts = [];
for(i=0; i<uploadOpts.length; i++) {
var opt = {};
opts.push()
opt.option = "";
n = uploadOpts[i];
opt.name = n;
opt.lowlight = !config.optionsDesc[n];
opt.description = opt.lowlight ? this.unknownDescription : config.optionsDesc[n];
opts.push(opt);
}
var listview = ListView.create(listWrapper,opts,this.listViewTemplate);
for(n=0; n<opts.length; n++) {
var type = opts[n].name.substr(0,3);
var h = config.macros.option.types[type];
if (h && h.create) {
h.create(opts[n].colElements['option'],type,opts[n].name,opts[n].name,"no");
}
}
},
onCancel: function(e)
{
backstage.switchTab(null);
return false;
},
wizardTitle: "Upload with options",
step1Title: "These options are saved in cookies in your browser",
step1Html: "<input type='hidden' name='markList'></input><br>",
cancelButton: "Cancel",
cancelButtonPrompt: "Cancel prompt",
listViewTemplate: {
columns: [
{name: 'Description', field: 'description', title: "Description", type: 'WikiText'},
{name: 'Option', field: 'option', title: "Option", type: 'String'},
{name: 'Name', field: 'name', title: "Name", type: 'String'}
],
rowClasses: [
{className: 'lowlight', field: 'lowlight'}
]}
}
//
// upload functions
//
if (!bidix.upload) bidix.upload = {};
if (!bidix.upload.messages) bidix.upload.messages = {
//from saving
invalidFileError: "The original file '%0' does not appear to be a valid TiddlyWiki",
backupSaved: "Backup saved",
backupFailed: "Failed to upload backup file",
rssSaved: "RSS feed uploaded",
rssFailed: "Failed to upload RSS feed file",
emptySaved: "Empty template uploaded",
emptyFailed: "Failed to upload empty template file",
mainSaved: "Main TiddlyWiki file uploaded",
mainFailed: "Failed to upload main TiddlyWiki file. Your changes have not been saved",
//specific upload
loadOriginalHttpPostError: "Can't get original file",
aboutToSaveOnHttpPost: 'About to upload on %0 ...',
storePhpNotFound: "The store script '%0' was not found."
};
bidix.upload.uploadChanges = function(onlyIfDirty,tiddlers,storeUrl,toFilename,uploadDir,backupDir,username,password)
{
var callback = function(status,uploadParams,original,url,xhr) {
if (!status) {
displayMessage(bidix.upload.messages.loadOriginalHttpPostError);
return;
}
if (bidix.debugMode)
alert(original.substr(0,500)+"\n...");
// Locate the storeArea div's
var posDiv = locateStoreArea(original);
if((posDiv[0] == -1) || (posDiv[1] == -1)) {
alert(config.messages.invalidFileError.format([localPath]));
return;
}
bidix.upload.uploadRss(uploadParams,original,posDiv);
};
if(onlyIfDirty && !store.isDirty())
return;
clearMessage();
// save on localdisk ?
if (document.location.toString().substr(0,4) == "file") {
var path = document.location.toString();
var localPath = getLocalPath(path);
saveChanges();
}
// get original
var uploadParams = Array(storeUrl,toFilename,uploadDir,backupDir,username,password);
var originalPath = document.location.toString();
// If url is a directory : add index.html
if (originalPath.charAt(originalPath.length-1) == "/")
originalPath = originalPath + "index.html";
var dest = config.macros.upload.destFile(storeUrl,toFilename,uploadDir);
var log = new bidix.UploadLog();
log.startUpload(storeUrl, dest, uploadDir, backupDir);
displayMessage(bidix.upload.messages.aboutToSaveOnHttpPost.format([dest]));
if (bidix.debugMode)
alert("about to execute Http - GET on "+originalPath);
var r = doHttp("GET",originalPath,null,null,null,null,callback,uploadParams,null);
if (typeof r == "string")
displayMessage(r);
return r;
};
bidix.upload.uploadRss = function(uploadParams,original,posDiv)
{
var callback = function(status,params,responseText,url,xhr) {
if(status) {
var destfile = responseText.substring(responseText.indexOf("destfile:")+9,responseText.indexOf("\n", responseText.indexOf("destfile:")));
displayMessage(bidix.upload.messages.rssSaved,bidix.dirname(url)+'/'+destfile);
bidix.upload.uploadMain(params[0],params[1],params[2]);
} else {
displayMessage(bidix.upload.messages.rssFailed);
}
};
// do uploadRss
if(config.options.chkGenerateAnRssFeed) {
var rssPath = uploadParams[1].substr(0,uploadParams[1].lastIndexOf(".")) + ".xml";
var rssUploadParams = Array(uploadParams[0],rssPath,uploadParams[2],'',uploadParams[4],uploadParams[5]);
bidix.upload.httpUpload(rssUploadParams,convertUnicodeToUTF8(generateRss()),callback,Array(uploadParams,original,posDiv));
} else {
bidix.upload.uploadMain(uploadParams,original,posDiv);
}
};
bidix.upload.uploadMain = function(uploadParams,original,posDiv)
{
var callback = function(status,params,responseText,url,xhr) {
var log = new bidix.UploadLog();
if(status) {
// if backupDir specified
if ((params[3]) && (responseText.indexOf("backupfile:") > -1)) {
var backupfile = responseText.substring(responseText.indexOf("backupfile:")+11,responseText.indexOf("\n", responseText.indexOf("backupfile:")));
displayMessage(bidix.upload.messages.backupSaved,bidix.dirname(url)+'/'+backupfile);
}
var destfile = responseText.substring(responseText.indexOf("destfile:")+9,responseText.indexOf("\n", responseText.indexOf("destfile:")));
displayMessage(bidix.upload.messages.mainSaved,bidix.dirname(url)+'/'+destfile);
store.setDirty(false);
log.endUpload("ok");
} else {
alert(bidix.upload.messages.mainFailed);
displayMessage(bidix.upload.messages.mainFailed);
log.endUpload("failed");
}
};
// do uploadMain
var revised = bidix.upload.updateOriginal(original,posDiv);
bidix.upload.httpUpload(uploadParams,revised,callback,uploadParams);
};
bidix.upload.httpUpload = function(uploadParams,data,callback,params)
{
var localCallback = function(status,params,responseText,url,xhr) {
url = (url.indexOf("nocache=") < 0 ? url : url.substring(0,url.indexOf("nocache=")-1));
if (xhr.status == httpStatus.NotFound)
alert(bidix.upload.messages.storePhpNotFound.format([url]));
if ((bidix.debugMode) || (responseText.indexOf("Debug mode") >= 0 )) {
alert(responseText);
if (responseText.indexOf("Debug mode") >= 0 )
responseText = responseText.substring(responseText.indexOf("\n\n")+2);
} else if (responseText.charAt(0) != '0')
alert(responseText);
if (responseText.charAt(0) != '0')
status = null;
callback(status,params,responseText,url,xhr);
};
// do httpUpload
var boundary = "---------------------------"+"AaB03x";
var uploadFormName = "UploadPlugin";
// compose headers data
var sheader = "";
sheader += "--" + boundary + "\r\nContent-disposition: form-data; name=\"";
sheader += uploadFormName +"\"\r\n\r\n";
sheader += "backupDir="+uploadParams[3] +
";user=" + uploadParams[4] +
";password=" + uploadParams[5] +
";uploaddir=" + uploadParams[2];
if (bidix.debugMode)
sheader += ";debug=1";
sheader += ";;\r\n";
sheader += "\r\n" + "--" + boundary + "\r\n";
sheader += "Content-disposition: form-data; name=\"userfile\"; filename=\""+uploadParams[1]+"\"\r\n";
sheader += "Content-Type: text/html;charset=UTF-8" + "\r\n";
sheader += "Content-Length: " + data.length + "\r\n\r\n";
// compose trailer data
var strailer = new String();
strailer = "\r\n--" + boundary + "--\r\n";
data = sheader + data + strailer;
if (bidix.debugMode) alert("about to execute Http - POST on "+uploadParams[0]+"\n with \n"+data.substr(0,500)+ " ... ");
var r = doHttp("POST",uploadParams[0],data,"multipart/form-data; boundary="+boundary,uploadParams[4],uploadParams[5],localCallback,params,null);
if (typeof r == "string")
displayMessage(r);
return r;
};
// same as Saving's updateOriginal but without convertUnicodeToUTF8 calls
bidix.upload.updateOriginal = function(original, posDiv)
{
if (!posDiv)
posDiv = locateStoreArea(original);
if((posDiv[0] == -1) || (posDiv[1] == -1)) {
alert(config.messages.invalidFileError.format([localPath]));
return;
}
var revised = original.substr(0,posDiv[0] + startSaveArea.length) + "\n" +
store.allTiddlersAsHtml() + "\n" +
original.substr(posDiv[1]);
var newSiteTitle = getPageTitle().htmlEncode();
revised = revised.replaceChunk("<title"+">","</title"+">"," " + newSiteTitle + " ");
revised = updateMarkupBlock(revised,"PRE-HEAD","MarkupPreHead");
revised = updateMarkupBlock(revised,"POST-HEAD","MarkupPostHead");
revised = updateMarkupBlock(revised,"PRE-BODY","MarkupPreBody");
revised = updateMarkupBlock(revised,"POST-SCRIPT","MarkupPostBody");
return revised;
};
//
// UploadLog
//
// config.options.chkUploadLog :
// false : no logging
// true : logging
// config.options.txtUploadLogMaxLine :
// -1 : no limit
// 0 : no Log lines but UploadLog is still in place
// n : the last n lines are only kept
// NaN : no limit (-1)
bidix.UploadLog = function() {
if (!config.options.chkUploadLog)
return; // this.tiddler = null
this.tiddler = store.getTiddler("UploadLog");
if (!this.tiddler) {
this.tiddler = new Tiddler();
this.tiddler.title = "UploadLog";
this.tiddler.text = "| !date | !user | !location | !storeUrl | !uploadDir | !toFilename | !backupdir | !origin |";
this.tiddler.created = new Date();
this.tiddler.modifier = config.options.txtUserName;
this.tiddler.modified = new Date();
store.addTiddler(this.tiddler);
}
return this;
};
bidix.UploadLog.prototype.addText = function(text) {
if (!this.tiddler)
return;
// retrieve maxLine when we need it
var maxLine = parseInt(config.options.txtUploadLogMaxLine,10);
if (isNaN(maxLine))
maxLine = -1;
// add text
if (maxLine != 0)
this.tiddler.text = this.tiddler.text + text;
// Trunck to maxLine
if (maxLine >= 0) {
var textArray = this.tiddler.text.split('\n');
if (textArray.length > maxLine + 1)
textArray.splice(1,textArray.length-1-maxLine);
this.tiddler.text = textArray.join('\n');
}
// update tiddler fields
this.tiddler.modifier = config.options.txtUserName;
this.tiddler.modified = new Date();
store.addTiddler(this.tiddler);
// refresh and notifiy for immediate update
story.refreshTiddler(this.tiddler.title);
store.notify(this.tiddler.title, true);
};
bidix.UploadLog.prototype.startUpload = function(storeUrl, toFilename, uploadDir, backupDir) {
if (!this.tiddler)
return;
var now = new Date();
var text = "\n| ";
var filename = bidix.basename(document.location.toString());
if (!filename) filename = '/';
text += now.formatString("0DD/0MM/YYYY 0hh:0mm:0ss") +" | ";
text += config.options.txtUserName + " | ";
text += "[["+filename+"|"+location + "]] |";
text += " [[" + bidix.basename(storeUrl) + "|" + storeUrl + "]] | ";
text += uploadDir + " | ";
text += "[[" + bidix.basename(toFilename) + " | " +toFilename + "]] | ";
text += backupDir + " |";
this.addText(text);
};
bidix.UploadLog.prototype.endUpload = function(status) {
if (!this.tiddler)
return;
this.addText(" "+status+" |");
};
//
// Utilities
//
bidix.checkPlugin = function(plugin, major, minor, revision) {
var ext = version.extensions[plugin];
if (!
(ext &&
((ext.major > major) ||
((ext.major == major) && (ext.minor > minor)) ||
((ext.major == major) && (ext.minor == minor) && (ext.revision >= revision))))) {
// write error in PluginManager
if (pluginInfo)
pluginInfo.log.push("Requires " + plugin + " " + major + "." + minor + "." + revision);
eval(plugin); // generate an error : "Error: ReferenceError: xxxx is not defined"
}
};
bidix.dirname = function(filePath) {
if (!filePath)
return;
var lastpos;
if ((lastpos = filePath.lastIndexOf("/")) != -1) {
return filePath.substring(0, lastpos);
} else {
return filePath.substring(0, filePath.lastIndexOf("\\"));
}
};
bidix.basename = function(filePath) {
if (!filePath)
return;
var lastpos;
if ((lastpos = filePath.lastIndexOf("#")) != -1)
filePath = filePath.substring(0, lastpos);
if ((lastpos = filePath.lastIndexOf("/")) != -1) {
return filePath.substring(lastpos + 1);
} else
return filePath.substring(filePath.lastIndexOf("\\")+1);
};
bidix.initOption = function(name,value) {
if (!config.options[name])
config.options[name] = value;
};
//
// Initializations
//
// require PasswordOptionPlugin 1.0.1 or better
bidix.checkPlugin("PasswordOptionPlugin", 1, 0, 1);
// styleSheet
setStylesheet('.txtUploadStoreUrl, .txtUploadBackupDir, .txtUploadDir {width: 22em;}',"uploadPluginStyles");
//optionsDesc
merge(config.optionsDesc,{
txtUploadStoreUrl: "Url of the UploadService script (default: store.php)",
txtUploadFilename: "Filename of the uploaded file (default: in index.html)",
txtUploadDir: "Relative Directory where to store the file (default: . (downloadService directory))",
txtUploadBackupDir: "Relative Directory where to backup the file. If empty no backup. (default: ''(empty))",
txtUploadUserName: "Upload Username",
pasUploadPassword: "Upload Password",
chkUploadLog: "do Logging in UploadLog (default: true)",
txtUploadLogMaxLine: "Maximum of lines in UploadLog (default: 10)"
});
// Options Initializations
bidix.initOption('txtUploadStoreUrl','');
bidix.initOption('txtUploadFilename','');
bidix.initOption('txtUploadDir','');
bidix.initOption('txtUploadBackupDir','');
bidix.initOption('txtUploadUserName','');
bidix.initOption('pasUploadPassword','');
bidix.initOption('chkUploadLog',true);
bidix.initOption('txtUploadLogMaxLine','10');
/* don't want this for tiddlyspot sites
// Backstage
merge(config.tasks,{
uploadOptions: {text: "upload", tooltip: "Change UploadOptions and Upload", content: '<<uploadOptions>>'}
});
config.backstageTasks.push("uploadOptions");
*/
//}}}
~IFrames are HTML elements that allow you to have a frame containing a different document within a Tiddler.
''The code'' to add to your tiddler:
{{{
<html><div align="center"><iframe src="WEBPAGEURLHERE" frameborder="0" width="100%" height="600"></iframe></div></html>
}}}
You can. of course, adjust the webpage url, the frame border, the width and the height with this code. You can also have an iframe of an html document or an image that is stored in your local hard drive. Instead of the webpage url you would substitute your file pathname, something like this:
{{{
"file:///c:/My%20Documents/Folder/document.html"
}}}
Here is an ~IFrame of our online bio page. Try clicking on a link to see what happens.
<html><div align="center"><iframe src="http://www.giffmex.org/aboutus/giffordsbio.html" frameborder="0" width="100%" height="600"></iframe></div></html>
You can use many of the same online resources as you can at school or the public library.
Start with the [[school library web page]] for great advice and resources
Ask for help online at the [[public library]]
[[go Google]]
[[use Wikipedia]]
!What does it include?
Version 2.2 is the latest version of ~TiddlyWiki. It has a "backstage" area with extra functions. As Jeremy Ruston explains [[here|http://www.tiddlywiki.com/#BackstageArea]], the idea of the backstage is to make some of the advanced sidebar options available to power users while eliminating the clutter and confusion for newer users who just want to read a ~TiddlyWiki. For example, some authors want to drastically change the page layout of their ~TiddlyWiki, but still want quick access to advanced features. The backstage gives them a way to have their cake and eat it too.
This tutorial is now upgraded to version 2.2.1. You can check out the backstage clicking "backstage" in the far upper right corner of the screen. This calls up a hidden menu with the following 5 options:
*''save'' - saves your ~TiddlyWiki just as you would by clicking "Save changes" in the right hand sidebar options.
*''sync'' - allows you to sync the changes in your ~TiddlyWiki file with other ~TiddlyWiki files on your hard drive and your server. I will try to write more about this as I play with it more myself.
*''import'' - this is the new location for ImportTiddlers, formerly available on the right hand options sidebar. This is a macro that allows you to import tiddlers from other ~TiddlyWiki files on your hard drive or on the Internet.
*''tweak'' - this is the new location for AdvancedOptions. This is still available on the right hand options side bar, but the backstage appears to be its new home. AdvancedOptions gives you, well, advanced options for saving, searching, editing and other functions. This is a good place to start when you save a new ~TiddlyWiki file and are fairly particular about how you want it to function.
*''plugins'' - this is the new location for Manage Plugins. You can see a list of your plugins. For more on plugins, see the following tiddlers if you haven't already:
**[[How to install a plugin]]
**[[My favorite "goodies" plugins]]
** [[Some great "power" plugins]]
For more on version 2.2, see Jeremy Ruston's explanation [[here|http://www.tiddlywiki.com/#Release2.2]].
!How do I upgrade?
Jeremy Ruston's helpful instructions for upgrading to the latest version can be found [[here|http://www.tiddlywiki.com/#HowToUpgrade]] (external link to www.tiddlywiki.com).
@@Please note!@@ In earlier versions of this tutorial I erroneously advised you to make style changes to your StyleSheetLayout, StyleSheetPrint and StyleSheetColors. This was incorrect. All style changes should actually be done on the StyleSheet tiddler. This will override the above three default stylesheets. The reason I'm telling you this is that if you have made changes to the 3 default stylesheets, you may find that the backstage doesn't work right. If that is the case, all you need to do is delete your three default stylesheets and save changes, and you should be okay. However, before you do, you should transfer all your style changes to the StyleSheet tiddler. I apologize for any inconvenience that my misinformation has caused you.
If you find any other difficulties in upgrading, please consult the TiddlyWiki Google Group at http://groups.google.com/group/TiddlyWiki. Please do a search for your problem first, before posting your problem in a brand new thread. You may find someone has already asked about your problem and that the solutions are already there waiting for you.
<!--{{{-->
<div class='toolbar' macro='toolbar closeTiddler closeOthers +editTiddler > fields syncing permalink references jump'></div>
<div class='title' macro='view title'></div>
<div class='subtitle'><span macro='view modifier link'></span>, <span macro='view modified date'></span> (<span macro='message views.wikified.createdPrompt'></span> <span macro='view created date'></span>)</div>
<div class='viewer' macro='view text wikified'></div>
<div class='tagClear'></div>
<!--}}}-->
/***
|Name|VisitCounterPlugin|
|Source|http://www.TiddlyTools.com/#VisitCounterPlugin|
|Version|1.0.0|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <br>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides||
|Description|use cookies to track/show private, personal visit counter and timestamp of last visit|
!!!!!Usage
<<<
The {{{<<visitCounter>>}}} macro tracks and displays a personal, private counter and the timestamps for your first visit, your most recent visit, and the total number of times you have visited a document. This information is stored in local cookies, and is ONLY available for display in YOUR browser. This data is not NOT tracked or aggregated across users, nor relayed or reported to anyone other than yourself, EVER.
{{{<<visitCounter counterID buttonlabel firsttimegreeting>>}}}
where:
* counterID is optional, and specifies a suffix to add to the visit tracking cookies for this document (enables tracking of multiple document on a single domain, such as file://).
* buttonlabel is optional, and specifies the text to display on the enable/disable toolbar button that is included in the visit display output. The default button label is "enable/disable visit counter".
* firsttimegreeting is options, and specifies a message to be displayed upon the first visit to the document. Subsequent visits report last visit timestamp and total visit count.
The following cookies names are used to track your visit information and current enabled/disabled status for this feature:
* chkDisableVisitCounter+id
* txtFirstVisit+id
* txtLastVisit+id
* txtVisitCount+id
The plugin also defines the following config.* values that may be referenced later by other scripts
* config.firstVisit
* config.lastVisit
* config.visitCount
<<<
!!!!!Examples
<<<
{{{<<visitCounter "demo" "visit counter" "Welcome To TiddlyTools!">>}}}
{{left{//<<visitCounter "demo" "visit counter" "Welcome To TiddlyTools!">>//}}}
Note: to invoke the counter without visible display, use:
*"""{{hidden{<<visitCounter counterID buttonlabel greeting>>}}}"""
where 'hidden' is a CSS class defined as:
*""".hidden { display:none; }"""
<<<
!!!!!Revisions
<<<
2007.07.26 [2.0.0] re-written as plugin
2007.05.02 [1.0.0] initial release (as inline script, VisitCounter)
<<<
!!!!!Code
***/
//{{{
version.extensions.visitCounter= {major: 2, minor: 0, revision: 0, date: new Date(2007,7,26)};
config.macros.visitCounter= {
handler: function(place,macroName,params,wikifier,paramString,tiddler) {
var id=""; if (params[0]) id="_"+params.shift();
var disabled=(config.options["chkDisableVisitCounter"+id]);
var label=disabled?"enable visit counter":"disable visit counter";
if (params[0] && params[0].length) label=params.shift();
if (params[0] && params[0].length) greeting=params.join(" ");
// create 'toggle visit counter' button
createTiddlyElement(place,"div",null,"fine toolbar").innerHTML="<a href='javascript:;' \
onclick='var disabled=config.options.chkDisableVisitCounter"+id+"; \
if (!disabled && parseInt(config.options.txtVisitCount"+id+")>1) \
if (!confirm(\"This will reset your personal visit count and timestamps... are you sure?\")) return false; \
disabled=!disabled; \
config.options.chkDisableVisitCounter"+id+"=disabled; \
saveOptionCookie(\"chkDisableVisitCounter"+id+"\"); \
config.visitCount=config.options.txtVisitCount"+id+"="+(disabled?0:1)+"; \
saveOptionCookie(\"txtVisitCount"+id+"\"); \
config.firstVisit=null; \
config.options.txtFirstVisit"+id+"=\"\"; \
saveOptionCookie(\"txtFirstVisit"+id+"\"); \
config.lastVisit=null; \
config.options.txtLastVisit"+id+"=\"\"; \
saveOptionCookie(\"txtLastVisit"+id+"\"); \
var msg=\"Personal visit counter has been \"; \
msg+=(config.options.chkDisableVisitCounter"+id+")?\"disabled\":\"enabled\"; \
displayMessage(msg); \
var here=story.findContainingTiddler(this); \
if (!here) story.refreshAllTiddlers(); else story.refreshTiddler(here.getAttribute(\"tiddler\"),null,true); \
return false; \
' \
title='"+(disabled?"enable":"reset/disable")+" your personal visit counter and timestamp'> "+label+ "</a> \
";
if (disabled) { config.firstVisit=config.lastVisit=""; config.visitCount=1; return; }
if (config.firstVisit==undefined) { // only do this once per session
// if first time running the script, create the 'first visit' timestamp cookie
if (!config.options["txtFirstVisit"+id] || !config.options["txtFirstVisit"+id].length) {
config.options["txtFirstVisit"+id]=new Date();
saveOptionCookie("txtFirstVisit"+id);
}
config.firstVisit=config.options["txtFirstVisit"+id];
}
if (config.lastVisit==undefined) { // only do this once per session
config.lastVisit=config.options["txtLastVisit"+id];
if (config.lastVisit==undefined) config.lastVisit="";
config.options["txtLastVisit"+id]=new Date();
saveOptionCookie("txtLastVisit"+id);
var c=config.options["txtVisitCount"+id]?parseInt(config.options["txtVisitCount"+id]):0;
config.visitCount=config.options["txtVisitCount"+id]=c+1;
saveOptionCookie("txtVisitCount"+id);
}
var count=config.options["txtVisitCount"+id]; if (!count) count=1; count=parseInt(count);
var digits=count.toString().substr(count.toString().length-2,2);
if (count<10) count=['---','first','second','third','fourth','fifth','sixth','seventh','eighth','ninth'][count];
else if (digits>=10&&digits<=13) count=count.toString()+'th';
else count=count.toString()+['th','st','nd','rd','th','th','th','th','th','th'][digits.substr(digits.length-1,1)];
var out="//@@white-space:nowrap;This is your ''"+count+"'' visit";
if (!config.lastVisit.length)
out+="...@@ @@white-space:nowrap;''"+(greeting.length?greeting:"Welcome!")+"''";
else {
out+=" since "+new Date(config.firstVisit).formatString("MMM DDth YYYY.");
out+=" @@ @@white-space:nowrap;";
out+="Your last visit was "+new Date(config.lastVisit).formatString("''MMM DDth YYYY, 0hh:0mm''");
}
out+=" @@//";
wikify(out,place);
}
}
//}}}
A WikiWord is a word that combines upper and lowercase letters. Examples: ~WikiWord, ~GiffMex, ~MainMenu, ~AbrahamLincoln, etc.
Even if you are careful about citing the Wikipedia articles, you never know when a wiki article has been vandalized or accidentally has misinformation.
It is a REALLY good idea to use multiple sources so you can check them against each other, no matter what the source.
[[ask a teacher-librarian]]
Better.
You can use these resources and the others you use to [[evaluate the sources]].
Your teacher-librarian shows you databases and NoodleBib, and talks with you about evaluating sources and the
information you find.
There is a lot to take in.
What now?
* [[use databases, NoodleBib and Google]] to do research and write paper - paraphrasing as you go!
* [[use Google and Wikipedia]]
* [[put off writing the paper]]
config.options.chkSinglePageMode=true;
[[do citations]]
[[just hand in the paper]]
You did make a works cited page, but you copied sections of your paper without citing correctly.
[[Try again|ask a teacher-librarian]], or you will get a zero and a reputation for plagiarism.
/***
|!''Name:''|!easyFormat|
|''Description:''|the format command format selection according to your choice|
|''Version:''|0.1.0|
|''Date:''|13/01/2007|
|''Source:''|[[TWkd|http://yann.perrin.googlepages.com/twkd.html#easyFormat]]|
|''Author:''|[[Yann Perrin|YannPerrin]]|
|''License:''|[[BSD open source license]]|
|''~CoreVersion:''|2.x|
|''Browser:''|Firefox 1.0.4+; Firefox 1.5; InternetExplorer 6.0|
|''Requires:''|@@color:red;''E.A.S.E''@@|
***/
//{{{
config.commands.format = new TWkd.Ease('Format','format selection accordingly to chosen mode');
config.commands.format.addMode({
name:'Bold',
tooltip:'turns selection into bold text',
operation:function(){
config.commands.format.putInPlace("''"+TWkd.context.selection.content+"''",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'Italic',
tooltip:'turns selection into italic text',
operation:function(){
config.commands.format.putInPlace("//"+TWkd.context.selection.content+"//",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'Blockquote',
tooltip:'turns selection into blocked text',
operation:function(){
config.commands.format.putInPlace(">"+TWkd.context.selection.content+">",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'2block',
tooltip:'turns selection into doubly blocked text',
operation:function(){
config.commands.format.putInPlace(">>"+TWkd.context.selection.content+">>",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'3block',
tooltip:'turns selection into triply blocked text',
operation:function(){
config.commands.format.putInPlace(">>>"+TWkd.context.selection.content+">>>",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'4block',
tooltip:'turns selection into quadruplly blocked text',
operation:function(){
config.commands.format.putInPlace(">>>>"+TWkd.context.selection.content+">>>>",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'Highlight',
tooltip:'highlight selection',
operation:function(){
config.commands.format.putInPlace("@@"+TWkd.context.selection.content+"@@",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'Code window',
tooltip:'Show a window to backstage TW code',
operation:function(){
config.commands.format.putInPlace("//{{{"+TWkd.context.selection.content+"//}}}",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'Group box',
tooltip:'Enclose text in a box',
operation:function(){
config.commands.format.putInPlace("{{menubox{"+TWkd.context.selection.content+"}}}",TWkd.context.selection);
}
});
config.commands.format.addMode({
name:'Greek',
tooltip:'turns selection into unicode text, for Greek characters',
operation:function(){
config.commands.format.putInPlace("{{greek{"+TWkd.context.selection.content+"}}}",TWkd.context.selection);
}
});
//}}}
Good work!
You made sure your sources were good ones, took notes and were careful not to plagarize.
Since you did good citations, too, you get a B+.
How can you get an even better grade?
Take a look at the [[databases|use databases, NoodleBib and Google]], too!
Doesn't everyone?
[[type in your words and hope for something that looks good]]
[[use "advanced search" to narrow results]]
Background: #eeffcc
Foreground: #000
PrimaryPale: #bbcc99
PrimaryLight: #bbdd88
PrimaryMid: #445533
PrimaryDark: #000
SecondaryPale: #ffc
SecondaryLight: #99dd55
SecondaryMid: #cccccc
SecondaryDark: #445533
TertiaryPale: #bbcc99
TertiaryLight: #EEC591
TertiaryMid: #552233
TertiaryDark: #8B7355
You receive a zero on your paper for not putting information into own words and not citing sources.
[[Try again.|ask a teacher-librarian]]
Much better.
You have cited your quotes and paraphrases, but some of your sources are questionable.
To get a better grade, [[ask a teacher-librarian]].
Excellent start! Follow the link for [[ask a teacher-librarian]]
(You can ask for help online at the [[Central Rappahannock Regional Library|http://www.teenspoint.org/]] outside the game.)
What do you think will happen?
You wait until the last minute, look up information on Wikipedia, and write your paper from that source. Since you
only used one source, you could not verify your facts.
Your grade is poor, but you still have time to go back and [[ask a teacher-librarian]]
It is re-search, not just search :-), so go back to [[ask a teacher-librarian]] for help searching again. You can do it!
Excellent start! Follow the link for [[ask a teacher-librarian]].
Click [[here|http://www.spotsylvania.k12.va.us/rhs/library]] to take a look, but come back!
*The MainMenu is like a table of contents. It's normally found in a left hand menu bar. The ~MainMenu for this file is found in the header. Click on any item and a tiddler will open up. You can create various levels of a table of contents starting with the ~MainMenu.
*Hyperlinks are links between files and between places within a file. The hyperlinks in this file are shown in [[bold, colored]] text. Click on the words "bold, colored" and TW will take you to another tiddler.
Tags are words attached to tiddlers to aid readers in finding and sorting them. In the colored box to the right side of this tiddler are listed two tags attached to this tiddler: "beginners" and "reading". Tags are like categories or topics that you want to assign to a tiddler. If you want to search for a specific tiddler without wading through the levels of the ~MainMenu, you can use the special menu at the bottom of the right-hand column to search for tiddlers and tags. See [[here|The right hand menu]] for more information on the right hand menu.
You take notes using the using [[copy/paste method]].
OR
You take notes and beware of [[plagiarism]].
Good idea. Using advanced search will help you get results that are closer to what you really need.
What's next?
take notes, beware of [[plagiarism]]
[[copy/paste method]]
[[evaluate the sources]], using only reliable, authoritative ones, then take notes
You take notes, write your paper, and hand it in.
Some information was inaccurate and your teacher did not want you to use Wikipedia as a cited source.
(You could use it, but needed to check the information in multiple sources.)
Your grade=B
You can still back up and make sure you [[use databases, NoodleBib and Google]] to cross-check each other. Also try
a book or two :-).
Even though your teachers say not to use it for most of your research in school...
[[You love Wikipedia]] and use it as your only source and copy/paste the words into your paper.
[[You use Wikipedia as a starting point]], look at resources listed and check _those_ sites for further information.
Hooray! You print your well-researched paper and citations and turn it in.
Your grade=A.