<!--{{{-->
<link rel='alternate' type='application/rss+xml' title='RSS' href='index.xml' />
<!--}}}-->
Background: #fff
Foreground: #000
PrimaryPale: #8cf
PrimaryLight: #18f
PrimaryMid: #04b
PrimaryDark: #014
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #eee
TertiaryLight: #ccc
TertiaryMid: #999
TertiaryDark: #666
Error: #f88
/*{{{*/
body {background:[[ColorPalette::Background]]; color:[[ColorPalette::Foreground]];}

a {color:[[ColorPalette::PrimaryMid]];}
a:hover {background-color:[[ColorPalette::PrimaryMid]]; color:[[ColorPalette::Background]];}
a img {border:0;}

h1,h2,h3,h4,h5,h6 {color:[[ColorPalette::SecondaryDark]]; background:transparent;}
h1 {border-bottom:2px solid [[ColorPalette::TertiaryLight]];}
h2,h3 {border-bottom:1px solid [[ColorPalette::TertiaryLight]];}

.button {color:[[ColorPalette::PrimaryDark]]; border:1px solid [[ColorPalette::Background]];}
.button:hover {color:[[ColorPalette::PrimaryDark]]; background:[[ColorPalette::SecondaryLight]]; border-color:[[ColorPalette::SecondaryMid]];}
.button:active {color:[[ColorPalette::Background]]; background:[[ColorPalette::SecondaryMid]]; border:1px solid [[ColorPalette::SecondaryDark]];}

.header {background:[[ColorPalette::PrimaryMid]];}
.headerShadow {color:[[ColorPalette::Foreground]];}
.headerShadow a {font-weight:normal; color:[[ColorPalette::Foreground]];}
.headerForeground {color:[[ColorPalette::Background]];}
.headerForeground a {font-weight:normal; color:[[ColorPalette::PrimaryPale]];}

.tabSelected{color:[[ColorPalette::PrimaryDark]];
	background:[[ColorPalette::TertiaryPale]];
	border-left:1px solid [[ColorPalette::TertiaryLight]];
	border-top:1px solid [[ColorPalette::TertiaryLight]];
	border-right:1px solid [[ColorPalette::TertiaryLight]];
}
.tabUnselected {color:[[ColorPalette::Background]]; background:[[ColorPalette::TertiaryMid]];}
.tabContents {color:[[ColorPalette::PrimaryDark]]; background:[[ColorPalette::TertiaryPale]]; border:1px solid [[ColorPalette::TertiaryLight]];}
.tabContents .button {border:0;}

#sidebar {}
#sidebarOptions input {border:1px solid [[ColorPalette::PrimaryMid]];}
#sidebarOptions .sliderPanel {background:[[ColorPalette::PrimaryPale]];}
#sidebarOptions .sliderPanel a {border:none;color:[[ColorPalette::PrimaryMid]];}
#sidebarOptions .sliderPanel a:hover {color:[[ColorPalette::Background]]; background:[[ColorPalette::PrimaryMid]];}
#sidebarOptions .sliderPanel a:active {color:[[ColorPalette::PrimaryMid]]; background:[[ColorPalette::Background]];}

.wizard {background:[[ColorPalette::PrimaryPale]]; border:1px solid [[ColorPalette::PrimaryMid]];}
.wizard h1 {color:[[ColorPalette::PrimaryDark]]; border:none;}
.wizard h2 {color:[[ColorPalette::Foreground]]; border:none;}
.wizardStep {background:[[ColorPalette::Background]]; color:[[ColorPalette::Foreground]];
	border:1px solid [[ColorPalette::PrimaryMid]];}
.wizardStep.wizardStepDone {background:[[ColorPalette::TertiaryLight]];}
.wizardFooter {background:[[ColorPalette::PrimaryPale]];}
.wizardFooter .status {background:[[ColorPalette::PrimaryDark]]; color:[[ColorPalette::Background]];}
.wizard .button {color:[[ColorPalette::Foreground]]; background:[[ColorPalette::SecondaryLight]]; border: 1px solid;
	border-color:[[ColorPalette::SecondaryPale]] [[ColorPalette::SecondaryDark]] [[ColorPalette::SecondaryDark]] [[ColorPalette::SecondaryPale]];}
.wizard .button:hover {color:[[ColorPalette::Foreground]]; background:[[ColorPalette::Background]];}
.wizard .button:active {color:[[ColorPalette::Background]]; background:[[ColorPalette::Foreground]]; border: 1px solid;
	border-color:[[ColorPalette::PrimaryDark]] [[ColorPalette::PrimaryPale]] [[ColorPalette::PrimaryPale]] [[ColorPalette::PrimaryDark]];}

