<!--{{{-->
<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>
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
<div class='headerForeground'>
<span class='siteTitle' refresh='content' tiddler='SiteTitle'></span>
<span class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></span>
</div>
</div>
<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>>
/***
| Name:|Clock2|
| Author:|Simon Baird|
| Description:|A skinnable, sizeable analog clock|
| Source:|http://tiddlyspot.com/mptw/#Clock2|
| Requires:|Firefox 1.5.x or maybe Safari|
| Version:|1.0.6|
| Date:|8-Jul-2008|
!!Note
* Does not work in IE or Opera due to lack of canvas support.
* If you make a nice skin send it to me and I will include it here.
*I'm not actively maintaining this plugin
* See also http://randomibis.com/coolclock/
!!Ideas
* Can we support IE with this? http://sourceforge.net/projects/excanvas
* Skin should specify order of drawing so things can be on top of other things
* Fix it so we can have filled and/or stroked elements
* Skin should allow any number of moving and static elements
* Make download and example for non-TW use
* Make floating draggable?
!!Examples
{{{
<<clock2 fancy>><<clock2 120>>
<<clock2 chunkySwiss>> <<clock2 60 chunkySwiss noSeconds>><<clock2 '{
outerBorder: { lineWidth: 60, radius:55, color: "#dd8877", alpha: 1 },
smallIndicator: { lineWidth: 4, startAt: 80, endAt: 95, color: "white", alpha: 1 },
largeIndicator: { lineWidth: 12, startAt: 77, endAt: 89, color: "#dd8877", alpha: 1 },
hourHand: { lineWidth: 15, startAt: -15, endAt: 50, color: "white", alpha: 1 },
minuteHand: { lineWidth: 10, startAt: 24, endAt: 200, color: "#771100", alpha: 0.6 },
secondHand: { lineWidth: 3, startAt: 22, endAt: 83, color: "green", alpha: 0 },
secondDecoration: { lineWidth: 1, startAt: 52, radius: 26, fillColor: "white", color: "red", alpha: 0.2 }
}'>>
}}}
<<clock2 fancy>><<clock2 120>>
<<clock2 chunkySwiss>> <<clock2 60 chunkySwiss noSeconds>><<clock2 '{
outerBorder: { lineWidth: 60, radius:55, color: "#dd8877", alpha: 1 },
smallIndicator: { lineWidth: 4, startAt: 80, endAt: 95, color: "white", alpha: 1 },
largeIndicator: { lineWidth: 12, startAt: 77, endAt: 89, color: "#dd8877", alpha: 1 },
hourHand: { lineWidth: 15, startAt: -15, endAt: 50, color: "white", alpha: 1 },
minuteHand: { lineWidth: 10, startAt: 24, endAt: 200, color: "#771100", alpha: 0.6 },
secondHand: { lineWidth: 3, startAt: 22, endAt: 83, color: "green", alpha: 0 },
secondDecoration: { lineWidth: 1, startAt: 52, radius: 26, fillColor: "white", color: "red", alpha: 0.2 }
}'>>
See also BigClock.
!!Code
***/
//{{{
window.CoolClock = function(canvasId,displayRadius,skinId,showSecondHand) {
return this.init(canvasId,displayRadius,skinId,showSecondHand);
}
CoolClock.config = {
clockTracker: {},
tickDelay: 1000,
longTickDelay: 15000,
defaultRadius: 85,
renderRadius: 100,
defaultSkin: "swissRail",
skins: {
// try making your own...
swissRail: {
outerBorder: { lineWidth: 1, radius:95, color: "black", alpha: 1 },
smallIndicator: { lineWidth: 2, startAt: 89, endAt: 93, color: "black", alpha: 1 },
largeIndicator: { lineWidth: 4, startAt: 80, endAt: 93, color: "black", alpha: 1 },
hourHand: { lineWidth: 8, startAt: -15, endAt: 50, color: "black", alpha: 1 },
minuteHand: { lineWidth: 7, startAt: -15, endAt: 75, color: "black", alpha: 1 },
secondHand: { lineWidth: 1, startAt: -20, endAt: 85, color: "red", alpha: 1 },
secondDecoration: { lineWidth: 1, startAt: 70, radius: 4, fillColor: "red", color: "red", alpha: 1 }
},
chunkySwiss: {
outerBorder: { lineWidth: 5, radius:97, color: "black", alpha: 1 },
smallIndicator: { lineWidth: 4, startAt: 89, endAt: 93, color: "black", alpha: 1 },
largeIndicator: { lineWidth: 8, startAt: 80, endAt: 93, color: "black", alpha: 1 },
hourHand: { lineWidth: 12, startAt: -15, endAt: 60, color: "black", alpha: 1 },
minuteHand: { lineWidth: 10, startAt: -15, endAt: 85, color: "black", alpha: 1 },
secondHand: { lineWidth: 4, startAt: -20, endAt: 85, color: "red", alpha: 1 },
secondDecoration: { lineWidth: 2, startAt: 70, radius: 8, fillColor: "red", color: "red", alpha: 1 }
},
fancy: {
outerBorder: { lineWidth: 5, radius:95, color: "green", alpha: 0.7 },
smallIndicator: { lineWidth: 1, startAt: 80, endAt: 93, color: "black", alpha: 0.4 },
largeIndicator: { lineWidth: 1, startAt: 30, endAt: 93, color: "black", alpha: 0.5 },
hourHand: { lineWidth: 8, startAt: -15, endAt: 50, color: "blue", alpha: 0.7 },
minuteHand: { lineWidth: 7, startAt: -15, endAt: 92, color: "red", alpha: 0.7 },
secondHand: { lineWidth: 10, startAt: 80, endAt: 85, color: "blue", alpha: 0.3 },
secondDecoration: { lineWidth: 1, startAt: 30, radius: 50, fillColor: "blue", color: "red", alpha: 0.15 }
}
}
};
CoolClock.prototype = {
init: function(canvasId,displayRadius,skinId,showSecondHand) {
this.canvasId = canvasId;
this.displayRadius = displayRadius || CoolClock.config.defaultRadius;
this.skinId = skinId || CoolClock.config.defaultSkin;
this.showSecondHand = typeof showSecondHand == "boolean" ? showSecondHand : true;
this.tickDelay = CoolClock.config[ this.showSecondHand ? "tickDelay" : "longTickDelay"];
this.canvas = document.getElementById(canvasId);
this.canvas.setAttribute("width",this.displayRadius*2);
this.canvas.setAttribute("height",this.displayRadius*2);
this.renderRadius = CoolClock.config.renderRadius;
var scale = this.displayRadius / this.renderRadius;
this.ctx = this.canvas.getContext("2d");
this.ctx.scale(scale,scale);
CoolClock.config.clockTracker[canvasId] = this;
this.tick();
return this;
},
fullCircle: function(skin) {
this.fullCircleAt(this.renderRadius,this.renderRadius,skin);
},
fullCircleAt: function(x,y,skin) {
with (this.ctx) {
save();
globalAlpha = skin.alpha;
lineWidth = skin.lineWidth;
if (!document.all)
beginPath();
arc(x, y, skin.radius, 0, 2*Math.PI, false);
if (skin.fillColor) {
fillStyle = skin.fillColor
fill();
}
else {
// XXX why not stroke and fill
strokeStyle = skin.color;
stroke();
}
restore();
}
},
radialLineAtAngle: function(angleFraction,skin) {
with (this.ctx) {
save();
translate(this.renderRadius,this.renderRadius);
rotate(Math.PI * (2 * angleFraction - 0.5));
globalAlpha = skin.alpha;
strokeStyle = skin.color;
lineWidth = skin.lineWidth;
if (skin.radius) {
this.fullCircleAt(skin.startAt,0,skin)
}
else {
beginPath();
moveTo(skin.startAt,0)
lineTo(skin.endAt,0);
stroke();
}
restore();
}
},
render: function(hour,min,sec) {
var skin = CoolClock.config.skins[this.skinId];
this.ctx.clearRect(0,0,this.renderRadius*2,this.renderRadius*2);
this.fullCircle(skin.outerBorder);
for (var i=0;i<60;i++)
this.radialLineAtAngle(i/60,skin[ i%5 ? "smallIndicator" : "largeIndicator"]);
this.radialLineAtAngle((hour+min/60)/12,skin.hourHand);
this.radialLineAtAngle((min+sec/60)/60,skin.minuteHand);
if (this.showSecondHand) {
this.radialLineAtAngle(sec/60,skin.secondHand);
this.radialLineAtAngle(sec/60,skin.secondDecoration);
}
},
nextTick: function() {
setTimeout("CoolClock.config.clockTracker['"+this.canvasId+"'].tick()",this.tickDelay);
},
stillHere: function() {
return document.getElementById(this.canvasId) != null;
},
refreshDisplay: function() {
var now = new Date();
this.render(now.getHours(),now.getMinutes(),now.getSeconds());
},
tick: function() {
if (this.stillHere()) {
this.refreshDisplay()
this.nextTick();
}
}
}
config.macros.clock2 = {
counter: 0,
handler: function (place,macroName,params,wikifier,paramString,tiddler) {
var size,skin,seconds,skinData;
for (var i=0;i<params.length;i++)
if (/^\d+$/.exec(params[i]))
size = params[i];
else if (params[i] == "noSeconds")
seconds = false;
else if (/^\{/.exec(params[i]))
eval("skinData = " + params[i]);
else
skin = params[i];
if (skinData) {
CoolClock.config.skins.customSkin = skinData;
skin = "customSkin";
}
var canvas = createTiddlyElement(place,"canvas","clockcanvas"+this.counter);
var clock = new CoolClock("clockcanvas"+this.counter,size,skin,seconds);
this.counter++;
}
}
//}}}
[[The time?]] [[Minesweeper?]]
[[What's next]]
/***
|''Name:''|Minesweeper|
|''Version:''|0.72 (12 Oct 2005)|
|''Source:''|Tiddly W;nks (http://www.bur.st/~blazeoz/tiddlywinks/)|
|''Author:''|[[Daniel Baird]]|
|''Type:''|Macro|
!Description
It's minesweeper!
!Syntax/Example usage
{{{<<minesweeper>>}}} or {{{<<minesweeper [width] [height] [bombs]>>}}}
<<minesweeper>>
!Notes
* Let me know if you want graphics, or that MSWindows Minesweeper thing where you can click with both buttons on a numbered square, and it does the thinking for you..
!Revision History
* 0.5.0 (2-Oct-05)
** original version (Daniel)
* 0.5.1 (3-Oct-05)
** added the css styles via set~StyleSheet (Simon)
* 0.5.2 (3-Oct-05)
** added parameters to macro and fixed bug preventing detection of win (Simon)
* 0.6 (5-Oct-05)
** Fixed the problem with multiple games on screen at once.
** Cleaned up the JavaScript warning generated when you clicked anywhere but on a square.
* 0.7 (6-Oct-05)
** Integrated sweet additions from Genesis_mage (genisis329 at gmail dot com) that:
*** allows winning by having all non-mines clicked (without having to mark every mine)
*** added a mark button to mark and unmark mines without the keyboard
** Win time now shows tenths of a second.
* 0.71 (10-Oct-05)
** tweaked a style to make the mark button work better in IE
* 0.72 (12-Oct-05)
** worked out how to use a closure as a event handler, which means that the code added in 0.6 could be made a lot simpler.
***/
/*{{{*/
version.extensions.minesweeper = {major: 0, minor: 7, revision: 2};
config.macros.minesweeper = {};
config.macros.minesweeper.handler = function(place,macroName,params) {
var width = params[0];
var height = params[1];
var bombs = params[2];
if (width == undefined) width = 9;
if (height == undefined) height = width;
if (bombs == undefined) bombs = Math.round(width * height / 8)
if (bombs > width * height) bombs = width * height;
var aGame = new MinesweeperGame();
createTiddlyElement(place,'div',aGame.id,null,'If you see this, Minesweeper is broken. Let Daniel know (DanielBaird at gmail dot com).');
aGame.newGame(width, height, bombs);
}
// =======================================================================
function MinesweeperGame() {
this.idprefix = 'mines';
this.version = '0.72 beta';
this.id = this.idprefix + MinesweeperGame.prototype.nextid;
MinesweeperGame.prototype.nextid++;
return this;
}
// -----------------------------------------------------------------------
MinesweeperGame.prototype.nextid = 0;
// -----------------------------------------------------------------------
MinesweeperGame.prototype.newGame = function(height, width, mines) {
this.height = height;
this.width = width;
this.mines = mines;
this.total = height * width;
this.markMode = false;
this.startGame();
}
// -----------------------------------------------------------------------
MinesweeperGame.prototype.startGame = function() {
this.gamestate = 'ready';
this.clicks = 0;
this.marks = 0;
this.message = 'click on the board to begin';
this.starttime = null;
this.wintime = null;
this.board = new Array();
// create the squares
for (var x = 0; x < this.height; x++) {
var row = new Array();
for (var y = 0; y < this.width; y++) {
row.push( {count: 0, mine: false, clicked: false, marked: false} );
}
this.board.push(row);
}
// add mines
for (var m = 0; m < this.mines; m++) {
var mx = Math.round((this.height-1)*Math.random());
var my = Math.round((this.width-1)*Math.random());
if (this.board[mx][my].mine) {
m--;
} else {
this.board[mx][my].mine = true;
}
}
// work out counts
for (var cx = 0; cx < this.height; cx++) {
for (var cy = 0; cy < this.width; cy++) {
var count = 0;
for (var dx = -1; dx < 2; dx++) {
for (var dy = -1; dy < 2; dy++) {
var nx = cx + dx;
var ny = cy + dy;
if ( (!(dx==0 && dy==0))
&& (nx >= 0) && (nx < this.height)
&& (ny >= 0) && (ny < this.width)
&& this.board[nx][ny].mine) {
count++;
}
}
}
this.board[cx][cy].count = count;
}
}
this.showBoard();
}
// -----------------------------------------------------------------------
MinesweeperGame.prototype.showBoard = function() {
var node = document.getElementById(this.id);
var html = new Array();
html.push('<table class="minefield" cellspacing="2">');
html.push('<tr><td class="info" colspan="'+this.width+'">');
html.push('Minesweeper '+this.version+'<br /><b>'+this.gamestate+'</b>');
if (this.gamestate == 'playing') {
this.message = (this.mines - this.marks)+' mines unmarked';
}
html.push('</td></tr>');
for (var x = 0; x < this.height; x++) {
html.push('<tr>');
for (var y = 0; y < this.width; y++) {
html.push( this.makeSquare(x,y) );
}
html.push('</tr>');
}
var cls = 'un';
if (this.markMode) cls = '';
html.push('<tr><td id="'+this.id+'_markbtn" class="'+cls+'clicked widebtn" colspan="'+this.width+'">mark / unmark mines</td></tr>');
html.push('<tr><td class="info" colspan="'+this.width+'">'+this.message);
html.push('<small>');
html.push('<br /><span class="minesweeper' + cls + 'show">ctrl- shift- or alt-</span>click to reveal a square');
html.push('<br /><span class="minesweeper' + cls + 'hide">ctrl- shift- or alt-</span>click to mark a mine');
html.push('</small>');
html.push('</td></tr>');
html.push('</table>');
node.innerHTML = html.join('');
node.onclick = this.getClickHandler();
}
// -----------------------------------------------------------------------
MinesweeperGame.prototype.makeSquare = function(x,y) {
var sq = this.board[x][y];
var reveal = (this.gamestate != 'playing' && this.gamestate != 'ready');
var html = new Array();
if (sq.clicked) {
html.push('<td class="clicked" id="'+this.id+'_x-'+x+'_y-'+y+'">');
if (!sq.marked && reveal && sq.mine) {
html.push('B!');
} else if (!sq.marked && reveal && sq.mine) {
html.push('B!');
} else if (sq.count > 0){
html.push(sq.count);
} else {
html.push(' ');
}
} else {
html.push('<td class="unclicked" id="'+this.id+'_x-'+x+'_y-'+y+'">');
if (sq.marked && !reveal) {
html.push('B?');
} else if (sq.marked && sq.mine && reveal) {
html.push('B');
} else if (sq.marked && !sq.mine && reveal) {
html.push('X');
} else if (sq.mine && reveal) {
html.push('B!');
} else {
html.push(' ');
}
}
html.push('</td>');
return html.join('');
}
// -------------------------------------------------------------------
MinesweeperGame.prototype.clickSquare = function(cx,cy,modifier) {
if (this.gamestate == 'ready') {
this.starttime = new Date();
this.gamestate = 'playing';
}
if (this.gamestate == 'playing') {
if (!this.board[cx][cy].clicked) {
if ( (modifier && !this.markMode) || (!modifier && this.markMode) ) {
if (this.board[cx][cy].marked) {
this.marks--;
this.board[cx][cy].marked = false;
} else {
this.marks++;
this.board[cx][cy].marked = true;
}
} else if (!this.board[cx][cy].clicked && !this.board[cx][cy].marked) {
this.revealSquare(cx,cy);
}
this.markMode = false;
}
this.checkWin();
this.showBoard();
} else {
// clicked when we're not playing..
this.startGame();
}
}
// -------------------------------------------------------------------
MinesweeperGame.prototype.revealSquare = function(x,y) {
if (this.board[x][y].clicked == false && this.board[x][y].marked == false) {
this.board[x][y].clicked = true;
this.clicks++;
if (this.board[x][y].mine) {
this.gamestate = 'boom!';
this.message = 'click board to play again';
} else if (this.board[x][y].count == 0) {
// if it's a zero, we might have to reveal some other squares..
for (var dx = -1; dx < 2; dx++) {
for (var dy = -1; dy < 2; dy++) {
var nx = x + dx;
var ny = y + dy;
if ( (!(dx==0 && dy==0)) && (nx >= 0) && (nx < this.height) && (ny >= 0) && (ny < this.width) ) {
this.revealSquare(nx,ny);
}
}
}
}
}
}
// -------------------------------------------------------------------
MinesweeperGame.prototype.handleClick = function(e) {
// work out which cell was clicked
if (!e) var e = window.event;
var str = resolveTarget(e).id;
if (str && str != undefined) {
if (str == this.id + '_markbtn') {
this.markMode = !this.markMode;
this.showBoard();
} else {
var cx = parseInt(str.substr( str.indexOf('x-')+2 ));
var cy = parseInt(str.substr( str.indexOf('y-')+2 ));
if ( !isNaN(cx) && !isNaN(cy) ) {
this.clickSquare(cx,cy,(e.altKey || e.shiftKey || e.ctrlKey));
}
}
}
}
// -------------------------------------------------------------------
MinesweeperGame.prototype.getClickHandler = function() {
var thisGame = this;
return function(e) {
thisGame.handleClick(e);
}
}
// -------------------------------------------------------------------
MinesweeperGame.prototype.checkWin = function() {
if (this.clicks == this.total - this.mines && this.gamestate !='boom!') {
this.gamestate = 'win';
this.wintime = new Date();
this.message = 'You won in '+Math.round(((this.wintime - this.starttime)/100))/10+' seconds';
this.message = this.message + '<br />click board to play again';
}
}
// -----------------------------------------------------------------------
setStylesheet(
".viewer .minefield { "+
"background: #ddd; "+
"border: double 3px black; "+
"border-collapse: separate; "+
"border-spacing: 2px; "+
"} \n"+
".viewer .minefield td { "+
"cursor: default; "+
"width: 1.3em; "+
"height: 1.1em; "+
"text-align: center; "+
"vertical-align: center; "+
"background: #ddd; "+
"border: 1px solid #ccc; "+
"} \n"+
".viewer .minefield td.info, .viewer .minefield td.widebtn { "+
"width: auto; "+
"} \n"+
".minesweeperhide, .minesweeperunshow { "+
"display: none; "+
"} \n"+
".viewer .minefield td.unclicked { "+
"cursor: pointer; "+
"border-color: #fff; "+
"border-right-color: #999; "+
"border-bottom-color: #999; "+
"} \n"+
"",
"MinesweeperGame");
/*}}}*/
<<minesweeper>>
<div class='header'> <div class='titleLine'> <div class='siteTitle' refresh='content' tiddler='SiteTitle'></div> <div class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></div> </div> <div class='headerLine'></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>
/***
|''Name''|SimpleSearchPlugin|
|''Description''|displays search results as a simple list of matching tiddlers|
|''Authors''|FND|
|''Version''|0.4.1|
|''Status''|stable|
|''Source''|http://devpad.tiddlyspot.com/#SimpleSearchPlugin|
|''CodeRepository''|http://svn.tiddlywiki.org/Trunk/contributors/FND/plugins/SimpleSearchPlugin.js|
|''License''|[[Creative Commons Attribution-ShareAlike 3.0 License|http://creativecommons.org/licenses/by-sa/3.0/]]|
|''Keywords''|search|
!Revision History
!!v0.2.0 (2008-08-18)
* initial release
!!v0.3.0 (2008-08-19)
* added Open All button (renders Classic Search option obsolete)
* sorting by relevance (title matches before content matches)
!!v0.4.0 (2008-08-26)
* added tag matching
!To Do
* tag matching optional
* animations for container creation and removal
* when clicking on search results, do not scroll to the respective tiddler (optional)
* use template for search results
!Code
***/
//{{{
if(!version.extensions.SimpleSearchPlugin) { //# ensure that the plugin is only installed once
version.extensions.SimpleSearchPlugin = { installed: true };
if(!config.extensions) { config.extensions = {}; }
config.extensions.SimpleSearchPlugin = {
heading: "Search Results",
containerId: "searchResults",
btnCloseLabel: "close",
btnCloseTooltip: "dismiss search results",
btnCloseId: "search_close",
btnOpenLabel: "Open all",
btnOpenTooltip: "open all search results",
btnOpenId: "search_open",
displayResults: function(matches, query) {
story.refreshAllTiddlers(true); // update highlighting within story tiddlers
var el = document.getElementById(this.containerId);
query = '"""' + query + '"""'; // prevent WikiLinks
if(el) {
removeChildren(el);
} else { //# fallback: use displayArea as parent
var container = document.getElementById("displayArea");
el = document.createElement("div");
el.id = this.containerId;
el = container.insertBefore(el, container.firstChild);
}
var msg = "!" + this.heading + "\n";
if(matches.length > 0) {
msg += "''" + config.macros.search.successMsg.format([matches.length.toString(), query]) + ":''\n";
this.results = [];
for(var i = 0 ; i < matches.length; i++) {
this.results.push(matches[i].title);
msg += "* [[" + matches[i].title + "]]\n";
}
} else {
msg += "''" + config.macros.search.failureMsg.format([query]) + "''"; // XXX: do not use bold here!?
}
createTiddlyButton(el, this.btnCloseLabel, this.btnCloseTooltip, config.extensions.SimpleSearchPlugin.closeResults, "button", this.btnCloseId);
wikify(msg, el);
if(matches.length > 0) { // XXX: redundant!?
createTiddlyButton(el, this.btnOpenLabel, this.btnOpenTooltip, config.extensions.SimpleSearchPlugin.openAll, "button", this.btnOpenId);
}
},
closeResults: function() {
var el = document.getElementById(config.extensions.SimpleSearchPlugin.containerId);
removeNode(el);
config.extensions.SimpleSearchPlugin.results = null;
highlightHack = null;
},
openAll: function(ev) {
story.displayTiddlers(null, config.extensions.SimpleSearchPlugin.results);
return false;
}
};
config.shadowTiddlers.StyleSheetSimpleSearch = "/*{{{*/\n" +
"#" + config.extensions.SimpleSearchPlugin.containerId + " {\n" +
"\toverflow: auto;\n" +
"\tpadding: 5px 1em 10px;\n" +
"\tbackground-color: [[ColorPalette::TertiaryPale]];\n" +
"}\n\n" +
"#" + config.extensions.SimpleSearchPlugin.containerId + " h1 {\n" +
"\tmargin-top: 0;\n" +
"\tborder: none;\n" +
"}\n\n" +
"#" + config.extensions.SimpleSearchPlugin.containerId + " ul {\n" +
"\tmargin: 0.5em;\n" +
"\tpadding-left: 1.5em;\n" +
"}\n\n" +
"#" + config.extensions.SimpleSearchPlugin.containerId + " .button {\n" +
"\tdisplay: block;\n" +
"\tborder-color: [[ColorPalette::TertiaryDark]];\n" +
"\tpadding: 5px;\n" +
"\tbackground-color: [[ColorPalette::TertiaryLight]];\n" +
"}\n\n" +
"#" + config.extensions.SimpleSearchPlugin.containerId + " .button:hover {\n" +
"\tborder-color: [[ColorPalette::SecondaryMid]];\n" +
"\tbackground-color: [[ColorPalette::SecondaryLight]];\n" +
"}\n\n" +
"#" + config.extensions.SimpleSearchPlugin.btnCloseId + " {\n" +
"\tfloat: right;\n" +
"\tmargin: -5px -1em 5px 5px;\n" +
"}\n\n" +
"#" + config.extensions.SimpleSearchPlugin.btnOpenId + " {\n" +
"\tfloat: left;\n" +
"\tmargin-top: 5px;\n" +
"}\n" +
"/*}}}*/";
store.addNotification("StyleSheetSimpleSearch", refreshStyles);
// override Story.search()
Story.prototype.search = function(text, useCaseSensitive, useRegExp) {
highlightHack = new RegExp(useRegExp ? text : text.escapeRegExp(), useCaseSensitive ? "mg" : "img");
var matches = store.search(highlightHack, null, "excludeSearch");
var q = useRegExp ? "/" : "'";
config.extensions.SimpleSearchPlugin.displayResults(matches, q + text + q);
};
// override TiddlyWiki.search() to sort by relevance
TiddlyWiki.prototype.search = function(searchRegExp, sortField, excludeTag, match) {
var candidates = this.reverseLookup("tags", excludeTag, !!match);
var primary = [];
var secondary = [];
var tertiary = [];
for(var t = 0; t < candidates.length; t++) {
if(candidates[t].title.search(searchRegExp) != -1) {
primary.push(candidates[t]);
} else if(candidates[t].tags.join(" ").search(searchRegExp) != -1) {
secondary.push(candidates[t]);
} else if(candidates[t].text.search(searchRegExp) != -1) {
tertiary.push(candidates[t]);
}
}
var results = primary.concat(secondary).concat(tertiary);
if(sortField) {
results.sort(function(a, b) {
return a[sortField] < b[sortField] ? -1 : (a[sortField] == b[sortField] ? 0 : +1);
});
}
return results;
};
} //# end of "install only once"
//}}}
Wanderingidea
/***
!Zeldman
http://tiddlystyles.com/#theme:Zeldman
!Colors used by this Theme
*@@background(#f79b60):#f79b60@@
*@@background(#c51):#c51@@
*@@background(#d16400):#d16400@@
*@@background(#be540b):#be540b@@
*@@background(#b44):#b44@@
*@@background(#930):#930@@
*@@background(#922):#922@@
*@@background(#f5d7b4):#f5d7b4@@
*@@background(#cf936c):#cf936c@@
*@@background(#c5886b):#c5886b@@
*@@background(#b8764c):#b8764c@@
*@@background(#867663):#867663@@ Used for MSG Area, Tiddler Title, text, and SubTitle
*@@background(#fff):#fff@@
*@@background(#ccc):#ccc@@
*@@background(#aaa):#aaa@@
*@@background(#888):#888@@
*@@background(#666):#666@@
*@@background(#333):#333@@
*@@background(#000):#000@@
!Popup styles /% =========================================================== %/
***/
/*{{{*/
#popup {
border: 1px solid #aaa;
padding: 0;
background: #fff;
color: #f79b60;
}
#popup a{
color: #f79b60;
font-weight: normal;
}
#popup a:hover {
background: #f5d7b4;
color: #930;
}
#popup hr {border-top: solid 1px #f5d7b48;}
#popup li.disabled{color: #cf936c;}
#popup .currentlySelected,
#popup .currentlySelected:hover{
background: #f5d7b4;
}
/*}}}*/
/***
!Generic styles /% ===================================================== %/
***/
/*{{{*/
h1,h2,h3,h4,h5,h6 {
background-color: transparent;
margin: .25em 0;
}
h1 {
border-bottom: 2px dotted #ccc;
}
h2 {
border-bottom: 1px dotted #ccc;
}
a{
color: #f79b60;
color: #c51;
}
a.button:active,
a:hover{
color: #f79b60;
background: transparent;
}
a.button,
a.button:active{
border: 0;
}
/*}}}*/
/***
!Header styles /% ================================================================== %/
***/
/*{{{*/
.header{
position: static;
}
.titleLine {
height: 7.5em;
background: #c51;
border-bottom: 8px solid #b8764c;
color: #fff;
left:0;
}
.titleLine a,
.titleLine a:link,
.titleLine a:hover{
color: #fff;
}
.titleLine a:hover{
border-bottom: 2px dotted;
}
.headerLine{
padding: 0;
border-top: 5px solid #cf936c;
border-bottom: 3px solid #f5d7b4;
}
.siteTitle {
text-align: right;
font-size: 4.5em;
font-weight: bold;
padding-right: .5em;
}
.siteSubtitle {
text-align: right;
font-size: 1.5em;
font-family: georgia,times;
padding-right: 1.5em;
}
/*}}}*/
/***
!Main menu styles /% ================================================================== %/
***/
/*{{{*/
#mainMenu {
width: 12em;
margin-top: .5em;
left: .5em;
padding: 0;
border: 1px solid #f5d7b4;
color: #666
}
#mainMenu ul,
#mainMenu li{
list-style: none;
margin: 0;
padding: 0;
}
#mainMenu li strong a {
color: #fff;
background: #d16400;
}
#mainMenu li strong a:hover,#mainMenu li strong .button:hover{
color: #f5d7b4;
background: #930;
text-decoration: none;
}
/* The bold has to be a block to contain the links <a>
because inline elements can't contain blocks */
#mainMenu li strong,
#mainMenu li span{
display: block;
}
#mainMenu li a,
#mainMenu li a:link{
display: block;
width: 100%;
text-decoration: none;
padding-right: 5px;
margin-right: 0;
color: #f79b60;
border: 0;
}
#mainMenu li a:hover, #mainMenu li .button:hover{
background-color: #f5d7b4;
text-decoration: none;
}
#mainMenu a:link{
text-decoration: none;
color: #f79b60;
margin-right: 5px;
}
#mainMenu a:hover,#mainMenu .button:hover{
text-decoration: underline;
background: transparent;
color: #930;
}
/*}}}*/
/***
!Message area styles /% ================================================================== %/
***/
/*{{{*/
#messageArea {
background-color: #f5d7b4;
color: #867663;
padding: 0.5em;
border: 1px solid #ccc;
}
#messageArea a:link, #messageArea a:visited {
color: #c51;
}
#messageArea a:hover {
color: #f79b60;
}
#messageArea a:active {
color: #fff;
}
/*}}}*/
/***
!Sidebar styles /% ================================================================== %/
***/
/*{{{*/
#sidebar {
width: 14.5em;
border-bottom:1px solid #aaa;
border-left: 1px solid #aaa;
}
#sidebarOptions{
background-color: #fff;
}
#sidebarOptions a{
color: #f79b60;
background: transparent;
text-decoration: none;
border: 0;
}
#sidebarOptions a:hover{
color: #c51;
background: #fff;
text-decoration: underline;
}
#sidebarOptions .sliderPanel{
background: #f5d7b4;
margin: 0;
}
#sidebarOptions .sliderPanel a{
color: #922;
font-weight:normal;
}
#sidebarOptions .sliderPanel a:hover{
color: #b44;
background: transparent;
}
#sidebarTabs {
background-color: #fff;
}
#sidebarTabs a {
background: transparent;
}
#sidebarTabs .tabContents a:hover {
color: #922;
text-decoration: underline;
background-color: transparent;
}
.tab {
margin: 0px 1px;
border:1px solid #aaa;
border-bottom:none;
color: #922;
}
.tab:hover {
border-color: black;
text-decoration: none;
}
#sidebarTabs .tabSelected {
background: #f5d7b4;
padding: 2px 4px;
color: #922;
}
#sidebarTabs .tabUnselected {
background: #c51;
padding: 2px 4px 0px 4px;
color: #fff;
}
#sidebarTabs .tabContents {
background-color: #f5d7b4;
}
#sidebarTabs .tabContents a{
color: #922;
}
#sidebarTabs .tabContents a:hover{
color: #b44;
}
#sidebarTabs .txtMoreTab .tabSelected,
#sidebarTabs .txtMoreTab .tabSelected:hover{
background: #cf936c ;
color: #000 ;
text-decoration: none;
}
#sidebarTabs .txtMoreTab .tabUnselected,
#sidebarTabs .txtMoreTab .tabUnselected:hover{
background: #f5d7b4 ;
color: #000 ;
text-decoration: none;
}
#sidebarTabs .txtMoreTab .tabContents {
color: #fff;
background: #cf936c;
border-bottom: solid #aaa 1px;
}
/*}}}*/
/***
!Tiddler display styles /% ================================================================== %/
***/
/*{{{*/
#displayArea {
margin: 1em 15em 0em 15em;
}
.tiddler{
padding: 0;
border: 1px solid #ccc;
padding: 5px;
}
.title {
font-size: 1.5em;
color: #867663;
font-weight: bold;
}
.toolbar {
font-size: .9em;
}
.toolbar a.button{
color: #f79b60;
border: 1px solid #fff;
}
.tiddler .toolbar a.button:hover,
.tiddler .toolbar a.button:active {
color: #930;
background: #f5d7b4;
border: 1px solid #f79b60;
}
.toolbar a.button:active {
color: #666;
}
.body {
border-top:1px solid #ccc;
padding-top: 0.5em;
margin-top:0.3em;
}
/*}}}*/
/***
''Viewer styles'' /% --------------------------------------------------------------------------------------------- %/
***/
/*{{{*/
.tiddler a.button {
color: #f79b60;
}
.tiddler a.button:hover {
color: #be540b;
background: transparent;
}
.subtitle,
.viewer {
color: #867663;
}
.viewer .button{
background: transparent;
color: #888;
border: 1px solid transparent;
}
.viewer a:link, .body a:visited{
color: #be540b;
}
.viewer a:hover {
background-color: transparent;
text-decoration: underline;
}
.viewer blockquote {
border-left: 1px solid #ccc;
}
.viewer table {
border: 2px solid #333;
}
.viewer td, tr {
border: 1px solid #666;
padding: 3px;
}
.viewer hr {
border-color: #666;
color: #666;
}
.viewer pre {
border: 1px solid #aaa;
background: #f5d7b4;
color: #333;
}
.viewer code {
color: #922;
}
.selected .isTag .tagging,
.selected .tagged,
.isTag .tagging,
.tagged {
float: none;
display: inline;
border: 0;
background: transparent;
color: #f79b60;
margin: 0;
}
.tagged li, .tagging li,
.tagged ul, .tagging ul{
display: inline;
}
.tiddler .tagging .listTitle,
.tiddler .tagged .listTitle{
color: #ccc;
}
.tiddler .tagging a.button,
.tiddler .tagged a.button{
margin: 0;
padding: 0;
color: #ccc;
}
.selected .tagging .listTitle,
.selected .tagged .listTitle,
.selected .tagging a.button,
.selected .tagged a.button{
color: #333;
}
/*}}}*/
/***
''Editor styles'' /% --------------------------------------------------- %/
***/
/*{{{*/
.editor input,
.editor textarea {
border: 1px solid black;
}
.editor textarea{
font-size: .8em;
}
/*}}}*/
<<clock2 120>>