Welcome to TiddlyWiki created by Jeremy Ruston, Copyright © 2007 UnaMesa Association
<!--{{{-->
<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]];}
#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]];}
#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 0em 1em 1em; left:-1px; top:-1px;}
.headerForeground {position:absolute; padding:4.5em 0em 1em 1em; left:0px; top:0px;}
.siteTitle {font-size:3em;}
.siteSubtitle {font-size:1.2em;}
#mainMenu {position:absolute; background-color:#FCFCFC; 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:0em 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 .3em 0;}
#sidebarTabs .tabContents {width:15em; overflow:hidden;}
.wizard {padding:0.1em 1em 0em 2em;}
.wizard h1 {font-size:2em; font-weight:bold; background:none; padding:0em 0em 0em 0em; margin:0.4em 0em 0.2em 0em;}
.wizard h2 {font-size:1.2em; font-weight:bold; background:none; padding:0em 0em 0em 0em; margin:0.4em 0em 0.2em 0em;}
.wizardStep {padding:1em 1em 1em 1em;}
.wizard .button {margin:0.5em 0em 0em 0em; font-size:1.2em;}
.wizardFooter {padding:0.8em 0.4em 0.8em 0em;}
.wizardFooter .status {padding:0em 0.4em 0em 0.4em; margin-left:1em;}
.wizard .button {padding:0.1em 0.2em 0.1em 0.2em;}
#messageArea {position:fixed; top:2em; right:0em; margin:0.5em; padding:0.5em; z-index:2000; _position:absolute;}
.messageToolbar {display:block; text-align:right; padding:0.2em 0.2em 0.2em 0.2em;}
#messageArea a {text-decoration:underline;}
.tiddlerPopupButton {padding:0.2em 0.2em 0.2em 0.2em;}
.popupTiddler {position: absolute; z-index:300; padding:1em 1em 1em 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 0em;}
.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 0em 0em 0.5em;}
.tab {margin:0em 0em 0em 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 0em 14em;}
.toolbar {text-align:right; font-size:.9em;}
.tiddler {padding:1em 1em 0em 1em;}
.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:0em 0.25em; padding:0em 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 0em; font-size:.9em;}
.editorFooter .button {padding-top:0px; padding-bottom:0px;}
.fieldsetFix {border:0; padding:0; margin:1px 0px 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 0.3em 0.5em;}
#backstageToolbar {position:relative;}
#backstageArea a {font-weight:bold; margin-left:0.5em; padding:0.3em 0.5em 0.3em 0.5em;}
#backstageButton {display:none; position:absolute; z-index:175; top:0em; right:0em;}
#backstageButton a {padding:0.1em 0.4em 0.1em 0.4em; margin:0.1em 0.1em 0.1em 0.1em;}
#backstage {position:relative; width:100%; z-index:50;}
#backstagePanel {display:none; z-index:100; position:absolute; margin:0em 3em 0em 3em; padding:1em 1em 1em 1em;}
.backstagePanelFooter {padding-top:0.2em; float:right;}
.backstagePanelFooter a {padding:0.2em 0.4em 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 1em;}
/* Fixes a feature in Firefox 1.5.0.2 where print preview displays the noscript content */
noscript {display:none;}
}
/*}}}*/
<!--{{{-->
<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 closeTiddler closeOthers +editTiddler > fields syncing permalink references jump'></div>
<div class='title' macro='view title'></div>
<div class='subtitle'><span macro='view modifier link'></span>, <span macro='view modified date'></span> (<span macro='message views.wikified.createdPrompt'></span> <span macro='view created date'></span>)</div>
<div class='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 +saveTiddler -cancelTiddler deleteTiddler'></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'></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
{{{
|text in a box|
}}}
|text in a box|
and you can vary other formatting like font-size, type and color at the same time. You can use hex-codes for color rather than the color names.
{{{
|@@font-family:arial;font-size:120%;color:#D662D3; ''JLiki''@@|
}}}
|@@font-family:arial;font-size:120%;color:#D662D3; ''JLiki''@@|
The color names that you can use are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.
{{{
* Item 1
** Item 2
** Item 3
*** Item 4
}}}
* Item 1
** Item 2
**Item 3
*** Item 4
Background: #fff
Foreground: #000
PrimaryPale: #FFB90F
PrimaryLight: #00EEEE
PrimaryMid: #008B8B
PrimaryDark: #014
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #eee
TertiaryLight: #ccc
TertiaryMid: #999
TertiaryDark: #666
Error: #f88
/***
|''Name:''|CryptoFunctionsPlugin|
|''Description:''|Support for cryptographic functions|
***/
//{{{
if(!version.extensions.CryptoFunctionsPlugin) {
version.extensions.CryptoFunctionsPlugin = {installed:true};
//--
//-- Crypto functions and associated conversion routines
//--
// Crypto "namespace"
function Crypto() {}
// Convert a string to an array of big-endian 32-bit words
Crypto.strToBe32s = function(str)
{
var be = Array();
var len = Math.floor(str.length/4);
var i, j;
for(i=0, j=0; i<len; i++, j+=4) {
be[i] = ((str.charCodeAt(j)&0xff) << 24)|((str.charCodeAt(j+1)&0xff) << 16)|((str.charCodeAt(j+2)&0xff) << 8)|(str.charCodeAt(j+3)&0xff);
}
while (j<str.length) {
be[j>>2] |= (str.charCodeAt(j)&0xff)<<(24-(j*8)%32);
j++;
}
return be;
};
// Convert an array of big-endian 32-bit words to a string
Crypto.be32sToStr = function(be)
{
var str = "";
for(var i=0;i<be.length*32;i+=8)
str += String.fromCharCode((be[i>>5]>>>(24-i%32)) & 0xff);
return str;
};
// Convert an array of big-endian 32-bit words to a hex string
Crypto.be32sToHex = function(be)
{
var hex = "0123456789ABCDEF";
var str = "";
for(var i=0;i<be.length*4;i++)
str += hex.charAt((be[i>>2]>>((3-i%4)*8+4))&0xF) + hex.charAt((be[i>>2]>>((3-i%4)*8))&0xF);
return str;
};
// Return, in hex, the SHA-1 hash of a string
Crypto.hexSha1Str = function(str)
{
return Crypto.be32sToHex(Crypto.sha1Str(str));
};
// Return the SHA-1 hash of a string
Crypto.sha1Str = function(str)
{
return Crypto.sha1(Crypto.strToBe32s(str),str.length);
};
// Calculate the SHA-1 hash of an array of blen bytes of big-endian 32-bit words
Crypto.sha1 = function(x,blen)
{
// Add 32-bit integers, wrapping at 32 bits
add32 = function(a,b)
{
var lsw = (a&0xFFFF)+(b&0xFFFF);
var msw = (a>>16)+(b>>16)+(lsw>>16);
return (msw<<16)|(lsw&0xFFFF);
};
// Add five 32-bit integers, wrapping at 32 bits
add32x5 = function(a,b,c,d,e)
{
var lsw = (a&0xFFFF)+(b&0xFFFF)+(c&0xFFFF)+(d&0xFFFF)+(e&0xFFFF);
var msw = (a>>16)+(b>>16)+(c>>16)+(d>>16)+(e>>16)+(lsw>>16);
return (msw<<16)|(lsw&0xFFFF);
};
// Bitwise rotate left a 32-bit integer by 1 bit
rol32 = function(n)
{
return (n>>>31)|(n<<1);
};
var len = blen*8;
// Append padding so length in bits is 448 mod 512
x[len>>5] |= 0x80 << (24-len%32);
// Append length
x[((len+64>>9)<<4)+15] = len;
var w = Array(80);
var k1 = 0x5A827999;
var k2 = 0x6ED9EBA1;
var k3 = 0x8F1BBCDC;
var k4 = 0xCA62C1D6;
var h0 = 0x67452301;
var h1 = 0xEFCDAB89;
var h2 = 0x98BADCFE;
var h3 = 0x10325476;
var h4 = 0xC3D2E1F0;
for(var i=0;i<x.length;i+=16) {
var j,t;
var a = h0;
var b = h1;
var c = h2;
var d = h3;
var e = h4;
for(j = 0;j<16;j++) {
w[j] = x[i+j];
t = add32x5(e,(a>>>27)|(a<<5),d^(b&(c^d)),w[j],k1);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=16;j<20;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),d^(b&(c^d)),w[j],k1);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=20;j<40;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),b^c^d,w[j],k2);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=40;j<60;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),(b&c)|(d&(b|c)),w[j],k3);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
for(j=60;j<80;j++) {
w[j] = rol32(w[j-3]^w[j-8]^w[j-14]^w[j-16]);
t = add32x5(e,(a>>>27)|(a<<5),b^c^d,w[j],k4);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a = t;
}
h0 = add32(h0,a);
h1 = add32(h1,b);
h2 = add32(h2,c);
h3 = add32(h3,d);
h4 = add32(h4,e);
}
return Array(h0,h1,h2,h3,h4);
};
}
//}}}
/***
|''Name:''|DeprecatedFunctionsPlugin|
|''Description:''|Support for deprecated functions removed from core|
***/
//{{{
if(!version.extensions.DeprecatedFunctionsPlugin) {
version.extensions.DeprecatedFunctionsPlugin = {installed:true};
//--
//-- Deprecated code
//--
// @Deprecated: Use createElementAndWikify and this.termRegExp instead
config.formatterHelpers.charFormatHelper = function(w)
{
w.subWikify(createTiddlyElement(w.output,this.element),this.terminator);
};
// @Deprecated: Use enclosedTextHelper and this.lookaheadRegExp instead
config.formatterHelpers.monospacedByLineHelper = function(w)
{
var lookaheadRegExp = new RegExp(this.lookahead,"mg");
lookaheadRegExp.lastIndex = w.matchStart;
var lookaheadMatch = lookaheadRegExp.exec(w.source);
if(lookaheadMatch && lookaheadMatch.index == w.matchStart) {
var text = lookaheadMatch[1];
if(config.browser.isIE)
text = text.replace(/\n/g,"\r");
createTiddlyElement(w.output,"pre",null,null,text);
w.nextMatch = lookaheadRegExp.lastIndex;
}
};
// @Deprecated: Use <br> or <br /> instead of <<br>>
config.macros.br = {};
config.macros.br.handler = function(place)
{
createTiddlyElement(place,"br");
};
// Find an entry in an array. Returns the array index or null
// @Deprecated: Use indexOf instead
Array.prototype.find = function(item)
{
var i = this.indexOf(item);
return i == -1 ? null : i;
};
// Load a tiddler from an HTML DIV. The caller should make sure to later call Tiddler.changed()
// @Deprecated: Use store.getLoader().internalizeTiddler instead
Tiddler.prototype.loadFromDiv = function(divRef,title)
{
return store.getLoader().internalizeTiddler(store,this,title,divRef);
};
// Format the text for storage in an HTML DIV
// @Deprecated Use store.getSaver().externalizeTiddler instead.
Tiddler.prototype.saveToDiv = function()
{
return store.getSaver().externalizeTiddler(store,this);
};
// @Deprecated: Use store.allTiddlersAsHtml() instead
function allTiddlersAsHtml()
{
return store.allTiddlersAsHtml();
}
// @Deprecated: Use refreshPageTemplate instead
function applyPageTemplate(title)
{
refreshPageTemplate(title);
}
// @Deprecated: Use story.displayTiddlers instead
function displayTiddlers(srcElement,titles,template,unused1,unused2,animate,unused3)
{
story.displayTiddlers(srcElement,titles,template,animate);
}
// @Deprecated: Use story.displayTiddler instead
function displayTiddler(srcElement,title,template,unused1,unused2,animate,unused3)
{
story.displayTiddler(srcElement,title,template,animate);
}
// @Deprecated: Use functions on right hand side directly instead
var createTiddlerPopup = Popup.create;
var scrollToTiddlerPopup = Popup.show;
var hideTiddlerPopup = Popup.remove;
// @Deprecated: Use right hand side directly instead
var regexpBackSlashEn = new RegExp("\\\\n","mg");
var regexpBackSlash = new RegExp("\\\\","mg");
var regexpBackSlashEss = new RegExp("\\\\s","mg");
var regexpNewLine = new RegExp("\n","mg");
var regexpCarriageReturn = new RegExp("\r","mg");
}
//}}}
Wikis were designed to work better in Firefox. If you're using Internet Explorer and this page looks out of balance, try this:
Go to Tools/Internet Options and click on the General tab, then click on Accessibility and untick the box that says "Ignore font sizes specified on webpages" and see if that helps.
If not, this is yet another reason to upgrade to a better browser. Click on the fox, it's free.
[img[http://www3.telus.net/Jgen/images/jliki/ff_1.png][http://www.mozilla.com/en-US/firefox/]]
After you've defined your SiteTitle and SiteSubtitle, the next thing you might want to do is make a new entry.
Click on New Tiddler from the menu on the right, put in a title, write something in the box and click Done. If you click on New Journal instead, it will put today's date as the Title automatically and tag it 'Journal' so later you can call up all Journal entries.
You cannot see New Tiddler and New Journal on this wiki because you're in reader-only mode. That's why you have to download your own. You cannot collaborate on this one directly, but you can keep yours and this open at the same time and toggle back and forth.
The other thing you might want to do is change the font. TiddlyWiki is programmed with a combination of html, css, and javascript so if you don't know how to do this yourself, you have to take some things on faith.
It took me half a day to find this. There may be other methods. I am not a CSS programmer. I'm just learning.
In the right-side menu of //your// Tiddlywiki, click on More and then Shadowed. This brings up a list of TiddlyWiki parts. If you go down the list and click on the StyleSheet tiddler it will open. Click Edit and paste this code in the box.
{{{
/*{{{*/
body { font-family: sylfaen; font-size: 1.0em;}
/*}}}*/
}}}
What you can noodle with is the font type. Change 'sylfaen' to the font of your desire. And you can change the font size. Fiddle with the number before 'em'. Every time you click Done, you can see your changes.
This will set the font for the body of your wiki as well as the left-hand margin and some of the right-side.
There's an article here that explains the meaning of 'em'.
http://www.bigbaer.com/css_tutorials/css_font_size.htm
You can use % instead of 'em' by putting font-size: 110%; in the code instead, or any other % you want.
Changing text size on specific areas can be done like this.
@@font-size:120%; your text here@@
{{{
@@font-size:120%; your text here@@
}}}
If it's not a link or WikiWord (colored automatically) you can also change the color of your text.
@@font-family:verdana;font-size:105%;color:red; your text here@@
{{{
@@font-family:verdana;font-size:105%;color:red; your text here@@
}}}
Make sure there are no spaces except after the last semi-colon in your code.
If you want to change the font color for your entire wiki, it's better to put the code in your StyleSheet tiddler.
Bold
''Bold''
two apostrophes before and after (not quotations)
underline
__underline__
2 underscores on either side
italics
//italics//
2 forward slashes before and after
strikethrough
--strikethrough--
2 hyphens before and after
Superscipt
Marvin3 Shelton4 Gunnar5
Marvin^^3^^, Shelton^^4^^, Gunnar^^5^^
highlighted text
@@highlighted text@@
[[ ]] to make any word or phrase a WikiWord
!Header
!!Header
!!!Header
The more exclamation marks preceding, the smaller the text.
Horizontal Ruler
Your text here
----
Your other text here
Bulleted Lists
* Item 1
o Item 2
o Item 3
+ Item 4
* Item 1
** Item 2
** Item 3
*** Item 4
Numbered Lists
1. Item 1
1. Item 2
1. Item 3
# Item 1
## Item 2
### Item 3
|text in a box|
You can vary formatting like font-size, type and color at the same time. You can use hex-codes for color rather than the color names. For example:
@@font-family:arial;font-size:120%;color:#D662D3; ''JLiki''@@
The color names that you can use are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.
!!!''Bold''
{{{
''bold''
}}}
two apostrophes before and after (not quotations)
!!!__Underline__
{{{
__underline__
}}}
2 underscores on either side
!!!//Italics//
{{{
//italics//
}}}
2 forward slashes before and after
!!!--Strikethrough--
{{{
--strikethrough--
}}}
2 hyphens before and after
!!!Superscript
Marvin^^3^^, Shelton^^4^^, Gunnar^^5^^
{{{
Marvin^^3^^, Shelton^^4^^, Gunnar^^5^^
}}}
!!!Highlight
@@highlighted text@@
{{{
@@highlighted text@@
}}}
These are some collaborative wikis, where you can add or edit pages.
[[FamilyPedia|http://genealogy.wikia.com/wiki/Main_Page]]
[[WikiPedia Genealogy|http://en.wikipedia.org/wiki/Genealogy]]
[[Creative Gene Wiki|http://genealogy.wetpaint.com/?t=anon]]
[[Wikia|http://www.wikia.com/wiki/Genealogy]]
[[Encyclopedia of Genealogy|http://www.eogen.com/]]
[[WikiTree|http://www.wikitree.org/index.php?title=Main_Page]]
!Header
!!Header
!!!Header
{{{
!Header
!!Header
!!!Header
}}}
The more exclamation marks preceding, the smaller the text.
I thought I'd chat about TiddlyWiki for a little while and then leave you to it. But within a day it occurred to me that there are many possibilities in using a wiki for sharing family history.
The one I'm most excited about is creating wikis that you can send to your family members. This is not intended for online collaboration as most genealogy wikis are. It's simply another way to share family history with the people you choose to. They can just enjoy your efforts or add to the wiki and email it back to you. This will be something quite different from our usual charts & reports. I'll get back to that once I've covered some basics, so you can pull it all together.
If you already know CSS, you'll be zooming on ahead. If you're not acquainted, just follow the guides from the Main Menu starting with Intro. This is a very simple thing to accomplish and I'm only two steps ahead of you.
TiddlyWiki can be used for any type of journal, so the basic techniques shown here will serve for any use you want to make of it.
Your text here
----
Your other text here
{{{
Your text here
----
Your other text here
}}}
If you've made a collection of TiddlyWiki's, for whatever reason, you may find yourself wanting to move tiddlers from one to another. Without further ado, you can simply copy and paste the contents from one to a new tiddler in the other. This works fine for one but would be tedious for many.
The 'official' and more efficient way to do it is this: In the upper right corner of your wiki header it says BackStage. If you click on that a menu will appear across the top. Click on the 'Import' option and browse to the wiki you want to import from. Click Open and a list of the tiddlers at that location will appear. Tick off the ones you want and click Import. Click Done.
In the survey, one of you asked about wikis. I could tell you what I know (not much) or I could just jump in and show you. My first impulse was to make this interactive, but, alas, this is not well-built for collaboration online. MediaWiki, which is used for WikiPedia and WeRelate and such, could get us there, but it's beyond my technical capacity at the moment. Both in computer expertise and required software.
This, what you're looking at right now, is a TiddlyWiki, the single-user version of a wiki. It's an html page and readable and write-able by any browser although, they say, best in Firefox. You'll need javascript enabled. Most people already do. There are several tutorials online about how this works. Organization of one kind or another seems to be the draw. Generally, TiddlyWiki is intended as a personal journal of some kind although some people make websites with it. If you're doing anything beyond text you have to code it yourself so either you already know how or you have to learn. It's gotten quite complex with the use of CSS and various plug-ins. But for starters, there's straight text and you hardly need to know anything.
As you can see, some of the words here have two capital letters in them and they're green instead of black. These are called WikiWords. If I click on one it will start a new "tiddler" (meaning entry) with that word as the title.
I can make any word into a WikiWord and use it as a starting point to go off on a tangent. So basically wikis are about tangential thinking. How our minds actually work. And, of course, how history works which makes this an ideal vehicle for our ancestors.
I can but I don't have to write in a straight line, what a relief, and you don't have to read in a straight line. Not all WikiWords go anywhere, if I haven't written anything there. It will simply present the Title and the opportunity to write. (Not here, but in your own wiki.)
Clicking on the WikiWords is how you navigate if you don't want to read straight through. Like surfing the web. Of course, right now there's nowhere to go. This is Day One. But try clicking on any of the WikiWords here and see what happens.
If you're the writer of a TiddlyWiki you have two choices. Over to the right of the title in faint grey lettering it says "Edit". You can't see "Edit" here because this is strictly reader-mode. Either you double-click on the title or click on Edit and a box will appear for you to write in. When you're finished click Done and the text box closes leaving an entry that looks similar to this.
It's already set to Save Changes automatically and you can define a folder name for the backups in Advanced Options from the menu on the right. It goes to My Documents by default so the folder name is whatever comes after that, not the whole file path. It saves a zillion backups so maybe that's not a good idea. It can be turned off and the changes saved manually each time before exiting.
If your TiddlyWiki is used for intensive list-making you can put it on a USB key and carry it around to use on other computers. I never come across 'other computers' to use when I'm out running errands so I'll stick with my usual scrap of paper.
I have found this the most useful for recording my sleep dreams as themes often repeat but in a non-linear way. I'm going to try making a wiki here and if you'd like to read along as I learn more about how to do that, you're welcome.
/***
|''Name:''|LegacyStrikeThroughPlugin|
|''Description:''|Support for legacy (pre 2.1) strike through formatting|
|''Version:''|1.0.2|
|''Date:''|Jul 21, 2006|
|''Source:''|http://www.tiddlywiki.com/#LegacyStrikeThroughPlugin|
|''Author:''|MartinBudden (mjbudden (at) gmail (dot) com)|
|''License:''|[[BSD open source license]]|
|''CoreVersion:''|2.1.0|
***/
//{{{
// Ensure that the LegacyStrikeThrough Plugin is only installed once.
if(!version.extensions.LegacyStrikeThroughPlugin) {
version.extensions.LegacyStrikeThroughPlugin = {installed:true};
config.formatters.push(
{
name: "legacyStrikeByChar",
match: "==",
termRegExp: /(==)/mg,
element: "strike",
handler: config.formatterHelpers.createElementAndWikify
});
} //# end of "install only once"
//}}}
Linking to an image or other file assumes the file exists somewhere your readers can access it. In other words, linking to files on your own computer will only work for you. Linking to a file called 'example.txt' on my own computer would look like this:
[[example|file:///C:/Documents%20and%20Settings/JLB/My%20Documents/example.txt/]]
and be done like this:
{{{
[[example|file:///C:/Documents%20and%20Settings/JLB/My%20Documents/example.txt/]]
}}}
In other words, two square brackets followed by the file name, then | and the file path and two square brackets.
Otherwise, files have to exist at some external address.
If you have your own website, you can upload files there and link to their URL's. Your ISP probably provides you with some free webspace. You could use that to store the photos and other files you want to use in your wiki project.
If you don't want to go that route, or don't have your own server, you need to find a file-hosting service. The only site I've ever used to upload files to is <html><a href="http://www.dpbolvw.net/8998ox52x4KNNQNPOOKMLPTUTTN" target="_blank" onmouseover="window.status='http://www.box.net';return true;" onmouseout="window.status=' ';return true;">Box.net.</a>
<img src="http://www.ftjcfx.com/te105wquiom7AADACBB798CGHGGA" width="1" height="1" border="0"/></html>I think you can still get 1 GB of space there for free, and 1GB can take you a long way. Look up "free file hosting" (not to be confused with web-hosting service) and try something. I don't have enough experience with this to advise you which would be best. There are many. [[Flickr|http://www.flickr.com/]] for instance for pictures, or [[ImageShack|http://www.imageshack.us/]].
Once you have uploaded a file, it will have its own URL. Copy it into the following code to make a link from your wiki. This is an example of how I would link to an external image.
{{{
[img[http://www3.telus.net/Jgen/images/jliki/flower.jpg]]
}}}
and this is the result.
[img[http://www3.telus.net/Jgen/images/jliki/ltf_1.jpg]]
(A note on images: they will appear in your wiki at their actual size, so it's best practice to determine that before you upload them.)
Do likewise for other types of files. Upload them to your file-sharing service and create links to them. Clicking on a link will take the reader directly to the document.
[[Example|http://www3.telus.net/Jgen/images/jliki/Example.pdf]]
Having uploaded the file to my own website, the code is this:
{{{
[[Example|http://www3.telus.net/Jgen/images/jliki/Example.pdf]]
}}}
Linking to external files can have adverse effects in the long run if/when you want to move the files to another location or //have// to move them because your file-hosting service goes under. There are other ways to set yourself up from the start so you don't run into these problems.
* create a [[Passage Express|http://www.thefamilyhistorystore.com/product_info.php?ref=143&products_id=1168&affiliate_banner_id=1]] project using a wiki
* allow others to view your wiki through an FTP server
* build your wiki on a flash-drive
I've written about these options in more detail at [[Serving It Up|http://www3.telus.net/Jgen/2008-01-23-serving_it_up.shtml]].
@@font-family:verdana;font-size:75%;
[[JGEN|http://www3.telus.net/Jgen/index.html]]
[[JLog|http://www3.telus.net/Jgen/jlog.html]]
[[Email|mailto: jgen@telus.net]]
[img[http://www3.telus.net/Jgen/images/ad-lft12.gif][http://www.legacyfamilytreestore.com/?Click=1054]]
[[Hi]]
[[Intro]]
[[Step 1]]
[[Fonts]]
[[Formatting Text]]
[[Headers]]
[[Horizontal Ruler]]
[[Your Main Menu]]
[[Preformatting]]
[[Bulleted Lists]]
[[Numbered Lists]]
[[Boxed Text]]
[[Wiki Colors]]
[[Website Links]]
[[Linking to Files]]
[[Firefox]]
[[Tagging & Searching]]
[[TiddlySnip]]
[[Importing Tiddlers]]
[[Serving It Up|http://www3.telus.net/Jgen/2008-01-23-serving_it_up.shtml]]
[[Text Options]]
[[Photo Options]]
[[Passage Express]]
<html><a href="http://www.kqzyfj.com/ma77hz74z6MPPSPRQQMONRTTSNW" onmouseover="window.status='http://www.ancestry.com';return true;" onmouseout="window.status=' ';return true;">
<img src="http://www.awltovhc.com/q465uuymsqBEEHEGFFBDCGIIHCL" alt="Banner - Ancestry.com" border="0"/></a></html>
<html><a href="http://clickserve.cc-dt.com/link/tplclick?lid=41000000024369301&pubid=21000000000160235"><img src="http://clickserve.cc-dt.com/link/tplimage?lid=41000000024369301&pubid=21000000000160235" border=0 alt="160x160 - discover your past"></a>
</html>
GenealogyWikis
[[Other Resources]]
<html><A href="http://www.footnote.com/freetrial-family-history.php?xid=19&kbid=1082&img=160x60_download.gif">
<img src="http://www.footnote.com/i/affimg/160x60_download.gif" border=0></a></html>
@@
http://www.mediawiki.org/wiki/MediaWiki
{{{
# Item 1
## Item 2
### Item 3
}}}
# Item 1
## Item 2
### Item 3
[[TiddlyWiki for the Rest of Us|http://www.giffmex.org/twfortherestofus.html]]
[[Google Groups - TiddlyWiki|http://groups.google.com/group/TiddlyWiki]]
[[CSS Color Chart|http://www.somacon.com/p142.php]]
[[TiddlyThemes|http://tiddlythemes.com/#Home]]
[[TW Help|http://tiddlyspot.com/twhelp/]]
[[TiddlyVault|http://tiddlyvault.tiddlyspot.com/]]
[[Tid-Help|http://tidhelp.tiddlyspot.com/]]
It's important that you read [[Serving It Up|http://www3.telus.net/Jgen/2008-01-23-serving_it_up.shtml]] first so you know how to start your wiki project in [[Passage Express|http://tiny.cc/pe545]] and how to find the file-path to the back-end.
The path to the linked-files folder in my Passage Express project looks like this:
C:\Program Files\Passage Express\Projects\~FHP00013\Files\~FILES00000177
To make a link from a wiki to a file would look like this:
{{{
[[Name|file:\\\C:\Program Files\Passage Express\Projects\FHP00013\Files\FILES00000177\file-name]]
}}}
This will be similar for you but the numbers will be different. Except for "Name" and "file-name" the file-path will be the same for every single linked file.
Importing and linking web albums is a little different. Use the Import feature inside PE to import a Folder and browse to the location of your web album. After import, look for the "index.html" file and link it appropriately to your wiki. This is the file that fires up the album.
You can also move or copy the album to your linked-files folder in the back-end of PE. It depends if it matters to you whether your readers can see these folders in PE or not. In my case, it would be folder 00000177. When I go back to the top-side of Passage Express there's no sign of this web album but it's still linked into my wiki if I've used the right file-path to it.
[img[http://www3.telus.net/Jgen/images/jliki/pe_1.jpg]]
The 3 folders listed under 00000177 are all web albums.
[img[http://www3.telus.net/Jgen/images/jliki/pe_2.jpg]]
All I have to do is link the wiki to their index.html files.
{{{
[[Name of Album|file:\\\C:\Program Files\Passage Express\Projects\FHP00013\Files\FILES00000177\Name of folder\index.html
}}}
or it might be
{{{
[[Name of Album|file:\\\C:\Program Files\Passage Express\Projects\FHP00013\Files\FILES00000177\Name of folder\album\index.html
}}}
depending on the location of the index.html in each album.
If you put a button on your Presentation menu that only opens your wiki, everything else is hidden. So your readers don't get into the main presentation area of [[Passage Express|http://tiny.cc/pe545]] looking at your linked-files folder. They're going to be taken directly to the wiki and that's all. Of course, they can open the contents of the disk and root around but it makes it a tiny bit more obscured than it would be on a flash-drive. And of course, you can name the button anything you want.
[img[http://www3.telus.net/Jgen/images/jliki/pe_3.jpg]]
If you leave your files fully accessible in Passage Express, your readers will have the option of viewing all the photos as a slideshow, including the ones in the web albums. This is not something that would work on a flash-drive as only one folder will present itself at a time.
I've had the experience of PE importing IPTC information (i.e. captions) on single photos, although it's been inconsistent and leads me to wonder if it's something happening by other than intentional software design.
Since I'd already started my project on a flash-drive, and I wanted to find out how easy it would be to switch it over to [[Passage Express|http://tiny.cc/pe545]], all I did was copy the wiki to folder 00000176 and the entire contents of the linked-files folder on the flash-drive into folder 00000177. Everything's the same except the local file-paths are wrong. The downside of that is there might be a hundred or more files. The upside is that it's the same file path for all of them, except for the individual file names. So it's a //relatively// easy thing to put the PE file-path on the clipboard and paste it over all the file-paths that have been imported from the flash-drive.
This is an extra step if you ever decide you want to do it both ways. You can save yourself the bother if you decide from the start whether you're going to build your wiki on a flash-drive or in [[Passage Express|http://tiny.cc/pe545]]. Or some other way.
I'm torn between the quickness and convenience of working on a flash-drive and the more tasteful presentation options of Passage Express. A compromise would be to create the wiki in a folder on your C-drive, using the PE file-path for linking files, and then move it into Passage Express when you're ready to send it.
Your Passage Express project can be burned to a disk or saved to a folder, zipped and sent by <html><a href="http://www.dpbolvw.net/h4102zw41w3JMMPMONNJLKPKLTKR" target="_blank" onmouseover="window.status='https://www.yousendit.com/signup.php?action=promo_display&s=40112';return true;" onmouseout="window.status=' ';return true;">YouSendIt</a>
<img src="http://www.ftjcfx.com/k5117xjnbhf03363544021612A18" width="1" height="1" border="0"/>.</html>
The options for including photos and other graphics in your wiki are //endless//.
*Link pictures directly into your tiddlers. See [[Linking to Files]].
*Link an html page that contains images. This gives you more freedom in your layout, accompanying text and other content. It's easy to do and you can edit your pages at any time.
*Make a web album and link its index page to a tiddler or your Main Menu.
Web albums can be made with most any photo-editing software. The programs on my computer right now that can do this are:
[[Adobe Elements|http://www.adobe.com/downloads/?PID=2252433]]
[[MediaDex|http://mediadex.com/us/index.htm]]
[[XnView|http://www.xnview.com/]]
[[Studioline|http://www.studioline.net/EN/]]
[[Picasa|http://picasa.google.com/]]
[[JAlbum|http://jalbum.net/]]
Just because it's called a web album, that doesn't mean you have to put it on the web. It just means it's created in html format. Perfect for linking into your wiki.
''Picasa'': The template options are limited. Except for picture size other options are non-existent. It will include any captions you've added to your pictures. If there are no captions it will include the file-names. The poorest of all the choices.
If you want the Mercedes of web album creators, that would probably be [[JAlbum|http://jalbum.net/]]. It's free and compatible with all operating systems. It will import any embedded-captions if you want it to but you can alter them as you like. There are dozens of templates to choose from or you can customize your own. Almost every aspect of your photo album can be tweaked to your specifications. If you're a beginner at this you can create an album in 2 steps or you can go to the max with other options.
Of the others, [[XnView|http://www.xnview.com/]] is best although not everything I would want it to be. Depending on which version you have of [[Adobe Elements|http://www.kqzyfj.com/click-2252433-10434209]] you might have good choices for web albums. Version 5.0 does not.
If you have your photos organized and tagged you only have to do a quick search to gather up the pictures you want for each album. You'll thank yourself for the time you've spent doing that. I use [[MediaDex|http://mediadex.com/us/index.htm]] as it handles all file-types, but if you're just looking at organizing photos [[Adobe Elements|http://www.kqzyfj.com/click-2252433-10434209]] is good.
You can also:
*Make a slideshow.
*Print a pdf of a photo collection. [[FastStoneViewer|http://www.faststone.org/FSViewerDetail.htm]] has good options for this. So does [[PhotoMeister|http://www.photomeister.com/]].
If you have your ducks lined up in [[Legacy|http://www.legacyfamilytreestore.com/?Click=1054]] you can print Scrapbook pages and link them in. Or Family Picture Trees.
Oh, and remember [[photo collage|http://www3.telus.net/Jgen/2007-11-03-photo_collage.shtml]]. Your creativity need know no bounds.
!!!Preformatted
If you want to add text that has formatting you need to preserve, start with three brackets of this type:
@@font-size: 200%; { @@
on a line of its own. Then paste your text in on the next line. On the line following the end of the text put three closing brackets. If you put the brackets on the same line with text you will not get the desired result. @@font-size: 85%;
{{{
+Sarah Ann Liles b. 17 Feb 1838, Great Gransden, Cambridgeshire, England, d.
28 Feb 1895, Dundee, Monroe Co., MI
2-Sarah Anna Beeken b. 08 Nov 1858, Sandusky, Erie Co., OH, d. 14 Jan 1897,
, Monroe Co., MI
+Henry Jay Bartow b. 26 Nov 1857, Berlin, , OH, d. 06 Jan 1939, Greenwich,
Huron Co., OH
}}}
@@
@@font-family:georgia; //creating your own genealogy wiki// - classes now on at [[JLog|http://www3.telus.net/Jgen/jlog.html]]
@@
@@font-family:georgia; JLiki@@
http://www3.telus.net/Jgen/jliki.html
/***
|''Name:''|SparklinePlugin|
|''Description:''|Sparklines macro|
***/
//{{{
if(!version.extensions.SparklinePlugin) {
version.extensions.SparklinePlugin = {installed:true};
//--
//-- Sparklines
//--
config.macros.sparkline = {};
config.macros.sparkline.handler = function(place,macroName,params)
{
var data = [];
var min = 0;
var max = 0;
var v;
for(var t=0; t<params.length; t++) {
v = parseInt(params[t]);
if(v < min)
min = v;
if(v > max)
max = v;
data.push(v);
}
if(data.length < 1)
return;
var box = createTiddlyElement(place,"span",null,"sparkline",String.fromCharCode(160));
box.title = data.join(",");
var w = box.offsetWidth;
var h = box.offsetHeight;
box.style.paddingRight = (data.length * 2 - w) + "px";
box.style.position = "relative";
for(var d=0; d<data.length; d++) {
var tick = document.createElement("img");
tick.border = 0;
tick.className = "sparktick";
tick.style.position = "absolute";
tick.src = "data:image/gif,GIF89a%01%00%01%00%91%FF%00%FF%FF%FF%00%00%00%C0%C0%C0%00%00%00!%F9%04%01%00%00%02%00%2C%00%00%00%00%01%00%01%00%40%02%02T%01%00%3B";
tick.style.left = d*2 + "px";
tick.style.width = "2px";
v = Math.floor(((data[d] - min)/(max-min)) * h);
tick.style.top = (h-v) + "px";
tick.style.height = v + "px";
box.appendChild(tick);
}
};
}
//}}}
The first thing is to [[download a TiddlyWiki|http:www3.telus.net/Jgen/images/empty.html]]. (Right click and choose Save Link As...) You're just saving the basic template as you see it here. Then double-click it as you would any other file and it will open in your browser window.
In the upper left you will see GettingStarted. Click on that and it will bring up the default tiddlers.
[img[http://www3.telus.net/Jgen/images/jliki/so_1.jpg]]
Click on SiteTitle. That tiddler will open so then click the Edit option over to the right of it, type the title you want for your wiki into the box and click Done. Don't alter the header, just the contents. Do the same with SiteSubtitle.
MainMenu is where you put tiddler headings as you go along. Whatever you want to have in your left-hand menu. You can leave that for now.
DefaultTiddlers is where you can put the names of tiddlers that you want always showing when you open your TiddlyWiki. All tiddlers can also be searched through the Timeline on the right. And you can search for individual words by using the Search box in the upper right.
Also put in initials or a full name for yourself, in WikiWord style. Two capital letters. Or not. Either way works. All your tiddlers will automatically start with this name.
Backup can be automatic or manual. By default it's set at automatic. This means it will put reams of backups into your My Documents folder (in Windows) that need to be deleted regularly because they'll spawn like fruit-flies. I prefer to save changes manually and just keep one copy. To do this, click Options on the right and then Advanced Options. On the list there you'll see a box that says "Automatically save changes". Untick it. From now on you have to always remember to click 'save changes' (over on the right) before you exit. It will send up a warning to you, however, if you do forget.
That's about it to get started. Now you've got your own non-linear journal to be used for any subject you want. You just need to write into it. Nobody else can see what you're doing unless you post your page online or send it to some-one by email, CD, flash-drive or what have you. [[TiddlySpot|http://tiddlyspot.com/]] will host your wiki for free if you do want yourself online. You can also go over there, click on Gallery and see what other people are doing.
/*{{{*/
body { font-family: sylfaen; font-size: 1.0em;}
/*}}}*/
By now, you may be envisioning how to make your family history wiki. There's no set way to do this. If you haven't already, you can jump right in and begin.
I'll give you a for-instance. My first entry might be telling what I know about my grandmother. I click New Tiddler, give it a name and start writing. I can write off the top of my head for awhile, then bring in a photo, link up a chart produced by [[Legacy|http://www.legacyfamilytreestore.com/?Click=1054]] or add a map. If I have a slideshow already made I can link that in. If I've already written stories elsewhere I can copy and paste them direct. The possibilities are endless, as much or as little as I like, and it doesn't matter if it's all done at once. Anytime I want I can come back and edit this piece.
I could also write bits and pieces as separate tiddlers. They don't have to be connected. Your preference. If you do write them sporadically you always have the choice later to paste them together into one. If I only have one for my grandmother I would likely add her as an item in my MainMenu.
Later, I will probably write another piece about her parents and likely mention her there as well. Chances are she'll come up again and again in other peoples' tiddlers. How will I know where to find everything I have on this one person? One way is to use the Search box in the upper right. Searching her name there will bring up all related tiddlers with her name highlighted. If I'm looking for a specific one this narrows my search. If I just want to read everything I have written about her, this is how to bring it altogether on one screen.
This is also where tagging comes in handy. Along the bottom edge of each tiddler editing box, there's a smaller area for adding tags.
[img[http://www3.telus.net/Jgen/images/jliki/ts_1.jpg]]
Tags are added with spaces in between, not commas. If the keyword has spaces, such as 'Florence L. Wilke' it's written between double-square brackets.
If the tag has been used before it's in a drop-down list under "tags" to save you having to re-type it.
Tags can be added for anything you like although the most obvious would be people, places and events.
Once tags are added they will show up in the tags box next to the tiddler. Any tag can be clicked on and this will immediately bring up all tiddlers using that tag.
[img[http://www3.telus.net/Jgen/images/jliki/ts_2.jpg]]
As you can see, this would make the complex non-linear nature of a family history much easier to navigate and understand.
I already have a convoluted map of my ancestors in my mind from repeated exposure over years. A family member who's hearing it for the first time, or even the 10th, hardly retains a thing (I've found.) Just imagine one of them reading through and thinking Charles Cooke, Charles Cooke, Charles Cooke, I know I've heard that name before... All they have to do is click on the 'Charles Cooke' tag and all the tiddlers containing his name as a tag will appear in order on the screen. In this way, they can easily see the myriad connections with many others in the story.
A 'Tags' list can also be accessed from the index on the right. The tags are in alphabetical order showing the number of and a list of the tiddlers they've been attached to. Tags are not written in stone so add and subtract as you please.
What I'm finding as I go along with my own Family History wiki is that tiddlers are better suited to short entries. This not in any way a requirement but I find it's easier to link files and edit on the fly if each piece is short.
When I was rambling on about my grandmother, I'd written an encyclopedia before I knew it. So, there's a couple of things that can be done here. One is to break up a person's life by decade, or by major life-cycles; pre-marriage years, marriage years, etc or by specific life events that you want to tell stories about.
To make it even quicker to navigate, keep your writing in the wiki to a minimum and link in other files. Write a short piece in a tiddler, then put the rest of the story, photographs, etc on a linked page or several pages.
If you're linking stories from [[Legacy|http://www.legacyfamilytreestore.com/?Click=1054]] or some other database, neither .rtf nor .txt documents display well in a browser. The .rtf includes strange format codes and the .txt has no formatting at all. So, this leaves html pages, pdf's and the major word-processor formats.
An html page works beautifully as a linked page, being in its own element here. Cruising around in your wiki is essentially the same as surfing the web. The wiki is an html page and if you connect it to others, you've made a website of sorts. The difference is that you're //not on the web// and you can choose your audience.
If you've never made an html page before, all you need is [[Kompozer|http://www.kompozer.net/]] and it's free. It's a WYSIWYG editor so somewhat like a word-processor. You can just type text in on a white background or you can go to the max with CSS if you know how. It's up to you. Here's a simple [[example|http://www3.telus.net/Jgen/images/jliki/to.html]]. If that seems beyond you, you don't even need it. You can construct a page in a word processor and then save or export it as html. Then link it to your wiki and you're ready to move on to your next segment.
The plan I like best is to build my Family History wiki on a flash-drive, so when I want to edit a page I just go to the folder where I keep all the linked files and edit it there. The file-path to the wiki stays the same.
PDF's also work as do the larger word-processor formats. A browser is not their native element though so they take longer to open.
When it comes to TiddlyWiki, there's always more. And more ...
But if you can do basic text formatting and link up files, you're good to go.
Firefox has an extension for TiddlyWiki called [[TiddlySnip|http://tiddlysnip.com/#About]]. If bookmarks and the Scrapbook and the ~EverNote extensions aren't enough, you can snip pieces of text directly off the web into their own tiddlers.
Once you've got it installed, you click on Tools/~TiddlySnip Preferences and choose which of your TiddlyWiki's you want it to go to. (If you keep several you have to decide.) And your username and the tags you want applied.
When you've found something to snip, you highlight it and click the TiddlySnip Selection button in your right-click menu and your heart's desire creates its own tiddler. If you don't select something you'll get the whole page added. Before you snip, you also have the option to change the title and the tags you want applied to it.
If you only want the URL, nothing else is required. For example:
http://www.legacynews.typepad.com/
If you want the website name instead it's done like this:
[[Legacy News|http://www.legacynews.typepad.com/]]
{{{
[[Legacy News|http://www.legacynews.typepad.com/]]
}}}
If you don't want your wiki looking like every other TiddlyWiki on the block, and who would, you can go all out with your ColorPalette tiddler (under More/Shadowed) changing the color of everything on the page. If things go horribly wrong, don't panic. Your color settings will revert to default as long as you don't click "save changes." If you blow that, you can still copy and paste back the original code. I keep another TiddlyWiki around just for experiments.
Don't be put off by the code that looks like this:
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
The 3 digit codes stand for colors and are CSS shorthand for the usual 6. Either one works. //What// they stand for you'll find out as soon as you start changing them.
You can find the codes for hundreds of colors at <html><a href="http://www.somacon.com/p142.php">CSS Color Chart</a></html>.
Assuming you've made some tiddlers and want to create a menu for them, here's how to do that. Click on your MainMenu tiddler which you'll find either under GettingStarted or More/Shadowed in the right-side column.
A WikiWord doesn't need any special code as it's automatically linked to the tiddler with that name. Put double-square brackets around any title that is not a WikiWord.
{{{
[[Like This]]
}}}
As you add more tiddlers, you simply add their titles to your MainMenu.
{{{
[[Item One]]
[[Item Two]]
[[Item Three]]
}}}
and they would look like this:
[[Item One]]
[[Item Two]]
[[Item Three]]
or
{{{
ItemOne
ItemTwo
ItemThree
}}}
This set are all WikiWords so they just are what they are and look like this:
ItemOne
ItemTwo
ItemThree
You don't have to add all your tiddlers to the MainMenu as both a timeline and an alphabetical listing are automatically created in the right-side index.