.wizard .notChanged {background:transparent;}
.wizard .changedLocally {background:#80ff80;}
.wizard .changedServer {background:#8080ff;}
.wizard .changedBoth {background:#ff8080;}
.wizard .notFound {background:#ffff80;}
.wizard .putToServer {background:#ff80ff;}
.wizard .gotFromServer {background:#80ffff;}

#messageArea {border:1px solid [[ColorPalette::SecondaryMid]]; background:[[ColorPalette::SecondaryLight]]; color:[[ColorPalette::Foreground]];}
#messageArea .button {color:[[ColorPalette::PrimaryMid]]; background:[[ColorPalette::SecondaryPale]]; border:none;}

.popupTiddler {background:[[ColorPalette::TertiaryPale]]; border:2px solid [[ColorPalette::TertiaryMid]];}

.popup {background:[[ColorPalette::TertiaryPale]]; color:[[ColorPalette::TertiaryDark]]; border-left:1px solid [[ColorPalette::TertiaryMid]]; border-top:1px solid [[ColorPalette::TertiaryMid]]; border-right:2px solid [[ColorPalette::TertiaryDark]]; border-bottom:2px solid [[ColorPalette::TertiaryDark]];}
.popup hr {color:[[ColorPalette::PrimaryDark]]; background:[[ColorPalette::PrimaryDark]]; border-bottom:1px;}
.popup li.disabled {color:[[ColorPalette::TertiaryMid]];}
.popup li a, .popup li a:visited {color:[[ColorPalette::Foreground]]; border: none;}
.popup li a:hover {background:[[ColorPalette::SecondaryLight]]; color:[[ColorPalette::Foreground]]; border: none;}
.popup li a:active {background:[[ColorPalette::SecondaryPale]]; color:[[ColorPalette::Foreground]]; border: none;}
.popupHighlight {background:[[ColorPalette::Background]]; color:[[ColorPalette::Foreground]];}
.listBreak div {border-bottom:1px solid [[ColorPalette::TertiaryDark]];}

.tiddler .defaultCommand {font-weight:bold;}

.shadow .title {color:[[ColorPalette::TertiaryDark]];}

.title {color:[[ColorPalette::SecondaryDark]];}
.subtitle {color:[[ColorPalette::TertiaryDark]];}

.toolbar {color:[[ColorPalette::PrimaryMid]];}
.toolbar a {color:[[ColorPalette::TertiaryLight]];}
.selected .toolbar a {color:[[ColorPalette::TertiaryMid]];}
.selected .toolbar a:hover {color:[[ColorPalette::Foreground]];}

.tagging, .tagged {border:1px solid [[ColorPalette::TertiaryPale]]; background-color:[[ColorPalette::TertiaryPale]];}
.selected .tagging, .selected .tagged {background-color:[[ColorPalette::TertiaryLight]]; border:1px solid [[ColorPalette::TertiaryMid]];}
.tagging .listTitle, .tagged .listTitle {color:[[ColorPalette::PrimaryDark]];}
.tagging .button, .tagged .button {border:none;}

.footer {color:[[ColorPalette::TertiaryLight]];}
.selected .footer {color:[[ColorPalette::TertiaryMid]];}

.sparkline {background:[[ColorPalette::PrimaryPale]]; border:0;}
.sparktick {background:[[ColorPalette::PrimaryDark]];}

.error, .errorButton {color:[[ColorPalette::Foreground]]; background:[[ColorPalette::Error]];}
.warning {color:[[ColorPalette::Foreground]]; background:[[ColorPalette::SecondaryPale]];}
.lowlight {background:[[ColorPalette::TertiaryLight]];}

.zoomer {background:none; color:[[ColorPalette::TertiaryMid]]; border:3px solid [[ColorPalette::TertiaryMid]];}

.imageLink, #displayArea .imageLink {background:transparent;}

.annotation {background:[[ColorPalette::SecondaryLight]]; color:[[ColorPalette::Foreground]]; border:2px solid [[ColorPalette::SecondaryMid]];}

.viewer .listTitle {list-style-type:none; margin-left:-2em;}
.viewer .button {border:1px solid [[ColorPalette::SecondaryMid]];}
.viewer blockquote {border-left:3px solid [[ColorPalette::TertiaryDark]];}

.viewer table, table.twtable {border:2px solid [[ColorPalette::TertiaryDark]];}
.viewer th, .viewer thead td, .twtable th, .twtable thead td {background:[[ColorPalette::SecondaryMid]]; border:1px solid [[ColorPalette::TertiaryDark]]; color:[[ColorPalette::Background]];}
.viewer td, .viewer tr, .twtable td, .twtable tr {border:1px solid [[ColorPalette::TertiaryDark]];}

.viewer pre {border:1px solid [[ColorPalette::SecondaryLight]]; background:[[ColorPalette::SecondaryPale]];}
.viewer code {color:[[ColorPalette::SecondaryDark]];}
.viewer hr {border:0; border-top:dashed 1px [[ColorPalette::TertiaryDark]]; color:[[ColorPalette::TertiaryDark]];}

.highlight, .marked {background:[[ColorPalette::SecondaryLight]];}

.editor input {border:1px solid [[ColorPalette::PrimaryMid]];}
.editor textarea {border:1px solid [[ColorPalette::PrimaryMid]]; width:100%;}
.editorFooter {color:[[ColorPalette::TertiaryMid]];}
.readOnly {background:[[ColorPalette::TertiaryPale]];}

#backstageArea {background:[[ColorPalette::Foreground]]; color:[[ColorPalette::TertiaryMid]];}
#backstageArea a {background:[[ColorPalette::Foreground]]; color:[[ColorPalette::Background]]; border:none;}
#backstageArea a:hover {background:[[ColorPalette::SecondaryLight]]; color:[[ColorPalette::Foreground]]; }
#backstageArea a.backstageSelTab {background:[[ColorPalette::Background]]; color:[[ColorPalette::Foreground]];}
#backstageButton a {background:none; color:[[ColorPalette::Background]]; border:none;}
#backstageButton a:hover {background:[[ColorPalette::Foreground]]; color:[[ColorPalette::Background]]; border:none;}
#backstagePanel {background:[[ColorPalette::Background]]; border-color: [[ColorPalette::Background]] [[ColorPalette::TertiaryDark]] [[ColorPalette::TertiaryDark]] [[ColorPalette::TertiaryDark]];}
.backstagePanelFooter .button {border:none; color:[[ColorPalette::Background]];}
.backstagePanelFooter .button:hover {color:[[ColorPalette::Foreground]];}
#backstageCloak {background:[[ColorPalette::Foreground]]; opacity:0.6; filter:'alpha(opacity=60)';}
/*}}}*/
/*{{{*/
* html .tiddler {height:1%;}

body {font-size:.75em; font-family:arial,helvetica; margin:0; padding:0;}

h1,h2,h3,h4,h5,h6 {font-weight:bold; text-decoration:none;}
h1,h2,h3 {padding-bottom:1px; margin-top:1.2em;margin-bottom:0.3em;}
h4,h5,h6 {margin-top:1em;}
h1 {font-size:1.35em;}
h2 {font-size:1.25em;}
h3 {font-size:1.1em;}
h4 {font-size:1em;}
h5 {font-size:.9em;}

hr {height:1px;}

a {text-decoration:none;}

dt {font-weight:bold;}

ol {list-style-type:decimal;}
ol ol {list-style-type:lower-alpha;}
ol ol ol {list-style-type:lower-roman;}
ol ol ol ol {list-style-type:decimal;}
ol ol ol ol ol {list-style-type:lower-alpha;}
ol ol ol ol ol ol {list-style-type:lower-roman;}
ol ol ol ol ol ol ol {list-style-type:decimal;}

.txtOptionInput {width:11em;}

#contentWrapper .chkOptionInput {border:0;}

.externalLink {text-decoration:underline;}

.indent {margin-left:3em;}
.outdent {margin-left:3em; text-indent:-3em;}
code.escaped {white-space:nowrap;}

.tiddlyLinkExisting {font-weight:bold;}
.tiddlyLinkNonExisting {font-style:italic;}

/* the 'a' is required for IE, otherwise it renders the whole tiddler in bold */
a.tiddlyLinkNonExisting.shadow {font-weight:bold;}

#mainMenu .tiddlyLinkExisting,
	#mainMenu .tiddlyLinkNonExisting,
	#sidebarTabs .tiddlyLinkNonExisting {font-weight:normal; font-style:normal;}
#sidebarTabs .tiddlyLinkExisting {font-weight:bold; font-style:normal;}

.header {position:relative;}
.header a:hover {background:transparent;}
.headerShadow {position:relative; padding:4.5em 0 1em 1em; left:-1px; top:-1px;}
.headerForeground {position:absolute; padding:4.5em 0 1em 1em; left:0px; top:0px;}

.siteTitle {font-size:3em;}
.siteSubtitle {font-size:1.2em;}

#mainMenu {position:absolute; left:0; width:10em; text-align:right; line-height:1.6em; padding:1.5em 0.5em 0.5em 0.5em; font-size:1.1em;}

#sidebar {position:absolute; right:3px; width:16em; font-size:.9em;}
#sidebarOptions {padding-top:0.3em;}
#sidebarOptions a {margin:0 0.2em; padding:0.2em 0.3em; display:block;}
#sidebarOptions input {margin:0.4em 0.5em;}
#sidebarOptions .sliderPanel {margin-left:1em; padding:0.5em; font-size:.85em;}
#sidebarOptions .sliderPanel a {font-weight:bold; display:inline; padding:0;}
#sidebarOptions .sliderPanel input {margin:0 0 0.3em 0;}
#sidebarTabs .tabContents {width:15em; overflow:hidden;}

.wizard {padding:0.1em 1em 0 2em;}
.wizard h1 {font-size:2em; font-weight:bold; background:none; padding:0; margin:0.4em 0 0.2em;}
.wizard h2 {font-size:1.2em; font-weight:bold; background:none; padding:0; margin:0.4em 0 0.2em;}
.wizardStep {padding:1em 1em 1em 1em;}
.wizard .button {margin:0.5em 0 0; font-size:1.2em;}
.wizardFooter {padding:0.8em 0.4em 0.8em 0;}
.wizardFooter .status {padding:0 0.4em; margin-left:1em;}
.wizard .button {padding:0.1em 0.2em;}

#messageArea {position:fixed; top:2em; right:0; margin:0.5em; padding:0.5em; z-index:2000; _position:absolute;}
.messageToolbar {display:block; text-align:right; padding:0.2em;}
#messageArea a {text-decoration:underline;}

.tiddlerPopupButton {padding:0.2em;}
.popupTiddler {position: absolute; z-index:300; padding:1em; margin:0;}

.popup {position:absolute; z-index:300; font-size:.9em; padding:0; list-style:none; margin:0;}
.popup .popupMessage {padding:0.4em;}
.popup hr {display:block; height:1px; width:auto; padding:0; margin:0.2em 0;}
.popup li.disabled {padding:0.4em;}
.popup li a {display:block; padding:0.4em; font-weight:normal; cursor:pointer;}
.listBreak {font-size:1px; line-height:1px;}
.listBreak div {margin:2px 0;}

.tabset {padding:1em 0 0 0.5em;}
.tab {margin:0 0 0 0.25em; padding:2px;}
.tabContents {padding:0.5em;}
.tabContents ul, .tabContents ol {margin:0; padding:0;}
.txtMainTab .tabContents li {list-style:none;}
.tabContents li.listLink { margin-left:.75em;}

#contentWrapper {display:block;}
#splashScreen {display:none;}

#displayArea {margin:1em 17em 0 14em;}

.toolbar {text-align:right; font-size:.9em;}

.tiddler {padding:1em 1em 0;}

.missing .viewer,.missing .title {font-style:italic;}

.title {font-size:1.6em; font-weight:bold;}

.missing .subtitle {display:none;}
.subtitle {font-size:1.1em;}

.tiddler .button {padding:0.2em 0.4em;}

.tagging {margin:0.5em 0.5em 0.5em 0; float:left; display:none;}
.isTag .tagging {display:block;}
.tagged {margin:0.5em; float:right;}
.tagging, .tagged {font-size:0.9em; padding:0.25em;}
.tagging ul, .tagged ul {list-style:none; margin:0.25em; padding:0;}
.tagClear {clear:both;}

.footer {font-size:.9em;}
.footer li {display:inline;}

.annotation {padding:0.5em; margin:0.5em;}

* html .viewer pre {width:99%; padding:0 0 1em 0;}
.viewer {line-height:1.4em; padding-top:0.5em;}
.viewer .button {margin:0 0.25em; padding:0 0.25em;}
.viewer blockquote {line-height:1.5em; padding-left:0.8em;margin-left:2.5em;}
.viewer ul, .viewer ol {margin-left:0.5em; padding-left:1.5em;}

.viewer table, table.twtable {border-collapse:collapse; margin:0.8em 1.0em;}
.viewer th, .viewer td, .viewer tr,.viewer caption,.twtable th, .twtable td, .twtable tr,.twtable caption {padding:3px;}
table.listView {font-size:0.85em; margin:0.8em 1.0em;}
table.listView th, table.listView td, table.listView tr {padding:0px 3px 0px 3px;}

.viewer pre {padding:0.5em; margin-left:0.5em; font-size:1.2em; line-height:1.4em; overflow:auto;}
.viewer code {font-size:1.2em; line-height:1.4em;}

.editor {font-size:1.1em;}
.editor input, .editor textarea {display:block; width:100%; font:inherit;}
.editorFooter {padding:0.25em 0; font-size:.9em;}
.editorFooter .button {padding-top:0px; padding-bottom:0px;}

.fieldsetFix {border:0; padding:0; margin:1px 0px;}

.sparkline {line-height:1em;}
.sparktick {outline:0;}

.zoomer {font-size:1.1em; position:absolute; overflow:hidden;}
.zoomer div {padding:1em;}

* html #backstage {width:99%;}
* html #backstageArea {width:99%;}
#backstageArea {display:none; position:relative; overflow: hidden; z-index:150; padding:0.3em 0.5em;}
#backstageToolbar {position:relative;}
#backstageArea a {font-weight:bold; margin-left:0.5em; padding:0.3em 0.5em;}
#backstageButton {display:none; position:absolute; z-index:175; top:0; right:0;}
#backstageButton a {padding:0.1em 0.4em; margin:0.1em;}
#backstage {position:relative; width:100%; z-index:50;}
#backstagePanel {display:none; z-index:100; position:absolute; width:90%; margin-left:3em; padding:1em;}
.backstagePanelFooter {padding-top:0.2em; float:right;}
.backstagePanelFooter a {padding:0.2em 0.4em;}
#backstageCloak {display:none; z-index:20; position:absolute; width:100%; height:100px;}

.whenBackstage {display:none;}
.backstageVisible .whenBackstage {display:block;}
/*}}}*/
/***
StyleSheet for use when a translation requires any css style changes.
This StyleSheet can be used directly by languages such as Chinese, Japanese and Korean which need larger font sizes.
***/
/*{{{*/
body {font-size:0.8em;}
#sidebarOptions {font-size:1.05em;}
#sidebarOptions a {font-style:normal;}
#sidebarOptions .sliderPanel {font-size:0.95em;}
.subtitle {font-size:0.8em;}
.viewer table.listView {font-size:0.95em;}
/*}}}*/
/*{{{*/
@media print {
#mainMenu, #sidebar, #messageArea, .toolbar, #backstageButton, #backstageArea {display: none !important;}
#displayArea {margin: 1em 1em 0em;}
noscript {display:none;} /* Fixes a feature in Firefox 1.5.0.2 where print preview displays the noscript content */
}
/*}}}*/
<!--{{{-->
<div class='header' macro='gradient vert [[ColorPalette::PrimaryLight]] [[ColorPalette::PrimaryMid]]'>
<div class='headerShadow'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
<div class='headerForeground'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>&nbsp;
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
</div>
<div id='mainMenu' 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>
<!--}}}-->
<!--{{{-->
<div class='toolbar' macro='toolbar [[ToolbarCommands::ViewToolbar]]'></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='tagging' macro='tagging'></div>
<div class='tagged' macro='tags'></div>
<div class='viewer' macro='view text wikified'></div>
<div class='tagClear'></div>
<!--}}}-->
<!--{{{-->
<div class='toolbar' macro='toolbar [[ToolbarCommands::EditToolbar]]'></div>
<div class='title' macro='view title'></div>
<div class='editor' macro='edit title'></div>
<div macro='annotations'></div>
<div class='editor' macro='edit text'></div>
<div class='editor' macro='edit tags'></div><div class='editorFooter'><span macro='message views.editor.tagPrompt'></span><span macro='tagChooser excludeLists'></span></div>
<!--}}}-->
To get started with this blank [[TiddlyWiki]], you'll need to modify the following tiddlers:
* [[SiteTitle]] & [[SiteSubtitle]]: The title and subtitle of the site, as shown above (after saving, they will also appear in the browser title bar)
* [[MainMenu]]: The menu (usually on the left)
* [[DefaultTiddlers]]: Contains the names of the tiddlers that you want to appear when the TiddlyWiki is opened
You'll also need to enter your username for signing your edits: <<option txtUserName>>
These [[InterfaceOptions]] for customising [[TiddlyWiki]] are saved in your browser

Your username for signing your edits. Write it as a [[WikiWord]] (eg [[JoeBloggs]])

<<option txtUserName>>
<<option chkSaveBackups>> [[SaveBackups]]
<<option chkAutoSave>> [[AutoSave]]
<<option chkRegExpSearch>> [[RegExpSearch]]
<<option chkCaseSensitiveSearch>> [[CaseSensitiveSearch]]
<<option chkAnimate>> [[EnableAnimations]]

----
Also see [[AdvancedOptions]]
<<importTiddlers>>
http://tiddlyslidy.osmosoft.com
~TiddlySlidy
a TiddlyWiki for creating and presenting Slideshows

<<tabs txtMainTab Notes "Notes" TabNotes Masters "Master Slide Templates" TabMasters "More" "More lists" TabDetails>>
<<list filter [tag[notes]]>>
<<list filter [tag[masterSlide]]>>
<<tabs txtTabDetails "Timeline" "Timeline" TabTimeline "All" "All tiddlers" TabAll "Tags" "All tags" TabTags "More" "More lists" TabMore>>
Background: #fff
Foreground: #000

PrimaryPale: #e8e8e8
PrimaryLight: #747474
PrimaryMid: #333
PrimaryDark: #111

SecondaryPale: #f8f8f8
SecondaryLight: #dddddd
SecondaryMid: #5B6D6E
SecondaryDark: #000

TertiaryPale: #e8e8e8
TertiaryLight: #dddddd
TertiaryMid: #404040
TertiaryDark: #000

Error: #faa

SelectedPale: #dafaff
SelectedLight: #459BF9
SelectedDark: #07f

TiddlySlidyLight: #50a0fc
TiddlySlidyMid: #2d00ff
TiddlySlidyDark: #0069dd
/*{{{*/

html, body {
	padding: 0;
	margin:0;
    font-family: Helvetica Neue, Arial, Helvetica, sans-serif;
    color: [[ColorPalette::PrimaryLight]];
    background-color: [[ColorPalette::SecondaryPale]];
}

#header {
    height: 4em;
    padding: 1.5em 2em 1.5em 2.6em;
    background-color: [[ColorPalette::PrimaryPale]];
    border: 2px solid [[ColorPalette::SecondaryLight]];
}

#contentWrapper {
    background-color: [[ColorPalette::SecondaryPale]];
}

a#backstageShow {
    color: [[ColorPalette::PrimaryPale]];
}

#header .siteTitle {
    font-family: Georgia, serif;
    font-size: 3em;
    padding: 0em;
    margin: 0em;
}

#header .modeTitle {
    font-size: 1.4em;
    margin-top: 0.5em;
}

#header .modeSwitch {
    float:right;
    margin-top: -2.5em;
    margin-bottom: 1em;
    height: 3em;
}


#displayArea {
    margin: 1em auto 1em auto;
    width: 50%;
}

#presentation {
    border: none;
    background-color: [[ColorPalette::SecondaryPale]];
    margin: 0 auto 0 0;
}

#tiddlerDisplay {
    margin: auto;
    width: 100%;
    height: 100%;
    background-color: [[ColorPalette::Background]];
    border: none;
    width: 640px;
    min-height: 460px;
}

#footer {
    height: 4em;
    padding: 0 2em 1em 2em;
    background-color: [[ColorPalette::SecondaryPale]];
    border: none;
}

#slide {
    border: 2px solid [[ColorPalette::SecondaryLight]];
    background-color: [[ColorPalette::Background]];
    margin: 1em auto;
    width: 640px;
    height: 460px;
    _height: auto;
    overflow: hidden;
}

#thumbnail {
    margin: 1em;
    border: 2px solid [[ColorPalette::PrimaryMid]];
}

#contentWrapper .themeButton, 
#contentWrapper .button {
    width: 5em;
    text-align: center;
    letter-spacing: 1px;
    line-height: 2em;
    padding: 0.3em 2em 0.3em 2em;
    margin: 2em 1em 0em 1em;
    background-color: [[ColorPalette::Background]];
    background: [[ColorPalette::SecondaryLight]] url(images/bg-button.gif);
    border: 1px solid [[ColorPalette::PrimaryLight]];
    color: [[ColorPalette::PrimaryMid]];
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -webkit-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
    -moz-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
    box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
}

#contentWrapper .themeButton:hover,
#contentWrapper .themeButton:active,
#contentWrapper .button:hover,
#contentWrapper .button:active
 {
    background: [[ColorPalette::SecondaryLight]] url(images/bg-button.gif);
    background-position:0 -400px;
    border: 1px solid [[ColorPalette::PrimaryMid]];
    color: [[ColorPalette::PrimaryMid]];
    outline: none;
}

#contentWrapper .themeButton.selected:hover,
#contentWrapper .themeButton.selected:active,
#contentWrapper .themeButton.selected {
    cursor: default;
    border: 1px solid [[ColorPalette::PrimaryLight]];
    color: [[ColorPalette::Background]];
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.0, [[ColorPalette::SelectedLight]]), color-stop(1.0, [[ColorPalette::SelectedDark]]));
    background: -moz-linear-gradient(top, [[ColorPalette::SelectedLight]] 0%, [[ColorPalette::SelectedDark]] 100%);
    background-color: [[ColorPalette::SelectedDark]];
}

#mainMenu {
    width: 100%;
    position: relative;
    margin: 0;
    padding: 0;
}

#mainMenu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#mainMenu li {
    text-align: right;
    display: block;
    width: 80%;
    border: 2px solid [[ColorPalette::PrimaryPale]];
    background-color: [[ColorPalette::Background]];
    margin-bottom: 0.2em;
    padding: 0 2em 0 0;
}

#mainMenu li a {
    color: [[ColorPalette::SecondaryMid]];
    display: block;
    padding-right: 1em;
    width: 90%;
}

#mainMenu li a.selected,
#mainMenu li a:hover,
#mainMenu li a.selected:active {
    color: [[ColorPalette::Background]];
    background-color: [[ColorPalette::SecondaryMid]];
}

h2 {
    border: none;
    color: [[ColorPalette::TertiaryMid]];
    font-size: 2em;
    font-weight: normal;
    padding-bottom: 0.5em;
    margin: 0;
}

.toolbar {
    float: right;
    padding: 1em 0;
    font-size: 1.2em;
}

.toolbarOptions {
    padding: 1em 0;
}
/* TBD: refactor */
.toolbarOptions select {
    margin-right: 2em;
}


