My choked TiddlyWiki

<!--{{{-->
<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>>

!Decriptions of Params
|!Params |%0|%1|%2|%3|%4|%5|
|!Descriptions|title|url|selections|descriptions|rererence|tags|
!Lingos of command button
{{{
''text:'' Bookmarks
''tooltip:'' Bookmark this tiddlers to ...
''popupNone:'' There are no bookmark services
}}}
!List of Services
{{{
''Services:'' Del.icio.us,Digg,Google,Yahoo,Furl,HemiDemi,MyShare,Baidu,Youpus,Technorati
}}}
!Definition of Services
{{{
''HemiDemi:''<br/>[[HemiDemi|http://www.hemidemi.com/user_bookmark/new?title=%0&url=%1&quotes=%2&description=%3&via=%4&tag_string=%5]]
''MyShare:''<br/>[[MyShare|http://myshare.url.com.tw/index.php?func=newurl&from=mysharepop&url=%1&desc=%0&contents=%3]]
''Baidu:''<br/>[[Baidu|http://cang.baidu.com/do/add?iu=%1&it=%0&dc=%3]]
''Google:''<br/>[[Google|http://www.google.com/bookmarks/mark?op=add&title=%0&bkmk=%1&annotation=%3&labels=%5]]
''Yahoo:''<br/>[[Yahoo|http://tw.myweb2.search.yahoo.com/myresults/bookmarklet?t=%1&u=%0&d=%3&ei=UTF-8]]
''Del.icio.us:''<br/>[[Del.icio.us|http://del.icio.us/post?title=%0&url=%1&notes=%3&tags=%5]]
''Digg:''<br/>[[Digg|http://digg.com/submit?phase=2&url=%0&title=%1&bodytext=%3]]
''Technorati:''<br/>[[Technorati|http://technorati.com/faves?add=%1&title=%0]]
''Furl:''<br/>[[Furl|http://www.furl.net/storeIt.jsp?t=%0&u=%1&r=%4&c=%2&p=1]]
''Youpush:''<br/>[[Youpush|http://www.youpush.net/submit.php?url=%1]]
}}}

<!--{{{-->
<!-- Borrowed -->
<script type="text/javascript" src="plugins/BigThemePack.js"></script>
<script type="text/javascript" src="plugins/NestedSlidersPlugin.js"></script>
<!--}}}-->
<!--{{{-->
<!-- PTW -->
<script type="text/javascript" src="plugins/ArchivedTimeline.js"></script>
<script type="text/javascript" src="plugins/BreadCrumbs2.js"></script>
<script type="text/javascript" src="plugins/BookrmarksCommand.js"></script>
<script type="text/javascript" src="plugins/ListExtensionsCode.js"></script>
<script type="text/javascript" src="plugins/TiddlyCalendar.js"></script>
<script type="text/javascript" src="plugins/XMLReader2.js"></script>
<!--}}}-->

<<rssfeed asHtml "http://sourceforge.net/export/rss2_projfiles.php?group_id=150646">>

<<listExtCode>>

/***

''This plugin was previously called StyleChooser.''

|Name|SelectThemePlugin|
|Created by|SimonBaird and SaqImtiaz|
|Source|http://tw.lewcid.org/#SelectThemePlugin|
|Version|1.2.5|
|CoreVersion:|~TW2.x|
!Description
*An alternative style switcher, can be used to switch just stylesheets and/or pagetemplates, or a combination of both (a theme)
*you can add your own stylesheets and pagetemplates, or use a ThemePack, like BigThemePack.

!Usage
* You have to have fetch or create some styleSheets and pageTemplates to use this plugin.
**You can either get a ThemePack like BigThemePack which automatically adds themes to ThemeSelect.
**or create tiddlers with styleSheets and pageTemplates and tag them styleSheets and pageTemplates respectively.
* Put {{{<<themeSelect style 'Select theme'>>}}} in your SideBarOptions.

!Creating Theme Packs
*You can create your own theme pack if you like. Instructions can be found [[here.|CreateThemePack]]

!History
*20-Dec-06, v 1.2.5, fixed horizontal rules for IE (thanks Clint), compatibility fix with HoverMenuPlugin
* 08-Sept-06, v1.2.4, fixed bug with TW2.1
* 15-May-06, v1.2.3, added paramifier so you can put theme on url, eg http://www.somewhere.com/twfile.html#theme:Berry2, thanks Clint (Simon).
* 28-Apr-o6, v1.2.2, fixed bug with opening TW after deleting themepacks. (Saq)
* 26-Apr-06, v1.2.1, more code optimization, dropdowns now updated on the fly. (Saq)
* 25-Apr-06, v1.2.0, added 3rd party ThemePack support, and made various other improvements.(Simon & Saq)
* 24-Apr-06, v1.1.0, added: no styles and default styles options,<<br>>support for ThemePack, support for tag variations(Saq)
* 21-Apr-06, v1.0.0, Reworked dropdowns to include option for pagetemplates (Saq)
* 21-Apr-06, v0.9.0, Rewrote and added Saq's lovely dropdown select (Simon)
* 20-Apr-06, v0.0.1, Basic switcher working (Simon)

!Examples
|!Source|!Output|h
|{{{<<themeSelect style>>}}} for a dropdown with StyleSheets|<<themeSelect style>>|
|{{{<<themeSelect pagetemplate>>}}} for a dropdown with PageTemplates|<<themeSelect pagetemplate>>|
|{{{<<themeSelect style customlabel>>}}} to use a customlabel|<<themeSelect style customlabel>>|
* When applying a stylesheet or template, it also looks for a template or stylesheet respectively based on naming convention, eg MyFunkyStyleSheet and MyFunkyPageTemplate.

!Notes
* See also http://www.tiddlytools.com/#SelectStyleSheetPlugin for a more feature-rich style sheet switcher

! Ideas
* do ViewTemplate also?
* Pretty up the [x] bit

!Code
***/
//{{{
// for compatibility with TW <2.0.9
if (!Array.prototype.contains)
   Array.prototype.contains = function(item)
   {
    return this.find(item) != null;
    };

// for compatibility with TW <2.0.9
if (!Array.prototype.containsAny)
   Array.prototype.containsAny = function(items)
   {
    for(var i=0; i<items.length; i++)
        if (this.contains(items[i]))
            return true;
    return false;
    };
//}}}

//{{{
version.extensions.SelectTheme = { major: 1, minor: 2, revision: 5, date: new Date(2006,12,20),
	source: "http://tw.lewcid.org/#SelectThemePlugin"
};

config.SelectTheme = {
	things: {
		style: {
			tag:        ["StyleSheets","StyleSheet","styleSheet","styleSheets","stylesheet","stylesheets"],
			theDefault: "StyleSheet",
			suffix:     "StyleSheet",
			notify:     refreshStyles,
			cookie:     "txtStyleSheet",
			otherThing: "pagetemplate",
			label:      "Choose StyleSheet: ",
			tooltip:     "Choose a StyleSheet",
			caseNone: { text:"None", title:"NoStyleSheet"},
                        caseDefault: { text:"Default", title:"StyleSheet" }

		},
		pagetemplate: {
			tag:        ["PageTemplates","PageTemplate","pageTemplates","pageTemplate","pagetemplate","pagetemplates"],
			theDefault: "PageTemplate",
			suffix:     "PageTemplate",
			notify:     refreshPageTemplate,
			cookie:     "txtPageTemplate",
			otherThing: "style",
			label: "Choose PageTemplate: ",
			tooltip:    "Choose a PageTemplate",
			caseNone: { text:"None", title:"NoPageTemplate"},
                        caseDefault: { text:"Default", title:"PageTemplate" }
		}

	},

                         specialCases: ["caseNone","caseDefault"]

};

TiddlyWiki.prototype.removeNotification = function(title,fn) {
	for (var i=0;i<this.namedNotifications.length;i++)
		if((this.namedNotifications[i].name == title) && (this.namedNotifications[i].notify == fn))
			this.namedNotifications.splice(i,1); // counting on it only being there once
}


var things = config.SelectTheme.things;
var specialCases=config.SelectTheme.specialCases;

for (var zz in things) {
	// make sure we have a value
	if (!config.options[things[zz].cookie])
		config.options[things[zz].cookie] = things[zz].theDefault;

	// remove core notify
	store.removeNotification(things[zz].theDefault,things[zz].notify);

	// and add our one
	store.addNotification(config.options[things[zz].cookie],things[zz].notify);

}

//checks to see if a tiddler exists in store or as a shadow.
TiddlyWiki.prototype.isTiddler= function (title)
        {return store.tiddlerExists(title) || store.isShadowTiddler(title)}

//hijack core function & make sure template exists
window.applyPageTemplate_themeSelect=window.applyPageTemplate;
window.applyPageTemplate=function(title){
           if(!store.isTiddler(title))
                       {title = things.pagetemplate.theDefault;}
           applyPageTemplate_themeSelect(title);
 }

TiddlyWiki.prototype.makeActiveTheme = function(what,title,alsoCheckOtherThing) {

	var thing = things[what];
        if (!store.isTiddler(title))
		title = thing.theDefault;

	var oldTitle = config.options[thing.cookie];

	if (what == "style") {
		// remove old style element from DOM
		var oldStyleElement = document.getElementById(oldTitle);
		if (oldStyleElement) oldStyleElement.parentNode.removeChild(oldStyleElement);
	}

	store.removeNotification(oldTitle,thing.notify);
	store.addNotification(title,thing.notify);
	store.notify(title);

	config.options[thing.cookie] = title;
	saveOptionCookie(thing.cookie);
	if (alsoCheckOtherThing)
		this.makeActiveTheme(thing.otherThing,
				title.replace(new RegExp(thing.suffix+"$"),"") + things[thing.otherThing].suffix,
						false);
};

if (config.hoverMenu)
    {
    old_hovermenu_makeActiveTheme = TiddlyWiki.prototype.makeActiveTheme;
    TiddlyWiki.prototype.makeActiveTheme = function(what,title,alsoCheckOtherThing)
        {
         old_hovermenu_makeActiveTheme.apply(this,arguments);
         if (!alsoCheckOtherThing)
                    config.hoverMenu.handler();
        };
    }

config.shadowTiddlers.NoStyleSheet = config.shadowTiddlers.StyleSheet;
config.shadowTiddlers.NoPageTemplate = config.shadowTiddlers.PageTemplate;


function switchTheme(e){
         if (!e) var e = window.event;
         var theTarget = resolveTarget(e);
         var theLink = theTarget;
         var switchTo= theLink.getAttribute("switchTo");
         var mode = theLink.getAttribute("mode");
         if ((config.options[things[mode].cookie])!=switchTo)
               {store.makeActiveTheme(mode,switchTo,true);};
         return(false);
}


config.macros.themeSelect={};
config.macros.themeSelect.dropdownchar = (document.all?"▼":"▾");
config.macros.themeSelect.handler = function(place,macroName,params,wikifier,paramString,tiddler){
         var arrow = config.macros.themeSelect.dropdownchar;
         var mode = params[0];
         var label = (params[1]?params[1]:things[mode].label) + arrow;
         var cookie = (config.options[things[mode].cookie]);

         var onclick = function(e)
             { if (!e) var e = window.event;
             var popup = Popup.create(this);

             var tagged=[];

	     store.forEachTiddler(function(title,tiddler) {
                  if ((tiddler.tags).containsAny(things[mode].tag)){
					tagged.push(tiddler.title);}
	     });

             //integrate ThemePacks
	     if (config.themes) {
		     // see what themes have been loaded...
		     for (var i=0;i<config.themes.length;i++) {
			    // see if there is one
			    var lookForThis = config.themes[i] + things[mode].suffix;
			    if (store.isShadowTiddler(lookForThis)) {
				   tagged.pushUnique(lookForThis);
			    }
		    }
		     tagged = tagged.sort();
             }

             //this function used later to create buttons
             var createThemeButton = function(switchTo){
                        var theButton = createTiddlyButton(createTiddlyElement(popup,"li"),text,null,switchTheme,useClass);
                        theButton.setAttribute("switchTo",switchTo);
                        theButton.setAttribute("mode",mode);};

            //create Buttons for None(shadow styles) & Default (StyleSheet)
                     // Default button is not created if StyleSheet doesnt exist.
             for(var t=0; t<specialCases.length; t++){
             var special = specialCases[t];
             var text = things[mode][special].text;
             var useClass = "tiddlyLinkExisting";   //redundant, optimize!
             if ((things[mode][special].title==cookie)||(special=="caseNone"&&!store.isTiddler(cookie)))
                      {text+= " [x]";
                      useClass = "currentlySelected";}
             if (!((special=="caseDefault")&&(!store.getTiddler(things[mode][special].title))))
             createThemeButton(things[mode][special].title);     }

             //insert horizontal rule
             //createTiddlyElement(createTiddlyElement(popup,"li"),"hr");
             createTiddlyElement(createTiddlyElement(popup,"li",null,"listBreak"),"div");

             //create buttons for all other stylesheet tiddlers
             for(var t=0; t<tagged.length; t++)
                     { var useClass = "tiddlyLinkExisting";
                       var text = (tagged[t]).replace((things[mode].suffix),"");
                     if (tagged[t]==(cookie) )
                           {text+=" [x]"; useClass="currentlySelected";}
                     if ((tagged[t]!= (things[mode].theDefault))&&tagged[t]!= (things[mode].none))
                        {createThemeButton(tagged[t]);}}
             Popup.show(popup,false);
             e.cancelBubble = true;
             if (e.stopPropagation)
                e.stopPropagation();
             return(false);
             };

        var createdropperButton = function(place){
           var sp = createTiddlyElement(place,"span",null,"ThemeChooserButton");
           var theDropDownBtn = createTiddlyButton(sp,label,things[mode].tooltip,onclick);
        };

        createdropperButton(place);
};


setStylesheet(".popup li a.currentlySelected {background:#ccc;color:black;font-weight:bold;}","currentlySelectedStyle"); // could do better probably...

config.macros.layoutChooser=config.macros.themeSelect;

//shadow tiddler to hold instructions for creating ThemePacks
config.shadowTiddlers.ThemePack='See http://simonbaird.com/mptw/#CreateThemePack'; 

config.macros.applyTheme = {handler: function (place,macroName,params,wikifier,paramString,tiddler) {
	var theme = params[0];
	var label = params[1]?params[1]:'Apply theme "' + theme + '"';
        var tooltip = 'Apply the "'+theme+'" theme to this TiddlyWiki';
	createTiddlyButton(place,label,tooltip,function() {
		store.makeActiveTheme("style",theme+things.style.suffix,true);
	});
}};


// this means you can put #theme:ThemeName in url. suggested by Clint
config.paramifiers.theme = {
	onstart: function(themeName) {
		store.makeActiveTheme("style",themeName+config.SelectTheme.things.style.suffix,true);
	}
};

//}}}

<<slider chkOptionsPanel01 [[SideBarOptions##Panel01]] 'Sidebar Panel' 'Sidebar Menu'>><<slider chkOptionsPanel02 [[SideBarOptions##Panel02]] 'Mangement' 'Mangement'>><<slider chkOptionsPanel03 [[SideBarOptions##Panel03]] 'Control Panel' 'Control Panel'>>
/%
!OptionPanels
!Panel01
<<search>>
<<closeAll>>
<<permaview>>
<<newTiddler>>
<<newJournal YYYY0MM0DD>>
<<saveChanges>>
<<slider chkSliderOptionsPanel OptionsPanel "options  »" "Change TiddlyWiki advanced options">>
!Panel02
[[Import Tiddlers|ImportTiddlers]]
[[Plugin Manager|PluginManager]]
[[Exterl js|Plugins - external .js files]]
!Panel03
<<tabs txtLookAndFeel
 'Configs' 'Configurations of Site' [[SideBarOptions##Panel03_01]]
 Menus 'Main menu、Side Bars' [[SideBarOptions##Panel03_02]]
 Stytles 'Stylesheets、Switch themes' [[SideBarOptions##Panel03_03]]
 >>
!!Panel03_01
SiteTitle
SiteSubtitle
DefaultTiddlers
SiteUrl
!!Panel03_02
MainMenu
SideBarOptions
SideBarTabs
!!Panel03_03
StyleSheet
StyleSheetColors
StyleSheetLayout
StyleSheetPrint
ColorPalette
<<themeSelect style>>
!End of Sections
%/

<<tCalendar lastModified>>

|~ViewToolbar|closeTiddler closeOthers +editTiddler > fields syncing permalink references jump <|
|~EditToolbar|+saveTiddler -cancelTiddler deleteTiddler|