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; 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
* How many times have you had to miss a really good speaker so you could see another? Did you wonder what you were missing?
* How many times have you filed away your conference notes, never to look at them again?
* How many times have you wanted to share your new knowledge with your colleagues back at the office, but haven't got around to it?
~RippleRap is here to help. As well as giving you an easy-to-use system for managing your conference notes and agenda, ~RippleRap shares your notes with other attendees at the same event - and you get theirs in return. Even those who aren't attending get to read these insights. And it works even with unreliable conference wi-fi (which is usually the case!).
As an organiser of a conference, you can offer ~RippleRap to your attendees with the most basic set-up and infrastructure. Plus, being entirely open source, ~RippleRap is free and fully customizable.
If you'd like to see an example of ~RippleRap in action, [[click here|http://www.ripplerap.com/BlogTalk2008/blogtalk.html]] to see an archive of notes from the [[BlogTalk|http://2008.blogtalk.net/]] conference in Cork, Ireland.
~RippleRap has been developed by Osmosoft, a subsidiary of BT. For general questions about Osmosoft, BT, ~TiddlyWiki and ~RippleRap, please take a look at the [[FAQs]].
{{{
Background: #111
Foreground: #888
PrimaryPale: #222
PrimaryLight: #18f
PrimaryMid: #333
PrimaryDark: #014
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #999
SecondaryDark: #841
TertiaryPale: #eee
TertiaryLight: #ccc
TertiaryMid: #999
TertiaryDark: #666
Error: #f88
Darkest: #000
Brightest: #fff
Darker: #111
Dark: #333
TextOnDark: #ccc
DullTextOnDark: #888
BrightOnDark: #eee
DullOnDark: #666
SubtleOnDark: #444
Magenta:#D71F85
}}}
/***
|''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
function add32(a,b)
{
var lsw=(a&0xFFFF)+(b&0xFFFF);
var msw=(a>>16)+(b>>16)+(lsw>>16);
return (msw<<16)|(lsw&0xFFFF);
}
function AA(a,b,c,d,e)
{
b=(b>>>27)|(b<<5);
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);
}
function RR(w,j)
{
var n=w[j-3]^w[j-8]^w[j-14]^w[j-16];
return (n>>>31)|(n<<1);
}
var len=blen*8;
x[len>>5] |= 0x80 << (24-len%32);
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=0;
var t;
var a=h0;
var b=h1;
var c=h2;
var d=h3;
var e=h4;
while(j<16) {
w[j]=x[i+j];
t=AA(e,a,d^(b&(c^d)),w[j],k1);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a=t; j++;
}
while(j<20) {
w[j]=RR(w,j);
t=AA(e,a,d^(b&(c^d)),w[j],k1);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a=t; j++;
}
while(j<40) {
w[j]=RR(w,j);
t=AA(e,a,b^c^d,w[j],k2);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a=t; j++;
}
while(j<60) {
w[j]=RR(w,j);
t=AA(e,a,(b&c)|(d&(b|c)),w[j],k3);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a=t; j++;
}
while(j<80) {
w[j]=RR(w,j);
t=AA(e,a,b^c^d,w[j],k4);
e=d; d=c; c=(b>>>2)|(b<<30); b=a; a=t; j++;
}
h0=add32(h0,a);
h1=add32(h1,b);
h2=add32(h2,c);
h3=add32(h3,d);
h4=add32(h4,e);
}
return [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");
}
//}}}
~RippleRap is an open source product, released under a [[BSD licence|http://www.osmosoft.com/#Licensing]], which means you can make amendments to the code if you wish. If you'd like to contribute to the project, improvements, additions and bug fixes are most welcome.
~RippleRap is built on the [[TiddlyWiki|http://www.tiddlywiki.com]] product and makes use of much of its core functionality. Whilst these guidelines attempt to be self-contained, a familiarity with ~TiddlyWiki is assumed, along with a working knowledge of ~JavaScript.
~RippleRap's component parts can be found in the [[RippleRap subversion repository|http://svn.tiddlywiki.org/Trunk/verticals/ripplerap/]]. Please see [[this page|http://trac.tiddlywiki.org/wiki/Cook]] on the tiddlywiki.org wiki for more information about how to work with this repository.
If you would like support with ~RippleRap development, please see the [[Support]] page.
Unless otherwise stated, plugins are found in /plugins. Click on the below links for more details on each aspect of the product.
[[Making Notes|Development: making notes]]
[[Sharing Notes|Development: sharing notes]]
[[The Agenda|Development: the Agenda]]
[[User Interface|Development: user interface]]
[[Content|Development: content]]
[[User Accounts|Development: user accounts]]
[[Server-side|Development: server-side]]
[[Testing|Development: testing]]
[[Bug Reports and Fixes|Development: bug reports and fixes]]
We're keen to receive Bug Reports and Fixes. Please register these on Trac at:
[[https://trac.osmosoft.com/Osmosoft/newticket|https://trac.osmosoft.com/Osmosoft/newticket]]
There are some tiddlers containing helpful content (in /content):
* About_your_username
* About_your_password
* ~Safari_and_Opera_configuration
* ~Setup_Instructions
* Welcome
Much of the functionality to support taking notes comes directly from TiddlyWiki, with some minor additions:
* The layout of notes (as explained in the [[User Interface|Development: user interface]] section)
* A macro called ~TiddlerDisplayDependencies to correctly order yours and other people's notes on the page (in [[TiddlerDisplayDependenciesPlugin|http://svn.tiddlywiki.org/Trunk/contributors/PhilHawksworth/plugins/TiddlerDisplayDependenciesPlugin.js]])
* A macro called ~MakeNotesControl to display a button for creating or editing a note (in ~MakeNotesControlPlugin)
A general description of the server-side architecture, along with guidelines on setting this up, can be found [[here|http://svn.tiddlywiki.org/Trunk/verticals/ripplerap/server/README]].
This is the major chunk of code in ~RippleRap and is contained in the ~RssSynchronizerPlugin:
* The ~RssSynchronizer object handles the PUT-ing and GET-ing of RSS feeds to and from the server
* The ~RssSynchronizer uses the [[RSSAdaptor|http://svn.tiddlywiki.org/Trunk/contributors/JonathanLister/adaptors/RSSAdaptor.js]] server adaptor to handle the interactions with the server, which itself depends on the [[WebDavLib|http://svn.tiddlywiki.org/Trunk/contributors/SaqImtiaz/plugins/WebDavLib.js]] plugin
* The ~RssSynchronizer calls itself on a timer, configured using the config.options.txtRippleRapInterval variable
There is a generic settings tiddler in the root directory called settings.js
There is the shell of a test script in the form of a macro called rippleRapTest (in rippleRapTestPlugin). In the words of the author, Martin Budden,
<<<
"it doesn't really do anything."
<<<
Instructions for how to populate the agenda can be found [[here|Personalise RippleRap]]. Items in the Agenda are encoded as [[hCalendar|http://microformats.org/wiki/hcalendar]] microformats. The Agenda is laid out using:
* The in-built tabs macro to create the tabbed agenda panel
* A macro called listRelated to create the lists of sessions and notes associated with them (in [[ListRelatedPlugin|http://svn.tiddlywiki.org/Trunk/contributors/JeremyRuston/plugins/ListRelatedPlugin.js]])
* A macro called ~LinkMaker to customize the links to notes on sessions (in [[LinkMakerPlugin|http://svn.tiddlywiki.org/Trunk/contributors/PhilHawksworth/plugins/LinkMakerPlugin.js]])
* Two templates for the display of Agenda items called ~AgendaItemsTemplate and ~AgendaSubItemsTemplate (these are tiddlers in /content)
* Five tiddlers referenced by the tabs macro called ~AgendaMain1, ~AgendaMain2, ~AgendaStartup1, ~AgendaStartup2 and ~AgendaWorkshops (these are also tiddlers in /content)
* Macros called dtstart and dtend handle the encoding of the Agenda items into hCalendar (in [[MicroformatPlugin|http://svn.tiddlywiki.org/Trunk/contributors/PaulDowney/Plugins/MicroformatPlugin.js]])
To support multiple users, much use is made of the server (see the [[Server-side|Development: server-side]] documentation). The client-side code is relatively straightforward:
* A macro called ripplerapAccountButton to display a button for creating an account and signing-in (in ~MakeNotesControlPlugin)
* A macro called accountManager to display either a log-in box with browser-specific instructions, or a note saying you are logged in
* The browser-specific help is supported by a macro called browser (in [[BrowserPlugin|http://svn.tiddlywiki.org/Trunk/contributors/JeremyRuston/plugins/BrowserPlugin.js]])
~RippleRap's user interface is created by changing the content of certain built-in tiddlers (in /shadows):
* ~ColorPalette
* ~StyleSheet
* ~EditTemplate
* ~PageTemplate
* ~ViewTemplate
* ~MainMenu
* ~DefaultTiddlers
* ~SiteSubtitle
* ~SiteTitle
~TaggedTemplateTweak is a plugin used to control the view and edit templates of tiddlers that are tagged with a specific word. It uses various templates (in /content):
* ~SessionViewTemplate
* ~SessionEditTemplate
* ~DiscoveredNotesViewTemplate
* ~DiscoveredNotesEditTemplate
* ~NoteEditTemplate
* ~NoteViewTemplate
There are some additional UI elements (in /content):
* ~SignInOption
* ~AccountDetails
* ~AgendaItemsTemplate
* ~AgendaSubItemsTemplate
* ~HeaderControls
If you're interested in using ~RippleRap at your own event or conference, note that ~RippleRap is a free, open source product provided under a [[BSD licence|http://www.osmosoft.com/#Licensing]]. This means you can download and distribute the code to your heart's content, so long as the licence text is kept in the code.
Click [[here|http://www.ripplerap.com/ripplerap.zip]] to get hold of an empty copy of ~RippleRap. This includes an empty copy of a ~RippleRap file (ready to populate with the agenda, etc.), plus the ~RippleRap logo. Once you've downloaded this, in order to get up and running you should follow the [[setup instructions|Set up]].
If you want the source code, go to the [[Developers|Developers guidelines]] section.
<!--{{{-->
<div class='title' macro='view title'></div>
<div class='toolbar' macro='toolbar +saveTiddler -cancelTiddler deleteTiddler'></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>
<!--}}}-->
!!! ~BlogTalk - Cork, 3/4 March 2008
~RippleRap was used for the second time at [[BlogTalk|http://2008.blogtalk.net/]] in Cork, Ireland, on 3/4 March 2008. An archive of the ~RippleRap file containing all the notes taken at the conference can be found [[here|http://www.ripplerap.com/BlogTalk2008/blogtalk.html]].
The ~BlogTalk edition featured new "event stream" functionality, allowing users to see the latest blog posts, tweets and photos from the event. If you're interested in running an event using this additional functionality, check back later when the developer notes will be available.
Phil Whitehouse wrote a [[blog post|http://philwhitehouse.blogspot.com/2008/03/blogtalk-wash-up.html]] reflecting on the experience, and the team published [[several photos on Flickr|http://www.flickr.com/groups/osmosoft/pool/tags/blogtalk/]].
The server which supported this event is no longer in operation.
!!! Le Web 3 - Paris, 10/11 December 2007
~RippleRap was used in a public environment for the first time at [[Le Web 3|http://www.leweb3.com/]], which was held in Paris on 10/11 December 2007. An archive of the ~RippleRap file containing all the notes taken at the conference can be found [[here|http://www.ripplerap.com/LeWeb3/]].
~RippleRap was supported by [[Osmosoft|http://www.osmosoft.com]] at Le Web, and there was a stall attended by various [[Osmosoftonians|http://www.osmosoft.com/#%5B%5BWho%20are%20we%3F%5D%5D]].
A number of blog entries have been written by the team, reflecting on the experience:
* [[Phil Whitehouse|http://philwhitehouse.blogspot.com/2007/12/le-web-morning-after.html]]
* [[Phil Hawksworth|http://www.hawksworx.com/journal/2007/12/17/osmosoft-return-from-leweb3-intact/]]
* [[Paul Downey|http://blog.whatfettle.com/2008/01/04/on-twitter-constraints/]]
Several photos were also [[uploaded to Flickr|http://www.flickr.com/groups/osmosoft/pool/tags/leweb3/]].
The server which supported this event is no longer in operation.
''Who created ~RippleRap?''
A company called [[Osmosoft]] created ~RippleRap. Osmosoft is a small open source innovation company owned by [[BT|http://www.bt.com]].
''What's the relationship between BT and Osmosoft?''
Osmosoft was bought by BT in May 2007, and our remit is to support BT in understanding and adopting open source solutions in a sensible, responsible fashion. BT decided that the best way to go about doing this was to hire people who already had experience of running a successful open source project, and they therefore hired Jeremy Ruston (through the acquisition of his company, Osmosoft) because of his experience creating and running the open source ~TiddlyWiki project.
''What's ~RippleRap based on?''
<<tiddler TiddlyWiki>>
''How does ~RippleRap work?''
*The product at the heart of ~RippleRap is TiddlyWiki. This product includes all the functionality required to create, edit and save notes locally. ~TiddlyWiki can run on a server, but ~RippleRap wasn't intended to be used in this way at Le Web.
*The sharing of notes with other delegates is done via RSS. When you've authorised sharing, ~TiddlyWiki creates an RSS feed that sends your notes to our server. The notes are combined with everyone else's notes on the server, and the aggregated notes are re-published as an RSS feed for your local copy of ~RippleRap. Once they're downloaded, they're stored locally and can be searched within your copy of ~RippleRap.
*The 'click to call' functionality is provided by [[BT's 21C SDK|http://sdk.bt.com]]. As it happens, ~TiddlyWiki is a great platform for building custom applications for this SDK.
''Why are you doing this?''
BT recognises the importance of being a good citizen in the open source arena, and wants to play their part in sustaining and growing the ~TiddlyWiki community as a whole. The more people who take an interest in ~TiddlyWiki, the better it is for everyone involved, which is why the product was being showcased by BT at Le Web.
We'd also like to use ~RippleRap to demonstrate the services being provided by the BT 21C SDK. It so happens that ~TiddlyWiki is a great platform for building custom applications for this SDK.
All the rights to the ~TiddlyWiki code have been passed to a non-for-profit foundation called [[UnaMesa|http://www.uamesa.org]], these rights are not owned by BT.
''Do you plan to do something similar at future conferences?''
Our intention is to use ~RippleRap as a vehicle for meeting the above goals; we may do something similar at other conferences we attend. Click [[here|Events]] to learn about our current plans. Hopefully we'll get some useful feedback and possibly code contributions that improve the product. The code and process are all open source anyway; anyone can take the product and improve it, and use it at future conferences if they wish.
''Can we learn more?''
More information is available on the Osmosoft website at [[http://www.osmosoft.com|http://www.osmosoft.com]].
~RippleRap is based on the popular open source product, TiddlyWiki.
These guidance notes explain how the note organisation and sharing works; the additional functionality created for the [[BlogTalk|http://2008.blogtalk.net/]] conference (gathering in event-related blog posts, photos and tweets) will be supported shortly.
Assuming the user opts-in to note-sharing, their notes will automatically be sent up to the web, where the notes will be collated, and then shared back down with all ~RippleRap users at the event via RSS. This process happens automatically when users are connected to the web. If they're not connected, the note ''taking'' capability will still work, and the ''sharing'' will take place the next time they're connected to the web - which is handy as conference wi-fi can be unreliable at times!
Because of the nature of TiddlyWiki, particularly the need for the user to save their TiddlyWiki updates to their local drive, it is important to make sure that first time users are guided through the initial setup procedure properly. This procedure will depend on the browser which the delegates are running and is explained in detail on the official [[TiddlyWiki website|http://tiddlywiki.com/#SaveChanges]]. ~RippleRap comes complete with browser detect code, which tailors the first time user experience depending on the browser which the user is running. You can configure this experience if you wish (see [[Developer documentation|Developers guidelines]])
[[MainMenu]]
[[About RippleRap]]
[[Download RippleRap]]
<<tiddler latestVersion>>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
_uacct = "UA-2171194-1";
urchinTracker();
</script>
Mojo is a Web friendly ([[REST|http://en.wikipedia.org/wiki/Representational_State_Transfer]]) exposure of [[BT's Web21C SDK|http://web21c.bt.com]]. You can use this to initiate telephone calls and send SMS messages from Widgets, Gadgets, Web mashups, etc! Sign up for an account at [[http://mojo.bt.com|http://mojo.bt.com]].
We've incorporated a simple click-to-call functionality into ~RippleRap using the [[Mojo API|http://mojo.bt.com/howtos]], so you can see it in action. Download the ~RippleRap file to see how this works - during Le Web, it connected phones with the [[Bat phone|http://www.flickr.com/photos/philliecasablanca/sets/72157603316817792/]] that was on the Osmosoft stall.
If you're a developer, then you'll be interested in seeing the code. One of the great aspects of TiddlyWiki is that the entire file - including content, the code which uses the SDK, and the code required for TiddlyWiki to function - can all be inspected. Have a play around and see what you think!
These interface options for customising TiddlyWiki are saved in your browser
<<option chkRegExpSearch>> RegExpSearch
<<option chkCaseSensitiveSearch>> CaseSensitiveSearch
<<option chkAnimate>> EnableAnimations
Also see AdvancedOptions
Osmosoft is a small company of open source developers owned by British Telecom. We're manning a stall at Le Web, so come over for a chat! You can find out more about us at [[http://www.osmosoft.com|http://www.osmosoft.com]].
<!--{{{-->
<div class='header'>
<div class='constrainer'>
<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>
<div id='mainMenu' refresh='content' tiddler='MainMenu'></div>
<div class='constrainer'>
<div id='sidebar' refresh='content' tiddler='SideBar'></div>
<div id='displayArea'>
<div id='messageArea'></div>
<div id='tiddlerDisplay'></div>
</div>
</div>
<!--}}}-->
You get a clean ~RippleRap file as part of the ~RippleRap [[download|Download]]. To personalise this for your event, you will need to:
* create the different tracks for your event
* create the sessions that run in those tracks
* add your server information
* review the copy text to ensure it is relevant to your event
!!! 1. Creating different tracks for the Agenda
~RippleRap's tabbed Agenda is built dynamically out of tiddlers, so you can easily edit it. We use the concept of conference "sessions" that belong to "tracks", which are usually the different stages at an event, but could also be workshops or anything else - a track is a tab on the Agenda.
Creating new sessions for an Agenda track is easy (see below), although creating a new track is a little more involved:
* The Agenda is created by the "AgendaMenu" tiddler (you can get to it by typing the name into the search box), which looks something like this:
{{{<<tabs txtMainTab }}}
{{{"Thu 6th Dec" "Agenda for the first day" AgendaDay1 }}}
{{{"Fri 7th Dec" "Agenda for the second day" AgendaDay2>>}}}
* The first two words, "tabs" and "txtMainTab" stay there
* You add tabs by adding sets of three parameters e.g. "Thu 6th Dec" "Agenda for the first day" AgendaDay1 - the first parameter is what will be displayed on the tab, the second is its tooltip and the third is the name of the tiddler to display when the tab is clicked (keep reading)
* You need to create a new tiddler for each track, with the name set to the third parameter just mentioned. To create a new tiddler, you can create a New tiddler button anywhere you like to make this easier. Just paste {{{<<newTiddler>>}}} into another tiddler, and this will become a New Tiddler button. You could even add it into the Main Menu while you're creating several new agenda items - just write "MainMenu" in a tiddler, click on the link, and add {{{<<newTiddler>>}}} to the menu items.
* These tiddlers follow the pattern of "AgendaDay1", which contains this code (most of it you leave as-is):
{{{<<listRelated tag:"main1" sort:"rr_session_starttime" filter:"[tag[main1]] [sort[+rr_session_starttime]]" rel:"raps" template:"AgendaItemsTemplate" subtemplate:"AgendaSubItemsTemplate">>}}}
* The ID "main1" above is what is used to find the session tiddlers that relate to this track; you can choose whatever you want for the ID so long as it is unique and you remember it for when you are creating the sessions
!!! 2. Creating the sessions for your Agenda
Clicking ''"Add new session"'' on the menu bar opens up a box to enter the information about the session.
The fields you can populate are (* means compulsory):
*Session title*
*Date
*Speaker
*Track (e.g. "main stage", "marketing", "developers")
*Tags* (MUST include: "session"; the ID for the track - see above)
*Start time (in TiddlyWiki format i.e. YYYYMMDDHHMM)
*End time (same format as the start time)
*Synopsis
!!! 3. Adding your server information
There are three bits of information you have to put into ~RippleRap for it to be able to work with your server properly - the root directory for user accounts, the root directory for downloading notes and the address of an administrative update feed (which can be used to push out updates to the Agenda).
This information is split between three tiddlers that contain the following template:
{{{|''Description:''| any useful description |}}}
{{{|''Type:''|rss|}}}
{{{|''URL:''| a url on your server |}}}
Please see the [[server documentation|Set up a RippleRap server]] to find out what set of url's to use for each tiddler. The three tiddlers you will want to edit are listed below, along with, as a guide, the feeds we used during the [[Le Web 3|http://www.leweb3.com/]] conference:
* LeWebUserUploadRootFeed - https://www.ripplerap.com/LeWeb/users
* LeWebUpdatesFeed - http://www.ripplerap.com/LeWeb/feeds/updates.xml
* LeWebSessionDownloadRootFeed - http://ripplerap.com/LeWeb/feeds
(Apologies for the LeWeb-specific naming, this will change as we update RippleRap. You can still use them.)
!!! 4. Reviewing the copy text
The tiddlers that contain the copy text for ~RippleRap and that you might want to review are:
* Welcome
* Setup Instructions
* About your username
* About your password
* Safari and Opera configuration
The ongoing development of ~RippleRap is very much an open collaborative venture.
We have outlined the intended next steps for ~RippleRap in blog posts that can be seen [[here|http://philwhitehouse.blogspot.com/search/label/RippleRap]]. The product was recently showcased at an [[event|Events]] called [[BlogTalk|http://2008.blogtalk.net/]], and we are now looking at these new plugins with a view to improvement and publication.
We are taking a goal-directed approach, which means we are trying to specify the likely users and their goals, and then design the user interface to help them meet these goals. Developing personas is the first step in this process, and more details can be seen [[here|http://philwhitehouse.blogspot.com/2008/01/designing-user-interfaces.html]].
At the time of writing, we are engaged in paper prototyping for the second version of ~RippleRap.
If you have feature requests, or improvements that you wish to contribute back to the project, please raise these either by contacting Osmosoft by email at hello AT osmosoft DOT com, or on the [[TiddlyWiki Discussion Group|http://groups.google.com/group/TiddlyWiki]].
If you're interested in setting up an instance of ~RippleRap for your conference or event, you will need to do the following:
* [[Download]] an empty ~RippleRap file
* [[Personalise the RippleRap file|Personalise RippleRap]] for your event
* Set up your server (we're happy to create a server instance for you if you want, or you can [[set up your own server|Development: server-side]])
* Share your version of the ~RippleRap file. Our recommendation is that it is packaged into a zip file (complete with the ~RippleRap logo image file), which is then either made available for download from the web and / or shared on USB sticks
!!! Troubleshooting tips
* If sharing via USB key, encourage users to drag the zip file over to their desktop before extracting it. This removes the dependency on the USB key staying in the computer.
* Where possible, manually guide the user through saving the ~RippleRap file to their desktop for the first time. Point out that they shouldn't use the browser's "File > Save As..." function, and if possible ensure their first note has saved successfully before they walk off.
* Encourage people to save their notes frequently. Not only is this better for other people, but also mitigates the risk that they'll lose notes due to e.g. the browser crashing.
* Familiarise yourself with the different first time user experiences on each browser.
* Encourage a few friends or colleagues to post their notes early on the event. This will help you and others to demonstrate the value of the product to other people when the event is underway.
* Let someone from [[Osmosoft|http://www.osmosoft.com/#%5B%5BContact%20us%5D%5D]] know when the event is taking place, and we'll support you if possible. Also, in case people at your event arrive at ~RippleRap.com by accident, we'll be happy to post a note directing them to you or your website. We'd also be happy to post an archived version of the notes taken at your events at http://www.ripplerap.com/eventname after your event is finished.
* You might be interested to read experiences from previous [[Events]]. Don't forget to share your experiences with the world as well, we'll be happy to update this website as we've done with [[Events|Events]]!
If you have any problems, check out the [[Support page|Support]].
A central server running Apache and ~WebDAV, which has been configured to accept and produce RSS feeds as described above. Guidelines for downloading and installing the necessary code are on the download page. Follow [[these instructions|Server setup]] to set up the server.
[[Welcome]]
[[About|About RippleRap]]
[[How it works]]
[[Download]]
[[Set up]]
[[Developers|Developers guidelines]]
[[Support]]
[[Roadmap]]
[[Events]]
the collaborative conferencing tool
/***
|''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);
}
};
}
//}}}
/*{{{*/
body { background-color:[[ColorPalette::Background]]; font: normal 13px/1.5em Arial, sans-serif; color:[[ColorPalette:TextOnDark]];}
div.constrainer { width:800px; margin:0 auto 0 auto; overflow:hidden; clear:both; }
input.txtOptionInput {border-style:none; margin:0; padding:4px; color:#444; background:#fff url(./images/bg_search.png) repeat-x top left;}
div.header { background:[[ColorPalette::Darker]] url(images/lights.jpg) repeat-x center 100px; position:relative;}
div.header div.headerShadow { height:200px; top:0; left:0; }
div.header div.headerShadow span.siteTitle { position:absolute; top:20px; left:0; width:271px; height:74px; text-indent:-9999px; overflow:hidden; background:transparent url(images/ripplerap_logo.png) no-repeat top left;}
div.header div.headerShadow span.siteSubtitle { position:absolute; top:20px; right:0; width:165px; height:118px;text-indent:-9999px; overflow:hidden; background:transparent url(images/osmosoft_bt_logos.png) no-repeat top left; }
div.header div.headerForeground { display:none; }
#controlBar { background-color:[[ColorPalette::Darkest]]; color:[[ColorPalette:TextOnDark]]; border-bottom:solid 1px [[ColorPalette::DullOnDark]]; }
#controlBar a { color:[[ColorPalette::DullOnDark]]; border-style:none; font-size:0.8em;}
#controlBar a:hover { color:[[ColorPalette::TextOnDark]]; background-color:[[ColorPalette::Darkest]]; }
#controlBar div.constrainer a { margin-right:2em; }
#controlBar div.sliderPanel { margin:2em 0;}
#controlBar div.sliderPanel a { margin-right:0;}
#messageArea {z-index:9999;}
#displayArea { margin:0; float:left; width:530px;}
#mainMenu {display:none;}
/*#sidebar {position: relative; margin:1em 0 4em 0; float:right; width:220px; text-align:right;}*/
#sidebar {position: relative; margin:1em 4em 2em 0; float:left; width:220px; text-align:right;}
#sidebar a.tiddlyLink {color:[[ColorPalette::Magenta]]; font-size:1.7em; font-weight:normal;line-height:1.4em;}
#sidebar a.tiddlyLink:hover {color:[[ColorPalette::Brightest]]; background-color:[[ColorPalette::Background]];}
#sidebar a.button {font-size:1.2em; color:#777; clear:left; border-style:none; width:219px;}
#sidebar a.button:hover {color:#ccc; background-color:[[ColorPalette::Background]]; }
#sidebar input.txtOptionInput {width:209px; margin:4px 0 0 0;}
div.tiddler {margin:0; padding:0 0 4em 0;}
div.tiddler a { color:#ddd;}
div.tiddler a:hover { color:[[ColorPalette::Magenta]]; background:[[ColorPalette::Background]];}
div.tiddler div.subtitle { display:none; }
div.tiddler div.toolbar { text-align:left; margin-left:0.5em; display:inline;}
div.tiddler div.toolbar > a.button { color:[[ColorPalette::SubtleOnDark]]; border-width:0;}
div.tiddler div.toolbar > a.button:hover { color:[[ColorPalette::BrightOnDark]]; background:[[ColorPalette::Darker]];}
div.tiddler div.title { font-size:2em; margin-left:0; color:[[ColorPalette::Brightest]]; display:inline; font-weight:normal;}
div.tiddler div.viewer { font-size:1.05em; margin:0 2em 0 0; padding-top:0.3em; width:100%; color:[[ColorPalette::Foreground]]; line-height:1.3em;}
/*div.tiddler div.viewer img { float:left; clear:left; margin:0 1em 1em 0; zoom:1;}*/
div.tiddler div.viewer img {width:100%;}
div.tiddler div.viewer h1, div.tiddler div.viewer h2, div.tiddler div.viewer h3, div.tiddler div.viewer h4 { border-bottom:solid 1px #333; padding:0.3em 0; margin:0.2em 0 0.2em 0; }
div.tiddler div.viewer h1 {color:#eee; font-size:1.4em; margin:1em 0 0.2em 0; }
div.tiddler div.viewer h2 {color:#eee; font-size:1.3em; margin:1em 0 0.2em 0;}
div.tiddler div.viewer h3 {color:#999; font-size:1.2em;}
div.tiddler div.viewer h4 {color:#999; font-size:1em;}
div.tiddler div.tagged { display:none;}
/*
div.tiddler div.tagged ul li.listTitle { display:none; }
div.tiddler div.tagged ul li a { font-size:1em; display:block; border-style:none; margin-bottom:0; padding:0 0 0 16px; text-decoration:none; background:transparent url(images/tag.png) no-repeat 0 0.2em; color:#333; }
div.tiddler div.tagged ul li a:hover { color:#ccc; background:transparent url(images/tag.png) no-repeat 0 0.2em;}
div.tiddler div.tagging { float:none; border:solid 1px #222; padding:3px; background-color:#000; overflow:hidden; clear:both; zoom:1;}
div.tiddler div.tagging ul li { float:left; margin:0 1em 0 0; color:#666; }
div.tiddler div.tagging ul li a { color:[[ColorPalette::Magenta]]; }
div.tiddler div.tagging ul li a:hover { color:#fff; background-color:#000; }
*/
div.tiddler table {margin:0; border-width:0px; }
div.tiddler table tr { border-width:0px; }
div.tiddler table tr td { border-width:0px; vertical-align:top; }
div.tiddler table tr td * { float:left; clear:left; }
div.tiddler div.viewer pre { font-size:0.9em; margin:0 0 1em 0; padding:1.2em; border:solid 1px #444; background-color:#222; color:#aaa; }
div.tiddler div.txtMainTab div.tabset {height:1.4em;}
div.tiddler div.txtMainTab div.tabset a.tab {border-style:none; background-color:transparent; color:[[ColorPalette::Magenta]]; padding:0.15em 0.6em;}
div.tiddler div.txtMainTab div.tabset a.tabSelected {border:solid 1px #ccc; border-bottom:solid 3px [[ColorPalette::Background]]; background-color:[[ColorPalette::Background]]; color:#ccc;}
div.tiddler div.txtMainTab div.tabset a.tabUnselected:hover {color:#fff;}
div.tiddler div.txtMainTab div.tabContents {background-color:transparent; border-style:none; border-top:solid 1px #444;}
div.tiddler div.txtMainTab ul { list-style:none; margin:0; padding:0.5em 0; }
div.tiddler div.txtMainTab ul li { padding:0 20px;}
div.tiddler div.txtMainTab ul li a { font-weight:normal; line-height:1.3em; margin:0.2em 0; }
div.tiddler div.txtMainTab ul li.listTitle { border-top:solid 1px #222 ;margin:0; padding:0.5em 0 0.2em 20px; font-size:1.5em; color:#555; }
div.tiddler div.txtMainTab ul li.listLink { margin:0; padding:0 0 0 20px; }
div.tiddler div.txtMainTab ul:first-child li.listTitle { border-style:none; }
#popup { border:solid 1px #000; padding:0;}
#popup.popup li a { background-color:#000; color:[[ColorPalette::Foreground]]; text-align:left; padding:0.1em 0.3em;}
#popup.popup li a:hover { background-color:[[ColorPalette::Magenta]]; color:#fff;}
#popup.popup li.listBreak div {border-bottom:solid 0px #111; border-top:solid 1px #333; margin:0;}
form.wizard {font-size:0.8em;}
form.wizard input.txtOptionInput {font-size:1em; }
span.button {display:block; width:100%; border-style:none; margin:1em 0;}
span.button a {display:block; text-align:center; border-top:solid 1px #ccc; border-bottom:solid 1px #000; background-color:#333; color:#fff; font-size:2em; padding:0.5em 1em; text-decoration:none;}
span.button a:hover {background-color:[[ColorPalette::Magenta]]; color:#fff; }
/*}}}*/
Because ~RippleRap is based on ~TiddlyWiki, and the new components which have been used to create ~RippleRap can be used in other ways by the ~TiddlyWiki community, the first port of call for ~RippleRap-related queries or requests is the [[TiddlyWiki Discussion Group|http://groups.google.com/group/TiddlyWiki]]. If you post your query there with "~RippleRap" in the title, it will not only ensure that a member of [[Osmosoft|http://www.osmosoft.com]] will read it (Osmosoft are the group that created the first version of ~RippleRap), but the community at large will also be able to contribute.
You can also find more information about ~TiddlyWiki on its [[official website|http://www.tidlywiki.com]] and [[documentation website|http://www.tiddlywiki.org]].
If you have feature requests, or improvements that you wish to contribute back to the project, please raise these either by contacting Osmosoft by email at hello AT osmosoft DOT com, or on the [[TiddlyWiki Discussion Group|http://groups.google.com/group/TiddlyWiki]].
If you have bug notifications or fixes, please notify us of these by completing [[this form on Trac|https://trac.osmosoft.com/Osmosoft/newticket]].
For general questions about Osmosoft, BT, ~TiddlyWiki and ~RippleRap, please take a look at the [[FAQs]].
~RippleRap is based on the popular open source product, TiddlyWiki; an entire wiki product packaged into a single html file! TiddlyWiki already has a loyal community of developers and enthusiasts helping to develop it and support new users. There are over 400+ plugins which can be used to configure ~TiddlyWiki in a multitude of ways. It can be used as a task management tool, a de-centralised collaboration tool, a platform for writing and de-bugging software, simply for organising notes or in many other ways.
The entire TiddlyWiki is made up of microcontent called tiddlers, including all the content and the code required to make it function. You're reading a tiddler right now - try double clicking on this text to send it into edit mode. If you have a working knowledge of javascript or css, you can immediately get under the hood, configuring it in any way you like. If you have questions, the TiddlyWiki community is incredibly helpful - there's a [[developer's group|http://groups.google.com/group/TiddlyWikiDev]] and a [[user's group|http://groups.google.com/group/TiddlyWiki]] on Google Groups.
~RippleRap was created by [[Osmosoft]], which is run by the original creator of TiddlyWiki, Jeremy Ruston. You can find out more by looking in our [[FAQs]], or alternatively, if you're online, here are some relevant links:
Official ~TiddlyWiki website: http://www.tiddlywiki.com
~TiddlyWiki community: http://groups.google.com/group/TiddlyWiki
~TiddlyWiki developer community: http://groups.google.com/group/TiddlyWikiDev
Osmosoft website: http://www.osmosoft.com
<!--{{{-->
<div class='title' macro='view title'></div>
<div class='toolbar' macro='toolbar closeTiddler closeOthers +editTiddler'></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>
<!--}}}-->
~RippleRap is a one-stop event dossier! Users can:
*Have easy access to the ''event agenda''
*Manage their conference notes offline
*''Share their notes'' with other delegates
*''See what's said'' - read notes from sessions they may have missed
With the new ~BlogTalk edition, users can also:
*''Follow the buzz!'' - see what event attendees are twittering about
*''Hold the front page!'' - read blog posts about the event
*''Snap!'' - see photos taken at the event
To see the archive of ~RippleRap from the [[BlogTalk|http://2008.blogtalk.net/]] conference in Cork, Ireland, click [[here|http://www.ripplerap.com/BlogTalk2008/blogtalk.html]].
For a product overview, we've created this video demo:
<html>
<object type="application/x-shockwave-flash" width="400" height="300" data="http://www.vimeo.com/moogaloop.swf?clip_id=886093&server=www.vimeo.com&fullscreen=1&show_title=1&show_byline=1&show_portrait=0&color="> <param name="quality" value="best" /> <param name="allowfullscreen" value="true" /> <param name="scale" value="showAll" /> <param name="movie" value="http://www.vimeo.com/moogaloop.swf?clip_id=886093&server=www.vimeo.com&fullscreen=1&show_title=1&show_byline=1&show_portrait=0&color=" /></object><br />
</html>