.button {
    -moz-border-radius: 4px;
}

#presentation .toolbar,
#presentation .toolbarOptions,
#presentation h2.preview {
    display: none;
}

.tiddler,
.viewSlide {
    height: 97%;
    overflow: hidden;
}


table.twtable {
    width: 100%;
    border-top: 1px solid [[ColorPalette::PrimaryLight]];
    border-bottom: 1px solid [[ColorPalette::PrimaryLight]];
    border-left: none;
    border-right: none;
    margin-left: 0mm;
    font-size: 0.5em;
    line-height: 1.5em;
}

.wizard table.twtable {
    font-size: 1.5em;
}

.twtable th {
    background-color: [[ColorPalette::PrimaryDark]];
    font-weight: normal;
}

.twtable th,
.twtable tr,
.twtable td {
    border: none;
}


.twtable .evenRow {
    background-color: [[ColorPalette::PrimaryPale]];
}

.twtable .oddRow {
    background-color: [[ColorPalette::SecondaryPale]];
}

[[GrowlStyle]]
[[ControlPanelStyle]]

.editor {
    font-size: 1.5em;
    padding-top: 0.2em;
    padding-bottom: 1em;
}

.editor input,
.editor textarea {
    border: 2px solid [[ColorPalette::PrimaryPale]];
}

.editSlide {
    padding: 0 1em;
}


#fullframe {
    background-color: #000;
}

#fullframe .preview,
#fullframe .toolbar,
#fullframe .toolbarOptions {
    display: none;
}

#messageArea a.button {
    border: 0;
    background: none;
    padding-left: 0;
    margin-left: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}


/*}}}*/

//{{{

/*
 *  Theme
 */
if (!config.options.txtTheme || config.options.txtTheme == "DefaultTheme") {
    config.options.txtTheme = "PresenterMode";
}

/*
 *  Faster fading messages!
 */
config.options.txtFadingMessagesTimeout = 2; 

/*
 *  Disable WikiLinks
 */
config.options.chkDisableWikiLinks = 1;

/*
 *  Animations
 */ 
config.options.chkAnimate = 0;

/*
 *  SinglePagedMode
 */
config.options.chkSinglePageMode = 1; //Display one tiddler at a time
config.options.chkSinglePagePermalink = 1; //Automatically permalink current tiddler
config.options.chkSinglePageKeepFoldedTiddlers = 0; //Don't close tiddlers that are folded
config.options.chkSinglePageKeepEditedTiddlers = 1; //Don't close tiddlers that are being edited
config.options.chkTopOfPageMode = 1; //Open tiddlers at the top of the page
//config.options.chkBottomOfPageMode = 0; //Open tiddlers at the bottom of the page
//config.options.chkSinglePageAutoScroll = 1; //Automatically scroll tiddler into view (if needed)


/*
 *  Lingo
 */
merge(config.macros.newTiddler,{
    label: "new slide",
    prompt: "Create a new slide",
    title: "New Slide",
    accessKey: "N"
});

merge(config.views.wikified,{
    defaultText: "The tiddler '%0' doesn't yet exist. Edit to create it."
});

merge(config.views.editor,{
	themePrompt: "Type a theme for the slide"
});

/*
 *  auto saving
 */
//config.options.chkAutoSave = true;
config.options.txtBackupFolder = "backups";

/*
 *  disable read-only mode for demo
 */
config.options.chkHttpReadOnly = false;
readOnly = false;
showBackstage = true;

// key mappings
// config.macros.keybindings.keyCodes[32] = function() { story.nextTiddler(); }; 	//space
// config.macros.keybindings.keyCodes[46] = function() { story.nextTiddler(); };	//greater
// config.macros.keybindings.keyCodes[44] = function() { story.prevTiddler(); };	//less

config.macros.keybindings.keyCodes = {
	32 : function() { story.nextTiddler(); },
	37 : function() { config.macros.keybindings.back(); }, //left
	39 : function() { config.macros.keybindings.forward(); }, //right
	46 : function() { story.nextTiddler(); },
	44 : function() { story.prevTiddler(); },
	104 : function() { config.macros.toggleLinearNavigation(); },
	110 : function() { config.macros.toggleLinearNavigation(); }
};

//}}}
<<saveChanges "Save">><<themeButton "AuthorMode" "Author" "Author Mode">><<themeButton "PresenterMode" "Present" "Presenter Mode">>
<<knob "|&#x25c4;" "story.firstTiddler()" "First slide">><<knob "&#x25c4;" "story.prevTiddler()" "Previous slide">><<knob "&#x25a3;" "story.switchTheme('AuthorMode');" "Author mode">><<knob "&#x25ba;" "story.nextTiddler()" "Next slide">><<knob "&#x25ba;|" "story.lastTiddler()" "Last slide">><<currentPosition "MainMenu" "SlideSorter">><<progressBar MainMenu>><<knob "F" "story.switchTheme('FullScreenMode')" "Fullscreen" "fullscreen">>
/*{{{*/

.controls {
    font-size: 1.2em;
    color: [[ColorPalette::PrimaryMid]];
    background-color: [[ColorPalette::PrimaryPale]];
    border: 2px solid [[ColorPalette::SecondaryLight]];
    width: 600px;
    height: 2em;
    margin: 0 auto 1em auto;
    padding: 1em;
    font-family: Helvetica Neue, Arial, Helvetica, sans-serif;
    text-align: center;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
}

.knob {
    float: left;
    margin: 0;
    border: 2px solid [[ColorPalette::PrimaryPale]];
    background-color: [[ColorPalette::PrimaryPale]];
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1em;
    font-weight: normal;
    width: 1.5em;
    height: 1.5em;
    line-height: 1.5em;
    text-align: center; 
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
    border-radius: 1px;
}

.contents {
    width: 6em;
    text-align: center;
}

.controls a:hover div,
.controls a:hover div div,
.controls .contents a:hover {
    text-decoration: none;
    color: [[ColorPalette::Foreground]];
    background-color: [[ColorPalette::Background]];
}

.controls a:active div,
.controls a:active div div,
.controls .contents a:active {
    color: [[ColorPalette::Background]];
}

.controls *:focus {
    outline: none;
}

.controls .fullscreen a:hover div,
.controls .fullscreen a:active div {
    text-decoration: none;
    background-color: [[ColorPalette::PrimaryMid]];
    border: 2px solid [[ColorPalette::PrimaryMid]];
}

.controls .fullscreen a:hover div div,
.controls .fullscreen a:active div div {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.knob div {
    font-weight: bolder;
    -webkit-border-radius: 1em; 
    -moz-border-radius: 1em;
    border-radius: 1em;
    color: [[ColorPalette::Background]];
    background-color: [[ColorPalette::PrimaryMid]];
    -webkit-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
    -moz-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
    box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
}


.squeeze {
    letter-spacing: -3px; 
}

.fullscreen {
    float: right;
    background-color: [[ColorPalette::PrimaryPale]];
    margin-top: -0.2em;
}

.fullscreen div {
    border: 2px solid [[ColorPalette::PrimaryMid]];
    background-color: [[ColorPalette::PrimaryPale]];
    width: 1em;
    height: 1em;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

.fullscreen div div {
    text-indent: -300px;
    overflow: hidden;
    background-color: [[ColorPalette::PrimaryMid]];
    border: 2px solid [[ColorPalette::PrimaryMid]];
    margin-top: -1px;
    margin-left: -1px;
    display: block;
    float: left;
    width: 50%;
    height: 50%;
}

.progressBar {
    margin-top: 0.4em;
}

.progressBar ul {
    list-style-type: none; 
    word-spacing: 0px;
    display: inline;
    padding: 0px;
}

.progressBar li {
    display: inline;
    cursor: pointer;
}

.progressBar a {
    display: block;
    margin: 2px;
    float: left;
    border: 2px solid [[ColorPalette::PrimaryMid]];
    line-height: 5px;
    min-width: 5px;
    width: 5px;
    background-color: [[ColorPalette::PrimaryPale]];
    color: [[ColorPalette::Foreground]];
    padding: 0;
    -webkit-border-radius: 1em;
    -moz-border-radius: 1em;
    -border-radius: 1em;
    -webkit-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
    -moz-box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
    box-shadow: 2px 2px 3px rgba(135, 139, 144, 0.4);
}

.progressBar .selected {
    background-color: [[ColorPalette::PrimaryMid]];
    color: [[ColorPalette::PrimaryMid]];
    border-color: [[ColorPalette::PrimaryMid]];
}


/*
 *  tooltip balloon
 */
#balloonHook { 
    display: none;
    position: relative;
    z-index: 100;
    opacity: 0.9;
}

#balloonHook .balloon {
    position: absolute;
    z-index: 101;
    margin: 1em auto;
    background-color: [[ColorPalette::PrimaryPale]];
    font-family: Constantia,Palatino,"Palatino Linotype","Palatino LT STD","Times New Roman",serif;
    width: 15em;
    left: -7.25em;
    bottom: 0.2em;
    display: block;
    opacity: 0.95;
}

#balloonHook .balloon > div {
    background-color: [[ColorPalette::PrimaryMid]];
}

#balloonHook .balloon .content {
    color: [[ColorPalette::Background]];
    background-color: [[ColorPalette::PrimaryMid]];
    line-height: 1em;
    padding: 1em;
    text-align:center;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
}

#balloonHook .balloon .pointer {
    height: 0.5em;
}

#balloonHook .balloon .pointer span {
    background-color: [[ColorPalette::PrimaryPale]];
    width: 49.5%;
    height: 100%;
}

#balloonHook .balloon .pointer .left {
    -moz-border-radius-topright: 1em;
    -webkit-border-top-right-radius: 1em;
    float: left;
}

#balloonHook .balloon .pointer .right {
    -moz-border-radius-topleft: 1em;
    -webkit-border-top-left-radius: 1em;
    float: right;
}

.contents {
    float: left;
    font-size: 0.8em;
    padding: 0.4em 1em 0;
    font-weight: lighter;
}

.contents a {
    padding: 0.3em 1em;
}

.contents > a.tiddlyLink,
.contents > a.tiddlyLink:hover {
    padding: 1em 0 0.5em 0;
}

.contents .spacer {
    padding-left: 0.3em;
}

#contents .balloon {
    bottom: 0.6em;
    left: -4.5em;
}

#contentsBalloon,
#contentsBalloon a.tiddlyLink {
    background-color: [[ColorPalette::PrimaryMid]];
    color: [[ColorPalette::Background]];
    font-size: 1.1em;
}

#contentsBalloon a.tiddlyLink:hover {
    color: [[ColorPalette::PrimaryMid]];
    background-color: [[ColorPalette::Background]];
}

#contentsBalloon ul {
    list-style: none;
    text-align: left;
    padding-left: 0;
    margin-left: 0;
    line-height: 1.8em;
}

#contentsBalloon li {
    list-style: none;
}

/*}}}*/
<div class='toolbar' macro='toolbar -cancelTiddler deleteTiddler +saveTiddler'></div>
<!--{{{-->
<div class='title' macro='view title'></div>
<div class='editor' macro='edit title'></div><div macro='annotations'></div>
<div class="label">Master</div><div class="master editor" macro="edit theme"></div>
<div macro='message views.editor.tagPrompt'></div>
<div class='editor' macro='edit tags'></div>
<div class='editor' macro='edit text'></div>
[[EditToolbar]]
<!--}}}-->
<div class="toolbarOptions">
    <span macro="fieldSelector 'Select a master slide' theme masterSlide"></span>
    <span macro="toggleTag slide notes 'Included in the presentation'"></span>
</div>
<div class='toolbar'>
    <span macro='toolbar closeTiddler deleteTiddler editTiddler'></span>
</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>
[[ViewToolbar]]
<!--}}}-->
<html><a class="button" href="#" onclick="story.displayTiddlers(null,['NewSlide'])" >New&nbsp;Slide</a></html>
<<tiddler MainMenu>>
<<MainMenuOrder>>
/***
|''Name:''|ThemeButtonPlugin|
|''Description:''|Macro to provide a button to switch to a named theme |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ThemeButtonPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ThemeButtonPlugin/ |
|''Version:''|0.3|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
Macro to provide a theme switch button, used as follows:

<<themeButton DefaultTheme>> {{{<<themeButton DefaultTheme>>}}}

<<themeButton DarkTheme "Dark Theme">> {{{<<themeButton DarkTheme "Dark Theme">>}}}

<<themeButton DarkTheme "Dark Theme (Again)" "switch to the Dark Theme">> {{{<<themeButton DarkTheme "Dark Theme (Again)" "switch to the Dark Theme">>}}}

A class of "selected" is provided for styling the selected button as follows:

!!StyleSheet
{{{
.themeButton.selected { 
    border: 5px solid red;
}
}}}

!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global jQuery config story createTiddlyButton createTiddlyElement addClass */
if (!version.extensions.ThemeButtonPlugin) {
	version.extensions.ThemeButtonPlugin = {installed: true};

	config.macros.themeButton = {
		label: "Switch Theme",
		prompt: "switch the theme"
	};

	config.macros.themeButton.handler = function (place, macroName, params) {
		var theme = params[0];
		var btn = createTiddlyButton(place, params[1] || this.label, params[2] || this.prompt, 
			function (ev) {
				story.switchTheme(theme);
				jQuery('.themeButton').removeClass('selected');
				theme = config.options.txtTheme;
				jQuery('.themeButton[theme="' + theme + '"]').addClass('selected');
				return false;
			});
		btn.setAttribute('theme', theme);
		addClass(btn, 'themeButton', theme);
		if (theme === config.options.txtTheme) {
			addClass(btn, 'selected');
		}
	};
}

//}}}
/***
|''Name:''|ThemeSwitchDirtyPlugin|
|''Description:''|Block a theme switch if a tiddler is dirty (open for edit) |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ThemeSwitchDirtyPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ThemeSwitchDirtyPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global jQuery config */
(function ($) {
    version.extensions.ThemeSwitchDirtyPlugin = {installed: true};

	var switchTheme = Story.prototype.switchTheme;
	Story.prototype.switchTheme = function(theme)
	{
		if ($('#'+story.container).find('.tiddler[dirty]').length) {
			return;
		}
		return switchTheme.apply(this,arguments);
	};

}(jQuery));
//}}}
/***
|''Name:''|SingleTiddlerPlugin|
|''Description:''|Display one tiddler at one time |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/SingleTiddlerPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/SingleTiddlerPlugin/ |
|''Version:''|0.4|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This plugin closes all tiddlers and displays one tiddler at one time. 
The URL is updated to point to the current tiddler.
Refuses to open a tiddler if one is already open for edit.
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global jQuery window config Story story Tiddler document */
(function ($) {
    version.extensions.SingleTiddlerPlugin = {installed: true};

	var displayTiddler = Story.prototype.displayTiddler;
	Story.prototype.displayTiddler = function (src, t) {
        var title = t instanceof Tiddler ? t.title : t;
		if (!document.getElementById(story.idPrefix + title) && $('#' + story.container).find('.tiddler[dirty]').length) {
			return;
		}
		story.closeAllTiddlers();
		displayTiddler.apply(this, arguments);
        window.location.hash = encodeURIComponent(String.encodeTiddlyLink(title));
	};

}(jQuery));
//}}}
/***
|''Name:''|ThemeSwitchRefreshPlugin|
|''Description:''|Force a refresh on switching a theme, even when the default View or Edit template hasn't been changed |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com)|
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ThemeSwitchRefreshPlugin |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
|''Overrides''|Story.prototype.swtichTheme() |
!!Documentation
The core Story.themeSwitch function has an optimization to avoid refreshing the story when the View or Edit templates haven't been altered. This causes issues with plugins which extend the chooseTemplateForTiddler functionality, such as the TaggedTemplateTweak and TaggedTemplatePlugin.
This plugin refreshes the page and story on a theme switch, regardless of the templates defined.
!!Code
***/
//{{{
if(!version.extensions.ThemeSwitchRefreshPlugin) {
version.extensions.ThemeSwitchRefreshPlugin = {installed:true};

Story.prototype._themeSwitchRefresh_switchTheme = Story.prototype.switchTheme;
Story.prototype.switchTheme = function(theme)
{
	this._themeSwitchRefresh_switchTheme.apply(this,arguments);
	//TBD: be canny to see if the theme contained a View or Edit template and avoid this:
	refreshAll();
	this.refreshAllTiddlers(true);
};
}
//}}}
/***
|''Name:''|ThemedTiddlerPlugin |
|''Description:''|Per-Tiddler Mini-Themes |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ThemedTiddlerPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ThemedTiddlerPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
The extended field "theme" is used to reference a tiddler containing a "mini-theme"

A mini-theme is a tiddler containing a [[ViewTemplate]], [[EditTemplate]] and [[StyleSheet]] sections which are applied when the tiddler is displayed. 

In addition, a CSS class of the theme name is added to the tiddler which may be useful when writing a mini-theme [[StyleSheet]]. 
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global Story, store, setStylesheet, addClass */
if (!version.extensions.ThemedTiddlerPlugin) {
    version.extensions.ThemedTiddlerPlugin = {installed: true};

    Story.prototype.__chooseTemplateForTiddler = Story.prototype.chooseTemplateForTiddler;
    Story.prototype.chooseTemplateForTiddler = function (title, n)
    {
        // translate number into template name
        var template = ["ViewTemplate", "EditTemplate"][n ? n - 1 : 0];

        var tiddler = store.getTiddler(title);

        if (tiddler) {
            var theme = tiddler.fields.theme;
            if (theme) {

                // assert stylesheet
                var style = store.getTiddlerText(theme + '##StyleSheet');
                if (style) {
                    setStylesheet(style, theme);
                }

                // return theme template
                var slice = theme + '##' + template;
                if (store.getTiddlerText(slice)) {
                    return slice;
                }
            }
        }

        // default template
        return this.__chooseTemplateForTiddler.apply(this, arguments);
    };

    // assert theme name as a class on the tiddler
    Story.prototype.__refreshTiddler = Story.prototype.refreshTiddler;
    Story.prototype.refreshTiddler = function (title, template, force, customFields, defaultText)
    {
        var tiddlerElem = this.__refreshTiddler.apply(this, arguments);
        var tiddler = store.getTiddler(title);
        if (tiddler) {
            addClass(tiddlerElem, store.getTiddler(title).fields.theme);
        }
        return tiddlerElem;
    };
}
//}}}
/***
|''Name:''|MasterSelectorPlugin|
|''Description:''|Select themed tiddler field |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/MasterSelectorPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/MasterSelectorPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
Used by [[TiddlySlidy|http://tiddlyslidy.com]] to select the [[ThemedTiddlerPlugin|http://whatfettle.com/2008/07/ThemedTiddlerPlugin/]] {{{theme}}} field.
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global jQuery config */
(function ($) {
    version.extensions.MasterSelectorPlugin = {installed: true};

    config.macros.fieldSelector = {};
    config.macros.fieldSelector.handler = function(place, macroName, params, wikifier, paramString, tiddler) {
        var caption = params[0] || "Select a master slide";
        var field = params[1] || "theme";
        var tag = params[2] || "masterSlide";
        var title = tiddler.title;

        var tagged = store.getTaggedTiddlers(tag);
        var options = [];
        options.push({'caption': caption, 'name': null});
        for (var i=0; i < tagged.length; i++) {
            options.push({'caption': tagged[i].title, 'name': tagged[i].title});
        }

        return createTiddlyDropDown(place, function(ev) {
                var fields = {};
                fields[field] = this[this.selectedIndex].value;
                store.addTiddlerFields(title, fields);
                story.refreshTiddler(title);
                return false;
            }, options, 
            tiddler.fields[field]);
    };

}(jQuery));
//}}}
/***
|''Name:''|ReadyPlugin|
|''Description:''|Attach a plugin to a tiddler from within a template |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ReadyPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ReadyPlugin/ |
|''Version:''|0.2|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This plugin allows the author of a PageTemplate ViewTemplate or EditTemplate to attach one or more plugins to an element with a {{{macro}}} or {{{content}}} attribute. For example, the function {{{config.macros.DemoReady.ready}}} will be called each time the Hello element is refreshed with the following ViewTemplate:
{{{
    <div class='title' macro='view title' ready='readyDemo'></div>
}}}
This behaviour is useful for attaching jQuery effects to a tiddler as they are dynamically added to the story.
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global jQuery config applyHtmlMacros refreshPageTemplate */
(function ($) {
    version.extensions.ReadyPlugin = {installed: true};

    function assertReady(root) {
        $(root).children(":first[ready]").each(function () {
            var macros = $(this).attr('ready').split(/[, ]/);
            for (var i = 0; i < macros.length; i++) {
                var m = config.macros[macros[i]];
                if (m && m.ready) {
                    m.ready.apply(this, arguments);
                }
            }
            $(this).removeAttr('ready');
        });
    };

    refreshElements = function (root,changeList,depth) {
        if (!depth) {
            assertReady(root);
        }

        // this is fugly but it's hard to hijack a recursive core function
        var nodes = root.childNodes;
        for(var c=0; c<nodes.length; c++) {
            var e = nodes[c], type = null;
            if(e.getAttribute && (e.tagName ? e.tagName != "IFRAME" : true))
                type = e.getAttribute("refresh");
            var refresher = config.refreshers[type];
            var refreshed = false;
            if(refresher != undefined)
                refreshed = refresher(e,changeList);
            if(e.hasChildNodes() && !refreshed)
                refreshElements(e,changeList,true);
        }
    }

})(jQuery);
//}}}
/***
|''Name:''|MainMenuOrderPlugin|
|''Description:''|MainMenu reorderable using drag and drop |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/MainMenuOrderPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/MainMenuOrderPlugin/ |
|''Version:''|0.3|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This plugin is Very much the subject of work in progress, has no automatic tests, 
and has only tried in Safari and Firefox.
The DragSort plugin is very buggy, may be replaced with jquery.ui "sortable".
The MainMenu currently must be an unordered bullet list.
It is planned to support nested lists in a later version.
Attach it to the page template as follows:
{{{
<div id='mainMenu' macro='MainMenuOrder'></div>
}}}
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global document config jQuery */
if (!version.extensions.MainMenuOrderPlugin) {
    version.extensions.MainMenuOrderPlugin = {installed: true};

/*
    jQuery List DragSort v0.3.8 pre-release
    Website: http://dragsort.codeplex.com/
    License: http://dragsort.codeplex.com/license
*/
(function($) {

    $.fn.dragsort = function(options) {
        var opts = $.extend({}, $.fn.dragsort.defaults, options);
        var lists = new Array();
        var list = null, lastPos = null;

        this.each(function(i, cont) {

            var newList = {
                draggedItem: null,
                placeHolderItem: null,
                pos: null,
                offset: null,
                offsetLimit: null,
                container: cont,

                init: function() {
                    $(this.container).attr("listIdx", i).find(opts.dragSelector).css("cursor", "move").mousedown(this.grabItem);
                },

                grabItem: function(e) {
                    var target = e.srcElement || e.target;
                    if (e.button == 2 || target.tagName == "INPUT" || target.tagName == "A" && target.getAttribute("href") != null)
                        return;
                    
                    if (list != null && list.draggedItem != null)
                        list.dropItem();

                    $(this).css("cursor", "move");

                    list = lists[$(this).parents("*[listIdx]").attr("listIdx")];
                    list.draggedItem = $(this).is(opts.itemSelector) ? $(this) : $(this).closest(opts.itemSelector);
                    list.offset = list.draggedItem.offset();
                    list.offset.top = e.pageY - list.offset.top;
                    list.offset.left = e.pageX - list.offset.left;

                    var containerHeight = $(list.container).outerHeight() == 0 ? Math.max(1, Math.round(0.5 + $(list.container).children(opts.itemSelector).size() * list.draggedItem.outerWidth() / $(list.container).outerWidth())) * list.draggedItem.outerHeight() : $(list.container).outerHeight();
                    list.offsetLimit = $(list.container).offset();
                    list.offsetLimit.right = list.offsetLimit.left + $(list.container).outerWidth() - list.draggedItem.outerWidth();
                    list.offsetLimit.bottom = list.offsetLimit.top + containerHeight - list.draggedItem.outerHeight();

                    list.placeHolderItem = list.draggedItem.clone().html(opts.placeHolderTemplate).addClass(opts.placeHolderClass).css("height", list.draggedItem.height()).attr("placeHolder", true);
                    list.draggedItem.after(list.placeHolderItem);
                    list.draggedItem.css({ position: "absolute", opacity: 0.8 });

                    $(lists).each(function(i, l) { l.ensureNotEmpty(); l.buildPositionTable(); });

                    list.setPos(e.pageX, e.pageY);
                    $(document).bind("selectstart", list.stopBubble); //stop ie text selection
                    $(document).bind("mousemove", list.swapItems);
                    $(document).bind("mouseup", list.dropItem);
                    return false; //stop moz text selection
                },

                setPos: function(x, y) {
                    var top = y - this.offset.top;
                    var left = x - this.offset.left;

                    if (!opts.dragBetween) {
                        top = Math.min(this.offsetLimit.bottom, Math.max(top, this.offsetLimit.top));
                        left = Math.min(this.offsetLimit.right, Math.max(left, this.offsetLimit.left));
                    }

                    this.draggedItem.parents().each(function() {
                        if ($(this).css("position") != "static"  && (!$.browser.mozilla || $(this).css("display") != "table")) {
                            var offset = $(this).offset();
                            top -= offset.top;
                            left -= offset.left;
                            return false;
                        }
                    });

                    this.draggedItem.css({ top: top, left: left });
                },

                buildPositionTable: function() {
                    var item = this.draggedItem == null ? null : this.draggedItem.get(0);
                    var pos = new Array();
                    $(this.container).children(opts.itemSelector).each(function(i, elm) {
                        if (elm != item) {
                            var loc = $(elm).offset();
                            loc.right = loc.left + $(elm).width();
                            loc.bottom = loc.top + $(elm).height();
                            loc.elm = elm;
                            pos.push(loc);
                        }
                    });
                    this.pos = pos;
                },

                dropItem: function() {
                    if (list.draggedItem == null)
                        return;

                    $(list.container).find(opts.dragSelector).css("cursor", "move");
                    list.placeHolderItem.before(list.draggedItem);

                    list.draggedItem.css({ position: "", top: "", left: "", opacity: "" });
                    list.placeHolderItem.remove();
                    
                    $("*[emptyPlaceHolder]").remove();

                    $(document).unbind("selectstart", list.stopBubble);
                    $(document).unbind("mousemove", list.swapItems);
                    $(document).unbind("mouseup", list.dropItem);

                    //opts.dragEnd.apply(list.draggedItem);
                    opts.dragEnd();
                    list.draggedItem = null;
                    return false;
                },

                stopBubble: function() { return false; },

                swapItems: function(e) {
                    if (list.draggedItem == null)
                        return false;

                    list.setPos(e.pageX, e.pageY);

                    var ei = list.findPos(e.pageX, e.pageY);
                    var nlist = list;
                    for (var i = 0; ei == -1 && opts.dragBetween && i < lists.length; i++) {
                        ei = lists[i].findPos(e.pageX, e.pageY);
                        nlist = lists[i];
                    }

                    if (ei == -1 || $(nlist.pos[ei].elm).attr("placeHolder"))
                        return false;

                    if (lastPos == null || lastPos.top > list.draggedItem.offset().top || lastPos.left > list.draggedItem.offset().left)
                        $(nlist.pos[ei].elm).before(list.placeHolderItem);
                    else
                        $(nlist.pos[ei].elm).after(list.placeHolderItem);

                    $(lists).each(function(i, l) { l.ensureNotEmpty(); l.buildPositionTable(); });
                    lastPos = list.draggedItem.offset();
                    return false;
                },

                findPos: function(x, y) {
                    for (var i = 0; i < this.pos.length; i++) {
                        if (this.pos[i].left < x && this.pos[i].right > x && this.pos[i].top < y && this.pos[i].bottom > y)
                            return i;
                    }
                    return -1;
                },
                
                ensureNotEmpty: function() {
                    if (!opts.dragBetween)
                        return;

                    var item = this.draggedItem == null ? null : this.draggedItem.get(0);
                    var emptyPH = null, empty = true;
                    
                    $(this.container).children(opts.itemSelector).each(function(i, elm) {
                        if ($(elm).attr("emptyPlaceHolder"))
                            emptyPH = elm;
                        else if (elm != item)
                            empty = false;
                    });
                    
                    if (empty && emptyPH == null)
                        $(this.container).append(list.placeHolderItem.clone().removeAttr("placeHolder").attr("emptyPlaceHolder", true));
                    else if (!empty && emptyPH != null)
                        $(emptyPH).remove();
                }
            };

            newList.init();
            lists.push(newList);
        });

        return this;
    };

    $.fn.dragsort.defaults = {
        itemSelector: "li",
        dragSelector: "li",
        dragEnd: function() { },
        dragBetween: false,
        placeHolderClass: "placeHolder",
        placeHolderTemplate: "&nbsp;"
    };

})(jQuery);

// core code until TW 2.5.5 is released ..
config.macros.tiddler.transclude = function(wrapper,tiddlerName,args)
{
    var text = store.getTiddlerText(tiddlerName);
    if(!text)
        return;
    var stack = config.macros.tiddler.tiddlerStack;
    if(stack.indexOf(tiddlerName) !== -1)
        return;
    stack.push(tiddlerName);
    try {
        if(typeof args == "string")
            args = args.readBracketedList();
        var n = args ? Math.min(args.length,9) : 0;
        for(var i=0; i<n; i++) {
            var placeholderRE = new RegExp("\\$" + (i + 1),"mg");
            text = text.replace(placeholderRE,args[i]);
        }
        config.macros.tiddler.renderText(wrapper,text,tiddlerName,params);
    } finally {
        stack.pop();
    }
};

(function ($) {
    config.macros.MainMenuOrder = {};
    config.macros.MainMenuOrder.update = function () {
        var text = "";
        $("#mainMenu li a").each(function(i, elm) { 
            text += "*[[" + $(elm).attr('tiddlylink') + "]]\n";
        });
        var t = store.getTiddler("MainMenu");
        if (t.text != text) {
            store.saveTiddler(t.title,t.title,text,t.modifier,t.modified,t.tags,t.fields,true,t.created,t.creator);
            autoSaveChanges();
        }
    };

    config.macros.MainMenuOrder.handler = function (place, macroName, params, wikifier, paramString) {
        config.macros.tiddler.transclude(place, "MainMenu", "");
        $("#mainMenu ul:first").dragsort({ dragEnd: config.macros.MainMenuOrder.update});
        config.macros.MainMenuOrder.refresh();
    };

    config.macros.MainMenuOrder.refresh = function () {
        $('#mainMenu a').removeClass('selected');
        $('.tiddler').each(function () { 
            var title = $(this).attr('tiddler');
            $('#mainMenu a[tiddlylink="' + title + '"]').addClass('selected');
        });
    };

})(jQuery);
}
//}}}
/***
|''Name:''|MainMenuNavigatorPlugin|
|''Description:''| First/Next/Previous/Last Tiddler from the MainMenu |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/MainMenuNavigatorPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/MainMenuNavigatorPlugin/ |
|''Version:''|0.2|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
Designed to work with the SinglePageMode, this plugin provides functions and macros which treat
the MainMenu as a list of tiddlers with the "current" tiddler as the first tiddler in the story.

<<firstTiddler>>
<<nextTiddler>>
<<prevTiddler>>
<<lastTiddler>>

!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global console, config, createTiddlyButton store story Story */
(function($) {
    version.extensions.MainMenuNavigatorPlugin = {installed: true};

    /*
     *  navigation buttons 
     */
    Story.prototype.firstTiddler = function () {
        var nav = config.extensions.navigation;
        nav.load();
        this.displayTiddler(null, nav.list[0]);
    };

    Story.prototype.lastTiddler = function () {
        var nav = config.extensions.navigation;
        nav.load();
        this.displayTiddler(null, nav.list[nav.list.length - 1]);
    };

    Story.prototype.nextTiddler = function () {
        var nav = config.extensions.navigation;
        nav.load();
        this.displayTiddler(null, nav.relative(1));
    };

    Story.prototype.prevTiddler = function () {
        var nav = config.extensions.navigation;
        nav.load();
        this.displayTiddler(null, nav.relative(-1));
    };

    Story.prototype.firstTitle = function () {
        var place = this.getContainer();
        if (place) {
            return place.firstChild.getAttribute("tiddler");
        }
    };

    /*
     *  plugin
     */
    config.extensions.navigation = {
        list: [],
        parse: function (s) {
            s = s.trim();
            if (!s) {
                return [];
            }
            s = s.replace(/\]\]$/, "");
            s = s.replace(/[\s\*]*\[\[/g, "[[");
            var list = s.split(/\]\]\s*/);
            for (var i = 0; i < list.length; i++) {
                list[i] = list[i].startsWith("[[") ? 
                    list[i].substring(2)
                    : parseInt(list[i], 10);
            }
            return list;
        },

        load: function () {
            this.list = this.parse(store.getTiddler("MainMenu").text);
        },

		current : function () {
			return story.currentTiddler || story.firstTitle();
		},

        relative : function (delta) {
            var title = this.current();
            var index = this.list.indexOf(title) + delta;
            index = index.clamp(0, this.list.length - 1);
            return this.list[index];
        },

        addButton : function (name) {
            config.macros[name + "Tiddler"] = {
                label : name,
                prompt : "Open the " + name + " Tiddler",
                handler: function (place, macroName, params, wikifier, paramString, tiddler) {
                    createTiddlyButton(place, params[1] || this.label, params[2] || this.prompt, function (ev) {
                        story[name + "Tiddler"]();
                    });
                }
            };
        },

        addButtons : function () {
            this.addButton("first");
            this.addButton("last");
            this.addButton("next");
            this.addButton("prev");
        }
    };

    config.extensions.navigation.addButtons();
})(jQuery);
//}}}
/***
|''Name:''|MainMenuUpdatePlugin|
|''Description:''|Update MainMenu links when a tiddler is added, renamed or removed |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/MainMenuUpdatePlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/MainMenuUpdatePlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This plugin treats the MainMenu as a list of tiddlers, and maintains its contents as tiddlers are saved and deleted from the story:
*Renaming a tiddler, results in the link being changed in the MainMenu.
*Deleting a tiddler mentioned in the MainMenu results in it being removed from the MainMenu.
*Saving a tiddler not mentioned in the MainMenu, causes it to be be added to the end of the MainMenu.
This plugin was developed for TiddlySlidy and has been designed to work with the MainMenuNavigation and MainMenuOrder plugins.
New items added to the MainMenu as a member of an unordered list, so as to work with the MainMenuReorder plugin. This may change in a future version.

!!Options
|<<option txtMainMenuTag>>|<<message config.optionsDesc.txtMainMenuTag>>|

!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global config story store refreshAll autoSaveChanges refreshPageTemplate */
(function ($) {
    version.extensions.MainMenuUpdatePlugin = {installed: true};

    config.options.txtMainMenuTag = "slide";
    config.optionsDesc.txtMainMenuTag = "Tag of items automatically added to the MainMenu";

    config.extensions.MainMenuUpdate = function (oldTitle, newTitle) {
        var t = store.getTiddler("MainMenu");
        var text = config.extensions.MainMenuUpdate.transform(t.text, oldTitle, newTitle);
        store.saveTiddler(t.title, t.title, text, t.modifier, t.modified, t.tags, t.fields, true, t.created, t.creator);

        // suspend and resume notifications ..

        // ideally this should really go, but MainMenu isn't a tiddler ..
        //applyHtmlMacros($('#mainMenu')[0], t);
        //refreshPageTemplate();
        autoSaveChanges();
    };

    config.extensions.MainMenuUpdate.transform = function (text, oldTitle, newTitle) {
        if (!newTitle) {
            text = text.replace("*[[" + oldTitle + "]]\n", "");
        } else {
            if (oldTitle !== newTitle) {
                text = text.replace("[[" + oldTitle + "]]", "[[" + newTitle + "]]");
            } 
            if (text.indexOf("[[" + newTitle  + "]]") === -1) {
                text = text.replace(/([^\s])\s*$/, "$1\n"); // defense against ie6 glitches
                text = text + "*[[" + newTitle + "]]\n";
            }
        }
        return text;
    };

    // should be possible to remove these hi-jacks
    var saveTiddler = story.saveTiddler;
    story.saveTiddler = function (title, minorUpdate) {
        var newTitle = saveTiddler.apply(this, arguments);
        var tiddler = store.getTiddler(newTitle);
        if (tiddler.tags.indexOf(config.options.txtMainMenuTag) !== -1) {
            config.extensions.MainMenuUpdate(title, newTitle);
        }
        return newTitle;
    };

    var removeTiddler = store.removeTiddler;
    store.removeTiddler = function (title) {
        config.extensions.MainMenuUpdate(title);
        story.closeTiddler(title, true);
        return removeTiddler.apply(store, arguments);
    };

})(jQuery);
//}}}
/***
|''Name:''|DefaultTiddlerListPlugin|
|''Description:''|DefaultTiddlers taken from a list of tiddler references |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/DefaultTiddlerListPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/DefaultTiddlerListPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This plugin constructs the default tiddlers from the MainMenu or other tiddler containing a list of tiddler references.
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global config */
(function ($) {
    version.extensions.DefaultTiddlerListPlugin = {installed: true};

    config.extensions.DefaultTiddlersListPlugin = {
        list: 'MainMenu',
        max: 1,
        filter: function(list, max) {
            var list = store.getTiddlerText("MainMenu");
            list = list.replace(/^[^\[]*\[\[/, "[[");
            list = list.replace(/\]\][^\[]*(\[\[|$)/g, "]]$1");
            return store.filterTiddlers(list).slice(0,max);
        }
    };
    var macro = config.extensions.DefaultTiddlersListPlugin;

    Story.prototype.displayDefaultTiddlers = function()
    {
        this.displayTiddlers(null, macro.filter(macro.list, macro.max));
    };

})(jQuery);
//}}}
/***
|''Name:''|CurrentPositionPlugin|
|''Description:''| Display current position n/n in a list of tiddlers |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/CurrentPositionPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/CurrentPositionPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
Developed for TiddlySlidy, this Macro to displays the position of the current slide (the most recently displayed tiddler) in a list of tiddlyLinks in the form n/n.

<<currentPosition>>
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global config onClickTiddlerLink store wikify */
(function ($) {
    version.extensions.CurrentPositionPlugin = {installed: true};

    config.macros.currentPosition = {};
    var macro = config.macros.currentPosition;
    macro.handler = function (place, macroName, params) {
        var list = params[0] || "MainMenu";
        var tiddlylink = params[1] || list;

        var listtext = store.fetchTiddler(list).text;
        var text = listtext.replace(/\**\s*\[\[/g, "");
        text = text.replace(/\]\]\s*$/, "");
        var items = text.split(/\]\]\s*/);

        var total = items.length;
        var first = $('#tiddlerDisplay .tiddler').attr('tiddler');
        var current = items.indexOf(first) + 1;

        $('<div id="contents" class="contents">' +
            '<a class="tiddlyLink" href="javascript:;" tiddlyLink="' + tiddlylink + '">' +
            '<span class="current">' + current + '</span>' + 
            '<span class="spacer">/</span>' +
            '<span class="total">' + total + '</span>' +
            '</a></div>'
        ).appendTo(place);
        $(place).find('a.tiddlyLink')
            .click(onClickTiddlerLink)
			.click(function() {
				// Added 'onComplete' event trigger (Ben Barnett)
				$('body').trigger('tiddlyWiki.macro.onCurrentPositionComplete');
			})
            .each(function () {
                if (config.macros.progressBar) {
                    var e = $('<span id="contentsBalloon"></span>')[0];
                    wikify(listtext, e, null, store.getTiddler(list));
                    config.macros.progressBar.popup(this, e);
                    $(e).find('a').attr('title', '');
                }
            });

		$('body').trigger('tiddlyWiki.macro.onCurrentPositionComplete');
		
    };

})(jQuery);
//}}}
/***
|''Name:''|ProgressBarPlugin|
|''Description:''| @@@Description@@@ |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ProgressBarPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ProgressBarPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation

<<progressBar ListOfTiddlers>>

!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global config Story store story wikify */
(function ($) {
    version.extensions.ProgressBarPlugin = {installed: true};

    Story.prototype.firstTitle = function () {
        var place = this.getContainer();
        if (place && place.firstChild && place.firstChild.getAttribute) {
            return place.firstChild.getAttribute("tiddler");
        }
    };

    config.macros.progressBar = {};
    var macro = config.macros.progressBar;

    macro.handler = function (place, macroName, params) {
        var list = params[0] || "MainMenu";
        var link = params[1] || "#";

        place = $('<div class="progressBar"></div>').appendTo(place)[0];

        var tiddler = store.getTiddler(list);
        wikify(tiddler.text, place, null, tiddler);

        var current = story.firstTitle();
        $(place).find('a[tiddlyLink="' + current + '"]').addClass("selected");
        $(place).find('a').each(function () {
            macro.popup(this, $(this).attr('tiddlylink'));
            $(this).html('&nbsp;');
        });
    };

    macro.popup = function (place, text) {
        $(place).hover(function () {
            $('#balloonHook').remove();
            $(this).append('<div id="balloonHook" class="balloonHook">' +
            '<div class="balloon"><div class="content"></div>' +
            '<div class="pointer"><span class="left"></span><span class="right"></span>' +
            '</div></div>')
            .attr("title", "")
            .find('.content').append(text);
            $('#balloonHook').fadeIn(100);
        }, function () {
            $('#balloonHook').fadeOut(100, function () {
                $(this).remove();
            }); 
        }).click(function () { 
                $('#balloonHook').remove();
            });
    };

})(jQuery);
//}}}
/***
|''Name:''|KnobPlugin|
|''Description:''| @@@Description@@@ |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/KnobPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/KnobPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This plugin is used by TiddlySlidy to produce the TV control panel buttons.

<<knob "1">>
<<knob |&#x25c4; >>
<<knob |&#x25c4; "alert('go')">>

!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global config */
(function ($) {
    version.extensions.KnobPlugin = {installed: true};

    config.macros.knob = {};
    config.macros.knob.handler = function (place, macroName, params) {
        var symbol = params[0] || "*";
        var action = params[1] || "";
        var title = params[2] || "";
        var classes = params[3] || "";

        var classes = classes + " knob" + (symbol.length === 1 ? "" : " squeeze");

        $('<div class="' + classes + '"><a href="#" ' + 
            (title.length ? ' title="' + title + '"': "") + 
            '><div><div>' + symbol + '</div></div></a></div>')
            .click(function () {
                eval(action);
                return false;
            }).appendTo(place);
    };

})(jQuery);
//}}}
/***
|''Name:''| keybindings |
|''Description:''|Keybindings|
|''Author:''|Phil Hawksworth|
|''Version:''|0.1|
|''Date:''|201001181709|
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''~CoreVersion:''|2.4.1|
***/

//{{{

	// create macro object
	config.macros.keybindings = {
		
		enabled: false,
		
		init: function() {	
			jQuery(document).bind('keydown', function(ev){	
				var keyCode = ev.keyCode || ev.which;
				if(config.macros.keybindings.enabled && config.macros.keybindings.keyCodes[keyCode] && config.macros.keybindings.keyCodes[keyCode] !== undefined) {
					config.macros.keybindings.keyCodes[keyCode].call();
				}
			});
		},
		
		// Add a handler function to be invoked by <<keybindings>> 
		// handler: function(place, macroName, params, wikifier, paramString, tiddler) {
		// 	
		// 	// to do: display the options panel for customisation.
		// 	
		// },
		
		// todo: replace this with some namespaced event binding and unbinding.
		enable: function() {
			config.macros.keybindings.enabled = true;
		},
		disable: function() {
			config.macros.keybindings.enabled = false;
		},
		
		
		// some sample functions to invoke.
		forward: function() {
            story.nextTiddler();
		},
		
		back: function() {
            story.prevTiddler();
		}
		
	};
	
	// key mappings
	config.macros.keybindings.keyCodes = {
		32: config.macros.keybindings.forward, 	//space
		46: config.macros.keybindings.forward, 	// .
		44: config.macros.keybindings.back		// ,
	};


//}}}
/***
|''Name:''|ImageFieldMacroPlugin|
|''Description:''|Embed an image from a URL or a URL in a named field |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ImageFieldMacroPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ImageFieldMacroPlugin/ |
|''Version:''|0.1|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation

This macro was created to assist including images in a tiddler view template, where the source 
of an image is defined by a tiddler field:

&lt;&lt;imageField "http://tiddlywiki.com/fractalveg.jpg"&gt;&gt;

<<imageField "http://tiddlywiki.com/fractalveg.jpg">>

&lt;&lt;imageField "field:image"&gt;&gt;

<<imageField field:image>>

This macro has been renamed from the image macro, to avoid a name clash with the TiddlySpace image macro 
Eventually they should be merged into the same plugin.
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global jQuery config store createTiddlyElement */
(function ($) {
	version.extensions.ImageFieldMacroPlugin = {installed: true};

	config.macros.imageField = {};
	config.macros.imageField.handler = function (place, macroName, params, wikifier, paramString, tiddler) {

		var value = params[0].match(/^field:/) ? store.getValue(tiddler, params[0].substring(6))
			: params[0];

		var e = createTiddlyElement(place, 'img', null, null);
		e.setAttribute('src', value);
	};

}(jQuery));
//}}}
/***
|''Name:''|ImageZoomMacroPlugin|
|''Description:''| macro to create a zoomable image using a tiddler field |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/ImageZoomMacroPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/ImageZoomMacroPlugin/ |
|''Version:''|0.2|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
This macro was created to assist including images in a tiddler view template, where the source 
of an image is defined by a tiddler field:

&lt;&lt;imagezoom "http://tiddlywiki.com/fractalveg.jpg"&gt;&gt;

<<imagezoom "http://farm1.static.flickr.com/33/65468830_ef7d984ba2_o.jpg">>

&lt;&lt;imagezoom "@image"&gt;&gt;

<<imagezoom @image>>

Clicking on the image creates a display containing the full sized image.
Both the image and the fullframe version may be styled using CSS.

!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global config jQuery store window */
(function ($) {
	version.extensions.ImageZoomMacroPlugin = {installed: true};

	config.macros.imagezoom = {};
	config.macros.imagezoom.color = '#000';
	config.macros.imagezoom.handler = function (place, macroName, params, wikifier, paramString, tiddler) {

		var src = params[0].match(/^@/) ? store.getValue(tiddler, params[0].substring(1))
			: params[0];

		if (!src) {
			return;
		}

		$(place).append($("<img>")
			.attr("src", src)
			.css('cursor', 'pointer')
			.click(function () { 
			$('body').append("<div id='fullframe'><img src='" + this.src + "'></div>");

			$('#fullframe img')
				.css('display', 'block')
				.css('margin', 'auto');

			$('body').trigger('tiddlyWiki.macro.imageZoom.OnOpen');
		
			$('#fullframe')
				.click(function () {
					$(this).remove();
					$('body').trigger('tiddlyWiki.macro.imageZoom.OnClose');
                });
        }));

		$('body').bind('tiddlyWiki.macro.imageZoom.OnOpen', function() {
			$('#contentWrapper').hide();
			$('#fullframe')
				.css('position', 'absolute')
				.css('z-index', '999')
				.css('top', '0')
				.css('left', '0')
				.css('width', '100%')
				.css('height', Math.max($('#fullframe img').height(), $(window).height()))
				.css('background-color', config.macros.imagezoom.color);
		});

		$('body').bind('tiddlyWiki.macro.imageZoom.OnClose', function() {
			$('#contentWrapper').show();
		});

		// TO OVERRIDE in custom tiddler:
		/**
		$('body').unbind('tiddlyWiki.macro.imageZoom.OnOpen').bind('tiddlyWiki.macro.imageZoom.OnOpen', function() {
			// custom actions to go here
		});
		**/
	};
})(jQuery);
//}}}

/***
|''Name:''|WikifiedMessagesPlugin|
|''Description:''|Wikify displayMessage text  |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/WikifiedMessagesPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/WikifiedMessagesPlugin/ |
|''Version:''|0.4|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
A plugin to replace the core displayMessage function with a version which wikifies the message text.
The construction of the [close] single message and [close all] buttons has been seperated to be overrideable and the created message div is returned by displayMessage, for extensibility by other plugins.
!!Code
***/
//{{{
if(!version.extensions.WikifiedMessagesPlugin) {
version.extensions.WikifiedMessagesPlugin = {installed:true};

	if(!config.extensions){
		config.extensions = {};
	}

	config.extensions.WikifiedMessages = {

		createClearAllButton: function(msgArea)
		{
			return (msgArea.hasChildNodes())? null :
				createTiddlyButton(createTiddlyElement(msgArea,"div",null,"messageToolbar"),
					config.messages.messageClose.text,
					config.messages.messageClose.tooltip,
					clearMessage);
		},
		createClearMessageButton: function(e)
		{
			return null;
		},
		getMessageDiv: function()
		{
			var msgArea = document.getElementById("messageArea");
			var me = config.extensions.WikifiedMessages;
			if(!msgArea){
				return null;
			}
			msgArea.style.display = "block";
			me.createClearAllButton(msgArea);
			e = createTiddlyElement(msgArea,"div",null,"messageBox");
			me.createClearMessageButton(e);
			return e;
		},
		displayMessage: function(text,linkText)
		{
			var e = getMessageDiv();
			if(!e) {
				alert(wikifyPlain(text));
				return null;
			}
			if(linkText) {
				text = "[["+text+"|"+linkText+"]]";
			}
			t = createTiddlyElement(e,"span",null,"messageText");
			t.innerHTML = wikifyStatic(text);
			return e;
		}
	};

	displayMessage = config.extensions.WikifiedMessages.displayMessage;
	getMessageDiv = config.extensions.WikifiedMessages.getMessageDiv;

        // macro, useful for testing
        config.macros.DisplayMessage = {
                handler: function(place,macroName,params,wikifier,paramString,tiddler){
                        displayMessage(paramString);
                }
        };
}
//}}}
/***
|''Name:''|FadingMessagesPlugin|
|''Description:''|Automatically clear a displayed message after an interval |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/FadingMessagesPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/FadingMessagesPlugin/ |
|''Version:''|0.2|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
|''Overrides:''|displayMessage|
|''Requires:''|WikifiedMessagesPlugin|
!!Documentation
Displayed messages automatically fade away after a short interval. 
!!Options
|<<option txtFadingMessagesTimeout>>|<<message config.optionsDesc.txtFadingMessagesTimeout>>|
|<<option chkAnimate>>|<<message config.optionsDesc.chkAnimate>>|
!!Code
***/
//{{{
if(!version.extensions.FadingMessagesPlugin) {
version.extensions.FadingMessagesPlugin = {installed:true};

	config.options.txtFadingMessagesTimeout = 5;
	config.optionsDesc.txtFadingMessagesTimeout = "seconds before a displayed message clears itself";

	config.animDurationFade = 900;

	config.extensions.FadingMessages = {
		Fader: function(e,done)
		{
			e.style.overflow = 'hidden';
			e.style.display = 'block';
			var p = [];
			p.push({style: 'display', atEnd: 'none'});
			p.push({style: 'opacity', start: 1, end: 0, template: '%0'});
			p.push({style: 'filter', start: 100, end: 0, template: 'alpha(opacity:%0)'});
			return new Morpher(e,config.animDurationFade,p,done);
		},  
		clearMessageBox: function(e)
		{
			try { removeNode(e); } catch(ex) {}
			var msgArea = document.getElementById("messageArea");
			var n = msgArea.getElementsByTagName('div');
			if(!(n&&n.length)){
				msgArea.style.display = "none";
			}
		},
		fadeMessageBox: function(e)
		{
			var me = config.extensions.FadingMessages;
			if(config.options.chkAnimate && anim){
				anim.startAnimating(new me.Fader(e,me.clearMessageBox));
			}else{
				me.clearMessageBox(e);
			}
		},
		createClearAllButton: function(e)
		{
			return null;
		},
		createClearMessageButton: function(e)
		{
			var me = config.extensions.FadingMessages;
			return createTiddlyButton(createTiddlyElement(e,"span",null,"messageClear"),
				"×","",
				function(){me.clearMessageBox(e);});
		},
		_displayMessage: displayMessage,
		displayMessage: function(text,linkText)
		{
			var me = config.extensions.FadingMessages;
			var e = me._displayMessage(text,linkText);
			if(e){
				window.setTimeout(function(){me.fadeMessageBox(e);},config.options.txtFadingMessagesTimeout*1000);
			}
			return e;
		}
	};

	displayMessage = config.extensions.FadingMessages.displayMessage;
	config.extensions.WikifiedMessages.createClearMessageButton = config.extensions.FadingMessages.createClearMessageButton;
	config.extensions.WikifiedMessages.createClearAllButton = config.extensions.FadingMessages.createClearAllButton;
}
//}}}
/*{{{*/
#messageArea {
	border:none;
	background: transparent;
}

#messageArea .messageBox {
	border:2px solid [[ColorPalette::SecondaryMid]];
	color:[[ColorPalette::Foreground]];
	background:[[ColorPalette::SecondaryLight]]; 
	width:20em;
	padding:10px;
	margin-top:0px;
	margin-bottom:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	filter:alpha(opacity=80);
}

#messageArea .messageText {
	display:block;
	width:15em;
	margin:0;
	padding:0;
}

#messageArea .messageClear {
	display:block;
	float:right;
	width:1em;
}

#messageArea .messageClear a {
	text-decoration:none;
	background-color: transparent;
	color:[[ColorPalette::Foreground]];
}

/*}}}*/
/***
|''Name:''|BackstageTiddlersPlugin|
|''Description:''|Adds a backstage panel allowing easy access to all tiddlers|
|''Author:''|JeremyRuston|
|''Source:''|http://www.osmosoft.com/#BackstageTiddlersPlugin |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/JeremyRuston/plugins/BackstageTiddlersPlugin.js |
|''Version:''|0.0.1|
|''Date:''|Feb 28, 2008|
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''~CoreVersion:''|2.3|

***/

//{{{
if(!version.extensions.BackstageTiddlersPlugin) {

version.extensions.BackstageTiddlersPlugin = {installed:true};

config.tasks.tiddlers = {
	text: "tiddlers",
	tooltip: "Access the raw tiddlers",
	content: "<<tabs txtMainTab 'Timeline' 'Timeline' TabTimeline 'All' 'All tiddlers' TabAll 'Tags' 'All tags' TabTags 'More' 'More lists' TabMore>>"};
config.backstageTasks.push("tiddlers");

} //# end of 'install only once'
//}}}
/***
|''Name:''|DisableWikiLinksPlugin|
|''Description:''|Allows you to disable TiddlyWiki's automatic linking of WikiWords|
|''Author:''|Martin Budden (mjbudden (at) gmail (dot) com)|
|''Source:''|http://www.martinswiki.com/#DisableWikiLinksPlugin |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/MartinBudden/plugins/DisableWikiLinksPlugin.js |
|''Version:''|0.1.3|
|''Date:''|Aug 5, 2006|
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''License:''|[[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]] |
|''~CoreVersion:''|2.1.0|

|''Disable WikiLinks''|<<option chkDisableWikiLinks>>|

***/

//{{{
// Ensure that the DisableWikiLinksPlugin is only installed once.
if(!version.extensions.DisableWikiLinksPlugin) {
version.extensions.DisableWikiLinksPlugin = {installed:true};

if(version.major < 2 || (version.major == 2 && version.minor < 1))
	{alertAndThrow('DisableWikiLinksPlugin requires TiddlyWiki 2.1 or newer.');}

if (config.options.chkDisableWikiLinks==undefined)
	{config.options.chkDisableWikiLinks = false;}

Tiddler.prototype.autoLinkWikiWords = function()
{
	if(config.options.chkDisableWikiLinks==true)
		{return false;}
	return !this.isTagged('systemConfig') && !this.isTagged('excludeMissing');
};

} // end of 'install only once'
//}}}
/***
|''Name:''|TiddlySlidyPlugin|
|''Description:''|Misc hacks for TiddlySlidy |
|''Author:''|PaulDowney (psd (at) osmosoft (dot) com) |
|''Source:''|http://whatfettle.com/2008/07/MainMenuOrderPlugin/ |
|''CodeRepository:''|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/plugins/MainMenuOrderPlugin/ |
|''Version:''|0.2|
|''License:''|[[BSD License|http://www.opensource.org/licenses/bsd-license.php]] |
|''Comments:''|Please make comments at http://groups.google.co.uk/group/TiddlyWikiDev |
|''~CoreVersion:''|2.4|
!!Documentation
These are here, ahead of being refactored into generic plugins
!!Code
***/
//{{{
/*jslint onevar: false nomen: false plusplus: false */
/*global console config jQuery createTiddlyButton store story Story createTiddlyDropDown merge */

// In the absence of a HistoryPlugin
var lastSlide = '';

(function ($) {

    // Enable keybindings only when we are in presenter mode.
    Story.prototype._keybindings_switchTheme = Story.prototype.switchTheme;
    Story.prototype.switchTheme = function(theme) {
        this._keybindings_switchTheme.apply(this,arguments);
        if(theme == 'PresenterMode') {
            config.macros.keybindings.enable();
        } else {
            config.macros.keybindings.disable();
        }
    };

	// expose a function for the navigation buttons toggle.
	config.macros.toggleLinearNavigation = function(){
		$('div.slide-bottom a').slideToggle(100);
	};
	
	

    var displayTiddler = Story.prototype.displayTiddler;
    Story.prototype.displayTiddler = function(srcElement,tiddler,template,animate,unused,customFields,toggle,animationSrc) {
        var r = displayTiddler.apply(this, arguments);
        tiddler = (tiddler instanceof Tiddler) ? tiddler : store.fetchTiddler(tiddler);

		// catch null tiddler exception in presentation mode
		if (!tiddler) {
			if ($('#presentation').length) {
				return false;
			}
		} 

        // refresh control panel
        refreshElements($('#footer')[0]);

        // update MainMenu
        config.macros.MainMenuOrder.refresh();

        if (tiddler.tags.indexOf('slide') != -1) {
            $('#fullframe').remove();
            $('#contentWrapper').show();
            lastSlide = tiddler.title;
            return r;
        }

        if ($('#presentation').length) {
			$('body').append("<div id='fullframe'></div>");
			$('#slide').clone().appendTo('#fullframe');
			$('body').trigger('tiddlyWiki.macro.fullframe.OnOpen');
			$('#fullframe')
				.click(function (e) {
					$('body').trigger('tiddlyWiki.macro.fullframe.OnClose');
					var link = $(e.target).attr("tiddlyLink");
					story.displayTiddler(null, link || lastSlide);
				});
        }

        return r;
    };

	// Setup "default" event listeners (to override simply .unbind())
	$('body').bind('tiddlyWiki.macro.fullframe.OnOpen', function(){
		$('#contentWrapper').hide();
		$('#fullframe')
			.css('display', 'block')
			.css('margin', 'auto')
			.css('position', 'absolute')
			.css('z-index', '999')
			.css('top', '0')
			.css('left', '0')
			.css('width', '100%')
			.css('height', Math.max($('#fullframe').height(), $(window).height()))
			.css('background-color', config.macros.imagezoom.color);
		
	});
	$('body').bind('tiddlyWiki.macro.fullframe.OnClose', function(){
		$('#contentWrapper').show();
	    $('#fullframe').remove();
	});


    /*
     *  newSlide button
     *  TBD := replace with selection from master slide thumbnails
     */
    config.macros.newSlide = {};
    config.macros.newSlide.handler = function(place, macroName, params, wikifier, paramString, tiddler) {
        var theme = params[0];
        var title = "New Slide";
        var tip = "Create a new " + theme + " Slide";
        var tag = params[1] || "slide";

        return createTiddlyButton(place, theme, tip, function () {
                var template = theme + "##EditTemplate";
                var tags = [tag];
                var customFields = {
                    'theme': theme
                };
                var tiddler = store.createTiddler(title);
                merge(tiddler.fields, customFields);
                merge(tiddler.tags, tags);
                story.displayTiddler(null, title, template, false, null, null, false, place);
                story.focusTiddler(title,'title');
                return false;
            }, 
            null, 
            null, 
            null);
    };

    /*
     *  better CheckboxToggle
     */
    config.macros.toggleTag = {};
    config.macros.toggleTag.handler = function (place, macroName, params, wikifier, paramString, tiddler) {
        var ontag = params[0] || "slide";
        var offtag = params[1] || "notes";
        var caption = params[2] || "";

        var title = tiddler.title;
		var checked = tiddler.isTagged(ontag);

        createTiddlyCheckbox(place, "", checked, function () {
            checked = this.checked;
            store.setTiddlerTag(title, checked, ontag);
            store.setTiddlerTag(title, !checked, offtag);
            config.extensions.MainMenuUpdate(title, checked ? title : null);
            return false;
        });

        var id = story.tiddlerId(title) + "Toggle" + ontag;
        $(place).find('input').attr('id', id);
        $('<label for=' + id + '>' + caption + '</label>').appendTo(place);
        return false;
    };

Story.prototype.onTiddlerMouseOver = function(e)
{
    addClass(this, "mousey");
    return false;
};


})(jQuery);
//}}}

|''PageTemplate''|##PageTemplate|
|''StyleSheet''|##StyleSheet|

!PageTemplate
<!--{{{-->
<div id='header'>
    <p class='siteTitle' refresh='content' tiddler='SiteTitle'></p>
    <div class="modeSwitch" refresh='content' tiddler='ModeSwitch'></div>
</div>
<div id='messageArea'></div>
<div id='author'>
    <div id="mainNav">
        <div id='authorButtons' refresh='content' tiddler='AuthorButtons'></div>
        <div id='mainMenu' refresh='content' force='true' tiddler='MainMenuWrapper'></div>
    </div>
    <div id="displayContainer">
        <div id='displayArea'>
            <div id='tiddlerDisplay'></div>
        </div>
        <div id='sidebar'>
            <div id='sidebarOptions' refresh='content' tiddler='SideBarOptions'></div>
            <div id='sidebarTabs' refresh='content' force='true' tiddler='SideBarTabs'></div>
        </div>
    </div>
</div>
<div id='footer'></div>
<!--}}}-->

!StyleSheet
[[StyleSheet]]
/*{{{*/

    #contentWrapper {
        width: 100%;
        max-width: 100%;
    }

    #author {
        width: 100em;
        margin: 0 auto;
        text-align: left;
    }

    #mainNav {
        width: 18em;
        max-width: 20%;
        float: left;
        margin: 1em 0;
    }

    #displayContainer {
        float: right;
        width: 75em;
        margin: 0;
    }

    #tiddlerDisplay {
        display: inline-block;
        margin: 0;
        padding: 0;
    }

    #displayArea {
        width: 50em;
        display: inline;
        margin: 0;
        padding: 0;
    }

    #sidebar {
        width: 18em;
        margin: 0;
        right: 0;
        top: 0;
        float: left;
        margin: 0;
        padding: 0;
        margin: 0;
        position: static;
        float: right;

        /* IE6 hack */
        _position: absolute;
        _top: 8em;
    }

    #footer { 
        clear: both;
    }

#sidebarTabs .tabContents {
    margin: 0 auto;
    text-align: left;
}
#sidebarOptions {
    padding-top:1em;
}
#sidebarOptions a {
    margin:0; 
    padding:0; 
    display: inline; 
}
#sidebarOptions input {
    margin:0.4em 0.5em;
}

#sidebarTabs .tabContents {
    width: 15em; 
    overflow: hidden;
    color: [[ColorPalette::SecondaryMid]];
    border: 2px solid [[ColorPalette::PrimaryPale]];
    background-color: [[ColorPalette::Background]];
    margin: 0;
}

#sidebar .tabUnselected {
    background-color: [[ColorPalette::SecondaryMid]];
    color: [[ColorPalette::Background]];
    margin: 0;
}

#sidebar .tiddlyLinkExisting {
    color: [[ColorPalette::SecondaryMid]];
    margin: 0;
}

#authorButtons {
    height: 3.5em;
    padding: 0 auto;
}

#sidebar a.button,
#authorButtons a.button {
    text-align: center;
    font-size: 1.2em;
}

/* ie6.0 hack */
div#tiddlerDisplay div.viewSlide {
    _height: 475px;
}



/*}}}*/
|''PageTemplate''|##PageTemplate|
|''StyleSheet''|##StyleSheet|

!PageTemplate
<!--{{{-->
<div id='messageArea'></div>
<div id='presentation'>
    <div id='slide'>
        <div id='tiddlerDisplay'>display</div>
    </div>
</div>
<div id='footer'>
    <div class="controls" refresh='content' tiddler='ControlPanel'></div>
</div>

<!--}}}-->

!StyleSheet
[[StyleSheet]]
/*{{{*/

a#backstageShow {
    color: [[ColorPalette::SecondaryPale]];
}

/* ie6.0 hack */
div#tiddlerDisplay div.tiddler {
    _height: 475px;
}

/*}}}*/
|''PageTemplate''|##PageTemplate|
|''StyleSheet''|##StyleSheet|

!PageTemplate
<!--{{{-->
<div id='messageArea'></div>
<div id='presentation'>
    <div id='slide'>
        <div id='tiddlerDisplay'>display</div>
    </div>
</div>
<div id='footer'>
    <div class="controls" refresh='content' tiddler='ControlPanel'></div>
</div>

<!--}}}-->

!StyleSheet
[[StyleSheet]]
/*{{{*/

html, body {
    background-color: #000;
    overflow-x: hidden;
    overflow-y: hidden;
}

#backstageButton,
#backstageArea,
#backstageShow,
#backstage,
#messageArea {
    display: none;
    color: #000;
}

a#backstageShow {
    color: #000;
}


#presentation {
    width: 100%;
    height: 100%;
    min-height: 100%;
    background-color: #000;
}

#contentWrapper,
#displayArea, 
#tiddlerDisplay,
#presentation .tiddler,
#presentation .viewSlide {
    margin: 0;
    padding: 0;
    border: none;
}

#tiddlerDisplay {
    height: auto;
    min-height: auto;
    background-color: black;
}

#slide {
    padding: 0;
    margin: 0 auto;
    border: none;
}

#footer {
    display: hidden;
    position: relative;
    bottom: 6em;
    z-index: 100;
    width: 100%;
    padding: 0;
    margin: 0;
    height: 0;
    background-color: transparent;
    opacity: 0;
}

#footer:hover {
    opacity: 1;
}

/*}}}*/
*[[TiddlySlidy]]
*[[TiddlyWiki]]
*[[TiddlyWiki.com]]
*[[Features]]
*[[Operation]]
*[[Offline]]
*[[Styling]]
*[[SingleImage]]
*[[ThreeImages]]
*[[FourImages]]
*[[Status]]
*[[Acknowledgements]]
*[[Thank You]]

*[[Author|TiddlyWiki]] in the browser
*[[Operate|Operation]] using the keyboard
*Work [[Offline]]
*Apply consistent [[Styling]]
*Use additional tiddlers for [[Notes]]
| Space | PgDn | &rarr; |Next slide |
| Backspace | PgUp | &larr; |Previous slide |
|| Home | 1 |First slide |
|| End | = |Last slide |
|| + | S |Smaller font |
|| - | B |Bigger font |
|| ? | H |Help |
||| T |Toggle the table of contents |
||| P |Present mode |
||| F |Full-screen mode |
|| Esc | A |Author mode |
#[[Download|http://tiddlyslidy.com/TiddlySlidy.zip]] [[TiddlySlidy]]
# unzip and then open the HTML file in a modern browser such as [[Firefox|http://www.mozilla.com/firefox/]]
Further advice on using [[TiddlyWiki|]] is avalable from [[tiddlywiki.com|http://tiddlywiki.com/#SaveChanges]]
<<<
A [[wiki|http://en.wikipedia.org/wiki/Wiki]] in a single HTML file you can put [[on the Web|http://tiddlyslidy.com]], [[save locally|Offline]], attach to an email, or share via a USB stick. 
<<<
http://tiddlywiki.com
You can find out more about about TiddlyWiki at http://tiddlywiki.com

There's a cheat-sheet for using TiddlyWiki [[Wiki markup|http://en.wikipedia.org/wiki/Wiki_markup]] at http://tiddlypocketbook.com
* [[SinglePageModePlugin]]
* [[MainMenuOrderPlugin]]
* [[ThemeButtonPlugin]]
* [[ThemedTiddlerPlugin]]
|  !Mode|!Issue  |
| Author|Whole page being refreshed on slide change? |
| Author|new slide cancel leaves Zombie tiddler |
| Author |Duplicate slide button |
| Author |New slide to add at current position |
| Author|reintroduce search, with extension for searching fields |
| Author|Options panel for which mode to open in, author name, etc |
| Author|Upgrade: Export slide/master tiddlers individually |
| Present|fullscreen mode |
| Author|new slide template based selector |
| Present|keyboard navigation customised from theme |
| Author|Different images for zoom/ thumbnail |
| Present|Popup keyboard shortcuts |
| Present|Zooming buttons +/- keys |
| Present|popup table of contents |
| Present|Program Guide like grid table of contents |
| Author|Improved drag and drop |
| Author|hierachical menu |
| All|test in ie6| |
| Author|search, missing and orphaned tiddlers |
| Author|thumbnail preview |
| Present|Show / hide sections / slides |
| Author|how does tagging surface? |
| Author|[[WYSIWYG editor|http://ckeditor.com/]] |
| Author|template authoring |
| Author|spell checking textarea/input box (Firefox: layout.spellcheckDefault)|
| Author |Offline mode (caches images locally) |
[[TiddlySlidy]] is an [[Open Source|http://svn.tiddlywiki.org/Trunk/verticals/TiddlySlidy/]] project developed by [[Osmosoft|http://osmosoft.com]] in collaboration with [[theTeam|http://theteam.co.uk]] and the [[TiddlyWiki]] [[Community|http://tiddlywiki.org]].

*[[TitleMaster]]
*[[TextBoxMaster]]
*[[ImageAndTextMaster]]
*[[SingleImageMaster]]
*[[ThreeImagesMaster]]
*[[FourImagesMaster]]
//etc//





[[TiddlyWiki]] Tiddlers outside of the presentation are treated as //hidden notes//, and are displayed using a dedicated theme when in presenter mode, for example [[Buncefield]], [[Frosty Figs]] and [[TallImage]].
[[View East|http://www.flickr.com/photos/psd/72440450/]] is a photograph taken by [[Paul Downey|http://blog.whatfettle.com]] of the [[Buncefield Fire|http://en.wikipedia.org/wiki/Buncefield_fire]] from [[Berkhamsted|http://en.wikipedia.org/wiki/Berkhamsted]] on the 11th December 2005.
[[Frosty Figs|http://www.flickr.com/photos/psd/64465147/]] is a photograph taken by [[Paul Downey|http://blog.whatfettle.com]] in [[Berkhamsted|http://en.wikipedia.org/wiki/Berkhamsted]].
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Title: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='titleSlide'>
        <div class='title viewer' macro='view title wikified'></div>
        <div class='subtitle viewer' macro='view subtitle wikified'></div>
        <div class='url viewer' macro='view url wikified'></div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Title Slide: <span macro="view title"></span></h2>
<div class='editSlide titleSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Homepage</div><div class="subtitle editor" macro="edit url"></div>
</div>
[[EditToolbar]]
<!--}}}-->

!StyleSheet
/*{{{*/
.titleSlide {
    font-size: 4em;
    text-align: center;
    background-color: #E8E8E8;
    height: 100%;
    min-height: 400px;
}

.titleSlide .title {
    color: #333;
    font-weight: bolder;
    letter-spacing: -2px;
}

.titleSlide .subtitle {
    color: #747474;
    font-size: 0.4em;
}

.titleSlide .url {
    color: #747474;
    font-size: 0.4em;
    padding-top: 6em;
}
/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Text Box: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='textBoxSlide'>
        <div class='title viewer' macro='view title wikified'></div>
        <div class='subtitle viewer' macro='view subtitle wikified'></div>
        <div class='textbox viewer' macro='view text wikified'></div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Text Box Slide: <span macro="view title"></span></h2>
<div class='editSlide textBoxSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Text</div><div class="textbox editor" macro="edit text"></div>
</div>
[[EditToolbar]]
<!--}}}-->


!StyleSheet
/*{{{*/
.textBoxSlide {
    font-size: 2em;
    text-align: left;
    background-color: #E8E8E8;
    height: 100%;
    min-height: 400px;
}

.textBoxSlide .title {
    color: #747474;
    font-weight: normal;
    letter-spacing: 0;
    padding-left: 0.5em;
}

.textBoxSlide .subtitle {
    color: #747474;
    font-weight: normal;
    font-size: 0.8em;
    padding-left: 1em;
}

.textBoxSlide .textbox {
    color: #333;
    font-size: 1.2em;
    line-spacing: 1.6em;
    padding: 0 1em;
}

.textBoxSlide ul li {
    padding-left: 0em;
}

.textBoxSlide blockquote {
    border-left:8px solid #999999;
    margin: 1em 2em;
    padding-left: 1em;
}


/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Text and Image: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='textAndImageSlide'>
        <div class='title viewer' macro='view title wikified'></div>
        <div class='subtitle viewer' macro='view subtitle wikified'></div>
        <div class='boxes'>
            <div class='image viewer' macro="imagezoom @image"></div>
            <div class='textbox viewer' macro='view text wikified'></div>
        </div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Text and Image Slide: <span macro="view title"></span></h2>
<div class='editSlide textAndImageSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image"></div>
    <div class="label">Text</div><div class="textbox editor" macro="edit text"></div>
</div>
[[EditToolbar]]
<!--}}}-->


!StyleSheet
/*{{{*/
.textAndImageSlide {
    font-size: 2em;
    text-align: left;
    background-color: #E8E8E8;
    height: 100%;
    min-height: 400px;
    overflow: hidden;
}

.textAndImageSlide .title {
    color: #747474;
    font-weight: normal;
    letter-spacing: 0;
    padding-left: 0.5em;
}

.textAndImageSlide .subtitle {
    color: #747474;
    font-weight: normal;
    font-size: 0.8em;
    padding-left: 1em;
}

.textAndImageSlide .image {
    margin: 2px;
    padding: 1em;
    height: auto;
    width: 40%;
    float: left;
    text-align: left;
}

.textAndImageSlide .image img {
    border: 1px solid #fff;
    padding: 0;
    margin: 0;
    width: 90%;
    height: auto; 
}

.textAndImageSlide .textbox {
    color: #333;
    padding: 1em;
    width: 45%;
    font-size: 0.8em;
    float: left;
}

.textAndImageSlide ul li {
    padding-left: 0em;
}

.textAndImageSlide blockquote {
    border-left:8px solid #999999;
    margin: 1em 2em;
    padding-left: 1em;
}

/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Single Image: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='singleImageSlide'>
        <div class='title viewer' macro='view title wikified'></div>
        <div class='subtitle viewer' macro='view subtitle wikified'></div>
        <div class='image viewer' macro="imagezoom @image"></div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Single Image Slide: <span macro="view title"></span></h2>
<div class='editSlide titleSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Image</div><div class="image editor" macro="edit image"></div>
</div>
[[EditToolbar]]
<!--}}}-->

!StyleSheet
/*{{{*/
.singleImageSlide {
    font-size: 2em;
    text-align: left;
    background-color: #e8e8e8;
    height: 100%;
    min-height: 400px;
}

.singleImageSlide .title {
    color: #747474;
    font-weight: normal;
    letter-spacing: 0;
    padding-left: 0.5em;
}

.singleImageSlide .subtitle {
    color: #747474;
    font-weight: normal;
    font-size: 0.8em;
    padding-left: 1em;
}

.singleImageSlide .image {
    padding: 0;
    margin: 0.5em;
    height: 310px;
    overflow: hidden;
    text-align: center;
}

.singleImageSlide .image img {
  height:100%;
  margin: 20px auto;
}

/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Three Images: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='threeImagesSlide'>
        <div class='title viewer' macro='view title wikified'></div>
        <div class='subtitle viewer' macro='view subtitle wikified'></div>
        <div class='boxes'>
            <div class='box'>
                <div class='caption viewer' macro='view caption wikified'></div>
                <div class='image viewer' macro="imagezoom @image"></div>
            </div>
            <div class='box'>
                <div class='caption viewer' macro='view caption2 wikified'></div>
                <div class='image viewer' macro="imagezoom @image2"></div>
            </div>
            <div class='box'>
                <div class='caption viewer' macro='view caption3 wikified'></div>
                <div class='image viewer' macro="imagezoom @image3"></div>
            </div>
        </div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Three Images Slide: <span macro="view title"></span></h2>
<div class='editSlide threeImagesSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption2"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image2"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption3"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image3"></div>
</div>
[[EditToolbar]]
<!--}}}-->

!StyleSheet
/*{{{*/
.threeImagesSlide {
    font-size: 2em;
    text-align: left;
    background-color: #e8e8e8;
    height: 100%;
    min-height: 400px;
}

.threeImagesSlide .title {
    color: #747474;
    font-weight: normal;
    letter-spacing: 0;
    padding-left: 0.5em;
}

.threeImagesSlide .subtitle {
    color: #747474;
    font-weight: normal;
    font-size: 0.8em;
    padding-left: 1em;
}

.threeImagesSlide .boxes {
    padding-left: 2em;
}

.threeImagesSlide .box {
    margin: 2px;
    height: auto;
    width: 30%;
    float: left;
    padding: 1em 0;
    text-align: center;
}

.threeImagesSlide .caption {
    text-align: center;
    font-size: 0.6em;
}

.threeImagesSlide .image img {
    border: 1px solid #fff;
    padding: 0;
    margin: 0;
    width: 90%;
    height: auto; 
}

/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Four Images: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='fourImagesSlide'>
        <div class='title viewer' macro='view title wikified'></div>
        <div class='subtitle viewer' macro='view subtitle wikified'></div>
        <div class='boxes'>
            <div class='box'>
                <div class='caption viewer' macro='view caption wikified'></div>
                <div class='image viewer' macro="imagezoom @image"></div>
            </div>
            <div class='box'>
                <div class='caption viewer' macro='view caption2 wikified'></div>
                <div class='image viewer' macro="imagezoom @image2"></div>
            </div>
            <div class='box'>
                <div class='caption viewer' macro='view caption3 wikified'></div>
                <div class='image viewer' macro="imagezoom @image3"></div>
            </div>
            <div class='box'>
                <div class='caption viewer' macro='view caption4 wikified'></div>
                <div class='image viewer' macro="imagezoom @image4"></div>
            </div>
        </div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Four Images Slide: <span macro="view title"></span></h2>
<div class='editSlide fourImagesSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption2"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image2"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption3"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image3"></div>
    <div class="label">Caption</div><div class="subtitle editor" macro="edit caption4"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image4"></div>
</div>
[[EditToolbar]]
<!--}}}-->

!StyleSheet
/*{{{*/
.fourImagesSlide {
    font-size: 2em;
    text-align: left;
    background-color: #e8e8e8;
    height: 100%;
    min-height: 400px;
}

.fourImagesSlide .title {
    color: #747474;
    font-weight: normal;
    letter-spacing: 0;
    padding-left: 0.5em;
}

.fourImagesSlide .subtitle {
    color: #747474;
    font-weight: normal;
    font-size: 0.8em;
    padding-left: 1em;
}

.fourImagesSlide .boxes {
    padding-left: 2em;
}

.fourImagesSlide .box {
    margin: 2px;
    height: auto;
    width: 22%;
    float: left;
    padding: 1em 0;
    text-align: center;
}

.fourImagesSlide .caption {
    text-align: center;
    font-size: 0.6em;
}

.fourImagesSlide .image img {
    border: 1px solid #fff;
    padding: 0;
    margin: 0;
    width: 90%;
    height: auto; 
}

/*}}}*/
<<newSlide TitleMaster "slide">> 
<<newSlide TextBoxMaster "slide">>   
<<newSlide ImageAndTextMaster "slide">> 
<<newSlide SingleImageMaster "slide">>
<<newSlide ThreeImagesMaster "slide">>
<<newSlide FourImagesMaster "slide">>
<<newSlide WideImageMaster "slide">>
<<newSlide TallImageMaster "slide">>
|''ViewTemplate''|##ViewTemplate|

!ViewTemplate
<!--{{{-->
<h2 class="preview">New Slide: Select a Template</div>
<div class='viewSlide'>
    <div class='newSlide'>
        <div class='textbox viewer' macro='view text wikified'></div>
    </div>
</div>
<div class='toolbar' macro='toolbar -closeTiddler'></div>
<!--}}}-->
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Wide Image: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='wideImageSlide'>
        <div class='image viewer' macro="imagezoom @image"></div>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Wide Image Slide: <span macro="view title"></span></h2>
<div class='editSlide wideImageSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image"></div>
</div>
[[EditToolbar]]
<!--}}}-->

!StyleSheet
/*{{{*/
.wideImageSlide {
    font-size: 2em;
    text-align: left;
    background-color: #E8E8E8;
    height: 100%;
    min-height: 400px;
}

.wideImageSlide .image {
    padding: 0;
    margin: 0 auto;
}

.wideImageSlide .image img {
    width: 100%;
    border: none;
    padding: 0;
    margin: 0;
}
/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''EditTemplate''|##EditTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview">Preview Tall Image: <span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='tallImageSlide'>
        <center><div class='image viewer' macro="imagezoom @image"></div></center>
    </div>
</div>
[[ViewToolbar]]
<!--}}}-->

!EditTemplate
<!--{{{-->
<h2>Edit Tall Image Slide: <span macro="view title"></span></h2>
<div class='editSlide tallImageSlideEdit'>
    <div class="label">Title</div><div class="title editor" macro="edit title"></div>
    <div class="label">Subtitle</div><div class="subtitle editor" macro="edit subtitle"></div>
    <div class="label">Image</div><div class="subtitle editor" macro="edit image"></div>
</div>
[[EditToolbar]]
<!--}}}-->

!StyleSheet
/*{{{*/
.tallImageSlide {
    font-size: 2em;
    text-align: left;
    background-color: #E8E8E8;
    height: 100%;
    min-height: 400px;
}

.tallImageSlide .image {
    padding: 0;
    margin: 0;
}

/* 100% height needs JavaScript .. */
.tallImageSlide .image img {
    height: 460px;
    border: none;
    margin: 0;
    padding: 0;
}
/*}}}*/
|''ViewTemplate''|##ViewTemplate|
|''StyleSheet''|##StyleSheet|

!ViewTemplate
<!--{{{-->
<h2 class="preview"><span macro="view title"></span></h2>
<div class='viewSlide'>
    <div class='slideSorter'>
        <div class='title viewer'>Slides</div>
        <div class='text viewer' macro='view text wikified'></div>
    </div>
</div>
<div class="toolbarOptions">
</div>
<div class='toolbar'>
    <span macro='toolbar closeTiddler'></span>
</div>
<!--}}}-->

!StyleSheet
/*{{{*/
.slideSorter {
    font-size: 4em;
    text-align: center;
    background-color: #E8E8E8;
    height: 100%;
    min-height: 400px;
}

.slideSorter .title {
    color: #333;
    font-weight: bolder;
    letter-spacing: -2px;
    font-size: 1em;
}

.slideSorter .text {
    font-size: 0.7em;
}

.slideSorter ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border: none;
    display: inline;
}

.slideSorter li {
    list-style: none;
    display: inline;
}

.slideSorter li:after {
    content: "  ";
}

/*}}}*/