Welcome to TiddlyWiki created by Jeremy Ruston, Copyright © 2007 UnaMesa Association
!!Me
Instructional Technologist at Earlham for 6 years having moved to ITAM from ECS in 02. I've been around a while and accumulated a BSc in Zoology from Coleg y Prifysgol Abertawe (Swansea University) in 1975, a PhD in Entomology from Imperial Collge, London in 1981, and a MSc in Computer Science from Brunel University in 1988. Many and varied interests from Eastern Orthodoxy to pedagogy with technology.
!!Tiddlywiki
[[TiddlyWiki|http://www.tiddlywiki.com/]] <<version>>
[[TW 4 restofus|http://giffmex.org/twfortherestofus.html]]
[[TiddlyWiki Guides|http://tiddlywikiguides.org/index.php?title=TiddlyWiki_Guides]]
[[Tiddly Doc|http://doc.tiddlywiki.org/#StartingPoints]]
[[Light Box Egs|TiddlyLightBoxExamples]]
[[Calendar creator|http://33ad.org/tools/gtdtwcal.php?month=3&year=2007]]
----
<<changeMode Author>>
<<changeMode>>
----
You can upload and share your own files and organize them in folders. The user interface places the 'Create folder' section ahead of 'Upload files' which is perhaps not the most intuitive.
# go to @@Your Files@@
# Optionally, +++[Create a new folder]>
* Folder Type : default. To create a gallery go to [[Photo gallery]]
* Access restrictions : logged in users or community
* Keywords : add a tag
* @@Create@@
===
# Open folder
# scroll down and upload a file or files
* Browse for the files. You can add up to 5 files at once but they will all share the same title and description
* Type in File title:
* add a Description
* Think about access : making this public exposes it to the web. Currently there is a bug that prevents going back and changing the access control, so try and get it right the first time.
* add a keyword/tag. Get into the habit of tagging your stuff
* ''Check the 'sharing file' box''. Nothing will happen unless you do this.
* Upload
!!Finding and adding a friend
# Use +++[Search ]>
* type name (first or last name) into Search box
* choose People / Communities or all
* Go
=== or click click @@Browse@@ to get a list of all the Users and Communities on the system
# click on the link to open that person's Profile page
# click the obvious link
# ''If'' the person has set Friendship moderation in their [[account settings|Set up your account]] she will get a message to the effect that you have added a friend request
# Currently there is no way to directly reciprocate friendship requests but this will come.
!!Add a photo to blog posting
!!! Add/upload graphic file
* The easy way : +++[Add a file]>
* Click @@Add File@@
** If you have already uploaded your picture(s) in a [[Photo gallery]] open the folder and you'll see the files
** If not, Browse and upload taking care to check the box ([[screenshot|graphics/Add_file.png]]<<imagebox>>
* Click on the file
===
* You'll notice something like {{{ {{file:89}} }}}-- this will display the graphic as a thumbnail
* You can easily move these around
The organised way : [[Photo gallery]]
!!!Link to graphic URL
* Find the graphic (maybe go to Your Files and open a folder)
* right-click and Copy link location
* Click the Insert/edit image button and paste in the location/URL to the graphic
** add a description of the image (this will become a 'tooltip')
** Align to left or right as desired
** add vertical or horizontal space (in pixels) as desired
** Save/update
* [[what the posting looks like|graphics/blog_post_graphics.png]]<<imagebox>>
* [[graphic display in blog|graphics/blog_display_graphics.png]]<<imagebox>>
/***
|''Name:''|AnnotationsPlugin|
|''Description:''|Inline annotations for tiddler text.|
|''Author:''|Saq Imtiaz ( lewcid@gmail.com )|
|''Source:''|http://tw.lewcid.org/#AnnotationsPlugin|
|''Code Repository:''|http://tw.lewcid.org/svn/plugins|
|''Version:''|2.0|
|''Date:''||
|''License:''|[[Creative Commons Attribution-ShareAlike 3.0 License|http://creativecommons.org/licenses/by-sa/3.0/]]|
|''~CoreVersion:''|2.2.3|
!!Usage:
*{{{((text to annotate(annotation goes here)}}}
* To include the text being annotated, in the popup as a title, put {{{^}}} as the first letter of the annotation text.
** {{{((text to annotate(^annotation goes here)}}}
!!Examples:
Mouse over, the text below:
* ((banana(the best fruit in the world)))
* ((banana(^ the best fruit in the world)))
***/
// /%
config.formatters.unshift({name:"annotations",match:"\\(\\(",lookaheadRegExp:/\(\((.*?)\((\^?)((?:.|\n)*?)\)\)\)/g,handler:function(w){
this.lookaheadRegExp.lastIndex=w.matchStart;
var _2=this.lookaheadRegExp.exec(w.source);
if(_2&&_2.index==w.matchStart){
var _3=createTiddlyElement(w.output,"span",null,"annosub",_2[1]);
_3.anno=_2[3];
if(_2[2]){
_3.subject=_2[1];
}
_3.onmouseover=this.onmouseover;
_3.onmouseout=this.onmouseout;
_3.ondblclick=this.onmouseout;
w.nextMatch=_2.index+_2[0].length;
}
},onmouseover:function(e){
popup=createTiddlyElement(document.body,"div",null,"anno");
this.popup=popup;
if(this.subject){
wikify("!"+this.subject+"\n",popup);
}
wikify(this.anno,popup);
addClass(this,"annosubover");
Popup.place(this,popup,{x:25,y:7});
},onmouseout:function(e){
removeNode(this.popup);
this.popup=null;
removeClass(this,"annosubover");
}});
setStylesheet(".anno{position:absolute;border:2px solid #000;background-color:#DFDFFF; color:#000;padding:0.5em;max-width:15em;width:expression(document.body.clientWidth > (255/12) *parseInt(document.body.currentStyle.fontSize)?'15em':'auto' );}\n"+".anno h1, .anno h2{margin-top:0;color:#000;}\n"+".annosub{background:#ccc;}\n"+".annosubover{z-index:25; background-color:#DFDFFF;cursor:help;}\n","AnnotationStyles");
// %/
You will need the following:
* a powerpoint presentation or a collection of slides on [[Picasa (Google)|http://picasa.google.com/]] or Flickr (Yahoo)
* a noise cancelling headset (earphones and microphone). ITAM and Lilly circulation have headsets to borrow which are usable in their respective domains.
Having got your equipment and plugged in the headset and made sure it works, fire up Firefox (this is all web based) and:
# Create an account on the [[Voicethread web site|http://voicethread.com/]] (free). I use my Gmail email address for these types of services.
# You can create up to three (3) annotated slides shows for free. The 'pro' version gives more capability for a monthly fee (they have to make money somehow).
# Follow the screencast //Voice annotation of powerpoint// which will show you how to upload your powerpoint and make audio comments. +++[Voice annotation of powerpoint -- recording comments]
<html>
<p> </p>
<object width="720" height="405">
<param name="movie" value="http://www.earlham.edu/markp/elsdocs/graphics/annotating%20powerpoint%20voicethread.swf"></param><param name="wmode" value="transparent"></param><embed src="http://www.earlham.edu/markp/elsdocs/graphics/annotating%20powerpoint%20voicethread.swf" type="application/x-shockwave-flash" wmode="transparent" width="720" height="405"></embed>
</object>
<p> </p>
</html>
===
# Now open up a new tab in Firefox, login to [[Earlham Learning Spaces|https://els.earlham.edu]] with your normal earlham username and password.
# Follow the screencast //Make your voice annotation accessible on the web// to add a Voicethread player into a Blog posting. +++[Make your voice annotation accessible on the web]
<html>
<p> </p>
<object width="720" height="405">
<param name="movie" value="http://www.earlham.edu/markp/elsdocs/graphics/voicethread 2.swf"></param><param name="wmode" value="transparent"></param><embed src="http://www.earlham.edu/markp/elsdocs/graphics/voicethread 2.swf" type="application/x-shockwave-flash" wmode="transparent" width="720" height="405"></embed>
</object>
<p> </p>
</html>
===
Alternative instructions are available at [[Instructional Tech Documentation|https://els.earlham.edu/markp/page/Annotating+powerpoint+with+Voicethread]] on the learning spaces (you'll need to login to see this) and the Voicethread Powerpoint is visible on [[my blog|https://els.earlham.edu/markp/weblog]] but again, you'll need to login.
Background: #fff
Foreground: #333
PrimaryPale: #FFBFBF
PrimaryLight: #BF2323
PrimaryMid: #BF2323
PrimaryDark: #660000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #eee
TertiaryLight: #ccc
TertiaryMid: #999
TertiaryDark: #666
Error: #ff0000
<<viewPalette>>
<!--{{{-->
<div class='toolbar' macro='toolbar +saveTiddler -cancelTiddler deleteTiddler'></div>
<div class='title' macro='view title'></div>
<div class="editLabel">Title</div><div class="editor" macro="edit title"></div>
<div class="editLabel">Tags</div><div class="editor" macro="edit tags"></div>
<div class="editorFooter"><span macro="message views.editor.tagPrompt"></span><span macro="tagChooser"></span></div>
<div macro="showWhenExists EditPanelTemplate">[[EditPanelTemplate]]</div>
<div class='editor' macro='edit text'></div>
<!--}}}-->
<<search>>
<<calendar thismonth>>
<<closeAll>>
<<newTiddler tag:News >>
<<newJournal title:'0DD/0MM/YYYY' label: "nouveau journal" tag:Changes tag:excludeLists>>
----
<<saveChanges>>
----
<<changeMode Reader>>
<<changeMode Author>>
<<changeMode>>
Author : <<option txtUserName>>
<!--{{{-->
<div id='header' class='header'>
<div id='topMenu' refresh='content' tiddler='TopMenu'></div>
<div class='siteTitle'>
<span refresh='content' tiddler='SiteTitle'></span>
</div>
<div class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></div>
</div>
<div id='sidebar'>
<div id='sidebarOptions' refresh='content' tiddler='AuthorMenu'></div>
<div id='sidebarTabs' refresh='content' force='true' tiddler='AuthorSidebarTabs'></div>
</div>
<div id='displayArea'>
<div id='messageArea'></div>
<div id='tiddlerDisplay'></div>
</div>
<!--}}}-->
<<tabs txtMainTab "Chrono" "Affichage chronologique des éléments utilisateur" UserTabTimeline "Alpha" "Liste aphabétique des éléments utilisateur" TabUser "Index" "Liste des index utilisateur" UserTabTags>>
[[CommunStyleSheet]]
/*{{{*/
body {
margin: 0 30px 0 30px;
}
#sidebarTabs {
font-size: .8em;
line-height: 1em;
}
/*}}}*/
<!--{{{-->
<div class='toolbar' macro='toolbar closeTiddler closeOthers +editTiddler > fields syncing permalink references jump'></div>
<div class='title'>
<span class='title' macro='view title'></span>
<!--<span macro="miniTag">--></span>
</div>
<div class='subtitle'><span macro='view modifier link'></span>, <span macro='view modified date [[DD MMM YYYY]]'></span> (<span macro='message views.wikified.createdPrompt'></span> <span macro='view created date [[DD MMM YYYY]]'></span>)</div>
<div class='tagged' macro='tags'></div>
<div class='tagClear'></div>
<div class='viewer' macro='view text wikified'></div>
<div macro="showWhenTagged [[systemList]]">
<div class='viewer' macro="listByTag '' created ''"></div>
</div>
<div class='tagging' macro='tagging'></div>
<div class='tagClear'></div>
<!--}}}-->
!!Making a blog posting
# Go to @@Your blog@@
# Post new entry
# give it a title
# type in or paste in [[unformatted text]]
# format with button bar
# [[Add links]]
# [[Add pictures]]
# [[Embed YouTube video]]
# type in keyword/tag eg ''name of film''
# set [[access|ELS : Access/Sharing]]
You can create multiple blogs within Mahara. It's easy to upload graphics and to attach and use them in a blog posting. But in order to expose your blog to anyone else you need to create a //View// to it. Here's an example:
+++[View Blog]
Public view of blog at : http://demo.mahara.org/view/artefact.php?artefact=3260&view=525. Note impersonal URL:
<<miniBrowser http://demo.mahara.org/view/artefact.php?artefact=3260&view=525>>
===
!Building blocks for Social Learning Spaces
The first thing that you need is an easy way to create a web 'presence', that is, creating [[content|SLS : Content]] in your web space. This might include uploaded photos, files , or media. You might want to have a way of making [[connections|SLS : Connections]] with other people and groups of people. Within the milieu of the Social Learning Space you'd want a way of controlling [[access|ELS : Access/Sharing]] to what you write or your other content. Finally, you'd want to [[repurpose|SLS: Information flow]] what you've created to make use of in other web contexts.
!Collaborative Online Writing and Blogging with Earlham Learning Spaces (COWBELS)
With Jan Sims and Mark Pearson
<<<
<<tiddler [[Writing with blogs : student comment]]>>
@@Quote from a student assessing his writing using blog@@
<<<
!1. Pedagogical rationale for blogging -- Jan (20 mins)
Collaborative writing works to teach the writing process. Why you should have your students do blogging and collaboration with blogs. Putting blogs into the context of collaborative writing as a strategy for teaching writing. Why not -- addressing objections to blogs.
!!1a. Blogs vs Discussion forums -- Mark (10 mins)
Blogs tend to encourage deeper and reflective writing. Discussions often degenerate into knee-jerk responses and 'me-too' comments. There is also the sense of ownership that students get from posting to their own blog and a sense of permanence in that their writing is not buried inside a course which disappears at the end of the semester.
+++[quotes from students]
<<tiddler [[Student quotes re blogging]]>>
===
!2. Hands-on blogging with Earlham learning spaces -- Mark (60 mins)
!!Session A : Making your first blog entry (30mins)
!!! Show (10 mins)
# Access [[els|https://els.earlham.edu]] and log in
# change user details
# create blog entry
!!! Exercise (20 mins)
# log in and change your user details
** add personal picture (cow)
# Create a blog entry
** Write about the following "What do you think could be a key benefit of blogging for a class that you teach? What drawbacks can you foresee?".
** choose an Access permission
** create one or more keywords/tags
!!Session B : Making connections in els
!!! Show (10 mins)
# Finding people with Search (landing page : Profile)
# Using tags to discover people
# Making friends and reciprocating friendship
# Commenting on another blog
!!! Exercise (20 mins)
# Use search to find known people within els
** use the Connections and Messages tabs
** explore the sidebar
** go back to home page
# Use the tag cloud to discover a new person and related blog posts
# make a friend of someone in the workshop and reciprocate a friend
# find the blog belonging to someone else in the workshop. Engage with the blogger's arguments for using blogs with a comment.
!3. Break for coffee / cookies (15 mins)
!4. Practical aspects -- Jan (30 mins)
Establishing guidelines and expectations for postings. Blog entries that foster trust and give a good public face. Show blogs that represent role models.
!5. Power of tagging and Communities -- Mark (60min)
!! Hands-on session C : Editing entry and changing tag (20 mins)
!!! Show (10 mins)
* Edit blog entry
* change tag
* follow connections
!!! Exercise (10 mins)
* edit a blog entry
* add tag "cowbels" to the keywords
* follow connections
* make a blog entry private access
** logout, go to your blog and try to find the entry. You won't!
!! Hands-on session D : Communities
+++[set up]
Jan to create two communities, with different approaches:
# //creative assignments// where we blog about ideas for creative assignments using ''els''
# //evaluating blogging// where we blog about different ways to evaluate or assess student's blogging efforts.
Jan to kick off both communities with some thoughts
===
!! Show (10mins)
* How to create a community
** community URL
* invite people to join
* joining a community
* making a blog entry to a community
** access controls pertinent to community
!! Exercise (20 mins)
* Find Jan's communities and join them
* post an appropriate blog entry in each
* Create your own community and invite someone else to join
* Find another community and join
* Delete your community
/***
''Name:'' CalendarPlugin
''Version:'' <<getversion calendar>> (<<getversiondate calendar "DD MMM YYYY">>)
''Author:'' SteveRumsby
''Configuration:''
|''First day of week:''|<<option txtCalFirstDay>>|(Monday = 0, Sunday = 6)|
|''First day of weekend:''|<<option txtCalStartOfWeekend>>|(Monday = 0, Sunday = 6)|
''Syntax:''
|{{{<<calendar>>}}}|Produce a full-year calendar for the current year|
|{{{<<calendar year>>}}}|Produce a full-year calendar for the given year|
|{{{<<calendar year month>>}}}|Produce a one-month calendar for the given month and year|
|{{{<<calendar thismonth>>}}}|Produce a one-month calendar for the current month|
|{{{<<calendar lastmonth>>}}}|Produce a one-month calendar for last month|
|{{{<<calendar nextmonth>>}}}|Produce a one-month calendar for next month|
***/
// //Modify this section to change the text displayed for the month and day names, to a different language for example. You can also change the format of the tiddler names linked to from each date, and the colours used.
// // ''[[Changes]] by ELS 2005.10.30:''
// // config.macros.calendar.handler()
// // ^^use "tbody" element for IE compatibility^^
// // ^^IE returns 2005 for current year, FF returns 105... fix year adjustment accordingly^^
// // createCalendarDays()
// // ^^use showDate() function (if defined) to render autostyled date with linked popup^^
// // calendar stylesheet definition
// // ^^use .calendar class-specific selectors, add text centering and margin settings^^
//{{{
config.macros.calendar = {};
config.macros.calendar.monthnames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
config.macros.calendar.daynames = ["M", "T", "W", "T", "F", "S", "S"];
config.macros.calendar.weekendbg = "#c0c0c0";
config.macros.calendar.monthbg = "#e0e0e0";
config.macros.calendar.holidaybg = "#ffc0c0";
//}}}
// //''Code section:''
// (you should not need to alter anything below here)//
//{{{
if(config.options.txtCalFirstDay == undefined)
config.options.txtCalFirstDay = 0;
if(config.options.txtCalStartOfWeekend == undefined)
config.options.txtCalStartOfWeekend = 5;
config.macros.calendar.tiddlerformat = "0DD/0MM/YYYY"; // This used to be changeable - for now, it isn't// <<smiley :-(>>
version.extensions.calendar = { major: 0, minor: 6, revision: 0, date: new Date(2006, 1, 22)};
config.macros.calendar.monthdays = [ 31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
config.macros.calendar.holidays = [ ]; // Not sure this is required anymore - use reminders instead
//}}}
// //Is the given date a holiday?
//{{{
function calendarIsHoliday(date)
{
var longHoliday = date.formatString("0DD/0MM/YYYY");
var shortHoliday = date.formatString("0DD/0MM");
for(var i = 0; i < config.macros.calendar.holidays.length; i++) {
if(config.macros.calendar.holidays[i] == longHoliday || config.macros.calendar.holidays[i] == shortHoliday) {
return true;
}
}
return false;
}
//}}}
// //The main entry point - the macro handler.
// //Decide what sort of calendar we are creating (month or year, and which month or year)
// // Create the main calendar container and pass that to sub-ordinate functions to create the structure.
// ELS 2005.10.30: added creation and use of "tbody" for IE compatibility and fixup for year >1900//
// ELS 2005.10.30: fix year calculation for IE's getYear() function (which returns '2005' instead of '105')//
//{{{
config.macros.calendar.handler = function(place,macroName,params)
{
var calendar = createTiddlyElement(place, "table", null, "calendar", null);
var tbody = createTiddlyElement(calendar, "tbody", null, null, null);
var today = new Date();
var year = today.getYear();
if (year<1900) year+=1900;
if (params[0] == "thismonth")
{
cacheReminders(new Date(year, today.getMonth(), 1, 0, 0), 31);
createCalendarOneMonth(tbody, year, today.getMonth());
}
else if (params[0] == "lastmonth") {
var month = today.getMonth()-1; if (month==-1) { month=11; year--; }
cacheReminders(new Date(year, month, 1, 0, 0), 31);
createCalendarOneMonth(tbody, year, month);
}
else if (params[0] == "nextmonth") {
var month = today.getMonth()+1; if (month>11) { month=0; year++; }
cacheReminders(new Date(year, month, 1, 0, 0), 31);
createCalendarOneMonth(tbody, year, month);
}
else {
if (params[0]) year = params[0];
if(params[1])
{
cacheReminders(new Date(year, params[1]-1, 1, 0, 0), 31);
createCalendarOneMonth(tbody, year, params[1]-1);
}
else
{
cacheReminders(new Date(year, 0, 1, 0, 0), 366);
createCalendarYear(tbody, year);
}
}
window.reminderCacheForCalendar = null;
}
//}}}
//{{{
//This global variable is used to store reminders that have been cached
//while the calendar is being rendered. It will be renulled after the calendar is fully rendered.
window.reminderCacheForCalendar = null;
//}}}
//{{{
function cacheReminders(date, leadtime)
{
if (window.findTiddlersWithReminders == null)
return;
window.reminderCacheForCalendar = {};
var leadtimeHash = [];
leadtimeHash [0] = 0;
leadtimeHash [1] = leadtime;
var t = findTiddlersWithReminders(date, leadtimeHash, null, 1);
for(var i = 0; i < t.length; i++) {
//just tag it in the cache, so that when we're drawing days, we can bold this one.
window.reminderCacheForCalendar[t[i]["matchedDate"]] = "reminder:" + t[i]["params"]["title"];
}
}
//}}}
//{{{
function createCalendarOneMonth(calendar, year, mon)
{
var row = createTiddlyElement(calendar, "tr", null, null, null);
createCalendarMonthHeader(calendar, row, config.macros.calendar.monthnames[mon] + " " + year, true, year, mon);
row = createTiddlyElement(calendar, "tr", null, null, null);
createCalendarDayHeader(row, 1);
createCalendarDayRowsSingle(calendar, year, mon);
}
//}}}
//{{{
function createCalendarMonth(calendar, year, mon)
{
var row = createTiddlyElement(calendar, "tr", null, null, null);
createCalendarMonthHeader(calendar, row, config.macros.calendar.monthnames[mon] + " " + year, false, year, mon);
row = createTiddlyElement(calendar, "tr", null, null, null);
createCalendarDayHeader(row, 1);
createCalendarDayRowsSingle(calendar, year, mon);
}
//}}}
//{{{
function createCalendarYear(calendar, year)
{
var row;
row = createTiddlyElement(calendar, "tr", null, null, null);
var back = createTiddlyElement(row, "td", null, null, null);
var backHandler = function() {
removeChildren(calendar);
createCalendarYear(calendar, year-1);
};
createTiddlyButton(back, "<", "Previous year", backHandler);
back.align = "center";
var yearHeader = createTiddlyElement(row, "td", null, "calendarYear", year);
yearHeader.align = "center";
yearHeader.setAttribute("colSpan", 19);
var fwd = createTiddlyElement(row, "td", null, null, null);
var fwdHandler = function() {
removeChildren(calendar);
createCalendarYear(calendar, year+1);
};
createTiddlyButton(fwd, ">", "Next year", fwdHandler);
fwd.align = "center";
createCalendarMonthRow(calendar, year, 0);
createCalendarMonthRow(calendar, year, 3);
createCalendarMonthRow(calendar, year, 6);
createCalendarMonthRow(calendar, year, 9);
}
//}}}
//{{{
function createCalendarMonthRow(cal, year, mon)
{
var row = createTiddlyElement(cal, "tr", null, null, null);
createCalendarMonthHeader(cal, row, config.macros.calendar.monthnames[mon], false, year, mon);
createCalendarMonthHeader(cal, row, config.macros.calendar.monthnames[mon+1], false, year, mon);
createCalendarMonthHeader(cal, row, config.macros.calendar.monthnames[mon+2], false, year, mon);
row = createTiddlyElement(cal, "tr", null, null, null);
createCalendarDayHeader(row, 3);
createCalendarDayRows(cal, year, mon);
}
//}}}
//{{{
function createCalendarMonthHeader(cal, row, name, nav, year, mon)
{
var month;
if(nav) {
var back = createTiddlyElement(row, "td", null, null, null);
back.align = "center";
back.style.background = config.macros.calendar.monthbg;
/*
back.setAttribute("colSpan", 2);
var backYearHandler = function() {
var newyear = year-1;
removeChildren(cal);
cacheReminders(new Date(newyear, mon , 1, 0, 0), 31);
createCalendarOneMonth(cal, newyear, mon);
};
createTiddlyButton(back, "<<", "Previous year", backYearHandler);
*/
var backMonHandler = function() {
var newyear = year;
var newmon = mon-1;
if(newmon == -1) { newmon = 11; newyear = newyear-1;}
removeChildren(cal);
cacheReminders(new Date(newyear, newmon , 1, 0, 0), 31);
createCalendarOneMonth(cal, newyear, newmon);
};
createTiddlyButton(back, "<", "Previous month", backMonHandler);
month = createTiddlyElement(row, "td", null, "calendarMonthname", name)
// month.setAttribute("colSpan", 3);
month.setAttribute("colSpan", 5);
var fwd = createTiddlyElement(row, "td", null, null, null);
fwd.align = "center";
fwd.style.background = config.macros.calendar.monthbg;
// fwd.setAttribute("colSpan", 2);
var fwdMonHandler = function() {
var newyear = year;
var newmon = mon+1;
if(newmon == 12) { newmon = 0; newyear = newyear+1;}
removeChildren(cal);
cacheReminders(new Date(newyear, newmon , 1, 0, 0), 31);
createCalendarOneMonth(cal, newyear, newmon);
};
createTiddlyButton(fwd, ">", "Next month", fwdMonHandler);
/*
var fwdYear = createTiddlyElement(row, "td", null, null, null);
var fwdYearHandler = function() {
var newyear = year+1;
removeChildren(cal);
cacheReminders(new Date(newyear, mon , 1, 0, 0), 31);
createCalendarOneMonth(cal, newyear, mon);
};
createTiddlyButton(fwd, ">>", "Next year", fwdYearHandler);
*/
} else {
month = createTiddlyElement(row, "td", null, "calendarMonthname", name)
month.setAttribute("colSpan", 7);
}
month.align = "center";
month.style.background = config.macros.calendar.monthbg;
}
//}}}
//{{{
function createCalendarDayHeader(row, num)
{
var cell;
for(var i = 0; i < num; i++) {
for(var j = 0; j < 7; j++) {
var d = j + (config.options.txtCalFirstDay - 0);
if(d > 6) d = d - 7;
cell = createTiddlyElement(row, "td", null, null, config.macros.calendar.daynames[d]);
if(d == (config.options.txtCalStartOfWeekend-0) || d == (config.options.txtCalStartOfWeekend-0+1))
cell.style.background = config.macros.calendar.weekendbg;
}
}
}
//}}}
//{{{
function createCalendarDays(row, col, first, max, year, mon)
{
var i;
for(i = 0; i < col; i++) {
createTiddlyElement(row, "td", null, null, null);
}
var day = first;
for(i = col; i < 7; i++) {
var d = i + (config.options.txtCalFirstDay - 0);
if(d > 6) d = d - 7;
var daycell = createTiddlyElement(row, "td", null, null, null);
var isaWeekend = ((d == (config.options.txtCalStartOfWeekend-0) || d == (config.options.txtCalStartOfWeekend-0+1))? true:false);
if(day > 0 && day <= max) {
var celldate = new Date(year, mon, day);
// ELS 2005.10.30: use <<date>> macro's showDate() function to create popup
if (window.showDate) {
showDate(daycell,celldate,"popup","DD","DD-MMM-YYYY",true, isaWeekend);
} else {
if(isaWeekend) daycell.style.background = config.macros.calendar.weekendbg;
var title = celldate.formatString(config.macros.calendar.tiddlerformat);
if(calendarIsHoliday(celldate)) {
daycell.style.background = config.macros.calendar.holidaybg;
}
if(window.findTiddlersWithReminders == null) {
var link = createTiddlyLink(daycell, title, false);
link.appendChild(document.createTextNode(day));
} else {
var button = createTiddlyButton(daycell, day, title, onClickCalendarDate);
}
}
}
day++;
}
}
//}}}
// //We've clicked on a day in a calendar - create a suitable pop-up of options.
// //The pop-up should contain:
// // * a link to create a new entry for that date
// // * a link to create a new reminder for that date
// // * an <hr>
// // * the list of reminders for that date
//{{{
function onClickCalendarDate(e)
{
var button = this;
var date = button.getAttribute("title");
var dat = new Date(date.substr(6,4), date.substr(3,2)-1, date.substr(0, 2));
date = dat.formatString(config.macros.calendar.tiddlerformat);
var popup = createTiddlerPopup(this);
popup.appendChild(document.createTextNode(date));
var newReminder = function() {
var t = store.getTiddlers(date);
displayTiddler(null, date, 2, null, null, false, false);
if(t) {
document.getElementById("editorBody" + date).value += "\n<<reminder day:" + dat.getDate() +
" month:" + (dat.getMonth()+1) +
" year:" + (dat.getYear()+1900) + " title: >>";
} else {
document.getElementById("editorBody" + date).value = "<<reminder day:" + dat.getDate() +
" month:" + (dat.getMonth()+1) +
" year:" + (dat.getYear()+1900) + " title: >>";
}
};
var link = createTiddlyButton(popup, "New reminder", null, newReminder);
popup.appendChild(document.createElement("hr"));
var t = findTiddlersWithReminders(dat, [0,14], null, 1);
for(var i = 0; i < t.length; i++) {
link = createTiddlyLink(popup, t[i].tiddler, false);
link.appendChild(document.createTextNode(t[i].tiddler));
}
}
//}}}
//{{{
function calendarMaxDays(year, mon)
{
var max = config.macros.calendar.monthdays[mon];
if(mon == 1 && (year % 4) == 0 && ((year % 100) != 0 || (year % 400) == 0)) {
max++;
}
return max;
}
//}}}
//{{{
function createCalendarDayRows(cal, year, mon)
{
var row = createTiddlyElement(cal, "tr", null, null, null);
var first1 = (new Date(year, mon, 1)).getDay() -1 - (config.options.txtCalFirstDay-0);
if(first1 < 0) first1 = first1 + 7;
var day1 = -first1 + 1;
var first2 = (new Date(year, mon+1, 1)).getDay() -1 - (config.options.txtCalFirstDay-0);
if(first2 < 0) first2 = first2 + 7;
var day2 = -first2 + 1;
var first3 = (new Date(year, mon+2, 1)).getDay() -1 - (config.options.txtCalFirstDay-0);
if(first3 < 0) first3 = first3 + 7;
var day3 = -first3 + 1;
var max1 = calendarMaxDays(year, mon);
var max2 = calendarMaxDays(year, mon+1);
var max3 = calendarMaxDays(year, mon+2);
while(day1 <= max1 || day2 <= max2 || day3 <= max3) {
row = createTiddlyElement(cal, "tr", null, null, null);
createCalendarDays(row, 0, day1, max1, year, mon); day1 += 7;
createCalendarDays(row, 0, day2, max2, year, mon+1); day2 += 7;
createCalendarDays(row, 0, day3, max3, year, mon+2); day3 += 7;
}
}
//}}}
//{{{
function createCalendarDayRowsSingle(cal, year, mon)
{
var row = createTiddlyElement(cal, "tr", null, null, null);
var first1 = (new Date(year, mon, 1)).getDay() -1 - (config.options.txtCalFirstDay-0);
if(first1 < 0) first1 = first1+ 7;
var day1 = -first1 + 1;
var max1 = calendarMaxDays(year, mon);
while(day1 <= max1) {
row = createTiddlyElement(cal, "tr", null, null, null);
createCalendarDays(row, 0, day1, max1, year, mon); day1 += 7;
}
}
//}}}
// //ELS 2005.10.30: added styles
//{{{
setStylesheet(".calendar, .calendar table, .calendar th, .calendar tr, .calendar td { font-size:10pt; text-align:center; } .calendar, .calendar a { margin:0px !important; padding:0px !important; }", "calendarStyles");
//}}}
/***
|''Name:''|ChangeModePlugin|
|''Description:''|Change template and styleSheet|
|''Credits:''|SaqImtiaz for is PresentationPlugin|
|''Version:''|0.0.4|
|''Date:''|Jun 5, 2007|
|''Source:''|http://tiddlywiki.bidix.info/#changeModePlugin|
|''Usage:''|{{{<<changeMode [newMode]>>}}}<br>{{{newMode: if omitted the default mode is applied}}}|
|''Author:''|BidiX (BidiX (at) bidix (dot) info)|
|''[[License]]:''|[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D ]]|
|''CoreVersion:''|2.2.0|
***/
//{{{
version.extensions.ChangeModePlugin =
{
major: 0, minor: 0, revision: 4,
date: new Date("Jun 9, 2007"),
source: 'http://tiddlywiki.bidix.info/#ChangeModePlugin',
author: 'BidiX (BidiX (at) bidix (dot) info',
coreVersion: '2.2.0'
};
// From SaqImtiaz's PresentationPlugin
//---------------------------------------------------
TiddlyWiki.prototype.isTiddler= function (title)
{
return store.tiddlerExists(title) || store.isShadowTiddler(title);
};
TiddlyWiki.prototype.removeNotification = function(title,fn)
{
for (var i=0; i<this.namedNotifications.length; i++)
if((this.namedNotifications[i].name == title) && (this.namedNotifications[i].notify == fn))
this.namedNotifications.splice(i,1);
};
Story.prototype.chooseTemplateForTiddler_core = Story.prototype.chooseTemplateForTiddler;
Story.prototype.chooseTemplateForTiddler = function(title,template)
{
if (!template)
template = DEFAULT_VIEW_TEMPLATE;
var mode = config.macros.changeMode.currentMode;
if (template == DEFAULT_VIEW_TEMPLATE) {
if (store.isTiddler(mode+"ViewTemplate"))
return mode+"ViewTemplate";
} else if (template == DEFAULT_EDIT_TEMPLATE) {
if (store.isTiddler(mode+"EditTemplate"))
return mode+"EditTemplate";
}
return this.chooseTemplateForTiddler_core(title,template);
}
Story.prototype.lewcidrefreshAllTiddlers = function()
{
var place = document.getElementById(this.container);
var e = place.firstChild;
if(!e) return;
this.refreshTiddler(e.getAttribute("tiddler"),null,true);
while((e = e.nextSibling) != null)
this.refreshTiddler(e.getAttribute("tiddler"),null,true);
}
//---------------------------------------------------
// manage different modes
//
// config.macros.changeMode.initMode: the name of the initial Mode
// config.macros.changeMode.readOnlyModes: array containing readOnly mode (no Backstage and readOnly)
//
config.macros.changeMode =
{
currentMode: '', // defaultMode
initMode: 'Reader',
readOnlyModes : ['Reader'],
noBackstage : ['Reader', 'Author'],
singlePageMode: ['Reader', 'Author'],
lingo: {
label: "%0 Mode",
prompt: "Change the current mode to '%0'",
modeName: {
Author: 'Author',
Reader: 'Reader',
'': '(default)'
}
},
handler: function(place,macroName,params) {
var newMode = (params[0] ? params[0]: ""); // default to ''
var newModeName = (this.lingo.modeName[newMode] ? this.lingo.modeName[newMode]: newMode); // default to ''
var label = this.lingo.label.format([newModeName]);
var prompt = this.lingo.prompt.format([newModeName]);
createTiddlyButton(place, label, prompt, function() {config.macros.changeMode.action(newMode);}, null, null, null);
},
action: function(template) {
config.macros.changeMode.applyMode(template);
},
defaults: [
{name: "StyleSheet", notify: refreshStyles},
{name: "PageTemplate", notify: refreshPageTemplate}
],
applyMode: function (newMode) {
var oldMode = this.currentMode;
var oldStyleElement = document.getElementById(oldMode+"StyleSheet");
if (oldStyleElement) {
oldStyleElement.parentNode.removeChild(oldStyleElement);
}
// change Palette
if (store.isTiddler(newMode + 'ColorPalette')) {
var tiddler = new Tiddler('ColorPalette');
tiddler.tags.push('admin');
if (!newMode) {
if (store.isTiddler('defaultColorPalette'))
tiddler.text = store.getTiddlerText('defaultColorPalette');
else
tiddler.text = config.shadowTiddlers['ColorPalette'];
} else {
tiddler.text = store.getTiddlerText(newMode + 'ColorPalette');
}
store.addTiddler(tiddler);
}
for (var i=0; i< this.defaults.length; i++)
{
var name = this.defaults[i]["name"];
var newElement = store.isTiddler(newMode + name) ? newMode + name : name;
store.removeNotification(oldMode + name, this.defaults[i]["notify"]);
store.addNotification(newElement,this.defaults[i]["notify"]);
store.notify(newElement); //just one do blanket notify instead?
}
if (backstage && !backstage.button)
backstage.init();
// change readOnly
if (this.readOnlyModes.indexOf(newMode) == -1) {
readOnly = false;
}
else {
readOnly = true;
}
// change backstage display
if (backstage && backstage.button) {
if (this.noBackstage.indexOf(newMode) == -1) {
backstage.button.style.display = "block";
}
else {
backstage.hide();
backstage.button.style.display = "none";
}
// change singlePageMode
if (this.singlePageMode.indexOf(newMode) == -1) {
config.options.chkSinglePageMode = false;
}
else {
config.options.chkSinglePageMode= true;
}
}
this.currentMode = newMode;
story.lewcidrefreshAllTiddlers ();
// store.refreshPalette();
store.notifyAll();
},
init: function() {
if (!store.isTiddler('defaultColorPalette'))
config.shadowTiddlers['defaultColorPalette'] = config.shadowTiddlers['ColorPalette'];
config.macros.changeMode.applyMode(this.initMode);
}
}
config.paramifiers.mode = {
onconfig: function(mode) {
if (mode == 'false')
config.macros.changeMode.initMode = null;
else
config.macros.changeMode.initMode = mode;
}
};
//}}}
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]];
margin:0 auto;
font-size: 85%;
color: [[ColorPalette::Foreground]];
position: relative;
font-family: Helvetica, Arial, sans-serif;
}
h1,h2,h3,h4,h5 {
font-weight: normal;
padding-left: 0;
color: [[ColorPalette::TertiaryDark]];
background: transparent;
}
h1 {font-size: 1.5em; font-weight: normal;border-bottom:2px solid [[ColorPalette::TertiaryLight]];}
h2 {font-size: 1.3em; border-bottom:0px;}
h3 {font-size: 1.1em; border-bottom:0px;}
h4 {font-size: 1em;}
h5 {font-size: .9em;}
ul, ul ul, ul ul ul {
list-style-image: url(http://tiddlyhome.bidix.info/_th/images/square.gif) ;
}
a {
color: [[ColorPalette::PrimaryMid]];
}
a:hover {
color: [[ColorPalette::PrimaryMid]];
background:transparent;
border-bottom:1px solid [[ColorPalette::PrimaryMid]];
}
.button {
color: [[ColorPalette::PrimaryMid]];
font-weight:bold;
}
#header {
background: [[ColorPalette::Background]];
padding: 0 0 0 0.4em;
height:1%;
}
.siteTitle {
padding: 1.5em 0 0 0;
font-weight: normal;
font-size: 3em;
color: [[ColorPalette::TertiaryDark]] ;
}
.siteSubtitle {
width: 33em;
padding: 0.3em 0em 0.2em 1em;
font-weight: bold;
font-size: 1em;
background: [[ColorPalette::PrimaryMid]];
color: [[ColorPalette::Background]];
}
#displayArea {
margin-left:0.5em;
margin-right:17.3em;
margin-top:3em;
padding-top:0em;
padding-bottom:10px;
padding-left: 1em;
}
/*}}}*/
/***
!!Sidebar
***/
/*{{{*/
#sidebar {
position:absolute;
width: 14em;
border-left:1px solid [[ColorPalette::TertiaryLight]];
padding-left:15px;
margin-top:0.5em;
font-size:1em;
line-height:1.5em;
font-family: Arial,em sans-serif;
background-color: [[ColorPalette::Background]];
}
#sidebar a {
display: inline;
font-weight: normal;
}
#sidebar h1,#sidebar h2,#sidebar h3,#sidebar h4,#sidebar h5 {
font-weight: normal;
margin-bottom:0em;
}
#sidebar h1 {
margin-left:-0.5em;
margin-bottom:0em;
}
#sidebar hr {
border:0;
border-bottom:1px solid [[ColorPalette::TertiaryLight]];
margin: 1em 0;
margin-left:-0.5em;
}
#sidebarOptions input {border:1px solid [[ColorPalette::PrimaryMid]];}
/*}}}*/
/***
!!viewer
***/
/*{{{*/
.title {
font-size: 1.5em;
font-weight: normal;
color: [[ColorPalette::TertiaryDark]];
background:transparent;
margin: 0;
margin-bottom: .5em;
padding:0;
}
.viewer {
line-height:1.5em;
}
.tiddler {
padding:0;
margin:0;
padding-bottom:0.5em;
}
.externalLink {font-weight:bold;}
.externalLink:hover {border:none;}
.toolbar { visibility:hidden; }
.selected .toolbar { visibility:visible; }
.tagged, .tagging { float:left; }
.tagged li, .tagging li { display:inline; }
.tagged, .tagging { background:transparent !important; border:0 !important; }
.tagged .button {color: [[ColorPalette::TiertiaryPale]] !important; }
/*}}}*/
/***
!!Editor
***/
/*{{{*/
.editor input {border:1px solid [[ColorPalette::PrimaryMid]];}
.editor textarea {border:1px solid [[ColorPalette::PrimaryMid]]; width:100%;}
/*}}}*/
/***
!!TopMenu
***/
/*{{{*/
#topMenu {
positon:relative; float:right; display:inline;
margin-left:3em;
margin-top:1em;
padding: 0.8em 0em;
}
#topMenu br {display:none; }
#topMenu a, #topMenu .tiddlyLink, #topMenu .button {
margin:0 1em;
color: [[ColorPalette::Foreground]];
margin-right:0;
margin-left:2em;
font-size: 18px;
font-family: Helvetica, sans-serif;
font-weight: normal;
font-style: normal;
}
#topMenu a:hover, #topMenu .activebutton {
border-bottom:5px
solid [[ColorPalette::PrimaryMid]];
}
.calendar, .calendar table, .calendar th, .calendar tr, .calendar td { font-size:12pt; text-align:center; } .calendar, .calendar a { margin:0px !important; padding:0px !important; }
/*}}}*/
/*{{{*/
@media print {
#topMenu {display: none ! important;}
}
/*}}}*/
!Communities on els
A unique feature of ((els(^earlham learning spaces))) is the Community. This has most of the attributes of a full user, that is, the community has a blog, and separate file store and access can be limited to community members only.
!!Creating a community
* community and friend connections are accessed through [[Connections|ELS Features]].
* to create, click the ((Owned Communities(communities that you have created))) link. Type in a name for your community and a moniker or username that you want to employ. Clicking the Create button creates the community. You'll note that you can also delete a community you own. Make sure that there is no content in the community before deleting because deletion is immediate and there's no way of backing out once delete is clicked!
!!!Joining / getting members
A community or group has no life until it has membership. Unlike a Moodle 'class' you cannot "join" another user to your community. But you can issue ((invitations(click on the 'invite people'))) to join -- merely search for a name or username and invite. They get sent a message which they can click on to join your community.
But how can I restrict membership to the people I want?
!!!Membership control
In the Profile of your community (the place you get to by default when you go there) you'll see Edit community details. This allows you to change the community name and even the owner, and under ''Membership restriction'' allows you to set who can join. There are three options:
# No moderation : anyone can join (the default)
# Moderation : membership must be approved by you
# Private : nobody can join
You will be sent a message whenever someone has requested to join.
!!!Suggested procedure
# create new community (Connections : Owned Communities)
# Set Membership restriction to Moderation (Community Profile : @@Edit community details@@ : Membership restriction)
# @@Invite people@@ to join by searching and inviting
# as people request to join go to Profile : @@View membership requests@@ to accept or deny their request
# when all have joined simply reset Membership restriction to Private
!!Accessing communities
!!!From within Elgg:
[[Community links|graphics/community_display.png]]<<imagebox>> can be accessed via the ((sidebar(the right hand column))):
* All the communities you own are listed under Owned communities
* All the communities that you are a member of are listed under Community memberships
!!!From the web:
The username that you give your community is the way that it's accessed from the web in the form <site name>/<community name>. Thus a community called 'green_research' for example might be accessed via els.earlham.edu/green_research .
Note:
* the default destination is the community profile: thus [[https://els.earlham.edu/itc|https://els.earlham.edu/itc]] will show the Profile for Instructional Tech Collaborative community. This is not generally so useful, so
* the direct link to the community blog is <site name>/<community name>/weblog , so [[https://els.earlham.edu/itc/weblog/|https://els.earlham.edu/itc/weblog/]]
!!RSS feeds
You can reuse or redisplay 'content' from your community with RSS feeds. There are feeds available from :
* the whole community
* just the blog
* from the file storage
[[Here's a screenshot|graphics/community_rss_feeds.png]]<<imagebox>>
[[The Firefox browser tool]]
!!Suggestions for development : Profile -- > Home
Currently the default URL to a community lands the browser at the Profile page. By tackling what we do with the 'Profile' page we set the tone for the whole of the Elgg system.
My suggestion is that the Profile page be considered as 'Home'. (And that Communities be treated as first class Elgg entitities).
The Profile itself should be relegated to an ancillary link and perhaps treated like a CV/resume generator. After all, who really changes or updates their profile unless applying for a job? A Profile which could generate a CV (and I have seen them out there - see [[Mahara eportfolio|http://www.mahara.org/features]] +++[Résumé Builder]>
Mahara includes a résumé builder which allows users to create digital CV’s by entering information into a variety of optional fields including:
* Contact and personal information
* Employment and education history
* Certifications, accreditations and awards
* Books and publications, professional memberships
* Personal, academic and work skills and
* Personal, academic and career goals
=== )
So if we think of a 'Home' page why not make it the default web 'home' that students and teachers want? Advantages:
* build a home page without needing ~DreamWeaver
* customize
* add Elgg profile widgets (call these a new name -- 'home page widgets') -- powerful plugins
* the widgets would enable dynamic content which makes the system very attractive. Display to your friend's thoughts and inner feelings without leaving your own home page.
* Why just a single page -- create a tabbed display system that allows up to //n// pages/tabs. Users label each one and they sit right at the top. Users can now organise their stuff in whatever way they want.
!!!Details
# remove Extended profile and tuck it away somewhere less prominent.
# A link called Create page/tab:
** name of tab
** title of page
** background image(s) -- rearrange using AJAX interface
** Photos or any graphic image can be placed on this background, moved around and re-orientated at different angles. Flatten with background to create new image?
# Within each page you can have a number (upper limit) of widget boxes
** create widget box -- give name of box (can be blank) / size (fixed or elastic to content) / borders / background colours / transparency settings/ text font - colour - size
** drag proto-box to desired position. Could make box take complete width.
# Available Widgets (superset of current list)
** Blog, Comment Wall, Video, Files, Friends , Community feed, RSS feeds, Profile
** new widgets : The River, Comment, Photo gallery (static / dynamic -- picks random image from given directory), Frame (display contents of a remote site)
!Earlham Learning Spaces : Elgg meets Liberal Arts (in the US)
International Elgg Conference presentation : Dec 1st 08, Brighton, UK
!! Background
Earlham as a typical small liberal arts college in mid-west USA. Early implementor of Moodle (v1.3). Used Movable Type 2.6 off and on.
!!Why use Elgg at Earlham?
Basic requirement for for a college wide blogging system.
Advantages of Elgg:
* vs free internet service, eg Blogger, Edublogs
* vs multiuser WordPress derivatives, WPMU, Lyceum.
Taken up by Spanish prof and Journalism prof.
Additional utility.
!!Elgg and Facebook
!!Elgg and Moodle
Moodle does blogs -- why have separate systems:
* class approach vs 'learning space' for student peer to peer learning.
* Folio vs wiki
* persistence of content
!!Integration with Moodle
Making ELS easy for faculty to buy in to. Need a way to link with a Moodle Activity.
* Blogging activity for Moodle
* Single Sign-On (OpenID -- LDAP)
* Marginalia for blog
* Folio / Pages for group wiki
* ePortfolio platform
* file repository for Moodle
!!!Implementation
Hacks needed to implement user friendly theme.
Issues with permissions
!!!Current issues
Folio
RSS feeds
!!!Migrating from 0.92 to 1.0
"Objects" in the Elgg space have a sophisticated but simple system of access control:
!!!General
* Public
* Any logged in user
* Private
A blog entry made public is accessible to the whole web in the same way that all other blogs work. But one can make an uploaded file private and thus visible only to the owner or a photo gallery can be made open to any logged in user of the system, ie anyone at Earlham. This powerful access control system addresses a lot of visibility issues. Making blog comments open only to logged in users effectively eliminates spam. But if you do want to make commenting completely open, then there's a WordPress plugin available called Akismet which is quite an effective anti-spam tool.
!!!Specific
* community
* custom access group
The
!Personal
# +++!![Content]
* @@Profile@@ [extended] [widgets]
* Blog
* Files
* Folio (wiki)
===
# +++!![Connections]
* Friends
* Community
* Tags / keywords
===
# +++!![Security / Access]
* Access Controls
** @@Logged in users@@
** Private
** Public
** Community
** Friends
** //Groups//
* Block
* Groups
===
# +++!![Keeping in touch]
* Comment Wall [Profile]
* Shouts
* Status
* Messages
===
# +++!![Information flow]
* system-wide tagging
* RSS in : feed reading
* RSS in : redirect to own blog
* RSS out : feeds off every content object (blog, profile, files, folio, tags)
===
!Community
[[ELS enhancements]]
Links to demo alternate themes
* Poll
* Media stream -- upload mp4s and play in Flash player
* ratings
* trackbacks
* forwarder -- change default 'landing' from Profile to Blog / Files or wherever.
<<tiddler [[Potential ELS themes]]>>
!!Display video from ~YouTube
Go to you blog and click @@Post a new entry@@
# In a separate tab, find the video clip on ~YouTube. Note the @@About this video@@ box.
# Highlight the embed code and copy ([[screenshot|graphics/you_tube_embed_code.png]]<<imagebox>>). Note the width and height parameters
# Switch tabs to your blog. Click @@Add External video@@
# Paste video URL into box.
# Make sure the dimensions in the Video size boxes correspond to the width and height in the embed code: +++[example]>
240 -> 425 (width)
200 -> 355 (height)
=== [[screenshot|graphics/you_tube_insert.png]]<<imagebox>>
# Click @@Insert video@@
// //''Name:'' FAQ List
// //''Version:'' 1.4 for TW 2.0.0
// //''Author:'' AlanHecht
// //''Type:'' [[Macro|Macros]]
// //''Description:'' FAQ List lets you compile a list of Frequently Asked Questions and present them in a cascading style for the viewer. Each question is turned into a link that will toggle the view of the answer text. The list can be compiled either from all tiddlers containing a certain tag or from a single tiddler that contains all the needed questions and answers.
// //''Syntax:'' << {{{ faqlist mode source sortBy hrSeparator }}} >>
// // ''faqlist:'' the macro call (required)
// // ''mode:'' either "byTag" or "byTitle" (required)
// // ''source:'' the associated tag or tiddler title (required)
// // ''sortBy:'' if byTag, sort can be "title," "modifier," "modified." If byTitle, sort can be "question" and will reorder the questions in alphabetical order. (this parameter is optional; use "null" if you don't want a sort order, but want to use "hr" as the last paramter)
// // ''hrSeparator:'' if "hr" is included at the end of the call string, each question/answer set will be separated by a horizontal rule.
// //Examples: (edit these two tiddlers to see the syntax used for each)
// // • [[FAQ Method One]] (compiled from tiddlers tagged with a certain tag)
// // • [[FAQ Method Two]] (compiled using the content of a single tiddler)
// // • @@color(#ff0000):''New!''@@ [[FAQ Method Three]] (uses the {{{<<tiddler>>}}} macro to pull the faq questions from a single tiddler and the answers from other tiddlers...very cool!)
// //''Directions:'' <<tiddler StartupBehaviorDirections>> <<tiddler MacroDirections>>
// //''Notes:'' If you choose to use byTitle mode where the entire set of questions/answers comes from a single tiddler, the syntax for the tiddler content is as follows:
// // • Each question must be a single line (i.e. no hard returns) but can wrap as needed
// // • The answer to a question begins on the next line after the question and can be as long as needed. It can also include hard returns as part of the answer text, but it cannot include empty lines (i.e. an empty line is the result of pressing enter twice).
// // • Each question/answer set must be seperated by two hard returns (i.e. must have a single, blank line between them.
// // Refer to [[FAQ Tiddler Sample]] for an example.
// //''Known Issues:'' If a user clicks too quickly to toggle a FAQ entry on/off, they will go into tiddler edit mode. This should be corrected in the future by allowing web-hosted versions of the faq to disable double-clicking.
// //''Revision History:''
// // v0.1.0 (01 August 2005): initial release
// // v0.1.1 (04 August 2005): Fixed an endless loop bug (thanks to Kevin Kleinfelter).
// // v0.1.2 (19 October 2005): Fixed TW compatibility .32 bugs (newline for block quote and e.preventDefault by Clint Checketts)
// // v0.1.3 (01 November 2005): Thanks to Clint's work, I fixed a similar "jump to top" problem when using the expand & collapse buttons. Also added the description for [[FAQ Method Three]]
// // v0.1.4 (05 January 2006): Created a special version of FaqList to work with TW v2.0.0
// //''Code section:''
version.extensions.faqlist = {major: 0, minor: 1, revision: 4, date: new Date("Jan 05, 2006")};
config.macros.faqlist = {
bulletCollapse: ">",
bulletExpand: "∨",
expandButton: {title: "Expand All", tooltip: "Open all items for reading"},
collapseButton: {title: "Collapse All", tooltip: "Close all items"}
};
config.macros.faqlist.handler = function(place,macroName,params)
{
lingo = config.macros.faqlist;
var mode = params[0].toLowerCase();
var list = [];
switch(mode)
{
case "bytag":
var tagged = store.getTaggedTiddlers(params[1], params[2]);
for(t=0; t<tagged.length; t++)
{
var title = tagged[t].title;
list[t] = [title,store.getTiddlerText(title)];
}
var subTitle = store.fetchTiddler(title).getSubtitle();
break;
case "bytitle":
var faqText = store.getTiddlerText(params[1]);
var faqItems = faqText.split("\n\n");
if(params[2] == "question")
faqItems.sort();
for(t=0; t<faqItems.length; t++)
{
list[t] = [faqItems[t].substring(0,faqItems[t].indexOf("\n")),faqItems[t].substring(faqItems[t].indexOf("\n")+1)];
}
var subTitle = null;
break;
}
var faqHeading = place.appendChild(document.createElement("span"));
faqHeading.appendChild(createTiddlyButton(faqHeading,lingo.expandButton.title,lingo.expandButton.tooltip,faqExpandAll));
faqHeading.appendChild(createTiddlyButton(faqHeading,lingo.collapseButton.title,lingo.collapseButton.tooltip,faqCollapseAll));
faqHeading.appendChild(document.createElement("p"));
var faqBody = place.appendChild(document.createElement("span"));
for(var t=0; t<list.length; t++)
{
var title = list[t][0];
var content = "<<<\n" + list[t][1] + "=\n<<<\n";
var theClass = "tiddlyLinkExisting tiddlyLink";
var itemHeading = faqBody.appendChild(document.createElement("span"));
itemHeading.appendChild(document.createTextNode(config.macros.faqlist.bulletCollapse + " "));
createTiddlyButton(itemHeading,title,subTitle,faqToggleThis,theClass);
var itemBody = faqBody.appendChild(document.createElement("span"));
itemBody.style.display = "none";
itemBody.className = "itemBody";
wikify(content,itemBody,null,null);
faqBody.appendChild(itemBody);
faqBody.appendChild(document.createElement("p"));
if(params[3] == "hr")
faqBody.appendChild(document.createElement("hr"));
}
}
function faqToggleThis(e)
{
var content = this.parentNode.nextSibling;
var shown = content.style.display;
if(shown == "none")
{
content.style.display = "inline";
this.previousSibling.nodeValue = config.macros.faqlist.bulletExpand + " ";
}
else
{
content.style.display = "none";
this.previousSibling.nodeValue = config.macros.faqlist.bulletCollapse + " ";
}
}
function faqExpandAll(e)
{
for(t=0; t<this.parentNode.nextSibling.childNodes.length; t++)
{
if(this.parentNode.nextSibling.childNodes[t].className == "itemBody")
{
this.parentNode.nextSibling.childNodes[t].style.display = "inline";
this.parentNode.nextSibling.childNodes[t].previousSibling.childNodes[0].nodeValue = config.macros.faqlist.bulletExpand + " ";
}
}
// e.preventDefault();
}
function faqCollapseAll(e)
{
for(t=0; t<this.parentNode.nextSibling.childNodes.length; t++)
{
if(this.parentNode.nextSibling.childNodes[t].className == "itemBody")
{
this.parentNode.nextSibling.childNodes[t].style.display = "none";
this.parentNode.nextSibling.childNodes[t].previousSibling.childNodes[0].nodeValue = config.macros.faqlist.bulletCollapse + " ";
}
}
// e.preventDefault();
}
/***
|Location|http://visualtw.ouvaton.org/VisualTW.html|
|Version|1.0.0|
|Requires|~TW2.2.x|
|Browsers|Firefox 2.0.x, IE 6.0+, others|
!Description:
//create//, //edit//, //view// and //delete// commands in toolbar <<toolbar fields>>
!Demo:
On [[homepage|http://visualtw.ouvaton.org/VisualTW.html]], see [[FieldEditor example]]
!Installation:
*import this tiddler from [[homepage|http://visualtw.ouvaton.org/VisualTW.html]] (tagged as systemConfig)
*save and reload
*optionnaly : add the following css text in your StyleSheet : {{{#popup tr.fieldTableRow td {padding:1px 3px 1px 3px;}}}}
!Code
***/
//{{{
config.commands.fields.handlePopup = function(popup,title) {
var tiddler = store.fetchTiddler(title);
if(!tiddler)
return;
var fields = {};
store.forEachField(tiddler,function(tiddler,fieldName,value) {fields[fieldName] = value;},true);
var items = [];
for(var t in fields) {
var editCommand = "<<untiddledCall editFieldDialog "+escape(title)+" "+escape(t)+">>";
var deleteCommand = "<<untiddledCall deleteField "+escape(title)+" "+escape(t)+">>";
var renameCommand = "<<untiddledCall renameField "+escape(title)+" "+escape(t)+">>";
items.push({field: t,value: fields[t], actions: editCommand+renameCommand+deleteCommand});
}
items.sort(function(a,b) {return a.field < b.field ? -1 : (a.field == b.field ? 0 : +1);});
var createNewCommand = "<<untiddledCall createField "+escape(title)+">>";
items.push({field : "", value : "", actions:createNewCommand });
if(items.length > 0)
ListView.create(popup,items,this.listViewTemplate);
else
createTiddlyElement(popup,"div",null,null,this.emptyText);
}
config.commands.fields.listViewTemplate = {
columns: [
{name: 'Field', field: 'field', title: "Field", type: 'String'},
{name: 'Actions', field: 'actions', title: "Actions", type: 'WikiText'},
{name: 'Value', field: 'value', title: "Value", type: 'WikiText'}
],
rowClasses: [
{className: 'fieldTableRow', field: 'actions'}
],
buttons: [ //can't use button for selected then delete, because click on checkbox will hide the popup
]
}
config.macros.untiddledCall = { // when called from listview, tiddler is unset, so we need to pass tiddler as parameter
handler : function(place,macroName,params,wikifier,paramString) {
var macroName = params.shift();
if (macroName) var macro = config.macros[macroName];
var title = params.shift();
if (title) var tiddler = store.getTiddler(unescape(title));
if (macro) macro.handler(place,macroName,params,wikifier,paramString,tiddler);
}
}
config.macros.deleteField = {
handler : function(place,macroName,params,wikifier,paramString,tiddler) {
if(!readOnly && params[0]) {
fieldName = unescape(params[0]);
var btn = createTiddlyButton(place,"delete", "delete "+fieldName,this.onClickDeleteField);
btn.setAttribute("title",tiddler.title);
btn.setAttribute("fieldName", fieldName);
}
},
onClickDeleteField : function() {
var title=this.getAttribute("title");
var fieldName=this.getAttribute("fieldName");
var tiddler = store.getTiddler(title);
if (tiddler && fieldName && confirm("delete field " + fieldName+" from " + title +" tiddler ?")) {
delete tiddler.fields[fieldName];
story.refreshTiddler(title,"ViewTemplate",true);
}
return false;
}
}
config.macros.createField = {
handler : function(place,macroName,params,wikifier,paramString,tiddler) {
if(!readOnly) {
var btn = createTiddlyButton(place,"create new", "create a new field",this.onClickCreateField);
btn.setAttribute("title",tiddler.title);
}
},
onClickCreateField : function() {
var title=this.getAttribute("title");
var tiddler = store.getTiddler(title);
if (tiddler) {
var fieldName = prompt("Field name","");
if (store.getValue(tiddler,fieldName)) {
window.alert("This field already exists.");
}
else if (fieldName) {
var v = prompt("Field value","");
tiddler.fields[fieldName]=v;
story.refreshTiddler(title,"ViewTemplate",true);
}
}
return false;
}
}
config.macros.editFieldDialog = {
handler : function(place,macroName,params,wikifier,paramString,tiddler) {
if(!readOnly && params[0]) {
fieldName = unescape(params[0]);
var btn = createTiddlyButton(place,"edit", "edit this field",this.onClickEditFieldDialog);
btn.setAttribute("title",tiddler.title);
btn.setAttribute("fieldName", fieldName);
}
},
onClickEditFieldDialog : function() {
var title=this.getAttribute("title");
var tiddler = store.getTiddler(title);
var fieldName=this.getAttribute("fieldName");
if (tiddler && fieldName) {
var value = tiddler.fields[fieldName];
value = value ? value : "";
var lines = value.match(/\n/mg);
lines = lines ? true : false;
if (!lines || confirm("This field contains more than one line. Only the first line will be kept if you edit it here. Proceed ?")) {
var v = prompt("Field value",value);
tiddler.fields[fieldName]=v;
story.refreshTiddler(title,"ViewTemplate",true);
}
}
return false;
}
}
config.macros.renameField = {
handler : function(place,macroName,params,wikifier,paramString,tiddler) {
if(!readOnly && params[0]) {
fieldName = unescape(params[0]);
var btn = createTiddlyButton(place,"rename", "rename "+fieldName,this.onClickRenameField);
btn.setAttribute("title",tiddler.title);
btn.setAttribute("fieldName", fieldName);
}
},
onClickRenameField : function() {
var title=this.getAttribute("title");
var fieldName=this.getAttribute("fieldName");
var tiddler = store.getTiddler(title);
if (tiddler && fieldName) {
var newName = prompt("Rename " + fieldName + " as ?", fieldName);
if (newName) {
tiddler.fields[newName]=tiddler.fields[fieldName];
delete tiddler.fields[fieldName];
story.refreshTiddler(title,"ViewTemplate",true);
}
}
return false;
}
}
//}}}
Use <<toolbar fields>> in toolbar to see this tiddler fields.
!!Install an Extension/Theme/Plugin
# select Tools -> Add-ons. A pop-up box appears.
# Click Get Add-ons
# If @@Adblock Plus@@ does ''not'' appear in the Recommended list (as it will usually do) type "Adblock Plus" into the search box and click the magnifier.
# to Download and install Add-on click the [Add to Firefox] button
** another pop-up will appear. Click [install now]
# The add-on will not be active until you restart but you may wish to take this opportunity to install other add-ons.
# to install add-ons not in the recommended list, click @@Browse all Add-ons@@ link
** a new ''Firefox tab'' will appear and you can search or browse for the one you want
** click Add to Firefox
** If there's an end-user licence, you'll be asked to Accept it and then install.
# click [Restart Firefox] when you're ready.
!!Useful Add-ons
* Block the display of all in browser adverts +++[Adblock Plus]
If you use no other extensions you really need this one! It blocks most every within browser advert. After you have installed this and then restarted Firefox you'll be asked if you want to subscribe to a maintained list of ad filters. This is like a central spam filter list. To do this:
* check ''Easylist(USA)''
* click [Subscribe]. (bottom right corner of window)
!!!Before and after Adblock
+++[Pandora before Adblock]
[img[graphics/ad-block_before_pandora.png]]
===
+++[Pandora after Adblock]
[img[graphics/ad-block_after_pandora.png]]
===
[[Wired before Adblock|graphics/ad-block_before_wired.png]]<<imagebox>> [[Wired after Adblock|graphics/ad-block_after_wired.png]]<<imagebox>>
----
===
* Save web sites and annotate +++[Scrapbook]>
Invaluable for saving online forms you've filled in, airline bookings, online transactions, any site that you want to quickly save. And you can annotate the page too.
===
* No more lost forms +++[Lazarus]>
Automatically saves all forms for easy retrieval later on. Lazarus securely saves every form as you type it, and if the submission fails you can right click, and select "recover form" to restore the form to it's prior state. But this does @@not@@ seem to work with forms that have HTML WYSWG editors such as Moodle and els.
===
* Screen captures with +++[Fireshot]>
Create screenshots of web pages (entirely or just visible part).Unlike other extensions, this plugin provides a set of editing and annotation tools, which let users quickly modify web captures and insert text annotations and graphical annotations.
;Note:
:PC only. Boo!
===
* Save your bookmarks with +++[Delicious bookmarks]
===
* Use Download Helper to download ~YouTube Videos
!!On Windows XP
# You'll want to empty the browser cache before backing up -- [[Clear private data|Firefox configuring]]. You might want to retain everything else.
# Drill down to {{{
c:\Documents and Settings\<username>\Application Data\Mozilla\Firefox\Profiles
}}} There you'll find a folder with a name like {{{52wam5jk.default}}}.
# Copy this folder and subfolders to other storage.
!!On Mac ~OS-X
# Clear the browser cache as above.
# All the Firefox settings are stored at {{{
<username>/Library/Application Support/Firefox/Profiles/
}}}. There you'll find a folder called something like {{{pfi3dtgy.default}}}
# Copy this to a safe place
* +++[Set home page]
* type in desired URL or use Google
* drag site icon from address bar and drop onto Home button
* popup box : 'Do you want this document to be your new home page?' -- ''Yes''
===
* Add New Window and New Tab buttons for convenience : +++[Customize toolbar]
* ((Right-click(PC))) or ((Ctrl-Click(Mac))) on toolbar (choose a space on the toolbar with no buttons to rt-click) and choose ''Customize''
* drag and drop @@New Window@@ and @@New Tab@@ buttons to a place on the toolbar. Suggest just left of the Back button
* drag and drop Separators as desired
* Click ''Done'' when finished
===
* +++[Searching]
* use the @@Google@@ search box on the right of the address box.
* click pulldown and @@Manage search engines@@ to configure default searches. Ask Amy Bryant for sophisticated searching possibilities.
===
* +++[Tools : Clear Private Data]
If using Firefox on a Public machine (eg Library, Lab or Internet Cafe) you will want to erase:
** browsing history
** cache
** Cookies
** Offline website data
** Saved passwords (you might have accidentally saved a password)
** Authenticated sessions
Click @@Clear Private Data Now@@
===
* +++[Tools : Options]
<<tiddler [[Firefox option settings]]>>
===
[[Documentation|http://support.mozilla.com/en-US/kb/Options+window]] from Mozilla Firefox site
* +++!!![Main]
* Startup : When Firefox starts -> 'show my windows and tabs from last time'. Optional -- I like to do this.
* Add-ons. This includes extensions, themes and plugins -- see @@[[Manage Add-ons|Firefox Add-ons]]@@
===
* +++!!![Tabs]
* Open windows in new tab
* Can switch to new tab if desired
===
* +++!!![Content]
Choose fonts suitable for viewing content on the web. Remember that fonts are ''local'' to your machine.
* Click @@Fonts & Colours : Advanced@@
* My preferred settings :
** Proportional : Sans Serif
** Serif : Palatino Linotype / Palatino (large x height, much more readable than TNR on the web)
** Sans-serif : Verdana / Helvetica (Verdana designed for web display)
** Monospace : Courier sucks -- Monaco (Mac) is great. Andale Mono or other 'Mono' font on PC.
* Check @@Allow page to choose own fonts@@
===
* +++!!![Privacy]
Suggested:
* Perhaps ''uncheck'' @@Remember what I enter in forms and search bar@@ -- using portable firefox this is less of an issue.
* ''uncheck'' @@Accept thrid party cookies@@
* perhaps @@Clear private data when close@@ -- certainly an issue on shared PCs
===
*+++!!![Security]
* perhaps uncheck @@Remember passwords@@. Useful feature but can lead to complications.
===
* +++!!![Advanced]
* enable spell checking. Browsing : @@check spelling as I type@@. For more details see [[Firefox spell checking]]
===
* To set spell checking go to the [[Advanced option setting|Firefox option settings]]
* Take a look at the official documentation for [[using the spell checker|http://support.mozilla.com/en-US/kb/Using+the+spell+checker]]
* The Firefox spell checker will work in most web forms. You can tell when it's working because you'll see red dotted lines on words that are not recognized.
* When using a WYSWYG text entry form (such as on Moodle) which commandeers the right mouse button the spell check may not function.
* To use, right-click on the misspelled word:
[img[spell checking and configuration|graphics/firefox_spell-checking.png]]
* You can add the word to the dictionary & add other languages too.
/***
|Name|FontSizePlugin|
|Created by|SaqImtiaz|
|Location|http://tw.lewcid.org/#FontSizePlugin|
|Version|1.0|
|Requires|~TW2.x|
!Description:
Resize tiddler text on the fly. The text size is remembered between sessions by use of a cookie.
You can customize the maximum and minimum allowed sizes.
(only affects tiddler content text, not any other text)
Also, you can load a TW file with a font-size specified in the url.
Eg: http://tw.lewcid.org/#font:110
!Demo:
Try using the font-size buttons in the sidebar, or in the MainMenu above.
!Installation:
Copy the contents of this tiddler to your TW, tag with systemConfig, save and reload your TW.
Then put {{{<<fontSize "font-size:">>}}} in your SideBarOptions tiddler, or anywhere else that you might like.
!Usage
{{{<<fontSize>>}}} results in <<fontSize>>
{{{<<fontSize font-size: >>}}} results in <<fontSize font-size:>>
!Customizing:
The buttons and prefix text are wrapped in a span with class fontResizer, for easy css styling.
To change the default font-size, and the maximum and minimum font-size allowed, edit the config.fontSize.settings section of the code below.
!Notes:
This plugin assumes that the initial font-size is 100% and then increases or decreases the size by 10%. This stepsize of 10% can also be customized.
!History:
*27-07-06, version 1.0 : prevented double clicks from triggering editing of containing tiddler.
*25-07-06, version 0.9
!Code
***/
//{{{
config.fontSize={};
//configuration settings
config.fontSize.settings =
{
defaultSize : 100, // all sizes in %
maxSize : 200,
minSize : 40,
stepSize : 10
};
//startup code
var fontSettings = config.fontSize.settings;
if (!config.options.txtFontSize)
{config.options.txtFontSize = fontSettings.defaultSize;
saveOptionCookie("txtFontSize");}
setStylesheet(".tiddler .viewer {font-size:"+config.options.txtFontSize+"%;}\n","fontResizerStyles");
setStylesheet("#contentWrapper .fontResizer .button {display:inline;font-size:105%; font-weight:bold; margin:0 1px; padding: 0 3px; text-align:center !important;}\n .fontResizer {margin:0 0.5em;}","fontResizerButtonStyles");
//macro
config.macros.fontSize={};
config.macros.fontSize.handler = function (place,macroName,params,wikifier,paramString,tiddler)
{
var sp = createTiddlyElement(place,"span",null,"fontResizer");
sp.ondblclick=this.onDblClick;
if (params[0])
createTiddlyText(sp,params[0]);
createTiddlyButton(sp,"+","increase font-size",this.incFont);
createTiddlyButton(sp,"=","reset font-size",this.resetFont);
createTiddlyButton(sp,"–","decrease font-size",this.decFont);
}
config.macros.fontSize.onDblClick = function (e)
{
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
return false;
}
config.macros.fontSize.setFont = function ()
{
saveOptionCookie("txtFontSize");
setStylesheet(".tiddler .viewer {font-size:"+config.options.txtFontSize+"%;}\n","fontResizerStyles");
}
config.macros.fontSize.incFont=function()
{
if (config.options.txtFontSize < fontSettings.maxSize)
config.options.txtFontSize = (config.options.txtFontSize*1)+fontSettings.stepSize;
config.macros.fontSize.setFont();
}
config.macros.fontSize.decFont=function()
{
if (config.options.txtFontSize > fontSettings.minSize)
config.options.txtFontSize = (config.options.txtFontSize*1) - fontSettings.stepSize;
config.macros.fontSize.setFont();
}
config.macros.fontSize.resetFont=function()
{
config.options.txtFontSize=fontSettings.defaultSize;
config.macros.fontSize.setFont();
}
config.paramifiers.font =
{
onstart: function(v)
{
config.options.txtFontSize = v;
config.macros.fontSize.setFont();
}
};
//}}}
/***
|''Name:''|ForEachTiddlerPlugin|
|''Version:''|1.0.6 (2006-09-16)|
|''Source:''|http://tiddlywiki.abego-software.de/#ForEachTiddlerPlugin|
|''Author:''|UdoBorkowski (ub [at] abego-software [dot] de)|
|''Licence:''|[[BSD open source license (abego Software)|http://www.abego-software.de/legal/apl-v10.html]]|
|''Copyright:''|© 2005-2006 [[abego Software|http://www.abego-software.de]]|
|''TiddlyWiki:''|1.2.38+, 2.0|
|''Browser:''|Firefox 1.0.4+; Firefox 1.5; InternetExplorer 6.0|
!Description
Create customizable lists, tables etc. for your selections of tiddlers. Specify the tiddlers to include and their order through a powerful language.
''Syntax:''
|>|{{{<<}}}''forEachTiddler'' [''in'' //tiddlyWikiPath//] [''where'' //whereCondition//] [''sortBy'' //sortExpression// [''ascending'' //or// ''descending'']] [''script'' //scriptText//] [//action// [//actionParameters//]]{{{>>}}}|
|//tiddlyWikiPath//|The filepath to the TiddlyWiki the macro should work on. When missing the current TiddlyWiki is used.|
|//whereCondition//|(quoted) JavaScript boolean expression. May refer to the build-in variables {{{tiddler}}} and {{{context}}}.|
|//sortExpression//|(quoted) JavaScript expression returning "comparable" objects (using '{{{<}}}','{{{>}}}','{{{==}}}'. May refer to the build-in variables {{{tiddler}}} and {{{context}}}.|
|//scriptText//|(quoted) JavaScript text. Typically defines JavaScript functions that are called by the various JavaScript expressions (whereClause, sortClause, action arguments,...)|
|//action//|The action that should be performed on every selected tiddler, in the given order. By default the actions [[addToList|AddToListAction]] and [[write|WriteAction]] are supported. When no action is specified [[addToList|AddToListAction]] is used.|
|//actionParameters//|(action specific) parameters the action may refer while processing the tiddlers (see action descriptions for details). <<tiddler [[JavaScript in actionParameters]]>>|
|>|~~Syntax formatting: Keywords in ''bold'', optional parts in [...]. 'or' means that exactly one of the two alternatives must exist.~~|
See details see [[ForEachTiddlerMacro]] and [[ForEachTiddlerExamples]].
!Revision history
* v1.0.6 (2006-09-16)
** Context provides "viewerTiddler", i.e. the tiddler used to view the macro. Most times this is equal to the "inTiddler", but when using the "tiddler" macro both may be different.
** Support "begin", "end" and "none" expressions in "write" action
* v1.0.5 (2006-02-05)
** Pass tiddler containing the macro with wikify, context object also holds reference to tiddler containing the macro ("inTiddler"). Thanks to SimonBaird.
** Support Firefox 1.5.0.1
** Internal
*** Make "JSLint" conform
*** "Only install once"
* v1.0.4 (2006-01-06)
** Support TiddlyWiki 2.0
* v1.0.3 (2005-12-22)
** Features:
*** Write output to a file supports multi-byte environments (Thanks to Bram Chen)
*** Provide API to access the forEachTiddler functionality directly through JavaScript (see getTiddlers and performMacro)
** Enhancements:
*** Improved error messages on InternetExplorer.
* v1.0.2 (2005-12-10)
** Features:
*** context object also holds reference to store (TiddlyWiki)
** Fixed Bugs:
*** ForEachTiddler 1.0.1 has broken support on win32 Opera 8.51 (Thanks to BrunoSabin for reporting)
* v1.0.1 (2005-12-08)
** Features:
*** Access tiddlers stored in separated TiddlyWikis through the "in" option. I.e. you are no longer limited to only work on the "current TiddlyWiki".
*** Write output to an external file using the "toFile" option of the "write" action. With this option you may write your customized tiddler exports.
*** Use the "script" section to define "helper" JavaScript functions etc. to be used in the various JavaScript expressions (whereClause, sortClause, action arguments,...).
*** Access and store context information for the current forEachTiddler invocation (through the build-in "context" object) .
*** Improved script evaluation (for where/sort clause and write scripts).
* v1.0.0 (2005-11-20)
** initial version
!Code
***/
//{{{
//============================================================================
//============================================================================
// ForEachTiddlerPlugin
//============================================================================
//============================================================================
// Only install once
if (!version.extensions.ForEachTiddlerPlugin) {
if (!window.abego) window.abego = {};
version.extensions.ForEachTiddlerPlugin = {
major: 1, minor: 0, revision: 6,
date: new Date(2006,8,16),
source: "http://tiddlywiki.abego-software.de/#ForEachTiddlerPlugin",
licence: "[[BSD open source license (abego Software)|http://www.abego-software.de/legal/apl-v10.html]]",
copyright: "Copyright (c) abego Software GmbH, 2005-2006 (www.abego-software.de)"
};
// For backward compatibility with TW 1.2.x
//
if (!TiddlyWiki.prototype.forEachTiddler) {
TiddlyWiki.prototype.forEachTiddler = function(callback) {
for(var t in this.tiddlers) {
callback.call(this,t,this.tiddlers[t]);
}
};
}
//============================================================================
// forEachTiddler Macro
//============================================================================
version.extensions.forEachTiddler = {
major: 1, minor: 0, revision: 5, date: new Date(2006,2,5), provider: "http://tiddlywiki.abego-software.de"};
// ---------------------------------------------------------------------------
// Configurations and constants
// ---------------------------------------------------------------------------
config.macros.forEachTiddler = {
// Standard Properties
label: "forEachTiddler",
prompt: "Perform actions on a (sorted) selection of tiddlers",
// actions
actions: {
addToList: {},
write: {}
}
};
// ---------------------------------------------------------------------------
// The forEachTiddler Macro Handler
// ---------------------------------------------------------------------------
config.macros.forEachTiddler.getContainingTiddler = function(e) {
while(e && !hasClass(e,"tiddler"))
e = e.parentNode;
var title = e ? e.getAttribute("tiddler") : null;
return title ? store.getTiddler(title) : null;
};
config.macros.forEachTiddler.handler = function(place,macroName,params,wikifier,paramString,tiddler) {
// config.macros.forEachTiddler.traceMacroCall(place,macroName,params,wikifier,paramString,tiddler);
if (!tiddler) tiddler = config.macros.forEachTiddler.getContainingTiddler(place);
// --- Parsing ------------------------------------------
var i = 0; // index running over the params
// Parse the "in" clause
var tiddlyWikiPath = undefined;
if ((i < params.length) && params[i] == "in") {
i++;
if (i >= params.length) {
this.handleError(place, "TiddlyWiki path expected behind 'in'.");
return;
}
tiddlyWikiPath = this.paramEncode((i < params.length) ? params[i] : "");
i++;
}
// Parse the where clause
var whereClause ="true";
if ((i < params.length) && params[i] == "where") {
i++;
whereClause = this.paramEncode((i < params.length) ? params[i] : "");
i++;
}
// Parse the sort stuff
var sortClause = null;
var sortAscending = true;
if ((i < params.length) && params[i] == "sortBy") {
i++;
if (i >= params.length) {
this.handleError(place, "sortClause missing behind 'sortBy'.");
return;
}
sortClause = this.paramEncode(params[i]);
i++;
if ((i < params.length) && (params[i] == "ascending" || params[i] == "descending")) {
sortAscending = params[i] == "ascending";
i++;
}
}
// Parse the script
var scriptText = null;
if ((i < params.length) && params[i] == "script") {
i++;
scriptText = this.paramEncode((i < params.length) ? params[i] : "");
i++;
}
// Parse the action.
// When we are already at the end use the default action
var actionName = "addToList";
if (i < params.length) {
if (!config.macros.forEachTiddler.actions[params[i]]) {
this.handleError(place, "Unknown action '"+params[i]+"'.");
return;
} else {
actionName = params[i];
i++;
}
}
// Get the action parameter
// (the parsing is done inside the individual action implementation.)
var actionParameter = params.slice(i);
// --- Processing ------------------------------------------
try {
this.performMacro({
place: place,
inTiddler: tiddler,
whereClause: whereClause,
sortClause: sortClause,
sortAscending: sortAscending,
actionName: actionName,
actionParameter: actionParameter,
scriptText: scriptText,
tiddlyWikiPath: tiddlyWikiPath});
} catch (e) {
this.handleError(place, e);
}
};
// Returns an object with properties "tiddlers" and "context".
// tiddlers holds the (sorted) tiddlers selected by the parameter,
// context the context of the execution of the macro.
//
// The action is not yet performed.
//
// @parameter see performMacro
//
config.macros.forEachTiddler.getTiddlersAndContext = function(parameter) {
var context = config.macros.forEachTiddler.createContext(parameter.place, parameter.whereClause, parameter.sortClause, parameter.sortAscending, parameter.actionName, parameter.actionParameter, parameter.scriptText, parameter.tiddlyWikiPath, parameter.inTiddler);
var tiddlyWiki = parameter.tiddlyWikiPath ? this.loadTiddlyWiki(parameter.tiddlyWikiPath) : store;
context["tiddlyWiki"] = tiddlyWiki;
// Get the tiddlers, as defined by the whereClause
var tiddlers = this.findTiddlers(parameter.whereClause, context, tiddlyWiki);
context["tiddlers"] = tiddlers;
// Sort the tiddlers, when sorting is required.
if (parameter.sortClause) {
this.sortTiddlers(tiddlers, parameter.sortClause, parameter.sortAscending, context);
}
return {tiddlers: tiddlers, context: context};
};
// Returns the (sorted) tiddlers selected by the parameter.
//
// The action is not yet performed.
//
// @parameter see performMacro
//
config.macros.forEachTiddler.getTiddlers = function(parameter) {
return this.getTiddlersAndContext(parameter).tiddlers;
};
// Performs the macros with the given parameter.
//
// @param parameter holds the parameter of the macro as separate properties.
// The following properties are supported:
//
// place
// whereClause
// sortClause
// sortAscending
// actionName
// actionParameter
// scriptText
// tiddlyWikiPath
//
// All properties are optional.
// For most actions the place property must be defined.
//
config.macros.forEachTiddler.performMacro = function(parameter) {
var tiddlersAndContext = this.getTiddlersAndContext(parameter);
// Perform the action
var actionName = parameter.actionName ? parameter.actionName : "addToList";
var action = config.macros.forEachTiddler.actions[actionName];
if (!action) {
this.handleError(parameter.place, "Unknown action '"+actionName+"'.");
return;
}
var actionHandler = action.handler;
actionHandler(parameter.place, tiddlersAndContext.tiddlers, parameter.actionParameter, tiddlersAndContext.context);
};
// ---------------------------------------------------------------------------
// The actions
// ---------------------------------------------------------------------------
// Internal.
//
// --- The addToList Action -----------------------------------------------
//
config.macros.forEachTiddler.actions.addToList.handler = function(place, tiddlers, parameter, context) {
// Parse the parameter
var p = 0;
// Check for extra parameters
if (parameter.length > p) {
config.macros.forEachTiddler.createExtraParameterErrorElement(place, "addToList", parameter, p);
return;
}
// Perform the action.
var list = document.createElement("ul");
place.appendChild(list);
for (var i = 0; i < tiddlers.length; i++) {
var tiddler = tiddlers[i];
var listItem = document.createElement("li");
list.appendChild(listItem);
createTiddlyLink(listItem, tiddler.title, true);
}
};
abego.parseNamedParameter = function(name, parameter, i) {
var beginExpression = null;
if ((i < parameter.length) && parameter[i] == name) {
i++;
if (i >= parameter.length) {
throw "Missing text behind '%0'".format([name]);
}
return config.macros.forEachTiddler.paramEncode(parameter[i]);
}
return null;
}
// Internal.
//
// --- The write Action ---------------------------------------------------
//
config.macros.forEachTiddler.actions.write.handler = function(place, tiddlers, parameter, context) {
// Parse the parameter
var p = 0;
if (p >= parameter.length) {
this.handleError(place, "Missing expression behind 'write'.");
return;
}
var textExpression = config.macros.forEachTiddler.paramEncode(parameter[p]);
p++;
// Parse the "begin" option
var beginExpression = abego.parseNamedParameter("begin", parameter, p);
if (beginExpression !== null)
p += 2;
var endExpression = abego.parseNamedParameter("end", parameter, p);
if (endExpression !== null)
p += 2;
var noneExpression = abego.parseNamedParameter("none", parameter, p);
if (noneExpression !== null)
p += 2;
// Parse the "toFile" option
var filename = null;
var lineSeparator = undefined;
if ((p < parameter.length) && parameter[p] == "toFile") {
p++;
if (p >= parameter.length) {
this.handleError(place, "Filename expected behind 'toFile' of 'write' action.");
return;
}
filename = config.macros.forEachTiddler.getLocalPath(config.macros.forEachTiddler.paramEncode(parameter[p]));
p++;
if ((p < parameter.length) && parameter[p] == "withLineSeparator") {
p++;
if (p >= parameter.length) {
this.handleError(place, "Line separator text expected behind 'withLineSeparator' of 'write' action.");
return;
}
lineSeparator = config.macros.forEachTiddler.paramEncode(parameter[p]);
p++;
}
}
// Check for extra parameters
if (parameter.length > p) {
config.macros.forEachTiddler.createExtraParameterErrorElement(place, "write", parameter, p);
return;
}
// Perform the action.
var func = config.macros.forEachTiddler.getEvalTiddlerFunction(textExpression, context);
var count = tiddlers.length;
var text = "";
if (count > 0 && beginExpression)
text += config.macros.forEachTiddler.getEvalTiddlerFunction(beginExpression, context)(undefined, context, count, undefined);
for (var i = 0; i < count; i++) {
var tiddler = tiddlers[i];
text += func(tiddler, context, count, i);
}
if (count > 0 && endExpression)
text += config.macros.forEachTiddler.getEvalTiddlerFunction(endExpression, context)(undefined, context, count, undefined);
if (count == 0 && noneExpression)
text += config.macros.forEachTiddler.getEvalTiddlerFunction(noneExpression, context)(undefined, context, count, undefined);
if (filename) {
if (lineSeparator !== undefined) {
lineSeparator = lineSeparator.replace(/\\n/mg, "\n").replace(/\\r/mg, "\r");
text = text.replace(/\n/mg,lineSeparator);
}
saveFile(filename, convertUnicodeToUTF8(text));
} else {
var wrapper = createTiddlyElement(place, "span");
wikify(text, wrapper, null/* highlightRegExp */, context.inTiddler);
}
};
// ---------------------------------------------------------------------------
// Helpers
// ---------------------------------------------------------------------------
// Internal.
//
config.macros.forEachTiddler.createContext = function(placeParam, whereClauseParam, sortClauseParam, sortAscendingParam, actionNameParam, actionParameterParam, scriptText, tiddlyWikiPathParam, inTiddlerParam) {
return {
place : placeParam,
whereClause : whereClauseParam,
sortClause : sortClauseParam,
sortAscending : sortAscendingParam,
script : scriptText,
actionName : actionNameParam,
actionParameter : actionParameterParam,
tiddlyWikiPath : tiddlyWikiPathParam,
inTiddler : inTiddlerParam, // the tiddler containing the <<forEachTiddler ...>> macro call.
viewerTiddler : config.macros.forEachTiddler.getContainingTiddler(placeParam) // the tiddler showing the forEachTiddler result
};
};
// Internal.
//
// Returns a TiddlyWiki with the tiddlers loaded from the TiddlyWiki of
// the given path.
//
config.macros.forEachTiddler.loadTiddlyWiki = function(path, idPrefix) {
if (!idPrefix) {
idPrefix = "store";
}
var lenPrefix = idPrefix.length;
// Read the content of the given file
var content = loadFile(this.getLocalPath(path));
if(content === null) {
throw "TiddlyWiki '"+path+"' not found.";
}
// Locate the storeArea div's
var posOpeningDiv = content.indexOf(startSaveArea);
var posClosingDiv = content.lastIndexOf(endSaveArea);
if((posOpeningDiv == -1) || (posClosingDiv == -1)) {
throw "File '"+path+"' is not a TiddlyWiki.";
}
var storageText = content.substr(posOpeningDiv + startSaveArea.length, posClosingDiv);
// Create a "div" element that contains the storage text
var myStorageDiv = document.createElement("div");
myStorageDiv.innerHTML = storageText;
myStorageDiv.normalize();
// Create all tiddlers in a new TiddlyWiki
// (following code is modified copy of TiddlyWiki.prototype.loadFromDiv)
var tiddlyWiki = new TiddlyWiki();
var store = myStorageDiv.childNodes;
for(var t = 0; t < store.length; t++) {
var e = store[t];
var title = null;
if(e.getAttribute)
title = e.getAttribute("tiddler");
if(!title && e.id && e.id.substr(0,lenPrefix) == idPrefix)
title = e.id.substr(lenPrefix);
if(title && title !== "") {
var tiddler = tiddlyWiki.createTiddler(title);
tiddler.loadFromDiv(e,title);
}
}
tiddlyWiki.dirty = false;
return tiddlyWiki;
};
// Internal.
//
// Returns a function that has a function body returning the given javaScriptExpression.
// The function has the parameters:
//
// (tiddler, context, count, index)
//
config.macros.forEachTiddler.getEvalTiddlerFunction = function (javaScriptExpression, context) {
var script = context["script"];
var functionText = "var theFunction = function(tiddler, context, count, index) { return "+javaScriptExpression+"}";
var fullText = (script ? script+";" : "")+functionText+";theFunction;";
return eval(fullText);
};
// Internal.
//
config.macros.forEachTiddler.findTiddlers = function(whereClause, context, tiddlyWiki) {
var result = [];
var func = config.macros.forEachTiddler.getEvalTiddlerFunction(whereClause, context);
tiddlyWiki.forEachTiddler(function(title,tiddler) {
if (func(tiddler, context, undefined, undefined)) {
result.push(tiddler);
}
});
return result;
};
// Internal.
//
config.macros.forEachTiddler.createExtraParameterErrorElement = function(place, actionName, parameter, firstUnusedIndex) {
var message = "Extra parameter behind '"+actionName+"':";
for (var i = firstUnusedIndex; i < parameter.length; i++) {
message += " "+parameter[i];
}
this.handleError(place, message);
};
// Internal.
//
config.macros.forEachTiddler.sortAscending = function(tiddlerA, tiddlerB) {
var result =
(tiddlerA.forEachTiddlerSortValue == tiddlerB.forEachTiddlerSortValue)
? 0
: (tiddlerA.forEachTiddlerSortValue < tiddlerB.forEachTiddlerSortValue)
? -1
: +1;
return result;
};
// Internal.
//
config.macros.forEachTiddler.sortDescending = function(tiddlerA, tiddlerB) {
var result =
(tiddlerA.forEachTiddlerSortValue == tiddlerB.forEachTiddlerSortValue)
? 0
: (tiddlerA.forEachTiddlerSortValue < tiddlerB.forEachTiddlerSortValue)
? +1
: -1;
return result;
};
// Internal.
//
config.macros.forEachTiddler.sortTiddlers = function(tiddlers, sortClause, ascending, context) {
// To avoid evaluating the sortClause whenever two items are compared
// we pre-calculate the sortValue for every item in the array and store it in a
// temporary property ("forEachTiddlerSortValue") of the tiddlers.
var func = config.macros.forEachTiddler.getEvalTiddlerFunction(sortClause, context);
var count = tiddlers.length;
var i;
for (i = 0; i < count; i++) {
var tiddler = tiddlers[i];
tiddler.forEachTiddlerSortValue = func(tiddler,context, undefined, undefined);
}
// Do the sorting
tiddlers.sort(ascending ? this.sortAscending : this.sortDescending);
// Delete the temporary property that holds the sortValue.
for (i = 0; i < tiddlers.length; i++) {
delete tiddlers[i].forEachTiddlerSortValue;
}
};
// Internal.
//
config.macros.forEachTiddler.trace = function(message) {
displayMessage(message);
};
// Internal.
//
config.macros.forEachTiddler.traceMacroCall = function(place,macroName,params) {
var message ="<<"+macroName;
for (var i = 0; i < params.length; i++) {
message += " "+params[i];
}
message += ">>";
displayMessage(message);
};
// Internal.
//
// Creates an element that holds an error message
//
config.macros.forEachTiddler.createErrorElement = function(place, exception) {
var message = (exception.description) ? exception.description : exception.toString();
return createTiddlyElement(place,"span",null,"forEachTiddlerError","<<forEachTiddler ...>>: "+message);
};
// Internal.
//
// @param place [may be null]
//
config.macros.forEachTiddler.handleError = function(place, exception) {
if (place) {
this.createErrorElement(place, exception);
} else {
throw exception;
}
};
// Internal.
//
// Encodes the given string.
//
// Replaces
// "$))" to ">>"
// "$)" to ">"
//
config.macros.forEachTiddler.paramEncode = function(s) {
var reGTGT = new RegExp("\\$\\)\\)","mg");
var reGT = new RegExp("\\$\\)","mg");
return s.replace(reGTGT, ">>").replace(reGT, ">");
};
// Internal.
//
// Returns the given original path (that is a file path, starting with "file:")
// as a path to a local file, in the systems native file format.
//
// Location information in the originalPath (i.e. the "#" and stuff following)
// is stripped.
//
config.macros.forEachTiddler.getLocalPath = function(originalPath) {
// Remove any location part of the URL
var hashPos = originalPath.indexOf("#");
if(hashPos != -1)
originalPath = originalPath.substr(0,hashPos);
// Convert to a native file format assuming
// "file:///x:/path/path/path..." - pc local file --> "x:\path\path\path..."
// "file://///server/share/path/path/path..." - FireFox pc network file --> "\\server\share\path\path\path..."
// "file:///path/path/path..." - mac/unix local file --> "/path/path/path..."
// "file://server/share/path/path/path..." - pc network file --> "\\server\share\path\path\path..."
var localPath;
if(originalPath.charAt(9) == ":") // pc local file
localPath = unescape(originalPath.substr(8)).replace(new RegExp("/","g"),"\\");
else if(originalPath.indexOf("file://///") === 0) // FireFox pc network file
localPath = "\\\\" + unescape(originalPath.substr(10)).replace(new RegExp("/","g"),"\\");
else if(originalPath.indexOf("file:///") === 0) // mac/unix local file
localPath = unescape(originalPath.substr(7));
else if(originalPath.indexOf("file:/") === 0) // mac/unix local file
localPath = unescape(originalPath.substr(5));
else // pc network file
localPath = "\\\\" + unescape(originalPath.substr(7)).replace(new RegExp("/","g"),"\\");
return localPath;
};
// ---------------------------------------------------------------------------
// Stylesheet Extensions (may be overridden by local StyleSheet)
// ---------------------------------------------------------------------------
//
setStylesheet(
".forEachTiddlerError{color: #ffffff;background-color: #880000;}",
"forEachTiddler");
//============================================================================
// End of forEachTiddler Macro
//============================================================================
//============================================================================
// String.startsWith Function
//============================================================================
//
// Returns true if the string starts with the given prefix, false otherwise.
//
version.extensions["String.startsWith"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
String.prototype.startsWith = function(prefix) {
var n = prefix.length;
return (this.length >= n) && (this.slice(0, n) == prefix);
};
//============================================================================
// String.endsWith Function
//============================================================================
//
// Returns true if the string ends with the given suffix, false otherwise.
//
version.extensions["String.endsWith"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
String.prototype.endsWith = function(suffix) {
var n = suffix.length;
return (this.length >= n) && (this.right(n) == suffix);
};
//============================================================================
// String.contains Function
//============================================================================
//
// Returns true when the string contains the given substring, false otherwise.
//
version.extensions["String.contains"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
String.prototype.contains = function(substring) {
return this.indexOf(substring) >= 0;
};
//============================================================================
// Array.indexOf Function
//============================================================================
//
// Returns the index of the first occurance of the given item in the array or
// -1 when no such item exists.
//
// @param item [may be null]
//
version.extensions["Array.indexOf"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
Array.prototype.indexOf = function(item) {
for (var i = 0; i < this.length; i++) {
if (this[i] == item) {
return i;
}
}
return -1;
};
//============================================================================
// Array.contains Function
//============================================================================
//
// Returns true when the array contains the given item, otherwise false.
//
// @param item [may be null]
//
version.extensions["Array.contains"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
Array.prototype.contains = function(item) {
return (this.indexOf(item) >= 0);
};
//============================================================================
// Array.containsAny Function
//============================================================================
//
// Returns true when the array contains at least one of the elements
// of the item. Otherwise (or when items contains no elements) false is returned.
//
version.extensions["Array.containsAny"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
Array.prototype.containsAny = function(items) {
for(var i = 0; i < items.length; i++) {
if (this.contains(items[i])) {
return true;
}
}
return false;
};
//============================================================================
// Array.containsAll Function
//============================================================================
//
// Returns true when the array contains all the items, otherwise false.
//
// When items is null false is returned (even if the array contains a null).
//
// @param items [may be null]
//
version.extensions["Array.containsAll"] = {major: 1, minor: 0, revision: 0, date: new Date(2005,11,20), provider: "http://tiddlywiki.abego-software.de"};
//
Array.prototype.containsAll = function(items) {
for(var i = 0; i < items.length; i++) {
if (!this.contains(items[i])) {
return false;
}
}
return true;
};
} // of "install only once"
// Used Globals (for JSLint) ==============
// ... DOM
/*global document */
// ... TiddlyWiki Core
/*global convertUnicodeToUTF8, createTiddlyElement, createTiddlyLink,
displayMessage, endSaveArea, hasClass, loadFile, saveFile,
startSaveArea, store, wikify */
//}}}
/***
!Licence and Copyright
Copyright (c) abego Software ~GmbH, 2005 ([[www.abego-software.de|http://www.abego-software.de]])
Redistribution and use in source and binary forms, with or without modification,
are permitted provided that the following conditions are met:
Redistributions of source code must retain the above copyright notice, this
list of conditions and the following disclaimer.
Redistributions in binary form must reproduce the above copyright notice, this
list of conditions and the following disclaimer in the documentation and/or other
materials provided with the distribution.
Neither the name of abego Software nor the names of its contributors may be
used to endorse or promote products derived from this software without specific
prior written permission.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES
OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT
SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT,
INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR
BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN
ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH
DAMAGE.
***/
* Add keywords/tags to everything you create or upload. Helps to organise stuff by RSS feed on the tag
* Make as much as possible public access so that everyone can see what you've been doing.
GenerateRssByTagPlugin overwrite the core generateRSS() function. And defines a txtRssTag option : <<option txtRssTag>> to specify the tag to use (defaulted to ''"toRSS"'' ).
Only tiddlers with this specific tag are inluded in the RSSFeed. If no tiddlers are selected then works with the old behaviour. (see ticket #270: http://trac.tiddlywiki.org/tiddlywiki/ticket/270).
Because the generateRSS mechanism should change in TW 2.3 this enhancement should not go in the core .
Hint : You can add {{{<<option txtRssTag>>}}} in AdvancedOptions
/***
|''Name:''|GenerateRssByTagPlugin|
|''Description:''|Only tiddlers with a specific tag are inluded in the RSSFeed. If no tiddlers are selected then works as before. (see ticket #270: http://trac.tiddlywiki.org/tiddlywiki/ticket/270). <br>RssTag: <<option txtRssTag>>|
|''Version:''|1.0.2|
|''Date:''|Apr 20, 2007|
|''Source:''|http://tiddlywiki.bidix.info/#GenerateRssByTagPlugin|
|''Author:''|BidiX (BidiX (at) bidix (dot) info)|
|''[[License]]:''|[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D ]]|
|''~CoreVersion:''|2.2.0 (Beta 5)|
***/
//{{{
version.extensions.GenerateRssByTagPlugin = {
major: 1, minor: 0, revision: 2,
date: new Date("Apr 20, 2007"),
source: 'http://tiddlywiki.bidix.info/#PasswordOptionPlugin',
author: 'BidiX (BidiX (at) bidix (dot) info',
coreVersion: '2.2.0 (Beta 5)'
};
if (!window.bidix) window.bidix = {}; // bidix namespace
bidix.generateRssByTag = function()
{
var s = [];
var d = new Date();
var u = store.getTiddlerText("SiteUrl");
// Assemble the header
s.push("<" + "?xml version=\"1.0\"" + " encoding='UTF-8' " + "?" + ">");
s.push("<rss version=\"2.0\">");
s.push("<channel>");
s.push("<title" + ">" + wikifyPlain("SiteTitle").htmlEncode() + "</title" + ">");
if(u)
s.push("<link>" + u.htmlEncode() + "</link>");
s.push("<description>" + wikifyPlain("SiteSubtitle").htmlEncode() + "</description>");
s.push("<language>en-us</language>");
s.push("<copyright>Copyright " + d.getFullYear() + " " + config.options.txtUserName.htmlEncode() + "</copyright>");
s.push("<pubDate>" + d.toGMTString() + "</pubDate>");
s.push("<lastBuildDate>" + d.toGMTString() + "</lastBuildDate>");
s.push("<docs>http://blogs.law.harvard.edu/tech/rss</docs>");
s.push("<generator>TiddlyWiki " + version.major + "." + version.minor + "." + version.revision + "</generator>");
// The body
var tiddlers;
if (config.options.txtRssTag && store.getTaggedTiddlers(config.options.txtRssTag).length > 0)
tiddlers = store.getTaggedTiddlers(config.options.txtRssTag,"modified");
else
tiddlers = store.getTiddlers("modified","[[excludeLists]]");
var n = config.numRssItems > tiddlers.length ? 0 : tiddlers.length-config.numRssItems;
for (var t=tiddlers.length-1; t>=n; t--)
s.push(tiddlers[t].saveToRss(u));
// And footer
s.push("</channel>");
s.push("</rss>");
// Save it all
return s.join("\n");
};
//
// Initializations
//
bidix.generateRss = generateRss; // backup core version
generateRss = bidix.generateRssByTag; // install new one
config.options.txtRssTag = "toRSS"; // default RssTag. use <<option txtRssTag>> to overwritte
merge(config.optionsDesc,{txtRssTag: "Only tiddlers with this tag will be included in the RSS Feed."});
//}}}
!!Problems with using Elgg for a group web site
This semester (Fall 07) Judi Hetrick's Journalism 310 class has been using Elgg v0.8 for class blogging ([[EC Blogs|http://blogs.barnabas.earlham.edu]]. She wanted to aggregate student research written up as web pages into a web site rather like last year's [[Intersections: where Earlham meets Richmond|http://www.earlham.edu/~hetriju/jrn/]]. This year however she wants students to create their own web pages and then she will link to them. So, learn ~DreamWeaver, HTML etc in 30 minutes. ARGGG!
I thought that perhaps since they were already using Elgg I could find a way to accomplish the same end but without students having to faff around with HTML and ~DreamWeaver.
!!!My original idea was :
* create a community called Journalism 07 and have that aggregate the student's pages.
* Have the header graphic display across or near the top of the page.
* Have the students write their content as a blog entry and tag it with a known tag, say @@journ07@@
* Open the feed for this tag as a Community RSS feed.
* Insert RSS feed widgets in the Profile, one on the left and the other on the right, which would display the student's pages.
* Viola, neat class site; students don't have to learn ~DreamWeaver and it's all nicely accessible with <web site>/journ07
!!!Problems / Issues
* There was no way of getting the banner graphic to display across the whole page. The nearest I could get was a Profile photo which [[looked naff|graphics/community_profile.png]]<<imagebox>>
* Although there's a link to Manage widgets in the community, try as I might, I could get none of the widgets I wanted to add to 'stick' into the Profile. @@[fall at Hurdle #1]@@
** I found that these widget settings were actually appearing in the ''community owner's'' Profile.
* Displaying a feed using the Feed widget box was a pain. First you have to go to where? Where are the RSS feeds configured. I always forget. Ah yes, "Your Resources". How is that related to RSS feeds?
** assuming that all the students have tagged their blog posting with exactly the same tag (and that's a big 'if') you have to roam around until you discover the correct RSS feed link to copy. Then go back to Your Resources and subscribe.
** nothing appears when you click View content. I think that this is because only new(ish) content is displayed. @@[Fall at Hurdle #2]@@
* You ''can'' use the Text box widget to display a list of links and graphic. But this does ''not'' have the ~TinyMCE WYSWG editor and so you have to enter raw HTML. @@[Suboptimal]@@
* You can also using the blog widget to display a user's blog postings but all the posts get displayed which is not what we want in this case.
>Here's what a mixed up Profile [[looks like|graphics/profile_widget_layout.png]]<<imagebox>>
!!SOLUTION
# Make all students in the class your 'Friends'. You'd want this anyway.
# The students type or copy their content into a blog post. Format it there. Add links, graphics, etc. At the bottom of the posting create a link to the Teacher's Profile page.
# Visit the blog posting and copy the URL to that blog posting (it's permanent).
# In the Text box widget make an HTML link to that blog posting.
# repeat with half of the class's blog entries.
# start a new Text box on the other side of the page.
# repeat with the rest of the class.
!!!!SUSSED
/***
| Name|HideWhenPlugin|
| Description|Allows conditional inclusion/exclusion in templates|
| Version|3.0 ($Rev: 1845 $)|
| Date|$Date: 2007-03-16 15:19:22 +1000 (Fri, 16 Mar 2007) $|
| Source|http://mptw.tiddlyspot.com/#HideWhenPlugin|
| Author|Simon Baird <simon.baird@gmail.com>|
| [[License]]|http://mptw.tiddlyspot.com/#TheBSDLicense|
For use in ViewTemplate and EditTemplate. Example usage:
{{{<div macro="showWhenTagged Task">[[TaskToolbar]]</div>}}}
{{{<div macro="showWhen tiddler.modifier == 'BartSimpson'"><img src="bart.gif"/></div>}}}
***/
//{{{
window.removeElementWhen = function(test,place) {
if (test) {
removeChildren(place);
place.parentNode.removeChild(place);
}
};
merge(config.macros,{
hideWhen: { handler: function(place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( eval(paramString), place);
}},
showWhen: { handler: function(place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( !eval(paramString), place);
}},
hideWhenTagged: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( tiddler.tags.containsAll(params), place);
}},
showWhenTagged: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( !tiddler.tags.containsAll(params), place);
}},
hideWhenTaggedAny: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( tiddler.tags.containsAny(params), place);
}},
showWhenTaggedAny: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( !tiddler.tags.containsAny(params), place);
}},
hideWhenTaggedAll: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( tiddler.tags.containsAll(params), place);
}},
showWhenTaggedAll: { handler: function (place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( !tiddler.tags.containsAll(params), place);
}},
hideWhenExists: { handler: function(place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( store.tiddlerExists(params[0]) || store.isShadowTiddler(params[0]), place);
}},
showWhenExists: { handler: function(place,macroName,params,wikifier,paramString,tiddler) {
removeElementWhen( !(store.tiddlerExists(params[0]) || store.isShadowTiddler(params[0])), place);
}}
});
//}}}
I have extracted HistoryPlugin from [[iplugin.js|http://itw.bidix.info/#iPlugins]], the external file containaing all plugins for [[iTW|http://itw.bidix.info/]], in a stand alone plugin available at http://tiddlywiki.bidix.info/#HistoryPlugin
Enjoy HistoryPlugin
We will be covering the following:
# Find [[Earlham Learning Spaces|https://els.earlham.edu]] , login and change your User details
** add a site picture
# Create a [[blog entry|Blog post]]
# Find another person
** [[make a friend|Add friend]]
** comment on a blog entry
# Find [[Community]]
** join
# Upload photo(s) to Files
** check out the [[Gallery|Photo gallery]]
# [[Link to photo(s)|Add pictures]] from blog entry
!Online Learning Framework for Digital Natives
!!Components
* students as learning peers
** faculty as learning mentors (as opposed to "sage on the stage")
* empowering true collaboration
* audience [[why this matters]]:
** primary : within institution
** secondary : complete web
* sense of identity. Comfort level within institution.
** //Earlham// space
* familiar concepts / processes from social networking sites (eg Facebook) established in an intentional learning environment.
* transformation of digital consumer to digital creator
<!--{{{-->
<link rel='alternate' type='application/rss+xml' title='RSS' href='index.xml' />
<!--}}}-->
<style type="text/css">#contentWrapper {display:none;}</style><div id="SplashScreen" style="border: 3px solid #ccc; display: block; text-align: center; width: 320px; margin: 100px auto; padding: 50px; color:#000; font-size: 28px; font-family:Tahoma; background-color:#eee;"><b>earlham learning spaces docs</b> is loading<blink> ...</blink><br><br><span style="font-size: 14px; color:red;">Requires Javascript.</span></div>
UrbanArtist
http://www.styleshout.com/templates/preview/UrbanArtist1-0/index.html
----
Colourise
http://www.styleshout.com/templates/preview/Colourise1-0/index.html
----
VectorLover
http://www.styleshout.com/templates/preview/VectorLover1-0/index.html
----
pixelgreen
http://www.styleshout.com/templates/preview/PixelGreen1-2/index.html
----
techjunkie
http://www.styleshout.com/templates/preview/TechJunkie1-0/index.html
----
Coolwater
http://www.styleshout.com/templates/preview/CoolWater1-0/index.html
----
Harvestfield
http://www.styleshout.com/templates/preview/HarvestField1-0/index.html
----
Enlighten
http://www.styleshout.com/templates/preview/Enlighten1-1/index.html
/***
|Name|MiniBrowserPlugin|
|Source|http://www.TiddlyTools.com/#MiniBrowserPlugin|
|Version|1.3.1|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <br>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires|PlayerPlugin (optional, recommended)|
|Overrides||
|Options|##Configuration|
|Description|embedded browser-in-browser with favorites lists and media support|
!!!!!Usage
<<<
{{{<<miniBrowser noplayer hidecontrols URL TiddlerName TiddlerName TiddlerName...>>}}}
* ''noplayer'' (optional)<br>disables support for embedded media player (using [[PlayerPlugin]], if installed)
* ''hidecontrols'' (optional)<br>hide initial display of minibrowser controls (except for 'show controls' checkbox)<br>//note: if no initial URL is specified, controls will be shown anyway//
* ''URL'' (optional)<br>specifies an initial URL to open when the mini browser is rendered
* ''TiddlerName'', ''TiddlerName''... (optional)<br>indicates one or more tiddlers containing "HR-separated" lists of favorites.<br>//notes: if no tiddler is specified, [[MiniBrowserList]] is used by default. In addition, when adding/deleting favorites, the plugin automatically updates [[MiniBrowserList]], regardless of any alternative lists of favorites stored in separate tiddlers. After changes to [[MiniBrowserList]] are made, you can then use cut/paste to manually move entries from that tiddler into other tiddlers.//
<<<
!!!!!Configuration
<<<
Default mini browser size:
width: <<option txtMiniBrowserWidth>> height: <<option txtMiniBrowserHeight>>
<<<
!!!!!Example
>{{{<<miniBrowser>>}}}<br>{{smallform small{<<miniBrowser>>}}}
>{{{<<miniBrowser hidecontrols http://www.TiddlyWiki.com>>}}}<br>{{smallform small{<<miniBrowser hidecontrols http://www.TiddlyWiki.com>>}}}
!!!!!Revisions
<<<
2008.09.16 [1.3.1] fixed getWikifiedData() when using IE (remove \r and multiple \n)
2008.08.12 [1.3.0] added support for wikifying content from favorites lists to enable use of forEachTiddler or inline script output to generate lists on the fly.
2008.08.06 [1.2.2] corrected size control buttons to use fixed width
2008.04.07 [1.2.1] added txtMiniBrowserWidth and txtMiniBrowserHeight. cleanup init handling (somewhat)
2008.04.06 [1.2.0] added support for specifying initial URL to view (suggested by Richard Berg). When opening a URL, select matching entry (if any) in bookmarks droplist. Added support for hiding minibrowser controls.
2008.01.19 [1.1.0] added support for optional extra favorites lists stored in separate tiddlers
2007.10.15 [1.0.0] combined MiniBrowser and MediaCenter inline scripts and converted to true plugin
2006.03.01 [0.0.0] inline script
<<<
!!!!!Code
***/
//{{{
version.extensions.MiniBrowserPlugin={major: 1, minor: 3, revision: 1, date: new Date(2008,9,16)};
//}}}
//{{{
config.shadowTiddlers.MiniBrowser="<<miniBrowser>>";
//}}}
//{{{
if (config.options.txtMiniBrowserWidth==undefined) config.options.txtMiniBrowserWidth="100%";
if (config.options.txtMiniBrowserHeight==undefined) config.options.txtMiniBrowserHeight="480";
//}}}
//{{{
config.macros.miniBrowser= {
favoritesList:
"MiniBrowserList",
handler: function(place,macroName,params,wikifier,paramString,tiddler) {
var noPlayer=params[0]&¶ms[0].toLowerCase()=="noplayer"; if (noPlayer) params.shift();
if (!config.macros.player) noPlayer=true; // if PlayerPlugin not installed
var hideControls=params[0]&¶ms[0].toLowerCase()=="hidecontrols"; if (hideControls) params.shift();
var url=(params[0]&&!store.tiddlerExists(params[0]))?params.shift():"";
hideControls=hideControls&&url.length; // if no initial URL, then show controls anyway
var w=config.options.txtMiniBrowserWidth;
var h=config.options.txtMiniBrowserHeight;
// create form
var guid=new Date().getTime()+Math.random().toString(); // globally unique ID
var html=this.html;
html=html.replace(/%id%/g,guid);
html=html.replace(/%noplayer%/g,noPlayer?"true":"");
html=html.replace(/%hidecontrols%/g,hideControls?"none":"block");
html=html.replace(/%favorites%/g,params[0]||config.macros.miniBrowser.favoritesList);
createTiddlyElement(place,"span").innerHTML=html;
// init form
document.getElementById("minibrowser_controls_"+guid).style.display=hideControls?"none":"block";
document.getElementById("minibrowser_resize_"+guid).style.display=hideControls?"none":"block";
document.getElementById("minibrowser_togglecontrols_"+guid).checked=!hideControls;
document.getElementById("minibrowser_form_"+guid).url.value=url;
document.getElementById("minibrowser_form_"+guid).w.value=w;
document.getElementById("minibrowser_form_"+guid).h.value=h;
if (noPlayer) { // hide "type" list no PlayerPlugin
document.getElementById("minibrowser_type_"+guid).style.display="none";
document.getElementById("minibrowser_url_"+guid).style.width="36%";
}
// load bookmarks droplist from HR-separated tiddler contents
var b=document.getElementById("minibrowser_bookmarks_"+guid);
while (b.options[1]) b.options[1]=null; // clear list but leave 'prompt' item
var p; while (p=params.shift()) this.getFavorites(b,p); // load custom bookmarks
if (b.length<2) this.getFavorites(b,config.macros.miniBrowser.favoritesList); // default list
// load initial URL (if any)
var place=document.getElementById("minibrowser_player_"+guid);
this.load(place,guid,"","",w,h,true,noPlayer);
this.go(document.getElementById("minibrowser_form_"+guid));
},
getFavorites: function(list,tid) {
var txt=store.getTiddlerText(tid); if (!txt||!txt.trim().length) return;
txt=this.getWikifiedData(txt);
var parts=txt.split("\n----\n");
for (var p=0; p<parts.length; p++) {
var lines=parts[p].split("\n");
var label=lines.shift()||""; // 1st line=display text
var value=lines.shift()||""; // 2nd line=item value
var indent=value&&value.length?"\xa0\xa0":"";
list.options[list.length]=new Option(indent+label,value,false,false);
}
},
getWikifiedData: // wikify tiddler content, then extract text WITH newlines and HRs included
function(txt) {
var e=createTiddlyElement(document.body,"div"); wikify(txt,e);
var breaks=e.getElementsByTagName("br");
for (var b=0; b<breaks.length; b++)
breaks[b].parentNode.insertBefore(document.createTextNode("\n"),breaks[b]);
var lines=e.getElementsByTagName("hr");
for (var l=0; l<lines.length; l++)
lines[l].parentNode.insertBefore(document.createTextNode("----\n"),lines[l]);
var items=e.getElementsByTagName("li");
for (var i=0; i<items.length; i++)
items[i].parentNode.insertBefore(document.createTextNode("\n"),items[i]);
var txt=getPlainText(e);
removeNode(e);
return txt.replace(/\r*/g,"").replace(/\n\n/g,"\n");
},
load: function(place,id,type,url,w,h,showcontrols,noPlayer) {
if (noPlayer) {
if (!place) place=document.getElementById(id).parentNode;
place.innerHTML="<iframe name='"+id+"' id='"+id+"' \
src='"+url+"' width='"+w+"' height='"+h+"' \
style='background:#fff;border:1px solid'></iframe>"
} else
config.macros.player.loadURL(place,id,type,url,w,h,showcontrols);
},
go: function(f) {
var url=f.url.value.trim();
if (!url.length) url=f.url.value=f.bookmarks.value.trim();
if (!url.length) { this.done(f); return false; }
var id=f.playerID.value;
document.getElementById("minibrowser_player_"+id).style.display="block";
document.getElementById("minibrowser_controls2_"+id).style.display="block";
this.load(null,id,f.type.value,f.url.value,f.w.value,f.h.value,f.ctrls.checked,f.noPlayer.value=="true");
var matched=false; for (var i=0; i<f.bookmarks.options.length; i++) // select matching bookmark
if (f.bookmarks.options[i].value==url) { f.bookmarks.selectedIndex=i; matched=true; break; }
if (!matched) f.bookmarks.selectedIndex=0;
f.done.disabled=false;
return false;
},
done: function(f) {
var id=f.playerID.value;
this.load(null,id,null,null,f.w.value,0,f.ctrls.checked,f.noPlayer.value=="true");
document.getElementById("minibrowser_player_"+id).style.display="none";
document.getElementById("minibrowser_controls2_"+id).style.display="none";
f.done.disabled=true;
return false;
},
fit: function(place) {
var trim=89; // fudge factor to account for the other controls + padding + borders. ADJUST THIS VALUE TO FIT LAYOUT
var t=story.findContainingTiddler(place);
if (!t) { t=place; while (t && t.className!='floatingPanel') t=t.parentNode; } if (!t) return;
var w="100%"; // horizontal stretching via CSS works, but vertical stretching doesn't... so:
var h=t.offsetHeight-trim; // workaround: get containing panel/tiddler height and subtract "trim" height
var f=place.form;
this.load(null,f.playerID.value,f.type.value,f.url.value,w,h,f.ctrls.checked,f.noPlayer.value=="true"); // reload player with new size
place.form.w.value=w; place.form.h.value=h; // update width/height input fields
},
add: function(place,title) {
var v=place.value; if (!v.length) return;
var d=prompt("Please enter a description for\n"+place.value); if (!d || !d.length) return;
var who=config.options.txtUserName;
var when=new Date();
var tid=store.getTiddler(title);
var txt="%0\n%1\n----\n%2".format([d,v,tid?tid.text:""]);
store.saveTiddler(title,title,txt,who,when,tid?tid.tags:[],tid?tid.fields:{});
if (!tid) story.displayTiddler(story.findContainingTiddler(place),title);
else story.refreshTiddler(title,1,true);
var here=story.findContainingTiddler(place);
if (here) story.refreshTiddler(here.getAttribute("tiddler"),1,true);
},
del: function(place,title) {
var v=place.value; if (!v.length) return;
var d=place.options[place.selectedIndex].text; if (!d.length) return;
if (!confirm("Are you sure you want to remove this favorite?\n\n"+d+"\n"+v)) return;
var tid=store.getTiddler(title); if (!tid) return;
var who=config.options.txtUserName;
var when=new Date();
var pat='%0\n%1\n----\n'.format([d.replace(/\xa0/g,''),v]); var re=new RegExp(pat,"i");
var txt=tid.text.replace(re,"");
store.saveTiddler(title,title,txt,who,when,tid?tid.tags:[],tid?tid.fields:{});
story.refreshTiddler(title,1,true);
var here=story.findContainingTiddler(place);
if (here) story.refreshTiddler(here.getAttribute("tiddler"),1,true);
},
html: "<form id='minibrowser_form_%id%' style='display:block;margin:0;padding:0' onsubmit='return config.macros.miniBrowser.go(this);'><!-- \
--><nobr><input type='hidden' name='playerID' value='%id%'><input type='hidden' name='noPlayer' value='%noplayer%'><!-- \
--><div id='minibrowser_controls_%id%' style='display:%hidecontrols%'><!-- \
--><input type='button' value='<' title='back' style='font-size:8pt;width:3%' \
onclick='try{window.frames[\"player_%id%\"].history.go(-1)}catch(e){window.history.go(-1)}' ><!-- \
--><input type='button' value='>' title='forward' style='font-size:8pt;width:3%' \
onclick='try{window.frames[\"player_%id%\"].history.go(+1)}catch(e){window.history.go(+1)}'><!-- \
--><input type='button' value='+' title='refresh'style='font-size:8pt;width:3%' \
onclick='try{window.frames[\"player_%id%\"].location.reload()}catch(e){;}'><!-- \
--><input type='button' value='x' title='stop'style='font-size:8pt;width:3%' \
onclick='window.stop()'><!-- \
--><select name='bookmarks' id='minibrowser_bookmarks_%id%' size='1' style='font-size:8pt;width:20%' \
onchange='this.form.url.value=this.value; return config.macros.miniBrowser.go(this.form);'><!-- \
--><option value=''>bookmarks...</option><!-- \
--></select><!-- \
--><input type='button' value='add' title='add URL to the bookmarks' style='font-size:8pt;width:5%' \
favorites=\"%favorites%\" \
onclick='config.macros.miniBrowser.add(this.form.url,this.getAttribute(\"favorites\"));'><!-- \
--><input type='button' value='del' title='remove URL from the bookmarks' style='font-size:8pt;width:5%' \
favorites=\"%favorites%\" \
onclick='config.macros.miniBrowser.del(this.form.bookmarks,this.getAttribute(\"favorites\"));'><!-- \
--><input type='button' value='edit' title='edit the bookmarks list' style='font-size:8pt;width:5%' \
favorites=\"%favorites%\" \
onclick='story.displayTiddler(null,this.getAttribute(\"favorites\"),2)'><!-- \
--><input type='text' name='url' id='minibrowser_url_%id%' size='60' value='' style='font-size:8pt;width:23%' \
onfocus='this.select()'><!-- \
--><select name='type' id='minibrowser_type_%id%' size='1' style='font-size:8pt;width:13%'><!-- \
--><option value=''>media type...</option><!-- \
--><option value=''>auto-detect</option><!-- \
--><option value='iframe'>web page</option><!-- \
--><option value='windows'>windows media</option><!-- \
--><option value='realone'>real one</option><!-- \
--><option value='quicktime'>quicktime</option><!-- \
--><option value='flash'>flash</option><!-- \
--><option value='image'>jpg/gif/png</option><!-- \
--></select><!-- \
--><input type='submit' value='go' title='view URL in embedded player' style='font-size:8pt;width:4%'><!-- \
--><input type='button' value='open' title='view URL in a separate player' style='font-size:8pt;width:6%' \
onclick='if (this.form.url.value.length) window.open(this.form.url.value)'><!-- \
--><input type='button' value='done' name='done' disabled title='disconnect from URL' style='font-size:8pt;width:6%' \
onclick='return config.macros.miniBrowser.done(this.form);'><!-- \
--></div><!-- \
--><div id='minibrowser_player_%id%' style='display:none;text-align:center'></div><!-- \
--><span id='minibrowser_controls2_%id%' style='margin-top:2px;display:none;font-size:8pt;'><!-- \
--><div id='minibrowser_resize_%id%' style='display:%hidecontrols%;float:right;font-size:8pt'><!-- \
--> size: <input type='text' name='w' size='3' value='' style='font-size:8pt;' \
onfocus='this.select()'><!-- \
-->x<input type='text' name='h' size='3' value='' style='font-size:8pt;' \
onfocus='this.select()'><!-- \
--> <input type='submit' value='set' style='font-size:8pt;width:5em' \
onclick='var f=this.form; \
if(!f.w.value.trim().length) f.w.value=config.options.txtMiniBrowserWidth; \
if(!f.h.value.trim().length) f.h.value=config.options.txtMiniBrowserHeight; \
config.options.txtMiniBrowserWidth=f.w.value; config.options.txtMiniBrowserHeight=f.h.value; \
saveOptionCookie(\"txtMiniBrowserWidth\"); saveOptionCookie(\"txtMiniBrowserHeight\");'><!-- \
--><input type='submit' value='reset' style='font-size:8pt;width:5em' \
onclick='var f=this.form; f.ctrls.checked=true; f.w.value=\"100%\"; f.h.value=\"480\"; \
config.options.txtMiniBrowserWidth=f.w.value; config.options.txtMiniBrowserHeight=f.h.value; \
saveOptionCookie(\"txtMiniBrowserWidth\"); saveOptionCookie(\"txtMiniBrowserHeight\");'><!-- \
--><input type='button' value='fit' title='resize player to fit containing window' style='font-size:8pt;width:5em' \
onclick='config.macros.miniBrowser.fit(this)'><!-- \
--></div><!-- \
--> <input type='checkbox' name='ctrls' id='minibrowser_togglecontrols_%id%' title='toggle minibrowser controls' CHECKED \
onclick='document.getElementById(\"minibrowser_controls_%id%\").style.display=this.checked?\"block\":\"none\"; \
document.getElementById(\"minibrowser_resize_%id%\").style.display=this.checked?\"block\":\"none\";' \
><a href='' title='toggle minibrowser controls' \
onclick='this.previousSibling.click();return false;'>show controls</a><!-- \
--></span><!-- \
--></nobr></form> \
"
}
//}}}
/***
|Name|NestedSlidersPlugin|
|Source|http://www.TiddlyTools.com/#NestedSlidersPlugin|
|Version|2.3.1|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <<br>>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides|Slider.prototype.stop|
|Description|show content in nest-able 'slider' or 'floating' panels, without needing to create separate tiddlers for each panel|
!!!!!Configuration
<<<
Enable animation for slider panels
<<option chkFloatingSlidersAnimate>> allow sliders to animate when opening/closing
>(note: This setting is in //addition// to the general option for enabling/disabling animation effects:
><<option chkAnimate>> enable animations (entire document)
>For slider animation to occur, you must also allow animation in general.
Debugging messages for 'lazy sliders' deferred rendering:
<<option chkDebugLazySliderDefer>> show debugging alert when deferring slider rendering
<<option chkDebugLazySliderRender>> show debugging alert when deferred slider is actually rendered
<<<
!!!!!Usage
<<<
When installed, this plugin adds new wiki syntax for embedding 'slider' panels directly into tiddler content. Use {{{+++}}} and {{{===}}} to delimit the slider content. You can also 'nest' these sliders as deep as you like (see complex nesting example below), so that expandable 'tree-like' hierarchical displays can be created. This is most useful when converting existing in-line text content to create in-line annotations, footnotes, context-sensitive help, or other subordinate information displays.
Additional optional syntax elements let you specify
*default to open
*cookiename
*heading level
*floater (with optional CSS width value)
*transient display (clicking elsewhere closes panel)
*custom class/label/tooltip/accesskey
*alternate label/tooltip (displayed when panel is open)
*panelID (for later use with {{{<<DOM>>}}} macro. See [[DOMTweaksPlugin]])
*automatic blockquote style on panel
*deferred rendering of panel content
The complete syntax, using all options, is:
//{{{
++++(cookiename)!!!!!^width^*{{class{[label=key|tooltip][altlabel|alttooltip]}}}#panelID:>...
content goes here
===
//}}}
where:
* {{{+++}}} (or {{{++++}}}) and {{{===}}}<br>marks the start and end of the slider definition, respectively. When the extra {{{+}}} is used, the slider will be open when initially displayed.
* {{{(cookiename)}}}<br>saves the slider opened/closed state, and restores this state whenever the slider is re-rendered.
* {{{!}}} through {{{!!!!!}}}<br>displays the slider label using a formatted headline (Hn) style instead of a button/link style
* {{{^width^}}} (or just {{{^}}})<br>makes the slider 'float' on top of other content rather than shifting that content downward. 'width' must be a valid CSS value (e.g., "30em", "180px", "50%", etc.). If omitted, the default width is "auto" (i.e., fit to content)
* {{{"*"}}} //(without the quotes)//<br>denotes "transient display": when a click occurs elsewhere in the document, the slider/floating panel will be automatically closed. This is useful for creating 'pulldown menus' that automatically go away after they are used.
* """{{class{[label=key|tooltip][altlabel|alttooltip]}}}"""<br>uses label/tooltip/accesskey. """{{class{...}}}""", """=key""", """|tooltip""" and """[altlabel|alttooltip]""" are optional. 'class' is any valid CSS class name, used to style the slider label text. 'key' must be a ''single letter only''. altlabel/alttooltip specifiy alternative label/tooltip for use when slider/floating panel is displayed.
* {{{#panelID:}}}<br>defines a unique DOM element ID that is assigned to the panel element used to display the slider content. This ID can then be used later to reposition the panel using the {{{<<DOM move id>>}}} macro (see [[DOMTweaksPlugin]]), or to access/modify the panel element through use of {{{document.getElementById(...)}}}) javascript code in a plugin or inline script.
* {{{">"}}} //(without the quotes)//<br>automatically adds blockquote formatting to slider content
* {{{"..."}}} //(without the quotes)//<br>defers rendering of closed sliders until the first time they are opened. //Note: deferred rendering may produce unexpected results in some cases. Use with care.//
//Note: to make slider definitions easier to read and recognize when editing a tiddler, newlines immediately following the {{{+++}}} 'start slider' or preceding the {{{===}}} 'end slider' sequence are automatically supressed so that excess whitespace is eliminated from the output.//
<<<
!!!!!Examples
<<<
simple in-line slider:
{{{
+++
content
===
}}}
+++
content
===
----
use a custom label and tooltip:
{{{
+++[label|tooltip]
content
===
}}}
+++[label|tooltip]
content
===
----
content automatically blockquoted:
{{{
+++>
content
===
}}}
+++>
content
===
----
all options combined //(default open, cookie, heading, sized floater, transient, class, label/tooltip/key, blockquoted, deferred)//
{{{
++++(testcookie)!!!^30em^*{{big{[label=Z|click or press Alt-Z to open]}}}>...
content
===
}}}
++++(testcookie)!!!^30em^*{{big{[label=Z|click or press Alt-Z to open]}}}>...
content
===
----
complex nesting example:
{{{
+++[get info...=I|click for information or press Alt-I]
put some general information here,
plus a floating panel with more specific info:
+++^10em^[view details...|click for details]
put some detail here, which could in turn contain a transient panel,
perhaps with a +++^25em^*[glossary definition]explaining technical terms===
===
===
}}}
+++[get info...=I|click for information or press Alt-I]
put some general information here,
plus a floating panel with more specific info:
+++^10em^[view details...|click for details]
put some detail here, which could in turn contain a transient panel,
perhaps with a +++^25em^*[glossary definition]explaining technical terms===
===
===
<<<
!!!!!Installation
<<<
import (or copy/paste) the following tiddlers into your document:
''NestedSlidersPlugin'' (tagged with <<tag systemConfig>>)
<<<
!!!!!Revision History
<<<
''2007.07.26 - 2.3.1'' in document.onclick(), propagate return value from hijacked core click handler to consume OR bubble up click as needed. Fixes "IE click disease", whereby nearly every mouse click causes a page transition.
''2007.07.20 - 2.3.0'' added syntax for setting panel ID (#panelID:). This allows individual slider panels to be repositioned within tiddler content simply by giving them a unique ID and then moving them to the desired location using the {{{<<DOM move id>>}}} macro.
''2007.07.19 - 2.2.0'' added syntax for alttext and alttip (button label and tooltip to be displayed when panel is open)
''2007.07.14 - 2.1.2'' corrected use of 'transient' attribute in IE to prevent (non-recursive) infinite loop
''2007.07.12 - 2.1.0'' replaced use of "*" for 'open/close on rollover' (which didn't work too well). "*" now indicates 'transient' panels that are automatically closed if a click occurs somewhere else in the document. This permits use of nested sliders to create nested "pulldown menus" that automatically disappear after interaction with them has been completed. Also, in onClickNestedSlider(), use "theTarget.sliderCookie", instead of "this.sliderCookie" to correct cookie state tracking when automatically dismissing transient panels.
''2007.06.10 - 2.0.5'' add check to ensure that window.adjustSliderPanel() is defined before calling it (prevents error on shutdown when mouse event handlers are still defined)
''2007.05.31 - 2.0.4'' add handling to invoke adjustSliderPanel() for onmouseover events on slider button and panel. This allows the panel position to be re-synced when the button position shifts due to changes in unrelated content above it on the page. (thanks to Harsha for bug report)
''2007.03.30 - 2.0.3'' added chkFloatingSlidersAnimate (default to FALSE), so that slider animation can be disabled independent of the overall document animation setting (avoids strange rendering and focus problems in floating panels)
''2007.03.01 - 2.0.2'' for TW2.2+, hijack Morpher.prototype.stop so that "overflow:hidden" can be reset to "overflow:visible" after animation ends
''2007.03.01 - 2.0.1'' in hijack for Slider.prototype.stop, use apply() to pass params to core function
|please see [[NestedSlidersPluginHistory]] for additional revision details|
''2005.11.03 - 1.0.0'' initial public release
<<<
!!!!!Credits
<<<
This feature was implemented by EricShulman from [[ELS Design Studios|http:/www.elsdesign.com]] with initial research and suggestions from RodneyGomes, GeoffSlocock, and PaulPetterson.
<<<
!!!!!Code
***/
//{{{
version.extensions.nestedSliders = {major: 2, minor: 3, revision: 1, date: new Date(2007,7,26)};
//}}}
//{{{
// options for deferred rendering of sliders that are not initially displayed
if (config.options.chkDebugLazySliderDefer==undefined) config.options.chkDebugLazySliderDefer=false;
if (config.options.chkDebugLazySliderRender==undefined) config.options.chkDebugLazySliderRender=false;
if (config.options.chkFloatingSlidersAnimate==undefined) config.options.chkFloatingSlidersAnimate=false;
// default styles for 'floating' class
setStylesheet(".floatingPanel { position:absolute; z-index:10; padding:0.5em; margin:0em; \
background-color:#eee; color:#000; border:1px solid #000; text-align:left; }","floatingPanelStylesheet");
//}}}
//{{{
config.formatters.push( {
name: "nestedSliders",
match: "\\n?\\+{3}",
terminator: "\\s*\\={3}\\n?",
lookahead: "\\n?\\+{3}(\\+)?(\\([^\\)]*\\))?(\\!*)?(\\^(?:[^\\^\\*\\[\\>]*\\^)?)?(\\*)?(?:\\{\\{([\\w]+[\\s\\w]*)\\{)?(\\[[^\\]]*\\])?(\\[[^\\]]*\\])?(?:\\}{3})?(\\#[^:]*\\:)?(\\>)?(\\.\\.\\.)?\\s*",
handler: function(w)
{
lookaheadRegExp = new RegExp(this.lookahead,"mg");
lookaheadRegExp.lastIndex = w.matchStart;
var lookaheadMatch = lookaheadRegExp.exec(w.source)
if(lookaheadMatch && lookaheadMatch.index == w.matchStart)
{
// var defopen=lookaheadMatch[1]
// var cookiename=lookaheadMatch[2]
// var header=lookaheadMatch[3]
// var panelwidth=lookaheadMatch[4]
// var transient=lookaheadMatch[5]
// var class=lookaheadMatch[6]
// var label=lookaheadMatch[7]
// var openlabel=lookaheadMatch[8]
// var panelID=lookaheadMatch[9]
// var blockquote=lookaheadMatch[10]
// var deferred=lookaheadMatch[11]
// location for rendering button and panel
var place=w.output;
// default to closed, no cookie, no accesskey, no alternate text/tip
var show="none"; var cookie=""; var key="";
var closedtext=">"; var closedtip="";
var openedtext="<"; var openedtip="";
// extra "+", default to open
if (lookaheadMatch[1]) show="block";
// cookie, use saved open/closed state
if (lookaheadMatch[2]) {
cookie=lookaheadMatch[2].trim().slice(1,-1);
cookie="chkSlider"+cookie;
if (config.options[cookie]==undefined)
{ config.options[cookie] = (show=="block") }
show=config.options[cookie]?"block":"none";
}
// parse label/tooltip/accesskey: [label=X|tooltip]
if (lookaheadMatch[7]) {
var parts=lookaheadMatch[7].trim().slice(1,-1).split("|");
closedtext=parts.shift();
if (closedtext.substr(closedtext.length-2,1)=="=")
{ key=closedtext.substr(closedtext.length-1,1); closedtext=closedtext.slice(0,-2); }
openedtext=closedtext;
if (parts.length) closedtip=openedtip=parts.join("|");
else { closedtip="show "+closedtext; openedtip="hide "+closedtext; }
}
// parse alternate label/tooltip: [label|tooltip]
if (lookaheadMatch[8]) {
var parts=lookaheadMatch[8].trim().slice(1,-1).split("|");
openedtext=parts.shift();
if (parts.length) openedtip=parts.join("|");
else openedtip="hide "+openedtext;
}
var title=show=='block'?openedtext:closedtext;
var tooltip=show=='block'?openedtip:closedtip;
// create the button
if (lookaheadMatch[3]) { // use "Hn" header format instead of button/link
var lvl=(lookaheadMatch[3].length>6)?6:lookaheadMatch[3].length;
var btn = createTiddlyElement(createTiddlyElement(place,"h"+lvl,null,null,null),"a",null,lookaheadMatch[6],title);
btn.onclick=onClickNestedSlider;
btn.setAttribute("href","javascript:;");
btn.setAttribute("title",tooltip);
}
else
var btn = createTiddlyButton(place,title,tooltip,onClickNestedSlider,lookaheadMatch[6]);
btn.innerHTML=title; // enables use of HTML entities in label
// set extra button attributes
btn.setAttribute("closedtext",closedtext);
btn.setAttribute("closedtip",closedtip);
btn.setAttribute("openedtext",openedtext);
btn.setAttribute("openedtip",openedtip);
btn.sliderCookie = cookie; // save the cookiename (if any) in the button object
btn.defOpen=lookaheadMatch[1]!=null; // save default open/closed state (boolean)
btn.keyparam=key; // save the access key letter ("" if none)
if (key.length) {
btn.setAttribute("accessKey",key); // init access key
btn.onfocus=function(){this.setAttribute("accessKey",this.keyparam);}; // **reclaim** access key on focus
}
btn.onmouseover=function(event) // mouseover on button aligns floater position with button
{ if (window.adjustSliderPos) window.adjustSliderPos(this.parentNode,this,this.sliderPanel,this.sliderPanel.className); }
// create slider panel
var panelClass=lookaheadMatch[4]?"floatingPanel":"sliderPanel";
var panelID=lookaheadMatch[9]; if (panelID) panelID=panelID.slice(1,-1); // trim off delimiters
var panel=createTiddlyElement(place,"div",panelID,panelClass,null);
panel.button = btn; // so the slider panel know which button it belongs to
btn.sliderPanel=panel; // so the button knows which slider panel it belongs to
panel.defaultPanelWidth=(lookaheadMatch[4] && lookaheadMatch[4].length>2)?lookaheadMatch[4].slice(1,-1):"";
panel.setAttribute("transient",lookaheadMatch[5]=="*"?"true":"false");
panel.style.display = show;
panel.style.width=panel.defaultPanelWidth;
panel.onmouseover=function(event) // mouseover on panel aligns floater position with button
{ if (window.adjustSliderPos) window.adjustSliderPos(this.parentNode,this.button,this,this.className); }
// render slider (or defer until shown)
w.nextMatch = lookaheadMatch.index + lookaheadMatch[0].length;
if ((show=="block")||!lookaheadMatch[11]) {
// render now if panel is supposed to be shown or NOT deferred rendering
w.subWikify(lookaheadMatch[10]?createTiddlyElement(panel,"blockquote"):panel,this.terminator);
// align floater position with button
if (window.adjustSliderPos) window.adjustSliderPos(place,btn,panel,panelClass);
}
else {
var src = w.source.substr(w.nextMatch);
var endpos=findMatchingDelimiter(src,"+++","===");
panel.setAttribute("raw",src.substr(0,endpos));
panel.setAttribute("blockquote",lookaheadMatch[10]?"true":"false");
panel.setAttribute("rendered","false");
w.nextMatch += endpos+3;
if (w.source.substr(w.nextMatch,1)=="\n") w.nextMatch++;
if (config.options.chkDebugLazySliderDefer) alert("deferred '"+title+"':\n\n"+panel.getAttribute("raw"));
}
}
}
}
)
// TBD: ignore 'quoted' delimiters (e.g., "{{{+++foo===}}}" isn't really a slider)
function findMatchingDelimiter(src,starttext,endtext) {
var startpos = 0;
var endpos = src.indexOf(endtext);
// check for nested delimiters
while (src.substring(startpos,endpos-1).indexOf(starttext)!=-1) {
// count number of nested 'starts'
var startcount=0;
var temp = src.substring(startpos,endpos-1);
var pos=temp.indexOf(starttext);
while (pos!=-1) { startcount++; pos=temp.indexOf(starttext,pos+starttext.length); }
// set up to check for additional 'starts' after adjusting endpos
startpos=endpos+endtext.length;
// find endpos for corresponding number of matching 'ends'
while (startcount && endpos!=-1) {
endpos = src.indexOf(endtext,endpos+endtext.length);
startcount--;
}
}
return (endpos==-1)?src.length:endpos;
}
//}}}
//{{{
window.onClickNestedSlider=function(e)
{
if (!e) var e = window.event;
var theTarget = resolveTarget(e);
var theLabel = theTarget.firstChild.data;
var theSlider = theTarget.sliderPanel
var isOpen = theSlider.style.display!="none";
// toggle label
theTarget.innerHTML=isOpen?theTarget.getAttribute("closedText"):theTarget.getAttribute("openedText");
// toggle tooltip
theTarget.setAttribute("title",isOpen?theTarget.getAttribute("closedTip"):theTarget.getAttribute("openedTip"));
// deferred rendering (if needed)
if (theSlider.getAttribute("rendered")=="false") {
if (config.options.chkDebugLazySliderRender)
alert("rendering '"+theLabel+"':\n\n"+theSlider.getAttribute("raw"));
var place=theSlider;
if (theSlider.getAttribute("blockquote")=="true")
place=createTiddlyElement(place,"blockquote");
wikify(theSlider.getAttribute("raw"),place);
theSlider.setAttribute("rendered","true");
}
// show/hide the slider
if(config.options.chkAnimate && (theSlider.className!='floatingPanel' || config.options.chkFloatingSlidersAnimate))
anim.startAnimating(new Slider(theSlider,!isOpen,e.shiftKey || e.altKey,"none"));
else
theSlider.style.display = isOpen ? "none" : "block";
// reset to default width (might have been changed via plugin code)
theSlider.style.width=theSlider.defaultPanelWidth;
// align floater panel position with target button
if (!isOpen && window.adjustSliderPos) window.adjustSliderPos(theSlider.parentNode,theTarget,theSlider,theSlider.className);
// if showing panel, set focus to first 'focus-able' element in panel
if (theSlider.style.display!="none") {
var ctrls=theSlider.getElementsByTagName("*");
for (var c=0; c<ctrls.length; c++) {
var t=ctrls[c].tagName.toLowerCase();
if ((t=="input" && ctrls[c].type!="hidden") || t=="textarea" || t=="select")
{ ctrls[c].focus(); break; }
}
}
var cookie=theTarget.sliderCookie;
if (cookie && cookie.length) {
config.options[cookie]=!isOpen;
if (config.options[cookie]!=theTarget.defOpen)
saveOptionCookie(cookie);
else { // remove cookie if slider is in default display state
var ex=new Date(); ex.setTime(ex.getTime()-1000);
document.cookie = cookie+"=novalue; path=/; expires="+ex.toGMTString();
}
}
return false;
}
//}}}
//{{{
// click in document background closes transient panels
document.nestedSliders_savedOnClick=document.onclick;
document.onclick=function(ev) { if (!ev) var ev=window.event; var target=resolveTarget(ev);
// call original click handler
if (document.nestedSliders_savedOnClick)
var retval=document.nestedSliders_savedOnClick.apply(this,arguments);
// if click was inside transient panel (or something contained by a transient panel)... leave it alone
var p=target;
while (p)
if ((p.className=="floatingPanel"||p.className=="sliderPanel")&&p.getAttribute("transient")=="true") break;
else p=p.parentNode;
if (p) return retval;
// otherwise, find and close all transient panels...
var all=document.all?document.all:document.getElementsByTagName("DIV");
for (var i=0; i<all.length; i++) {
// if it is not a transient panel, or the click was on the button that opened this panel, don't close it.
if (all[i].getAttribute("transient")!="true" || all[i].button==target) continue;
// otherwise, if the panel is currently visible, close it by clicking it's button
if (all[i].style.display!="none") window.onClickNestedSlider({target:all[i].button})
}
return retval;
};
//}}}
//{{{
// adjust floating panel position based on button position
if (window.adjustSliderPos==undefined) window.adjustSliderPos=function(place,btn,panel,panelClass) {
if (panelClass=="floatingPanel") {
var left=0;
var top=btn.offsetHeight;
if (place.style.position!="relative") {
var left=findPosX(btn);
var top=findPosY(btn)+btn.offsetHeight;
var p=place; while (p && p.className!='floatingPanel') p=p.parentNode;
if (p) { left-=findPosX(p); top-=findPosY(p); }
}
if (findPosX(btn)+panel.offsetWidth > getWindowWidth()) // adjust position to stay inside right window edge
left-=findPosX(btn)+panel.offsetWidth-getWindowWidth()+15; // add extra 15px 'fudge factor'
panel.style.left=left+"px"; panel.style.top=top+"px";
}
}
function getWindowWidth() {
if(document.width!=undefined)
return document.width; // moz (FF)
if(document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) )
return document.documentElement.clientWidth; // IE6
if(document.body && ( document.body.clientWidth || document.body.clientHeight ) )
return document.body.clientWidth; // IE4
if(window.innerWidth!=undefined)
return window.innerWidth; // IE - general
return 0; // unknown
}
//}}}
//{{{
// TW2.1 and earlier:
// hijack Slider animation handler 'stop' handler so overflow is visible after animation has completed
Slider.prototype.coreStop = Slider.prototype.stop;
Slider.prototype.stop = function()
{ this.coreStop.apply(this,arguments); this.element.style.overflow = "visible"; }
// TW2.2+
// hijack Morpher animation handler 'stop' handler so overflow is visible after animation has completed
if (version.major+.1*version.minor+.01*version.revision>=2.2) {
Morpher.prototype.coreStop = Morpher.prototype.stop;
Morpher.prototype.stop = function()
{ this.coreStop.apply(this,arguments); this.element.style.overflow = "visible"; }
}
//}}}
!!Getting started on Earlham Learning Spaces
ELS uses a system called [[Elgg|http://www.elgg.org]]. Latest developments on the system are to be found in [[News]]
# +++[Starting up]
<<tiddler [[Starting up]]>>
===
# +++[Posting to your blog]
<<tiddler [[Blog post]]>>
===
# +++[Adding a friend]
<<tiddler [[Add friend]]>>
===
[[General principles]]
!Description
A vertical TiddlyWiki for publishing.
!Features
Version 1.2.0
*mode management
**<<changeMode Reader>>: browse and navigate into the content in readOnly mode and SinglePageMode .
**<<changeMode Author>>: for managing content (tiddlers, tags and perhaps Menus) and publishing (Save to web) the TiddlyWiki.
**<<changeMode>>: is the default mode when start:safe or plugin errors. This mode has the basic TiddlyWiki presentation and behaviour.
*SinglePageMode and ReadOnly for Reader
*StyleSheet reader oriented
*All [[admin]] stuff masked to reader and author
*Tweaks to ease navigation :
**an admin tag for all admin stuff
**Triangle added to tag button to indicate popup
**new lists ('timeline' 'all' 'tags') without tiddlers or tags tagged 'admin'
**[[systemList]]
**[[systemTool]]
**Latest [[News]]
*AutoWeave in Author mode
*Localizable
**See NewsWikiFR
!Components
all tagged NewsWiki :
*ChangeModePlugin
*SinglePageModePlugin
*NewsWikiTweaks
*IsDirtyPlugin
*SinglePageModePlugin
*CalendarPlugin
*AutoWeavePluginPatched
*''[[admin]] tag'' : has the special meanning to hide to Reader and Author
*''[[systemList]]'' : List all tiddlers tagged with it
*''[[systemTool]]'' : in tiddler view, hide subtitle (modifier, created, modified)
*''<mode><tiddler>'' (like AuthorStyleSheet, ReaderStyleSheet, StyleSheet ...)
!Sources
*Sample :
**http://TiddlyHome.bidix.info/
**http://TiddlyHomeFR.bidix.info/
*Empty :
**http://TiddlyHome.bidix.info/systemServer/NewsWiki
**http://TiddlyHome.bidix.info/systemServer/NewsWikiFR
!toDo
*--[[toRelease]]--
*--French version--
*--In French Version, [[locale.fr-FR]] is loaded after NewsWikiTweaks. NewsWikiTweaksFR should require local.fr-FR--
!History
!!2007/06/05
*Version 1.0.0
!!2007/07/28
*Version 1.2.0
|URL:|http://tiddlyhome.bidix.info/systemServer/NewsWiki.html|
|Description|Repository for NewsWiki system ressources |
|Author:|BidiX|
/***
|''Name:''|NewsWikiTweaks|
|''Description:''|Some tweaks for NewsWiki|
|''Version:''|0.0.1|
|''Date:''|Jun 11, 2007|
|''Source:''|http://TiddlyWiki.bidix.info/#NewsWikiTweaks|
|''Author:''|BidiX (BidiX (at) bidix (dot) info)|
|''[[License]]:''|[[BSD open source license|http://tiddlywiki.bidix.info/#%5B%5BBSD%20open%20source%20license%5D%5D ]]|
|''~CoreVersion:''|2.2.0|
***/
/***
!Options
***/
//{{{
//Options
config.options.chkAnimate = false;
config.options.txtRssTag = 'toRSS';
//}}}
/***
!tag
***/
//{{{
merge(config.views.wikified.tag,{
labelNoTags: "",
labelTags: ""});
/*
merge(config.macros.tagging,{
label: "",
labelNotTag: "",
tooltip: ""});
*/
createTagButton = function(place,tag,excludeTiddler)
{
var triangle = " "+glyph("downTriangle");
var theTag = createTiddlyButton(place,tag+triangle,config.views.wikified.tag.tooltip.format([tag]),onClickTag);
theTag.setAttribute("tag",tag);
if(excludeTiddler)
theTag.setAttribute("tiddler",excludeTiddler);
return theTag;
}
onClickTag = function(e)
{
if(!e) var e = window.event;
var theTarget = resolveTarget(e);
var popup = Popup.create(this);
var tag = this.getAttribute("tag");
var title = this.getAttribute("tiddler");
if(popup && tag) {
var tagged = store.getTaggedTiddlers(tag);
var titles = [];
var li,r;
for(r=0;r<tagged.length;r++) {
if(tagged[r].title != title)
titles.push(tagged[r].title);
}
var lingo = config.views.wikified.tag;
if(titles.length > 0) {
// var openAll = createTiddlyButton(createTiddlyElement(popup,"li"),lingo.openAllText.format([tag]),lingo.openAllTooltip,onClickTagOpenAll);
// openAll.setAttribute("tag",tag);
// createTiddlyElement(createTiddlyElement(popup,"li",null,"listBreak"),"div");
for(r=0; r<titles.length; r++) {
createTiddlyLink(createTiddlyElement(popup,"li"),titles[r],true);
}
} else {
createTiddlyText(createTiddlyElement(popup,"li",null,"disabled"),lingo.popupNone.format([tag]));
}
createTiddlyElement(createTiddlyElement(popup,"li",null,"listBreak"),"div");
if (!config.options.chkSinglePageMode) {
var openAll = createTiddlyButton(createTiddlyElement(popup,"li"),lingo.openAllText.format([tag]),lingo.openAllTooltip,onClickTagOpenAll);
openAll.setAttribute("tag",tag);
}
// createTiddlyElement(createTiddlyElement(popup,"li",null,"listBreak"),"div");
var h = createTiddlyLink(createTiddlyElement(popup,"li"),tag,false);
createTiddlyText(h,lingo.openTag.format([tag]));
}
Popup.show();
e.cancelBubble = true;
if(e.stopPropagation) e.stopPropagation();
return false;
}
config.macros.tagChooser.onClick = function(e)
{
if(!e) var e = window.event;
var lingo = config.views.editor.tagChooser;
var popup = Popup.create(this);
var tags = store.getTags("[[admin]]");
if(tags.length == 0)
createTiddlyText(createTiddlyElement(popup,"li"),lingo.popupNone);
for(var t=0; t<tags.length; t++) {
var theTag = createTiddlyButton(createTiddlyElement(popup,"li"),tags[t][0],lingo.tagTooltip.format([tags[t][0]]),config.macros.tagChooser.onTagClick);
theTag.setAttribute("tag",tags[t][0]);
theTag.setAttribute("tiddler",this.getAttribute("tiddler"));
}
Popup.show();
e.cancelBubble = true;
if(e.stopPropagation) e.stopPropagation();
return false;
};
//}}}
/***
!tabs
***/
//{{{
config.macros.list.user= {};
config.macros.list.user.handler = function(params)
{
return store.reverseLookup("tags","admin",false,"title");
};
config.macros.userTimeline = {};
config.macros.userTimeline.handler = function(place,macroName,params)
{
var field = params[0] ? params[0] : "modified";
var tiddlers = store.reverseLookup("tags","admin",false,field);
var lastDay = "";
var last = params[1] ? tiddlers.length-Math.min(tiddlers.length,parseInt(params[1])) : 0;
for(var t=tiddlers.length-1; t>=last; t--) {
var tiddler = tiddlers[t];
var theDay = tiddler[field].convertToLocalYYYYMMDDHHMM().substr(0,8);
if(theDay != lastDay) {
var theDateList = document.createElement("ul");
place.appendChild(theDateList);
createTiddlyElement(theDateList,"li",null,"listTitle",tiddler[field].formatString(config.macros.timeline.dateFormat));
lastDay = theDay;
}
var theDateListItem = createTiddlyElement(theDateList,"li",null,"listLink");
theDateListItem.appendChild(createTiddlyLink(place,tiddler.title,true));
}
};
//}}}
/***
!Shadow tiddlers
***/
//{{{
config.shadowTiddlers.GettingStarted =
"To get started with this blank NewsWiki, you'll need to change mode to <<changeMode Author>> or <<changeMode>>\n\n" +
config.shadowTiddlers.GettingStarted;
//}}}
/***
!others
***/
//{{{
config.macros.version.handler = function(place)
{
createTiddlyElement(place,"span",null,null,version.major + "." + version.minor + "." + version.revision + (version.beta ? " (beta " + version.beta + ")" : "") + (version.build ? " (build #" + version.build + ")" : ""));
};
//}}}
;Last Updated:
:16-Sept-2009
Mark H Pearson
Social Networking Czar and Web 2.0 Wizzard
<html><!--Creative Commons License--><a rel="license" href="http://creativecommons.org/licenses/by-sa/2.5/"><img alt="Creative Commons License" style="border-width: 0" src="http://creativecommons.org/images/public/somerights20.png"/></a><br/>This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/2.5/">Creative Commons Attribution-ShareAlike 2.5 License</a>.<!--/Creative Commons License--><!-- <rdf:RDF xmlns="http://web.resource.org/cc/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#">
<Work rdf:about="">
<license rdf:resource="http://creativecommons.org/licenses/by-sa/2.5/" />
<dc:type rdf:resource="http://purl.org/dc/dcmitype/Text" />
</Work>
<License rdf:about="http://creativecommons.org/licenses/by-sa/2.5/"><permits rdf:resource="http://web.resource.org/cc/Reproduction"/><permits rdf:resource="http://web.resource.org/cc/Distribution"/><requires rdf:resource="http://web.resource.org/cc/Notice"/><requires rdf:resource="http://web.resource.org/cc/Attribution"/><permits rdf:resource="http://web.resource.org/cc/DerivativeWorks"/><requires rdf:resource="http://web.resource.org/cc/ShareAlike"/></License></rdf:RDF> -->
</html>
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>>
Password: <<option pasUploadPassword>>
<<option chkSaveBackups>> SaveBackups
<<option chkAutoSave>> AutoSave
<<option chkRegExpSearch>> RegExpSearch
<<option chkCaseSensitiveSearch>> CaseSensitiveSearch
<<option chkAnimate>> EnableAnimations
----
Also see
AdvancedOptions
<!--{{{-->
<!--<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='header' class='header'>
<div id='topMenu' refresh='content' tiddler='TopMenu'></div>
<div id='title'>
<div class='siteTitle' refresh='content' tiddler='SiteTitle'></div>
<div class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></div>
</div>
</div>
<div id='mainMenu'>
<span refresh='content' tiddler='ReaderMainMenu'></span>
<span id='noticeBoard' refresh='content' tiddler='NoticeBoard'></span>
</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>
<!--}}}-->
Create a folder of type Photo gallery and upload files
!!Adding photos to Photo gallery
# go to @@Your Files@@
# +++[Create a new folder]>
* Folder Type : Photo gallery
* Access restrictions : logged in users
* Keywords : add a tag
* @@Create@@
===
# Open folder
# scroll down and +++[Upload a file]>
* Browse for the graphic
* Type in File title:
* add a Description
* Think about access : making this public exposes it to the web
* add a keyword/tag. Get into the habit of tagging your stuff
* ''Check the 'sharing file' box''. Nothing will happen unless you do this.
* Upload
===
Here are some potential theme templates for earlham learning spaces. Choose a template from the pulldown list:
<<miniBrowser hidecontrols>>
Background: #fff
Foreground: #333
PrimaryPale: #FFBFBF
PrimaryLight: #BF2323
PrimaryMid: #BF2323
PrimaryDark: #660000
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #eee
TertiaryLight: #ccc
TertiaryMid: #999
TertiaryDark: #666
Error: #ff0000
<<viewPalette>>
<<search>>
[[Intro to els class]]
+++[For new users]
* [[New users]]
* [[Starting up]]
* [[Change settings|Setting up your account]]
* [[Blog post]]
* [[Add friend]]
===
[[Firefox essentials|The Firefox browser tool]]
;
:<<tag firefox>>
:<<tag HowTo>>
----
[[Powerpoint into Blog|Audio annotation of powerpoint presentations]]
----
[[Schedule for els publicity]]
[[Student quotes|Student quotes re blogging]]
[[ELS enhancements]]
----
<<changeMode Author>>
<<changeMode>>
----
<!--{{{-->
<div id='page'>
<div id='header' class='header'>
<div id='topMenu' refresh='content' tiddler='TopMenu'></div>
<div id='title'>
<div class='siteTitle' refresh='content' tiddler='SiteTitle'></div>
<div class='siteSubtitle' refresh='content' tiddler='SiteSubtitle'></div>
</div>
</div>
<div id='sidebar'>
<div id='sidebarOptions' refresh='content' tiddler='ReaderMainMenu'></div>
<span id='noticeBoard' refresh='content' tiddler='NoticeBoard'></span>
</div>
<div id='displayArea'>
<div id='messageArea'></div>
<div id='tiddlerDisplay'></div>
</div>
</div>
<!--}}}-->
[[CommunStyleSheet]]
/***
!!page
***/
/*{{{*/
#page {
border-left: 1px solid [[ColorPalette::TertiaryLight]];
padding: 0 30px 0 30px;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
width: 65em;
position: relative;
text-align: left;
background-color: [[ColorPalette::Background]];
color: [[ColorPalette::Foreground]];
font-family: Verdana,Helvetica, Arial, sans-serif;
}
#page h* {
font-family: Helvetica, Arial, sans-serif;
}
/*}}}*/
<!--{{{-->
<div class='title'>
<span class='title' macro='view title'></span>
<!--<span macro="miniTag">--></span>
</div>
</div>
<div macro="hideWhenTaggedAny systemTool systemList">
<span class = "subtitle"><span macro='view created date [[0DD/0MM/YYYY]]'></span> - <span macro='view modifier'></span></span>
<div class='tagged' macro='tags'></div>
<div class='tagClear'></div>
</div>
<div class='viewer' macro='view text wikified'></div>
<div macro="showWhenTagged systemList">
<div class='viewer' macro="listByTag '' created ''"></div>
</div>
<!--}}}-->
!!!Messaging
!!!Comment Wall
My Profile
!!!'Friends'
* individual connections
!!!'Community'
* group connections
!!Content for web presence
!!!1. Dynamic content.
The backbone for a Social Learning Space is a powerful blogging system. Blog entries should be easy to write (spell checker please!) , easy to format (WYSWG editor), easy to manage and taggable with keyword/tags. Comments and trackbacks are //de rigeur//. But how to prevent spam? See [[SLS : Access/Sharing]] for how Elgg handles this problem.
!!!2. Static pages/wiki
It would be nice if one could add content in the form of static web pages to my site. I don't want to have to learn Dreamweaver to create a web site. Even nicer if some of these could have joint editorship with friends. This is accomplished on the Elgg system by a plugin called [[Folio]]. This implements a small scale wiki which is closely bound to the [[access control|SLS : Access/Sharing]] system of Elgg.
!!!3. File store
It would be great to have a space for files that I own, my photos, music that I have created with Garageband, video clips etc. And even better to be able to control access to that space to share with friends / groups etc.
!!RSS feeds
* from blog entries
* Tagged items
* folio entries
* community blogs
!! RSS feed reader
* aggregate your friend's blogs
* incorporate content from your other sources eg Tiddlywiki sites into your blog
!!!Web site bookmark storage / sharing.
Share web sites with others
!!1. [[TIP Workshop : ELS -- A Liberal Arts Approach to Social Networking|TIP : Earlham Learning Spaces]]
''with Mark Pearson''
Location : 24 hour Lab in Lilly
Date : Monday Sept-29
Time: 12:00 -- 12:50
Focus on :
* [[Whys and Wherefores of ELS]]
* blogging, tagging and friending
!!2. Science Division presentation : ELS for collaboration / cooperation
''with //Mark Pearson//''
Location : Dennis 310
Date: Tuesday Sept-30
Time : 12:00 -- 12:50
Focus on:
* collaborative work (students class groups, clubs & groups, faculty work)
* files, blogs, folio
!! 3. Friday Forum : Writing outside the classroom
''with //Nelson Bingham// and //Ana Cornide//''
Location : LBC 211
Date : Friday Oct-3
Time : 1600 -- 1700
Focus on :
* Academic Journaling (Nelson Bingham)
* Using ELS blogs to improve writing expertise in Spanish (Ana Cornide)
!!4. [[COWBELS]] workshop
Collaborative Online Writing and Blogging with Earlham Learning Spaces
''with //Jan Sims// & //Mark Pearson//''
Location : Bolling Center PC Lab
Date : Thursday Oct - 23
Time : 9:00 -- 1300
Focus on:
* Collaborative Online Writing and Blogging with Earlham Learning Spaces
!!Science Division presentation : ELS for collaboration / cooperation
/***
|Name|SearchOptionsPlugin|
|Source|http://www.TiddlyTools.com/#SearchOptionsPlugin|
|Version|2.6.1|
|Author|Eric Shulman - ELS Design Studios|
|License|http://www.TiddlyTools.com/#LegalStatements <<br>>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides|Story.prototype.search, TiddlyWiki.prototype.search, config.macros.search.onKeyPress|
|Description|extend core search function with additional user-configurable options|
The TiddlyWiki search function normally looks in both tiddler titles and tiddler body content ('text'). However, narrowing the search so that it examines only titles or only text, or expanding the search to include text contained in tiddler tags can be very helpful, especially when searching on common words or phrases. In addition, it is often useful for the search results to show tiddlers with matching titles before tiddlers that contain matching text or tags.
!!!!!Usage
<<<
This plugin adds checkboxes (see below and in AdvancedOptions) to let you selectively configure the TiddlyWiki search function to just examine any combination of tiddler titles, text, or tags. It also provides an option to switch the search results order between 'titles mixed in' (default) and 'titles shown first', as well as an option display the search results as a list of links (in an auto-generated "SearchResults" tiddler), rather than actually displaying all matching tiddlers. You can also enable/disable the "incremental search" (key-by-key searching), so that a search is only initiated when you press the ENTER key or click on the "search:" prompt text.
<<<
!!!!!Configuration
<<<
In additional to the checkboxes in AdvancedOptions, a self-contained control panel is included here for your convenience:
<<option chkSearchTitles>> Search in titles
<<option chkSearchText>> Search in tiddler text
<<option chkSearchTags>> Search in tags
<<option chkSearchFields>> Search in data fields
<<option chkSearchShadows>> Search shadow tiddlers
<<option chkSearchTitlesFirst>> Show title matches first
<<option chkSearchByDate>> Sort matching tiddlers by date
<<option chkSearchList>> Show list of matches in [[SearchResults]]
<<option chkSearchIncremental>> Incremental searching
<<<
!!!!!Installation
<<<
import (or copy/paste) the following tiddlers into your document:
''SearchOptionsPlugin'' (tagged with <<tag systemConfig>>)
^^documentation and javascript for SearchOptionsPlugin handling^^
When installed, this plugin automatically adds checkboxes in the AdvancedOptions shadow tiddler so you can enable/disable the extended search behavior. However, if you have customized your AdvancedOptions, you will need to manually add {{{<<option chkSearchTitles>>}}}, {{{<<option chkSearchText>>}}} and {{{<<option chkSearchTitlesFirst>>}}} (with suitable prompt text) to your customized tiddler.
<<<
!!!!!Revision History
<<<
''2007.02.17 [2.6.1]'' added redefinition of config.macros.search.onKeyPress() to restore check to bypass key-by-key searching (i.e., when chkSearchIncremental==false), which had been unintentionally removed with v2.6.0
''2007.02.13 [2.6.0]'' remove redefinition of config.macros.search.handler since core now includes handling for ENTER key.
''2007.02.08 [2.5.1]'' include 'temporary' tag when creating SearchResults (for use with TemporaryTiddlersPlugin)
''2007.01.29 [2.5.0]'' added support for "sort results by date". Default is to sort alphabetically (standard). When sorted by dates, most recent changes are shown first
''2006.10.10 [2.4.0]'' added support for "search in tiddler data" (tiddler.fields) Default is to search extended data.
''2006.04.06 [2.3.0]'' added support for "search in shadow tiddlers". Default is *not* to search in the shadows (i.e. standard TW behavior). Note: if a shadow tiddler has a 'real' counterpart, only the real tiddler is searched, since the shadow is inaccessible for viewing/editing.
''2006.02.03 [2.2.1]'' rewrite timeout clearing code and blank search text handling to match 2.0.4 core release changes. note that core no longer permits "blank=all" searches, so neither does this plugin. To search for all, use "." with text patterns enabled.
''2006.02.02 [2.2.0]'' in search.handler(), KeyHandler() function clears 'left over' timeout when search input is < 3 chars. Prevents searching on shorter text when shortened by rapid backspaces (<500msec)
''2006.02.01 [2.1.9]'' in Story.prototype.search(), correct inverted logic for using/not using regular expressions when searching
also, blank search text now presents "No search text. Continue anyway?" confirm() message box, so search on blank can still be processed if desired by user.
''2006.02.01 [2.1.8]'' in doSearch(), added alert/return if search text is blank
''2006.01.20 [2.1.7]'' fixed setting of config.macros.search.reportTitle so that Tweaks can override it.
''2006.01.19 [2.1.6]'' improved SearchResults formatting, added a "search again" form to the report (based on a suggestion from MorrisGray)
define results report title using config.macros.search.reportTitle instead of hard-coding the tiddler title
''2006.01.18 [2.1.5]'' Created separate functions for reportSearchResults(text,matches) and discardSearchResults(), so that other developers can create alternative report generators.
''2006.01.17 [2.1.4]'' Use regExp.search() instead of regExp.test() to scan for matches. Correctd the problem where only half the matching tiddlers (the odd-numbered ones) were being reported.
''2006.01.15 [2.1.3]'' Added information (date/time, username, search options used) to SearchResults output
''2006.01.10 [2.1.2]'' use displayTiddlers() to render matched tiddlers. This lets you display multiple matching tiddlers, even if SinglePageModePlugin is enabled.
''2006.01.08 [2.1.1]'' corrected invalid variable reference, "txt.value" to "text" in story.search()
''2006.01.08 [2.1.0]'' re-write to match new store.search(), store.search.handler() and story.search() functions.
''2005.12.30 [2.0.0]'' Upgraded to TW2.0
when rendering SearchResults tiddler, closeTiddler() first to ensure display is refreshed.
''2005.12.26 [1.4.0]'' added option to search for matching text in tiddler tags
''2005.12.21 [1.3.7]'' use \\ to 'escape' single quotes in tiddler titles when generating "Open all matching tiddlers" link. Also, added access key: "O", to trigger "open all" link.
Based on a suggestion by UdoBorkowski.
''2005.12.18 [1.3.6]'' call displayMessage() AFTER showing matching tiddlers so message is not cleared too soon
''2005.12.17 [1.3.5]'' if no matches found, just display message and delete any existing SearchResults tiddler.
''2005.12.17 [1.3.4]'' use {/%%/{/%%/{ and }/%%/}/%%/} to 'escape' display text in SearchResults tiddler to ensure that formatting contained in search string is not rendered
Based on a suggestion by UdoBorkowski.
''2005.12.14 [1.3.3]'' tag SearchResults tiddler with 'excludeSearch' so it won't list itself in subsequent searches
Based on a suggestion by UdoBorkowski.
''2005.12.14 [1.3.2]'' added "open all matching tiddlers..." link to search results output.
Based on a suggestion by UdoBorkowski.
''2005.12.10 [1.3.1]'' added "discard search results" link to end of search list tiddler output for quick self-removal of 'SearchResults' tiddler.
''2005.12.01 [1.3.0]'' added chkSearchIncremental to enable/disable 'incremental' searching (i.e., search after each keystroke) (default is ENABLED).
added handling for Enter key so it can be used to start a search.
Based on a suggestion by LyallPearce
''2005.11.25 [1.2.1]'' renamed from SearchTitleOrTextPlugin to SearchOptionsPlugin
''2005.11.25 [1.2.0]'' added chkSearchList option
Based on a suggestion by RodneyGomes
''2005.10.19 [1.1.0]'' added chkSearchTitlesFirst option.
Based on a suggestion by ChristianHauck
''2005.10.18 [1.0.0]'' Initial Release
Based on a suggestion by LyallPearce.
<<<
!!!!!Credits
<<<
This feature was developed by EricShulman from [[ELS Design Studios|http:/www.elsdesign.com]].
<<<
!!!!!Code
***/
//{{{
version.extensions.searchOptions = {major: 2, minor: 6, revision: 1, date: new Date(2007,2,17)};
//}}}
//{{{
if (config.options.chkSearchTitles==undefined) config.options.chkSearchTitles=true;
if (config.options.chkSearchText==undefined) config.options.chkSearchText=true;
if (config.options.chkSearchTags==undefined) config.options.chkSearchTags=true;
if (config.options.chkSearchFields==undefined) config.options.chkSearchFields=true;
if (config.options.chkSearchTitlesFirst==undefined) config.options.chkSearchTitlesFirst=false;
if (config.options.chkSearchList==undefined) config.options.chkSearchList=false;
if (config.options.chkSearchByDate==undefined) config.options.chkSearchByDate=false;
if (config.options.chkSearchIncremental==undefined) config.options.chkSearchIncremental=true;
if (config.options.chkSearchShadows==undefined) config.options.chkSearchShadows=false;
if (config.optionsDesc) {
config.optionsDesc.chkSearchTitles="Search in tiddler titles";
config.optionsDesc.chkSearchText="Search in tiddler text";
config.optionsDesc.chkSearchTags="Search in tiddler tags";
config.optionsDesc.chkSearchFields="Search in tiddler data fields";
config.optionsDesc.chkSearchShadows="Search in shadow tiddlers";
config.optionsDesc.chkSearchTitlesFirst="Search results show title matches first";
config.optionsDesc.chkSearchList="Search results show list of matching tiddlers";
config.optionsDesc.chkSearchByDate="Search results sorted by modification date ";
config.optionsDesc.chkSearchIncremental="Incremental searching";
} else {
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchTitles>> Search in tiddler titles";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchText>> Search in tiddler text";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchTags>> Search in tiddler tags";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchFields>> Search in tiddler data fields";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchShadows>> Search in shadow tiddlers";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchTitlesFirst>> Search results show title matches first";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchList>> Search results show list of matching tiddlers";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchByDate>> Search results sorted by modification date ";
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSearchIncremental>> Incremental searching";
}
if (config.macros.search.reportTitle==undefined) config.macros.search.reportTitle="SearchResults";
//}}}
//{{{
config.macros.search.onKeyPress = function(e)
{
if(!e) var e = window.event;
switch(e.keyCode)
{
case 13: // Ctrl-Enter
case 10: // Ctrl-Enter on IE PC
config.macros.search.doSearch(this);
break;
case 27: // Escape
this.value = "";
clearMessage();
break;
}
if (config.options.chkSearchIncremental) {
if(this.value.length > 2)
{
if(this.value != this.getAttribute("lastSearchText"))
{
if(config.macros.search.timeout)
clearTimeout(config.macros.search.timeout);
var txt = this;
config.macros.search.timeout = setTimeout(function() {config.macros.search.doSearch(txt);},500);
}
}
else
{
if(config.macros.search.timeout)
clearTimeout(config.macros.search.timeout);
}
}
}
//}}}
//{{{
Story.prototype.search = function(text,useCaseSensitive,useRegExp)
{
highlightHack = new RegExp(useRegExp ? text : text.escapeRegExp(),useCaseSensitive ? "mg" : "img");
var matches = store.search(highlightHack,config.options.chkSearchByDate?"modified":"title","excludeSearch");
if (config.options.chkSearchByDate) matches=matches.reverse(); // most recent changes first
var q = useRegExp ? "/" : "'";
clearMessage();
if (!matches.length) {
if (config.options.chkSearchList) discardSearchResults();
displayMessage(config.macros.search.failureMsg.format([q+text+q]));
} else {
if (config.options.chkSearchList)
reportSearchResults(text,matches);
else {
var titles = []; for(var t=0; t<matches.length; t++) titles.push(matches[t].title);
this.closeAllTiddlers(); story.displayTiddlers(null,titles);
displayMessage(config.macros.search.successMsg.format([matches.length, q+text+q]));
}
}
highlightHack = null;
}
//}}}
//{{{
TiddlyWiki.prototype.search = function(searchRegExp,sortField,excludeTag)
{
var candidates = this.reverseLookup("tags",excludeTag,false,sortField);
// scan for matching titles first...
var results = [];
if (config.options.chkSearchTitles) {
for(var t=0; t<candidates.length; t++)
if(candidates[t].title.search(searchRegExp)!=-1)
results.push(candidates[t]);
if (config.options.chkSearchShadows)
for (var t in config.shadowTiddlers)
if ((t.search(searchRegExp)!=-1) && !store.tiddlerExists(t))
results.push((new Tiddler()).assign(t,config.shadowTiddlers[t]));
}
// then scan for matching text, tags, or field data
for(var t=0; t<candidates.length; t++) {
if (config.options.chkSearchText && candidates[t].text.search(searchRegExp)!=-1)
results.pushUnique(candidates[t]);
if (config.options.chkSearchTags && candidates[t].tags.join(" ").search(searchRegExp)!=-1)
results.pushUnique(candidates[t]);
if (config.options.chkSearchFields && store.forEachField!=undefined) // requires TW2.1 or above
store.forEachField(candidates[t],
function(tid,field,val) { if (val.search(searchRegExp)!=-1) results.pushUnique(candidates[t]); },
true); // extended fields only
}
// then check for matching text in shadows
if (config.options.chkSearchShadows)
for (var t in config.shadowTiddlers)
if ((config.shadowTiddlers[t].search(searchRegExp)!=-1) && !store.tiddlerExists(t))
results.pushUnique((new Tiddler()).assign(t,config.shadowTiddlers[t]));
// if not 'titles first', or sorting by modification date, re-sort results to so titles, text, tag and field matches are mixed together
if(!sortField) sortField = "title";
var bySortField=function (a,b) {if(a[sortField] == b[sortField]) return(0); else return (a[sortField] < b[sortField]) ? -1 : +1; }
if (!config.options.chkSearchTitlesFirst || config.options.chkSearchByDate) results.sort(bySortField);
return results;
}
//}}}
// // ''REPORT GENERATOR''
//{{{
if (!window.reportSearchResults) window.reportSearchResults=function(text,matches)
{
var title=config.macros.search.reportTitle
var q = config.options.chkRegExpSearch ? "/" : "'";
var body="\n";
// summary: nn tiddlers found matching '...', options used
body+="''"+config.macros.search.successMsg.format([matches.length,q+"{{{"+text+"}}}"+q])+"''\n";
body+="^^//searched in:// ";
body+=(config.options.chkSearchTitles?"''titles'' ":"");
body+=(config.options.chkSearchText?"''text'' ":"");
body+=(config.options.chkSearchTags?"''tags'' ":"");
body+=(config.options.chkSearchFields?"''fields'' ":"");
body+=(config.options.chkSearchShadows?"''shadows'' ":"");
if (config.options.chkCaseSensitiveSearch||config.options.chkRegExpSearch) {
body+=" //with options:// ";
body+=(config.options.chkCaseSensitiveSearch?"''case sensitive'' ":"");
body+=(config.options.chkRegExpSearch?"''text patterns'' ":"");
}
body+="^^";
// numbered list of links to matching tiddlers
body+="\n<<<";
for(var t=0;t<matches.length;t++) {
var date=config.options.chkSearchByDate?(matches[t].modified.formatString('YYYY.0MM.0DD 0hh:0mm')+" "):"";
body+="\n# "+date+"[["+matches[t].title+"]]";
}
body+="\n<<<\n";
// open all matches button
body+="<html><input type=\"button\" href=\"javascript:;\" ";
body+="onclick=\"story.displayTiddlers(null,["
for(var t=0;t<matches.length;t++)
body+="'"+matches[t].title.replace(/\'/mg,"\\'")+"'"+((t<matches.length-1)?", ":"");
body+="],1);\" ";
body+="accesskey=\"O\" ";
body+="value=\"open all matching tiddlers\"></html> ";
// discard search results button
body+="<html><input type=\"button\" href=\"javascript:;\" ";
body+="onclick=\"story.closeTiddler('"+title+"'); store.deleteTiddler('"+title+"'); store.notify('"+title+"',true);\" ";
body+="value=\"discard "+title+"\"></html>";
// search again
body+="\n\n----\n";
body+="<<search \""+text+"\">>\n";
body+="<<option chkSearchTitles>>titles ";
body+="<<option chkSearchText>>text ";
body+="<<option chkSearchTags>>tags";
body+="<<option chkSearchFields>>fields";
body+="<<option chkSearchShadows>>shadows";
body+="<<option chkCaseSensitiveSearch>>case-sensitive ";
body+="<<option chkRegExpSearch>>text patterns";
body+="<<option chkSearchByDate>>sort by date";
// create/update the tiddler
var tiddler=store.getTiddler(title); if (!tiddler) tiddler=new Tiddler();
tiddler.set(title,body,config.options.txtUserName,(new Date()),"excludeLists excludeSearch temporary");
store.addTiddler(tiddler); story.closeTiddler(title);
// use alternate "search again" label in <<search>> macro
var oldprompt=config.macros.search.label;
config.macros.search.label="search again";
// render/refresh tiddler
story.displayTiddler(null,title,1);
store.notify(title,true);
// restore standard search label
config.macros.search.label=oldprompt;
}
if (!window.discardSearchResults) window.discardSearchResults=function()
{
// remove the tiddler
story.closeTiddler(config.macros.search.reportTitle);
store.deleteTiddler(config.macros.search.reportTitle);
}
//}}}
''3 tiddlers found matching '{{{YouTube}}}'''
^^//searched in:// ''titles'' ''text'' ''tags'' ''fields'' ^^
<<<
# 2009.02.24 11:03 [[Firefox Add-ons]]
# 2008.01.17 14:10 [[Blog post]]
# 2008.01.17 11:06 [[Embed YouTube video]]
<<<
<html><input type="button" href="javascript:;" onclick="story.displayTiddlers(null,['Firefox Add-ons', 'Blog post', 'Embed YouTube video'],1);" accesskey="O" value="open all matching tiddlers"></html> <html><input type="button" href="javascript:;" onclick="story.closeTiddler('SearchResults'); store.deleteTiddler('SearchResults'); store.notify('SearchResults',true);" value="discard SearchResults"></html>
----
<<search "YouTube">>
<<option chkSearchTitles>>titles <<option chkSearchText>>text <<option chkSearchTags>>tags<<option chkSearchFields>>fields<<option chkSearchShadows>>shadows<<option chkCaseSensitiveSearch>>case-sensitive <<option chkRegExpSearch>>text patterns<<option chkSearchByDate>>sort by date
!!Changing account settings
Clicking @@Account settings@@ gets you to Edit user details page:
* You may want to change your name from 'Topes, Spiggy' to 'Spiggy Topes'
* You may want to change - Friendship moderation : friendships must be approved by you
* Receive email notifications : Yes. This is very useful way of alerting you to friendship adds and other messages
* can change language to Spanish if you like
* Save
!!Change site picture
* click @@Your site picture@@
You can have up to 10 'avatars' uploaded.
# Browse for mugshot
# Give it a description and set it to the default.
# Upload new icon
<<search>><<closeAll>><<permaview>><<newTiddler>><<newJournal "DD MMM YYYY" "journal">><<saveChanges>><<changeMode Reader>><<changeMode Author>><<changeMode>><<slider chkSliderOptionsPanel OptionsPanel "options »" "Change TiddlyWiki advanced options">>
/***
|Name|SinglePageModePlugin|
|Source|http://www.TiddlyTools.com/#SinglePageModePlugin|
|Version|2.2.3|
|Author|Eric Shulman - ELS Design Studios|
|[[License]]|http://www.TiddlyTools.com/#LegalStatements <<br>>and [[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|~CoreVersion|2.1|
|Type|plugin|
|Requires||
|Overrides|Story.prototype.displayTiddler(), Story.prototype.displayTiddlers()|
|Description|Display tiddlers one at a time with automatic update of URL (permalink). Also, option to always open tiddlers at top of page|
Normally, as you click on the links in TiddlyWiki, more and more tiddlers are displayed on the page. The order of this tiddler display depends upon when and where you have clicked. Some people like this non-linear method of reading the document, while others have reported that when many tiddlers have been opened, it can get somewhat confusing.
!!!!!Usage
<<<
SinglePageMode allows you to configure TiddlyWiki to navigate more like a traditional multipage web site with only one item displayed at a time. When SinglePageMode is enabled, the title of the current tiddler is automatically displayed in the browser window's titlebar and the browser's location URL is updated with a 'permalink' for the current tiddler so that it is easier to create a browser 'bookmark' for the current tiddler.
Even when SinglePageMode is disabled (i.e., displaying multiple tiddlers is permitted), you can reduce the potential for confusion by enable TopOfPageMode, which forces tiddlers to always open at the top of the page instead of being displayed following the tiddler containing the link that was clicked.
<<<
!!!!!Configuration
<<<
When installed, this plugin automatically adds checkboxes in the AdvancedOptions tiddler so you can enable/disable the plugin behavior. For convenience, these checkboxes are also included here:
<<option chkSinglePageMode>> Display one tiddler at a time
<<option chkTopOfPageMode>> Always open tiddlers at the top of the page
<<<
!!!!!Installation
<<<
import (or copy/paste) the following tiddlers into your document:
''SinglePageModePlugin'' (tagged with <<tag [[systemConfig]]>>)
^^documentation and javascript for SinglePageMode handling^^
When installed, this plugin automatically adds checkboxes in the ''shadow'' AdvancedOptions tiddler so you can enable/disable this behavior. However, if you have customized your AdvancedOptions, you will need to ''manually add these checkboxes to your customized tiddler.''
<<<
!!!!!Revision History
<<<
''2007.02.06 [2.2.3]'' in Story.prototype.displayTiddler(), use convertUnicodeToUTF8() for correct I18N string handling when creating URL hash string from tiddler title (based on bug report from BidiX)
''2007.01.08 [2.2.2]'' use apply() to invoke hijacked core functions
''2006.07.04 [2.2.1]'' in hijack for displayTiddlers(), suspend TPM as well as SPM so that DefaultTiddlers displays in the correct order.
''2006.06.01 [2.2.0]'' added chkTopOfPageMode (TPM) handling
''2006.02.04 [2.1.1]'' moved global variable declarations to config.* to avoid FireFox 1.5.0.1 crash bug when assigning to globals
''2005.12.27 [2.1.0]'' hijack displayTiddlers() so that SPM can be suspended during startup while displaying the DefaultTiddlers (or #hash list). Also, corrected initialization for undefined SPM flag to "false", so default behavior is to display multiple tiddlers
''2005.12.27 [2.0.0]'' Update for TW2.0
''2005.11.24 [1.1.2]'' When the back and forward buttons are used, the page now changes to match the URL. Based on code added by Clint Checketts
''2005.10.14 [1.1.1]'' permalink creation now calls encodeTiddlyLink() to handle tiddler titles with spaces in them
''2005.10.14 [1.1.0]'' added automatic setting of window title and location bar ('auto-permalink'). feature suggestion by David Dickens.
''2005.10.09 [1.0.1]'' combined documentation and code in a single tiddler
''2005.08.15 [1.0.0]'' Initial Release
<<<
!!!!!Credits
<<<
This feature was developed by EricShulman from [[ELS Design Studios|http:/www.elsdesign.com]].
Support for BACK/FORWARD buttons adapted from code developed by Clint Checketts
<<<
!!!!!Code
***/
//{{{
version.extensions.SinglePageMode= {major: 2, minor: 2, revision: 3, date: new Date(2007,2,6)};
if (config.options.chkSinglePageMode==undefined) config.options.chkSinglePageMode=false;
config.shadowTiddlers.AdvancedOptions += "\n<<option chkSinglePageMode>> Display one tiddler at a time";
if (config.options.chkTopOfPageMode==undefined) config.options.chkTopOfPageMode=false;
config.shadowTiddlers.AdvancedOptions += "\n<<option chkTopOfPageMode>> Always open tiddlers at the top of the page";
config.SPMTimer = 0;
config.lastURL = window.location.hash;
function checkLastURL()
{
if (!config.options.chkSinglePageMode)
{ window.clearInterval(config.SPMTimer); config.SPMTimer=0; return; }
if (config.lastURL == window.location.hash)
return;
// var tiddlerName = convertUTF8ToUnicode(decodeURI(window.location.hash.substr(1)));
var tiddlerName = decodeURI(window.location.hash.substr(1));
tiddlerName=tiddlerName.replace(/\[\[/,"").replace(/\]\]/,""); // strip any [[ ]] bracketing
if (tiddlerName.length) story.displayTiddler(null,tiddlerName,1,null,null);
}
if (Story.prototype.SPM_coreDisplayTiddler==undefined) Story.prototype.SPM_coreDisplayTiddler=Story.prototype.displayTiddler;
Story.prototype.displayTiddler = function(srcElement,title,template,animate,slowly)
{
if (config.options.chkSinglePageMode) {
// window.location.hash = encodeURIComponent(convertUnicodeToUTF8(String.encodeTiddlyLink(title)));
window.location.hash = encodeURIComponent(String.encodeTiddlyLink(title));
config.lastURL = window.location.hash;
document.title = wikifyPlain("IsDirty") + wikifyPlain("SiteTitle") + " - " + title;
story.closeAllTiddlers();
if (!config.SPMTimer) config.SPMTimer=window.setInterval(function() {checkLastURL();},1000);
}
if (config.options.chkTopOfPageMode) { story.closeTiddler(title); window.scrollTo(0,0); srcElement=null; }
this.SPM_coreDisplayTiddler.apply(this,arguments);
}
if (Story.prototype.SPM_coreDisplayTiddlers==undefined) Story.prototype.SPM_coreDisplayTiddlers=Story.prototype.displayTiddlers;
Story.prototype.displayTiddlers = function(srcElement,titles,template,unused1,unused2,animate,slowly)
{
// suspend single-page mode when displaying multiple tiddlers
var saveSPM=config.options.chkSinglePageMode; config.options.chkSinglePageMode=false;
var saveTPM=config.options.chkTopOfPageMode; config.options.chkTopOfPageMode=false;
this.SPM_coreDisplayTiddlers.apply(this,arguments);
config.options.chkSinglePageMode=saveSPM; config.options.chkTopOfPageMode=saveTPM;
}
//}}}
for the web 2.0 generation
((els(Earlham Learning Spaces))) docs
http://www.earlham.edu/markp/elsdocs
<<slideShow noClicks forceRefresh>> - A simple slide show that keeps the TW style
<<slideShow style:'MySSStyleSheet' clock:'+'>> - A themed slide show with a clock showing the presentation elapsed time
<<slideShow repeat clock:'-20'>> - A looping slide show with a 20 minutes countdown clock
<<slideShow slidePause:1000>> - A timed slideshow that runs once
<<slideShow slidePause:1000 repeat>> - A timed looping slideshow
-s-
!The [[SlideShowPlugin]]
Press F11 to go fullscreen and adjust the font sizes with Ctrl++ Ctrl+- (or Ctrl+mousewheel).
This plugin was developed by Paulo Soares and Clint Checketts.
{{Comment{This block is not shown in the slide show.
@@Don't show me!!!@@}}}
-s-
!How slides are separated
In a tiddler, you start each slide with the markup {{{-s-}}}
-s-
Slides don't have to have titles like this poor one
-s-
!A slide with subsections and a long title
Check to TOC below to see how this slide title is abbreviated.
!!Section 1
This is a section
!!!Subsection 1.1
This is a subsection
!!!Subsection 1.2
This is another subsection
!!!!Subsubsection 1.2.1
This is a subsubsection
-s-
!Using the keyboard
The following keys are defined:
*Left arrow - previous overlay
*Down arrow - previous slide
*Right arrow - next overlay
*Up arrow - next slide
*Home - first slide
*End - last slide
*Escape - exit slide show
*Spacebar - pause/resume slide show in auto advance mode
-s-
!Slide show parameters
*The slide show can be themed by providing a ~StyleSheet ({{{<<slideShow style:'MyStyleSheet'>>}}})
*By default, there is a clock at bottom of the browser window that displays the current time. This clock can also show the presentation elapsed time with {{{<<slideShow clock:'+'>>}}} or a countdown clock with {{{<<slideShow clock:'-20'>>}}} (for 20 minutes). In these two cases, if you click on the clock display it will be restarted
*The slide show can be set to loop ({{{<<slideShow repeat>>}}})
*You can set it so each slide changes after X milliseconds ({{{<<slideShow slidePause:X>>}}}) (auto advance mode)
*Use auto start mode to begin the slideshow the moment the tiddler is opened ({{{<<slideShow autostart>>>}}})
*You can disable overlays with {{{<<slideShow noOverlays>>}}}
*These parameters can be mixed and matched in any order: {{{<<slideShow slidePause:1000 repeat>>}}} is the same as {{{<<slideShow repeat slidePause:1000>>}}}
-s-
!Overlays
To see how incremental display works use the left and right mouse buttons.
{{Overlay1{You can}}} {{Overlay2{present things}}} {{Overlay1{in an arbitrary order!!!}}}
{{Overlay3{Its a bit harder with lists but it works:}}}
<html>
<ol>
<li class="Overlay4">First item</li>
<li class="Overlay5">Second item</li>
<li class="Overlay4">Last item</li>
</ol>
</html>
{{Comment{You can hide comments on a slide that won't display in the slide show}}}
<!--{{{-->
<div id='displayArea'>
<div id='tiddlerDisplay'></div>
</div>
<!--}}}-->
/***
|''Name:''|SlideShowPlugin|
|''Description:''|Creates a simple slide show type display|
|''Version:''|1.5.3|
|''Date:''|Sep 12, 2007|
|''Source:''|http://www.math.ist.utl.pt/~psoares/addons.html|
|''Documentation:''|[[SlideShowPlugin Documentation|SlideShowPluginDoc]]|
|''Author:''|Paulo Soares and [[Clint Checketts|http://www.checkettsweb.com]]|
|''License:''|[[Creative Commons Attribution-Share Alike 3.0 License|http://creativecommons.org/licenses/by-sa/3.0/]]|
|''~CoreVersion:''|2.1.0|
***/
//{{{
config.macros.slideShow = {label: "slide show", maxTOCLength: 30};
config.macros.slideShow.messages = {gotoLabel: "Go to slide:"};
config.views.wikified.slideShow = {text: "slide show", tooltip: "Start slide show"};
config.views.wikified.slideShow.quit = {text: "end", tooltip: "Quit the slide show"};
config.views.wikified.slideShow.firstSlide = {text: "<<", tooltip: "first slide"};
config.views.wikified.slideShow.previousSlide = {text: "<", tooltip: "previous slide"};
config.views.wikified.slideShow.nextSlide = {text: ">", tooltip: "next slide"};
config.views.wikified.slideShow.lastSlide = {text: ">>", tooltip: "last slide"};
config.views.wikified.slideShow.resetClock = {text: " ", tooltip: "reset"};
config.formatters.push( {
name: "SlideSeparator",
match: "^-s-+$\\n?",
handler: function(w) {
createTiddlyElement(w.output,"hr",null,'slideSeparator');
}
});
function changeStyleSheet(tiddlerName) {
setStylesheet(store.getRecursiveTiddlerText("StyleSheetColors"),"StyleSheetColors");
setStylesheet(store.getRecursiveTiddlerText("StyleSheetLayout"),"StyleSheetLayout");
setStylesheet(store.getRecursiveTiddlerText(tiddlerName == null ? "StyleSheet" : tiddlerName,""),"StyleSheet");
}
//Excellent (and versatile) reparser created by Paul Petterson for parsing the paramString in a macro
function reparse( params ) {
var re = /([^:\s]+)(?:\:((?:\d+)|(?:["'](?:[^"']+)["']))|\s|$)/g;
var ret = new Array();
var m;
while( (m = re.exec( params )) != null ) ret[ m[1] ] = m[2]?m[2]:true;
return ret;
}
function getElementsByClass(searchClass,node,tag) {
var classElements = new Array();
if ( node == null ) node = document;
if ( tag == null ) tag = '*';
var els = node.getElementsByTagName(tag);
var elsLen = els.length;
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
var j=0;
for (var i = 0; i < elsLen; i++) {
if ( pattern.test(els[i].className) ) {
classElements[j] = els[i];
j++;
}
}
return classElements;
}
// 'keys' code adapted from S5 which in turn was adapted from MozPoint (http://mozpoint.mozdev.org/)
function keys(key) {
with(config.macros.slideShow){
if (document.getElementById('contentWrapper').className == "slideShowMode"){
if (!key) {
key = event;
key.which = key.keyCode;
}
switch (key.which) {
case 32: // spacebar
if(time>0){
if(autoAdvance){
clearInterval(autoAdvance);
autoAdvance = null;
} else {
autoAdvance=setInterval("GoToSlide(1)", time);
}
}
break;
case 34: // page down
case 39: // rightkey
GoToSlide("n");
break;
case 40: // downkey
GoToSlide(-1);
break;
case 33: // page up
case 37: // leftkey
GoToSlide("p");
break;
case 38: // upkey
GoToSlide(1);
break;
case 36: // home
GoToSlide("f");
break;
case 35: // end
GoToSlide("l");
break;
case 27: // escape
endSlideShow();
break;
}
}
return false;
}
}
function clicker(e) {
if (!e) var e = window.event;
var target = resolveTarget(e);
//Whenever something is clicked that won't advance the slide make sure that the table of contents gets hidden
if (target.getAttribute('href') != null || isParentOrSelf(target, 'toc') || isParentOrSelf(target,'embed') || isParentOrSelf(target,'object') || isParentOrSelf(target, 'slideFooter') || isParentOrSelf(target, 'navigator')){
//Don't hide the TOC if the indexNumbers (which trigger the index) is clicked
if(isParentOrSelf(target,'indexNumbers') || isParentOrSelf(target,'jumpInput')){
return true;
}
showHideTOC('none');
return true;
}
//Advance a slide if the TOC is visible otherwise make sure that the TOC gets hidden
if ((!e.which && e.button == 1) || e.which == 1) {
if (document.getElementById('toc').style.display != 'block'){
GoToSlide("n");
} else {
showHideTOC('none');
}
}
if ((!e.which && e.button == 2) || e.which == 3) {
if (document.getElementById('toc').style.display != 'block'){
GoToSlide("p");
} else {
showHideTOC('none');
}
return false;
}
}
function isParentOrSelf(element, id) {
if (element == null || element.nodeName=='BODY') return false;
else if (element.id == id) return true;
else return isParentOrSelf(element.parentNode, id);
}
function GoToSlide(step) {
var new_pos;
var slideHolder = document.getElementById('slideContainer');
//The parse float ensures that the attribute is returned as a number and not a string.
var cur_pos = parseFloat(slideHolder.getAttribute('currentslide'));
var numberSlides = parseFloat(slideHolder.getAttribute('numberSlides'));
switch (step) {
case "f":
new_pos=0;
break;
case "l":
new_pos=numberSlides-1;
break;
case "n":
var numberOverlays = parseFloat(slideHolder.childNodes[cur_pos].getAttribute('numberOverlays'));
var currentOverlay = parseFloat(slideHolder.getAttribute('currentOverlay'));
if(numberOverlays==0 || currentOverlay==numberOverlays){
if(noClicks==false) new_pos=cur_pos+1;
} else {
var className="Overlay"+currentOverlay;
var overlay=getElementsByClass(className,slideHolder.childNodes[cur_pos]);
for(var i=0; i<overlay.length; i++) {overlay[i].className=className+' previousOverlay';}
currentOverlay++;
slideHolder.setAttribute('currentOverlay',currentOverlay);
className="Overlay"+currentOverlay;
overlay=getElementsByClass(className,slideHolder.childNodes[cur_pos]);
for(i=0; i<overlay.length; i++) {overlay[i].className=className+' currentOverlay';}
return false;
}
break;
case "p":
var numberOverlays = parseFloat(slideHolder.childNodes[cur_pos].getAttribute('numberOverlays'));
var currentOverlay = parseFloat(slideHolder.getAttribute('currentOverlay'));
if(numberOverlays==0 || currentOverlay==0){
if(noClicks==false) new_pos=cur_pos-1;
} else {
var className="Overlay"+currentOverlay;
var overlays=getElementsByClass(className,slideHolder.childNodes[cur_pos]);
for(var i=0; i<overlays.length; i++) {overlays[i].className=className+' nextOverlay';}
currentOverlay--;
className="Overlay"+currentOverlay;
overlays=getElementsByClass(className,slideHolder.childNodes[cur_pos]);
for(i=0; i<overlays.length; i++) {overlays[i].className=className+' currentOverlay';}
slideHolder.setAttribute('currentOverlay',currentOverlay);
return false;
}
break;
default:
new_pos=cur_pos+step;
}
if(slideShowCircularMode && new_pos == numberSlides) new_pos=0;
if(slideShowCircularMode && new_pos<0) new_pos=(numberSlides - 1);
if(step!=0 && new_pos>=0 && new_pos<numberSlides) {
slideHolder.childNodes[cur_pos].style.display='none';
slideHolder.childNodes[new_pos].style.display='block';
slideHolder.setAttribute('currentslide',new_pos);
var numberOverlays = parseFloat(slideHolder.childNodes[new_pos].getAttribute('numberOverlays'));
if(step=="p"){
var currentOverlay=numberOverlays;
var state=' previousOverlay';
} else {
var currentOverlay=0;
var state=' nextOverlay';
}
slideHolder.setAttribute('currentOverlay',currentOverlay);
if(numberOverlays>0) {
for(var i=1; i<=numberOverlays; i++){
var className="Overlay"+i;
var overlays=getElementsByClass(className,slideHolder.childNodes[new_pos]);
for(var j=0; j<overlays.length; j++) {overlays[j].className=className+state;}
}
if(step=="p"){
var className="Overlay"+numberOverlays;
var overlays=getElementsByClass(className,slideHolder.childNodes[new_pos]);
for(var j=0; j<overlays.length; j++) {overlays[j].className=className+' currentOverlay';}
}
}
new_pos++;
var indexNumbers = document.getElementById('indexNumbers');
indexNumbers.firstChild.data = new_pos+'/'+numberSlides;
if((new_pos==numberSlides) && !slideShowCircularMode && autoAdvance) clearInterval(autoAdvance);
return true;
}
return false;
}
function tocShowSlide(e) {
if (!e) var e = window.event;
var target = resolveTarget(e);
var slide = target.getAttribute('slideNumber');
var cur_pos = document.getElementById('slideContainer').getAttribute('currentslide');
var step = slide-cur_pos;
if(step!=0) GoToSlide(step);
showHideTOC('none');
return;
}
//Toggle the display of the table of contents
function showHideTOC(display){
var toc = document.getElementById('toc');
//Reset the input box
document.getElementById('jumpInput').value = "";
if (display == null || display.length == null){
if (toc.style.display == 'none' || toc.style.display == ''){
toc.style.display = 'block';
document.getElementById('jumpInput').focus();
} else {
toc.style.display = 'none';
}
} else {
toc.style.display = display;
if (display == 'block')
document.getElementById('jumpInput').focus();
}
}
function padZero(x){return (x>=10 || x<0 ? "" : "0")+x;}
function setClock(){
var actualTime = new Date();
var newTime = actualTime.getTime() - clockStartTime;
newTime = clockMultiplier*newTime+clockInterval+clockCorrection;
actualTime.setTime(newTime);
newTime = padZero(actualTime.getHours()) + ":" + padZero(actualTime.getMinutes())+ ":" + padZero(actualTime.getSeconds());
var clock = document.getElementById('slideClock');
clock.firstChild.nodeValue = newTime;
}
function resetClock(){
var time = new Date(0);
if(clockStartTime>time){
var startTime = new Date();
clockStartTime=startTime.getTime();
}
}
var title;
var place;
var autoAdvance=null;
var slideClock=null;
var noOverlays=false;
var noClicks=false;
var forceRefresh=false;
var time = 0;
var slideShowCircularMode;
var slideShowStyleSheet;
var slideShowParams;
var clockMultiplier;
var clockInterval;
var clockCorrection=0;
var clockStartTime;
var openTiddlers;
config.macros.slideShow.handler = function(aPlace,macroName,params,wikifier,paramString,tiddler){
if(tiddler instanceof Tiddler){
var lingo = config.views.wikified.slideShow;
if (!e) var e = window.event;
place = aPlace;
title = tiddler.title;
params = reparse(paramString);
var onclick = function(){config.macros.slideShow.onClickSlideShow(params);};
createTiddlyButton(aPlace,lingo.text,lingo.tooltip,onclick);
}
}
config.macros.slideShow.onClickSlideShow = function(newParams) {
// if(typeof(newParams)=="number") newParams=slideShowParams;
openTiddlers = new Array;
var viewer=document.getElementById('tiddlerDisplay');
for(var i=0; i<viewer.childNodes.length; i++){
var name = viewer.childNodes[i].getAttribute('tiddler');
openTiddlers.push(name);
}
document.oncontextmenu = function(e){return false;}
clockMultiplier = 1;
clockInterval = 0;
var startTime = new Date(0);
slideShowCircularMode = false;
time = 0;
slideShowStyleSheet = null;
if(newParams['style']){
slideShowStyleSheet = eval(newParams['style']);
}
if(newParams['repeat']){
slideShowCircularMode = true;
}
if(newParams['noClicks']){
noClicks = true;
}
if(newParams['forceRefresh']){
forceRefresh = true;
}
if(newParams['slidePause'] > 0){
time = newParams['slidePause'];
}
if(newParams['clock']){
clockCorrection=startTime.getTimezoneOffset()*60000;
startTime = new Date();
var clockType= eval(newParams['clock']);
if(clockType != '+') {
clockMultiplier = -1;
clockInterval = -clockType*60000;
}
}
clockStartTime=startTime.getTime();
if(newParams['noOverlays']){
noOverlays = true;
}
clearMessage();
//Attach the key and mouse listeners
document.onkeyup = keys;
document.onmouseup = clicker;
story.refreshTiddler(title,"SlideShowViewTemplate",true);
createSlides(newParams);
slideClock=setInterval("setClock()", 1000);
if(time>0) autoAdvance=setInterval("GoToSlide(1)", time);
story.closeAllTiddlers(title);
toggleSlideStyles();
return;
}
config.macros.slideShow.endSlideShow=function(){
var showHolder = document.getElementById('slideShowWrapper');
showHolder.parentNode.removeChild(showHolder);
document.oncontextmenu = function(e){};
if(autoAdvance) clearInterval(autoAdvance);
if(slideClock) clearInterval(slideClock);
noClicks=false;
story.refreshTiddler(title,null,true);
story.closeAllTiddlers();
toggleSlideStyles();
story.displayTiddlers(null,openTiddlers,DEFAULT_VIEW_TEMPLATE);
document.onmouseup = function(){};
}
function isInteger(s){
var i;
for (i = 0; i < s.length; i++){
// Check that current character is number.
var c = s.charAt(i);
if (((c < "0") || (c > "9"))) return false;
}
// All characters are numbers.
return true;
}
function jumpInputToSlide(e){
if (!e) {
e = window.event;
e.which = e.keyCode;
}
if(e.which==13){
var jumpInput= document.getElementById("jumpInput").value;
if(isInteger(jumpInput)){
var step=jumpInput-document.getElementById('slideContainer').getAttribute('currentslide')-1;
if (GoToSlide(step)){
showHideTOC('none');
}
}
}
return;
}
//Used to shorten the TOC fields
function abbreviateLabel(label){
var maxTOCLength = config.macros.slideShow.maxTOCLength;
if(label.length>maxTOCLength) {
var temp = new Array();
temp = label.split(' ');
label = temp[0];
for(var j=1; j<temp.length; j++){
if((label.length+temp[j].length)<=maxTOCLength){
label += " " + temp[j];
} else {
label += " ...";
break;
}
}
}
return label;
}
function createSlides(newParams){
var lingo = config.views.wikified.slideShow;
//Remove dblClick on edit function
var theTiddler = document.getElementById("tiddler"+title);
theTiddler.ondblclick = function() {};
// Grab the 'viewer' element and give it a signature so the show can be resumed if stopped
var tiddlerElements = theTiddler.childNodes;
var viewer;
for (var i = 0; i < tiddlerElements.length; i++){
if (tiddlerElements[i].className == "viewer") viewer = tiddlerElements[i];
}
viewer.id = 'slideShowWrapper';
//Hide the text that comes before the first H1 element (I think I may put this into a cover page type thing)
while(viewer.childNodes.length > 0 && viewer.firstChild.nodeName.toUpperCase() != "HR" && viewer.firstChild.className!="slideSeparator") {
viewer.removeChild(viewer.firstChild);
}
//Cycle through the content and each time you hit an H1 begin a new slide div
var slideNumber = 0;
var slideHolder = document.createElement('DIV');
slideHolder.id = "slideContainer";
slideHolder.setAttribute('currentslide',0);
while(viewer.childNodes.length > 0){
//Create a new slide a append it to the slide holder
if (viewer.firstChild.nodeName.toUpperCase() == "HR" && viewer.firstChild.className=="slideSeparator"){
slideNumber++;
var slide = document.createElement('DIV');
slide.id = "slideNumber"+slideNumber;
slide.className = "slide";
if (slideNumber > 1) {
//slideHolder.setAttribute('currentslide',0);
slide.style.display='none';
} else {
slide.style.display='block';
}
slideHolder.appendChild(slide);
viewer.removeChild(viewer.firstChild);
} else {
if(viewer.firstChild.nodeName=="SPAN" && viewer.firstChild.className=="" && viewer.firstChild.hasChildNodes()) {
var anchor=viewer.firstChild.nextSibling;
for (var ii=0;ii<viewer.firstChild.childNodes.length;ii++) {
var clone=viewer.firstChild.childNodes[ii].cloneNode(true);
viewer.insertBefore(clone,anchor);
}
viewer.removeChild(viewer.firstChild);
} else {
slide.appendChild(viewer.firstChild);
}
}
}
//Stick the slides back into the viewer
viewer.appendChild(slideHolder);
slideHolder.setAttribute('numberSlides',slideNumber);
//Create the navigation bar
var slidefooter = createTiddlyElement(viewer,"DIV","slideFooter","slideFooterOff");
var navigator = createTiddlyElement(slidefooter,"SPAN","navigator");
//Make it so that when the footer is hovered over the class will change to make it visible
slidefooter.onmouseover = function () {slidefooter.className = "slideFooterOn"};
slidefooter.onmouseout = function () {slidefooter.className = "slideFooterOff"};
//Create the control button for the navigation
var onClickQuit = function(){config.macros.slideShow.endSlideShow();};
createTiddlyButton(navigator,lingo.quit.text,lingo.quit.tooltip,onClickQuit);
createTiddlyButton(navigator,lingo.firstSlide.text,lingo.firstSlide.tooltip,first_slide);
createTiddlyButton(navigator,lingo.previousSlide.text,lingo.previousSlide.tooltip,previous_slide);
createTiddlyButton(navigator,lingo.nextSlide.text,lingo.nextSlide.tooltip,next_slide);
createTiddlyButton(navigator,lingo.lastSlide.text,lingo.lastSlide.tooltip,last_slide);
createTiddlyButton(navigator,lingo.resetClock.text,lingo.resetClock.tooltip,resetClock,"button","slideClock");
var indexNumbers = createTiddlyElement(slidefooter,"SPAN","indexNumbers","indexNumbers","1/"+slideNumber)
indexNumbers.onclick = showHideTOC;
var toc = createTiddlyElement(slidefooter,"UL","toc");
var ovl=1;
for (var i=0;i<slideHolder.childNodes.length;i++) {
if(!noOverlays) {
var ovl=1;
while(1){
var className="Overlay"+ovl;
var overlays=getElementsByClass(className,slideHolder.childNodes[i]);
if(overlays.length>0){
for(var j=0; j<overlays.length; j++) {overlays[j].className+=' nextOverlay';}
ovl++;
} else {break;}
}
}
slideHolder.childNodes[i].setAttribute("numberOverlays",ovl-1);
slideHolder.setAttribute("currentOverlay",0);
//Loop through each slide and check the header's content
var tocLabel = null;
for (var j=0;j<slideHolder.childNodes[i].childNodes.length;j++) {
var node = slideHolder.childNodes[i].childNodes[j];
if(node.nodeName=="H1" || node.nodeName=="H2" || node.nodeName=="H3" || node.nodeName=="H4") {
var htstring = node.innerHTML;
var stripped = htstring.replace(/(<([^>]+)>)/ig,"");
tocLabel = abbreviateLabel(stripped);
var tocLevel="tocLevel"+node.nodeName.charAt(1);
var tocItem = createTiddlyElement(toc,"LI",null,tocLevel);
var tocLink = createTiddlyElement(tocItem,"A",null,"tocItem",tocLabel);
tocLink.setAttribute("slideNumber",i);
tocLink.onclick=tocShowSlide;
}
}
}
//Input box to jump to s specific slide
var tocItem = createTiddlyElement(toc,"LI",null,"tocJumpItem",config.macros.slideShow.messages.gotoLabel);
var tocJumpInput = createTiddlyElement(tocItem,"INPUT","jumpInput");
tocJumpInput.type="text";
tocJumpInput.onkeyup=jumpInputToSlide;
}
var next_slide= function(e){GoToSlide(1);}
var first_slide= function(e){GoToSlide("f");}
var previous_slide= function(e){GoToSlide(-1);}
var last_slide= function(e){GoToSlide("l");}
function toggleSlideStyles(){
var contentWrapper = document.getElementById('contentWrapper');
if (contentWrapper.className == "slideShowMode"){
contentWrapper.className = "";
window.applyPageTemplate();
setStylesheet("#backstageShow{display: block;}","SlideShowStyleSheet");
changeStyleSheet();
} else{
contentWrapper.className = "slideShowMode";
window.applyPageTemplate("SlideShowPageTemplate");
setStylesheet(store.getRecursiveTiddlerText("SlideShowStyleSheet"),"SlideShowStyleSheet");
if(slideShowStyleSheet) changeStyleSheet(slideShowStyleSheet);
}
}
config.shadowTiddlers.SlideShowPageTemplate="<!--{{{-->\n<div id='displayArea'>\n<div id='tiddlerDisplay'></div>\n</div>\n<!--}}}-->";
config.shadowTiddlers.SlideShowViewTemplate="<!--{{{-->\n<div class='title' macro='view title'></div>\n<div class='viewer' macro='view text wikified'></div>\n<!--}}}-->";
config.shadowTiddlers.SlideShowStyleSheet = "/***\n!Slide Mode Styles\n***/\n/*{{{*/\n#backstageShow{\n display: none !important;\n}\n\n#contentWrapper.slideShowMode #slideContainer{\n display: block;\n}\n\n#contentWrapper.slideShowMode .Comment{\n display: none;\n}\n\n#contentWrapper.slideShowMode .nextOverlay{\n visibility: hidden;\n}\n\n#contentWrapper.slideShowMode .currentOverlay{\n visibility: visible;\n}\n\n#contentWrapper.slideShowMode .previousOverlay{\n visibility: visible;\n}\n\n#jump{\n text-align: right;\n}\n\n.slideFooterOff #navigator{\n visibility: hidden;\n}\n\n.slideFooterOn #navigator{\n visibility: visible;\n}\n\n#contentWrapper.slideShowMode #slideClock{\n cursor: pointer; margin: 0 5px 0 5px; border: 1px solid #db4\n}\n\n#contentWrapper.slideShowMode,\n #contentWrapper.slideShowMode #displayArea{\n width: 100%;\n font-size: 1.5em;\n margin: 0 !important;\n padding: 0;\n}\n\n#slideContainer{\n display: none;\n}\n\n.indexNumbers{\n cursor: pointer;\n}\n\n#navigator{\n visibility: hidden;\n bottom: 0;\n}\n\n#toc{\n display: none;\n position: absolute;\n font-size: .75em;\n bottom: 2em;\n right: 0;\n background: #fff;\n border: 1px solid #000;\n text-align: left;\n}\n\nul#toc, #toc li{\n margin: 0;\n padding: 0;\n list-style: none;\n line-height: 1em;\n}\n\n.tocJumpItem{\n margin-right: 2em;\n}\n\n.tocJumpItem input{\nmargin-right: 1em;\n border: 0;\n}\n\n#toc a,\n#toc a.button{\n display: block;\n padding: .1em;\n}\n\n#toc .tocLevel1{\nfont-size: .8em;\n}\n\n#toc .tocLevel2{\n margin-left: 1em;\n font-size: .75em;\n}\n\n#toc .tocLevel3{\n margin-left: 2em;\nfont-size: .75em;\n}\n\n#toc .tocLevel4{\n margin-left: 3em;\nfont-size: .65em;\n}\n\n#toc a{\n cursor: pointer;\n}\n\nh1{\n min-height: 1em;\n}\n\n.slide h1{\n min-height: 0;\n}\n\n/* The '>' selector is ignored by IE6 and earlier so the proper rules are given */\n#slideFooter{\n position: fixed;\n bottom: 2px;\n right: 2px;\n width: 100%;\n text-align: right;\n}\n\n/* This is a hack to trick IE6 and earlier to put the navbar on the bottom of the page */\n* html #slideFooter {\n position: absolute;\n width: 100%;\n text-align: right;\n right: auto; bottom: auto;\n left: expression( ( -20 - slideFooter.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );\n top: expression( ( -10 - slideFooter.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );\n}\n\n\n\n/*}}}*/";
config.shadowTiddlers.SlideShowPluginDoc="The documentation is missing. It is available [[here|http://www.math.ist.utl.pt/~psoares/addons.html#SlideShowPluginDoc]].";
//}}}
!Description
This plugin turns a TiddlyWiki tiddler into a simple slide show type display. Most features that are usually found in presentation software are available. It should work in a way that does not interfere with TiddlyWiki. When you close the slide show you get back to your good old TW.
This plugin has been tested in Firefox and Internet Explorer. Let me know if something seems broken.
!Usage
To use this plugin you //must// be using TiddlyWiki 2.0. Some optional features (as the incremental display) require version 2.0.8 or higher. To install the plugin copy the tiddlers SlideShowPlugin, SlideShowPageTemplate and SlideShowViewTemplate to your TW, label the first one with the //systemConfig// tag, save the TW and refresh the browser.
To make a slide show simply drop {{{<<slideShow>>}}} at the beginning of a tiddler and use {{{--s--}}} to start each slide.
If you move your mouse over the bottom of the browser window you will see a few navigation buttons, a clock and a table of contents that shows up when you click the slide number.
Any block of text marked as {{{{{Comment{For my eyes only!}}}}}} will not be displayed in the slide show.
See these and other features in this [[SlideShowExample]].
!Incremental display
A succession of overlays (or layers) can be defined in each slide by marking blocks of text with {{{{{Overlay1{...some text...}}}}}}, {{{{{Overlay2{...some text...}}}}}}, {{{{{Overlay3{...some text...}}}}}}, ...
To costumize the way overlays are shown you can redefine the following CSS classes
*contentWrapper.slideShowMode .previousOverlay
*contentWrapper.slideShowMode .currentOverlay
*contentWrapper.slideShowMode .nextOverlay
in a ~StyleSheet. The default style simply hides the next overlays and shows the current and the previous ones as normal text.
!Slide show parameters
*The slide show can be themed by providing a ~StyleSheet ({{{<<slideShow style:'MyStyleSheet'>>}}})
*By default, there is a clock at bottom of the browser window that displays the current time. This clock can also show the presentation elapsed time with {{{<<slideShow clock:'+'>>}}} or a countdown clock with {{{<<slideShow clock:'-20'>>}}} (for 20 minutes). In these two cases, if you click on the clock display it will be restarted
*The slide show can be set to loop ({{{<<slideShow repeat>>}}})
*You can set it so each slide changes after X milliseconds ({{{<<slideShow slidePause:X>>}}}) (auto advance mode)
*To not use the mouse to navigate through the presentation use {{{<<slideShow noCLicks>>>}}}. This is useful when there are clickable elements in the presentation
*{{{<<slideShow forceRefresh>>>}}} forces a refresh of the presentation tiddler (useful when a presentation is built from separate tiddlers using the {{{<<tiddler>>}}} macro)
*You can disable overlays with {{{<<slideShow noOverlays>>}}}
*These parameters can be mixed and matched in any order: {{{<<slideShow slidePause:1000 repeat>>}}} is the same as {{{<<slideShow repeat slidePause:1000>>}}}
!Slide show navigation
You can navigate through a slide show using the keyboard or the mouse. To quickly move to titled sections you can use the table of contents.
!!Mouse navigation
Left (right) clicking on a slide jumps to the next (previous) overlay. To move to the beginning of the next or previous slide you must use the navigation bar at the bottom of the browser's window. If there are no overlays defined both operations are equivalent.
!!Keyboard navigation
The following keys are defined:
*Left arrow - previous overlay
*Down arrow - previous slide
*Right arrow - next overlay
*Up arrow - next slide
*Home - first slide
*End - last slide
*Escape - exit slide show
*Spacebar - pause/resume slide show in auto advance mode
!Revision history
*1.5.3
**fix for ~TW2.2
**forceRefresh and noClicks
**removed autoStart feature
**templates are now in shadow tiddlers
*1.5.2 13/02/2007
**fixed a conflict with TW pageFooter
*1.5.1 10/11/2006
**added SlideShowPageTemplate and SlideShowViewTemplate. This way, the plugin no longer requires a standard TW layout. Thanks to Andrew Lister for the idea.
*1.5.0 18/09/2006
**fixed restoring stylesheet on exit
**changed (again!) the way how slides are separated (slide shows prepared for previous versions must be fixed)
*1.4.0 20/04/2006
**changed the way how slides are separated (slide shows prepared for previous versions must be fixed)
**now works with content included with the {{{<<tiddler>>}}} macro
**added incremental display (overlays)
**improved documentation
**assorted small fixes
*1.3.1 10/03/2006
**removed empty slide titles
**fixed wrong numberSlides when slides have div's
**fixed wrong time in Windows
*1.3.0 26/02/2006
**restore open tiddlers on exit
**fixed problem with markup in headers (should work with NestedSlidersPlugin)
**added slide comments (blocks of text in the tiddler that don't show up in the presentation)
*1.2.1 28/01/2006
**pause timed slideshow with spacebar
**added clock with 3 different modes
**fixed bugs with style and abbreviation options
**general cleanup
*1.2.0 07/01/2006
**added a resume feature
**added themes support
*1.1.5 14/12/2005
**added mouse support
**cleaned up navbar generation
*1.1.0 12/12/2005
**added support for IE
**added key listeners
*1.0.0 11/12/2005
**initial release
!Todo
*Time code is still very hackerish and unreliable.
<!--{{{-->
<div class='title' macro='view title'></div>
<div class='viewer' macro='view text wikified'></div>
<!--}}}-->
/***
''Inspired by [[TiddlyPom|http://www.warwick.ac.uk/~tuspam/tiddlypom.html]]''
|Name|SplashScreenPlugin|
|Created by|SaqImtiaz|
|Location|http://tw.lewcid.org/#SplashScreenPlugin|
|Version|0.21 |
|Requires|~TW2.08+|
!Description:
Provides a simple splash screen that is visible while the TW is loading.
!Installation
Copy the source text of this tiddler to your TW in a new tiddler, tag it with systemConfig and save and reload. The SplashScreen will now be installed and will be visible the next time you reload your TW.
!Customizing
Once the SplashScreen has been installed and you have reloaded your TW, the splash screen html will be present in the MarkupPreHead tiddler. You can edit it and customize to your needs.
!History
* 20-07-06 : version 0.21, modified to hide contentWrapper while SplashScreen is displayed.
* 26-06-06 : version 0.2, first release
!Code
***/
//{{{
var old_lewcid_splash_restart=restart;
restart = function()
{ if (document.getElementById("SplashScreen"))
document.getElementById("SplashScreen").style.display = "none";
if (document.getElementById("contentWrapper"))
document.getElementById("contentWrapper").style.display = "block";
old_lewcid_splash_restart();
if (splashScreenInstall)
{if(config.options.chkAutoSave)
{saveChanges();}
displayMessage("TW SplashScreen has been installed, please save and refresh your TW.");
}
}
var oldText = store.getTiddlerText("MarkupPreHead");
if (oldText.indexOf("SplashScreen")==-1)
{var siteTitle = store.getTiddlerText("SiteTitle");
var splasher='\n\n<style type="text/css">#contentWrapper {display:none;}</style><div id="SplashScreen" style="border: 3px solid #ccc; display: block; text-align: center; width: 320px; margin: 100px auto; padding: 50px; color:#000; font-size: 28px; font-family:Tahoma; background-color:#eee;"><b>'+siteTitle +'</b> is loading<blink> ...</blink><br><br><span style="font-size: 14px; color:red;">Requires Javascript.</span></div>';
if (! store.tiddlerExists("MarkupPreHead"))
{var myTiddler = store.createTiddler("MarkupPreHead");}
else
{var myTiddler = store.getTiddler("MarkupPreHead");}
myTiddler.set(myTiddler.title,oldText+splasher,config.options.txtUserName,null,null);
store.setDirty(true);
var splashScreenInstall = true;
}
//}}}
!!Starting up on Learning Spaces
# Click the link to [[Earlham Learning Spaces|https://els.earlham.edu]] (either in Moodle or elsewhere)
# Logon with your Earlham username and password. If you're using Firefox browser (and IU strongly suggest you do) you can remember your username.
# At the top right of the screen there a link called @@Account settings@@ ; click this.
# Now +++[Set up your account]
<<tiddler [[Set up your account]]>>
===
On commenting:
<<<
"with blogs, I got the feedback I needed when I needed it. My work was that much better because of it."
<<<
<<<
Ultimately, comments work best in two situations: when the commentor is a complete outside from another social group, and when the commentor is a classmate.
<<<
On audience :
<<<
Writing for an audience, no matter who it is, is wonderful via blogging. It’s a much difference experience than writing on a forum, and the content is for the most part more engaging. I like this medium, a lot; I like that people can see what I write.
<<<
On discussion forums :
<<<
Discussion forums for classes simply don’t work. I’ve been in two other classes that tried to use them, Ultimate Frisbee and Asian Cinema. What ends up happening is that people initially post a lot, but by the end of the course the topics become dead and only several people post.
<<<
On writing :
<<<
<<tiddler [[Writing with blogs : student comment]]>>
<<<
<<<
the fact that people outside the class were able to trackback/comment on our blogs was really interesting; it really put us up for review, in some cases, and I’m sure made us think a little bit more about our writing
<<<
<<<
Having my work open to the whole class was fine with me, but having it open to everyone put a little bit of pressure on me. It made me double-check my work for mistakes and also to write formally, not just a stream of consciousness: I certainly did not want the whole Internet to see my mistakes and then use my blog as an example of a bad immature blog.
<<<
/*{{{*/
.myPasOptionInput {background:[[ColorPalette::SecondaryPale]]; }
body {font-size:.8em; font-family:verdana,arial,helvetica; margin:0; padding:0;}
/*}}}*/
!!Earlham Learning Spaces — A Liberal Arts Approach to Social Networking
* [[Online Learning Framework for Digital Natives|Learning Framework]]
* [[Whys and Wherefores of Earlham Learning Spaces|Whys and Wherefores of ELS]]
* [[Earlham Learning Spaces Features|ELS Features]]
* [[New users]]
/***
|''Name:''|~TaggerPlugin|
|''Version:''|1.0.1 (2006-06-01)|
|''Source:''|http://tw.lewcid.org//#TaggerPlugin|
|''Author:''|SaqImtiaz|
|''Description:''|Provides a drop down listing current tiddler tags, and allowing toggling of tags.|
|''Documentation:''|[[TaggerPluginDocumentation]]|
|''Source Code:''|[[TaggerPluginSource]]|
|''~TiddlyWiki:''|Version 2.0.8 or better|
***/
// /%
config.tagger={defaults:{label:"Tags: ",tooltip:"Manage tiddler tags",taglist:"true",excludeTags:"",notags:"tiddler has no tags",aretags:"current tiddler tags:",toggletext:"add tags:"}};config.macros.tagger={};config.macros.tagger.arrow=(document.all?"▼":"▾");config.macros.tagger.handler=function(_1,_2,_3,_4,_5,_6){var _7=config.tagger.defaults;var _8=_5.parseParams("tagman",null,true);var _9=((_8[0].label)&&(_8[0].label[0])!=".")?_8[0].label[0]+this.arrow:_7.label+this.arrow;var _a=((_8[0].tooltip)&&(_8[0].tooltip[0])!=".")?_8[0].tooltip[0]:_7.tooltip;var _b=((_8[0].taglist)&&(_8[0].taglist[0])!=".")?_8[0].taglist[0]:_7.taglist;var _c=((_8[0].exclude)&&(_8[0].exclude[0])!=".")?(_8[0].exclude[0]).readBracketedList():_7.excludeTags.readBracketedList();if((_8[0].source)&&(_8[0].source[0])!="."){var _d=_8[0].source[0];}if(_d&&!store.getTiddler(_d)){return false;}var _e=function(e){if(!e){var e=window.event;}var _11=Popup.create(this);var _12=store.getTags();var _13=new Array();for(var i=0;i<_12.length;i++){_13.push(_12[i][0]);}if(_d){var _15=store.getTiddler(_d);_13=_15.tags.sort();}var _16=_6.tags.sort();var _17=function(_18,_19,_1a){var sp=createTiddlyElement(createTiddlyElement(_11,"li"),"span",null,"tagger");var _1c=createTiddlyButton(sp,_18,_1a+" '"+_19+"'",taggerOnToggle,"button","toggleButton");_1c.setAttribute("tiddler",_6.title);_1c.setAttribute("tag",_19);insertSpacer(sp);if(window.createTagButton_orig_mptw){createTagButton_orig_mptw(sp,_19)}else{createTagButton(sp,_19);}};createTiddlyElement(_11,"li",null,"listTitle",(_6.tags.length==0?_7.notags:_7.aretags));for(var t=0;t<_16.length;t++){_17("[x]",_16[t],"remove tag ");}createTiddlyElement(createTiddlyElement(_11,"li"),"hr");if(_b!="false"){createTiddlyElement(_11,"li",null,"listTitle",_7.toggletext);for(var i=0;i<_13.length;i++){if(!_6.tags.contains(_13[i])&&!_c.contains(_13[i])){_17("[ ]",_13[i],"add tag ");}}createTiddlyElement(createTiddlyElement(_11,"li"),"hr");}var _1f=createTiddlyButton(createTiddlyElement(_11,"li"),("Create new tag"),null,taggerOnToggle);_1f.setAttribute("tiddler",_6.title);if(_d){_1f.setAttribute("source",_d);}Popup.show(_11,false);e.cancelBubble=true;if(e.stopPropagation){e.stopPropagation();}return (false);};createTiddlyButton(_1,_9,_a,_e,"button","taggerDrpBtn");};window.taggerOnToggle=function(e){var tag=this.getAttribute("tag");var _22=this.getAttribute("tiddler");var _23=store.getTiddler(_22);if(!tag){var _24=prompt("Enter new tag:","");if(_24!=""&&_24!=null){var tag=_24;if(this.getAttribute("source")){var _26=store.getTiddler(this.getAttribute("source"));_26.tags.pushUnique(_24);}}else{return false;}}if(!_23||!_23.tags){store.saveTiddler(_22,_22,"",config.options.txtUserName,new Date(),tag);}else{if(_23.tags.find(tag)==null){_23.tags.push(tag);}else{if(!_24){_23.tags.splice(_23.tags.find(tag),1);}}store.saveTiddler(_23.title,_23.title,_23.text,_23.modifier,_23.modified,_23.tags);}story.refreshTiddler(_22,null,true);if(config.options.chkAutoSave){saveChanges();}return false;};setStylesheet(".tagger a.button {font-weight: bold;display:inline; padding:0px;}\n"+".tagger #toggleButton {padding-left:2px; padding-right:2px; margin-right:1px; font-size:110%;}\n"+"#nestedtagger {background:#2E5ADF; border: 1px solid #0331BF;}\n"+".popup .listTitle {color:#000;}\n"+"","TaggerStyles");window.lewcidTiddlerSwapTag=function(_27,_28,_29){for(var i=0;i<_27.tags.length;i++){if(_27.tags[i]==_28){_27.tags[i]=_29;return true;}}return false;};window.lewcidRenameTag=function(e){var tag=this.getAttribute("tag");var _2d=prompt("Rename tag '"+tag+"' to:",tag);if((_2d==tag)||(_2d==null)){return false;}if(store.tiddlerExists(_2d)){if(confirm(config.messages.overwriteWarning.format([_2d.toString()]))){story.closeTiddler(_2d,false,false);}else{return null;}}tagged=store.getTaggedTiddlers(tag);if(tagged.length!=0){for(var j=0;j<tagged.length;j++){lewcidTiddlerSwapTag(tagged[j],tag,_2d);}}if(store.tiddlerExists(tag)){store.saveTiddler(tag,_2d);}if(document.getElementById("tiddler"+tag)){var _2f=document.getElementById(story.idPrefix+tag);var _30=story.positionTiddler(_2f);var _31=document.getElementById(story.container);story.closeTiddler(tag,false,false);story.createTiddler(_31,_30,_2d,null);story.saveTiddler(_2d);}if(config.options.chkAutoSave){saveChanges();}return false;};window.onClickTag=function(e){if(!e){var e=window.event;}var _34=resolveTarget(e);var _35=(!isNested(_34));if((Popup.stack.length>1)&&(_35==true)){Popup.removeFrom(1);}else{if(Popup.stack.length>0&&_35==false){Popup.removeFrom(0);}}var _36=(_35==false)?"popup":"nestedtagger";var _37=createTiddlyElement(document.body,"ol",_36,"popup",null);Popup.stack.push({root:this,popup:_37});var tag=this.getAttribute("tag");var _39=this.getAttribute("tiddler");if(_37&&tag){var _3a=store.getTaggedTiddlers(tag);var _3b=[];var li,r;for(r=0;r<_3a.length;r++){if(_3a[r].title!=_39){_3b.push(_3a[r].title);}}var _3d=config.views.wikified.tag;if(_3b.length>0){var _3e=createTiddlyButton(createTiddlyElement(_37,"li"),_3d.openAllText.format([tag]),_3d.openAllTooltip,onClickTagOpenAll);_3e.setAttribute("tag",tag);createTiddlyElement(createTiddlyElement(_37,"li"),"hr");for(r=0;r<_3b.length;r++){createTiddlyLink(createTiddlyElement(_37,"li"),_3b[r],true);}}else{createTiddlyText(createTiddlyElement(_37,"li",null,"disabled"),_3d.popupNone.format([tag]));}createTiddlyElement(createTiddlyElement(_37,"li"),"hr");var h=createTiddlyLink(createTiddlyElement(_37,"li"),tag,false);createTiddlyText(h,_3d.openTag.format([tag]));createTiddlyElement(createTiddlyElement(_37,"li"),"hr");var _40=createTiddlyButton(createTiddlyElement(_37,"li"),("Rename tag '"+tag+"'"),null,lewcidRenameTag);_40.setAttribute("tag",tag);}Popup.show(_37,false);e.cancelBubble=true;if(e.stopPropagation){e.stopPropagation();}return (false);};if(!window.isNested){window.isNested=function(e){while(e!=null){var _42=document.getElementById("contentWrapper");if(_42==e){return true;}e=e.parentNode;}return false;};}config.shadowTiddlers.TaggerPluginDocumentation="The documentation is available [[here.|http://tw.lewcid.org/#TaggerPluginDocumentation]]";config.shadowTiddlers.TaggerPluginSource="The uncompressed source code is available [[here.|http://tw.lewcid.org/#TaggerPluginSource]]";
// %/
''If you want this documentation available offline, copy this tiddler to your TW.''
!Description:
The tagger plugin is a result of combining key features from the dropTags and tagAdder macro's. However, since it departs somewhat from the interface tagAdder users will be familiar with, I'm making this available as a new plugin alongside tagAdder.
Tagger provides a dropdown list of the current tiddler tags, along with the ability to toggle them. Further it can optionally display a list of tags in the dropdown, which can be addded to the tiddler.
*Clicking on ''[x]'' and ''[ ]'' removes and adds the tag respectively.
*Clicking on the tag text displays the tag dropdown for that tag, listing tiddlers tagged with it.
*The ''Create new tag'' lets you quickly type in a new tag not in the list.
*Click on this button to see the dropdown: <<tagger>>
Further note that each tag dropdown has a ''Rename tag'' option. This can be used to quickly rename a tag in the entire TW, also rename it's tiddler if it exists.
//''tagAdder, dropTags and the future''
- tagAdder will no longer will be developed, but will remain available. I encourage all tagAdder users to upgrade to tagger.
- dropTags will still be developed for those users that dont want the 'tag editing' features.//
!Examples & Usage:
*At it's simplest, using tagger is as simple as {{{<<tagger>>}}} <<tagger>>
**This gives a dropdown with the current tiddler tags, followed by all the tags in the TW.
*You can also use a list of specified tags instead of all tags in the TW, by specifying a source tiddler.
**{{{<<tagger source:TagsDB>>}}} <<tagger source:TagDataBase>>
*You can also display ONLY the current tiddler tags
**{{{<<tagger taglist:false>>}}} <<tagger taglist:false>>
*To exclude tags from the list: {{{<<tagger exclude:"excludeLists Tag2 [[Tag with spaces]]">>}}} <<tagger exclude:"excludeLists Tag2 [[Tag with spaces]]">>
*For a custom button label: {{{<<tagger label:"custom label">>}}} <<tagger label:"custom label">>
*For a custom tooltip: {{{<<tagger tooltip:"custom tooltip">>}}} <<tagger tooltip:"custom tooltip">>
!CSS and Styling:
For those wishing to customize the popup appearance:
*the main popup has a class and id of popup has with all other popups.
*the nested tag popups have an id of nestedpopup
!Advanced Users:
You can change the global defaults for tagger, like the button label, the tags to exclude or whether to display the taglist or not, by editing the ''config.tagger.defaults'' section in the code.
!To Do:
*code optimization
*possibly a 'delete this tag' option.
!History
*version 1.0.1 (2006-06-01): fixed conflicts with QuickOpenTag (TagglyTagging) and AutoTagger.
+++![Configuring tips]
<<tiddler [[Firefox configuring]]>>
===
+++![Add ons]
<<tiddler [[Firefox Add-ons]]>>
===
+++![Spell checking]
<<tiddler [[Firefox spell checking]]>>
===
+++![Backing up]
<<tiddler [[Firefox backup]]>>
===
!Documentation for TiddlyLightBoxPlugin
''Credits:''
This lightbox implementation is a derivative of Bob Denny's [[DC3.LightBox|http://solo.dc3.com/tw/index.html]] library optimized for a ~TiddlyWiki environment, with an emphasis on ease of use. It also uses some code and ideas from [[LightBox Gone Wild|http://particletree.com/features/lightbox-gone-wild/]] and [[Ibox|http://www.ibegin.com/ibox/]]. For a more feature rich and versatile option, you can't beat the ~DC3 library.
''Concept:''
I needed a light weight lightbox implementation for [[TiddlyThemes|http://tiddlythemes.googlepages.com/index.html]] but none of the existing options fit the bill. The ~DC3 library came closest, so I set out to rewrite it. I believe the result is a quite versatile ~TW plugin. Some of the bells and whistles have been removed though since I find them annoying (animations), and there are some features yet to be implemented, as you can read further on this document. Almost the entire library has been rewritten.
''Installation:''
Copy the TiddlyLightBoxPlugin tiddler to your TW, tag it with systemConfig, save and reload your TW file. You will also need to save [[this|indicator.gif]] 'loading' image to the same folder as your TW. Or you can choose one of many [[here|http://www.ajaxload.info/]]. That's it, you are ready to create some lightboxes!
''Usage:''
There are 3 macros provide to facilitate setting up macros.
1. ''{{{<<imagebox>>}}}''
The imagebox macro is designed to display images in the lightbox. The usage is very easy. Simply create a text or image link to an image using standard TW syntax, and follow it with {{{<<imagebox>>}}}.
Eg: {{{[img[cactus-thumb.jpg]cactus.jpg]]}}}
[img[cactus-thumb.jpg][cactus.jpg]]<<imagebox>>
Let's try a text link: {{{[[click me|triad.jpg]]<<imagebox>>}}}
[[click me|triad.jpg]]<<imagebox>>
This macro also accepts some optional parameters in this order:
2. description text
3. width ( as a number, like 500)
4. height (as a number, like 300)
Also, if width is passed as a word, like "bananas", then it is treated as a css class and the container for the image is given the class "bananas".
Let's try one more, with a title and a custom size:
{{{[img[cubicles-thumb.jpg][cubicles.jpg]]<<imagebox 'Office space' 300 300>>}}}
[img[cubicles-thumb.jpg][cubicles.jpg]]<<imagebox 'Office space' 300 300>>
----
2. ''{{{<<divbox>>}}}''
The divbox macro lets you put the html content of any inline div into a lightbox, you just need the id of the div in question. The idea being to create a hidden div using "display:none" and then displaying it on the click of a link/button.
You can create such a div in any tiddler by wrapping it in html tags, but using the MarkupPostBody tiddler might be the better option.
The macro can create the button for you, or you can use an existing element to launch the lightbox. To create a button, pass the label for the button as the first parameter. To use an existing element, pass the first parameter as ' ' and place the macro immediately after the element. Eg: {{{<<tiddlerbox label>> or <<tiddlerbox ''>>}}}
The next parameter is the id of the div to display: {{{<<tiddlerbox label theID>>}}}
These two parameters are a must for the divbox macro. There are also 3 more optional parameters, just like the imagebox macro:
3. description text
4. width ( as a number, like 500) OR className
5. height (as a number, like 300)
As an example, lets display this hidden div which I have written inline:
{{{<html><div id="testDiv" style="display:none;"><div style="text-align:center;"> Lightboxes have become very cliche, but they can still be useful!</div></div></html><<divbox "Click to see it" "testDiv" "This is a test div">>}}}
<html><div id="testDiv" style="display:none;"><div style="text-align:center"><br><br><br><br> Lightboxes have become very cliche, but they can still be useful!</div></div></html><<divbox "Click to see it" "testDiv" "This is a test div">>
----
3.''{{{<<tiddlerbox>>}}}''
This macro lets you put the wikified contents of any tiddler into a lightbox! So you can put your MainMenu and Sidebar into a lightbox for example, and have handy links to bring them up whenever you need them. (like in say the hovering menu provided by HoverMenuPlugin). It's also very useful for when you are working on something and want to refer to some reference material without having to loose your place in your work.
The parameters for this macro are the same as for the divbox macro, except instead of the id for the div, you use the title of the tiddler.
Let's give it a go:
{{{<<tiddlerbox "menu" "MainMenu" "Thats my main menu, and the links work!">>}}}
<<tiddlerbox "menu" "MainMenu" "Thats my main menu, and the links work!">>
or
{{{<<tiddlerbox "menu" "Sidebar" "Thats my sidebar!" 300 500>>}}}
<<tiddlerbox "sidebar" "Sidebar" "Thats my sidebar!" 300 500>>
-----
''CSS Styling:''
The css rules for the lightbox and its contents are in the TiddlyLightBoxStyles folder. You can edit them to your liking, but I recommend not changing the rules for ~lightBoxOverlay and lightboxprogress. But don't worry, if you break anything, just delete the tiddler. It's a shadow tiddler!
I'll post a diagram showing the structure of the lightbox later, to faciliate css styling.
----
''Features comparison with ~DC3Lightbox:''
Missing:
* IE transparency filters
* ability to create own lightbox containers
*call back functions on closing lightbox
Added:
*macros for TW usage
*optimized for TW environment
*ability to display Tiddlers in lightboxes
*preloading of images, to avoid layout problems
*removed need for manually creating styles tiddler and adding html markup.
*fixed bug with regards to selects displaying over the lightbox!
----
''To Do''
* fixed positioning of lightbox so it scrolls with the page!
*possible light weight animation for images
* optional preloading of images
* resizing of images to fit the viewport when larger.
* optional automatic lightboxing of all links to images.
*grabbing description from image alt text.
* improved support for inline html content.
!!Images in a lightbox:
[img[cactus-thumb.jpg][cactus.jpg]]<<imagebox>>
Let's try a text link:
[[click me|triad.jpg]]<<imagebox>>
----
!Html div in a lightbox:
<html><div id="testDiv" style="display:none;"><div style="text-align:center"><br><br><br><br> Lightboxes have become very cliche, but they can still be useful!</div></div></html><<divbox "Click to see it" "testDiv" "This is a test div">>
----
!Tiddlers in a lightbox:
Let's give it a go:
<<tiddlerbox "menu" "MainMenu" "Thats my main menu, and the links work!">>
<<tiddlerbox "sidebar" "Sidebar" "Thats my sidebar!" 300 500>>
----
[[Full Documentation|TiddlyLightBoxDoc]]
[[TiddlyLightBoxPlugin]]
/***
|''Name:''|TiddlyLightBox|
|''Date:''|Jan 1, 2006|
|''Version:''|1.0 beta|
|''Author:''|Saq Imtiaz|
|''Location:''|http://tw.lewcid.org/#TiddlyLightBoxPlugin|
|''Documentation:''|http://tw.lewcid.org/#TiddlyLightBoxDocs|
|''License:''|[[Creative Commons Attribution-ShareAlike 2.5 License|http://creativecommons.org/licenses/by-sa/2.5/]]|
|''Based on:''|DC3.LightBox<br>Light Box Gone Wild <br>Ibox|
!!Code
***/
//{{{
config.macros.imagebox ={};
config.macros.imagebox.handler = function (place,macroName,params,wikifier,paramString,tiddler)
{
var e = place.lastChild;
e.onclick = function(){TiddlyLightBox.initBox('image',this,params[1],params[2],params[0]);return false;};
}
config.macros.divbox ={};
config.macros.divbox.handler = function (place,macroName,params,wikifier,paramString,tiddler)
{
if (params[0]!=".")
createTiddlyButton(place,params[0],params[0],function(){TiddlyLightBox.initBox('html',params[1],params[3],params[4],params[2]);return false;});
else
{
var e = place.lastChild;
e.onclick = function(){TiddlyLightBox.initBox('html',params[1],params[3],params[4],params[2]);return false;};
}
}
config.macros.tiddlerbox ={}
config.macros.tiddlerbox.handler = function (place,macroName,params,wikifier,paramString,tiddler)
{
config.macros.divbox.handler(place,macroName,[params[0],"tiddler:"+params[1],params[2],params[3],params[4]]);
return false;
}
store.addNotification("TiddlyLightBoxStyles",refreshStyles);
if (!window.TiddlyLightBox)
window.TiddlyLightBox = {};
var loadingImage = "indicator.gif";
window.TiddlyLightBox =
{
_curBox: null, // [sentinel]
lightBoxHtml : '<div id="lightBoxOverlay" onclick="TiddlyLightBox.hideBox()" style="display:none"></div><div id="lightboxprogress" style="display:none;"><img src=\''+loadingImage+'\' alt=\'loading\' style="width:128px;height:128px;"></div><div class="lightBox" id="lightBox" style="display:none"><div id="lightBoxContent"></div><div id="lightBoxTitle">This is a title</div><div id="lightBoxClose"><a href:"#" onclick="TiddlyLightBox.hideBox();return false;">Click to close</a></div></div>',
createBoxWrapper : function()
{
var wrapper = createTiddlyElement(document.getElementsByTagName("body")[0],"div","tiddlyLightBoxWrapper");
wrapper.innerHTML = this.lightBoxHtml;
},
initBox : function(contentType,url,w,h,text)
{
if (this._curBox)
return;
this.showProgress();
this.hideSelects("hidden");
this.showBg();
this._curBox = true;
this.sizeTheBox(contentType,w,h);
if (contentType == 'image')
this.showImage(url,text);
else if (contentType == 'html')
this.showHtml(url,text);
return false;
},
sizeTheBox : function(contentType,w,h)
{
var box = document.getElementById("lightBoxContent");
if (w && isNaN(parseInt(w)))
{
addClass(box,w);
}
else if (w ||h || contentType == 'html')
{
box.style.width = w? w+ "px" : "450px";
box.style.height = h? h+ "px" : "280px";
if (contentType=='image')
setStylesheet("#lightBoxContent img{height:100%;width:100%;}","lightBoxImageSizeHack");
}
},
showProgress : function()
{
var progress = document.getElementById("lightboxprogress");
progress.style.display='';
this._center(progress);
},
hideProgress: function()
{
var progress = document.getElementById("lightboxprogress");
progress.style.display='none';
},
//this function lifted from Lightbox Gone Wild
hideSelects: function(visibility)
{
var selects = document.getElementsByTagName('select');
for(i = 0; i < selects.length; i++)
{
selects[i].style.visibility = visibility;
}
},
showBg: function()
{
var overlay = document.getElementById('lightBoxOverlay');
if (config.browser.isIE)
{
overlay.style.height = Math.max(document.documentElement.scrollHeight,document.documentElement.offsetHeight);
overlay.style.width = document.documentElement.scrollWidth;
}
overlay.style.display = 'block';
},
showImage: function (url,text)
{
imgPreloader = new Image();
imgPreloader.onload = function ()
{
var lb = document.getElementById("lightBoxContent");
lb.innerHTML = "<img src="+url+">";
lb.onclick = function(){TiddlyLightBox.hideBox();return false;};
TiddlyLightBox.posBox(text);
};
imgPreloader.src = url;
},
showHtml : function(theID,text)
{
var lb = document.getElementById("lightBoxContent");
if (theID.indexOf("tiddler:")==-1)
lb.innerHTML = document.getElementById(theID).innerHTML;
else
{
wikify(store.getTiddlerText(theID.replace("tiddler:","")),lb);
lb.className='tiddler';
}
lb.style.overflow = "auto";
this.posBox(text);
},
posBox: function(text)
{
this.setTitle(text);
this.hideProgress();
var lb = document.getElementById("lightBox");
lb.style.display = "";
lb.style.visibilty = "hidden";
lb.style.position = "absolute";
this._center(lb);
if(!TiddlyLightBox._curBox) return;
lb.style.visibility = "visible";
lb.style.display = "block";
},
setTitle: function(text)
{
document.getElementById("lightBoxTitle").innerHTML= (text==undefined)? '': text;
},
_center: function(lb)
{
var lbSize = new TiddlyLightBox.getElementSize(lb);
lb.style.left = (Math.round(findWindowWidth()/2) - (lbSize.width /2) + findScrollX())+'px';
lb.style.top = (Math.round(findWindowHeight()/2) - (lbSize.height /2) + findScrollY())+'px';
},
//this function lifted from Ibox
getElementSize : function(elem)
{
this.width = elem.offsetWidth || elem.style.pixelWidth;
this.height = elem.offsetHeight || elem.style.pixelHeight;
},
hideBox: function()
{
if(!this._curBox)
return;
document.getElementById("tiddlyLightBoxWrapper").innerHTML= this.lightBoxHtml;
setStylesheet("","lightBoxImageSizeHack");
this._curBox = null;
return false;
}
}
TiddlyLightBox.createBoxWrapper();
Story.prototype.findContainingTiddler = function(e)
{
while(e && (!hasClass(e,"tiddler") || !e.getAttribute("tiddler")))
e = e.parentNode;
return(e);
}
config.shadowTiddlers.TiddlyLightBoxStyles="/*{{{*/\n#lightBoxOverlay {\n position:absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 90; \n background-color: #000;\n -moz-opacity: 0.75;\n opacity: .75;\n filter: alpha(opacity=75);\n}\n#lightBoxOverlay[id]{ \n position: fixed;\n}\n\n#lightboxprogress { \n margin:0;padding:0;\n position: absolute;\n z-index:95;\n}\n\ndiv.lightBox {\n background: #fff;\n color: #fff;\n border: 4px solid #525252;\npadding:20px 20px 25px 20px; position:absolute; z-index:99;\n}\n\n#lightBoxClose {text-align:right; color:#000; font-size:1.0em; position:absolute; bottom:6px; right:20px;}\n#lightBoxClose a{color:#666; border-bottom:1px solid #666;cursor:pointer;}\n#lightBoxClose a:hover {color:#111; border-bottom:1px solid #666; cursor:pointer; background:transparent;}\n\n#lightBoxContent {border:1px solid #525252;color:#000; background:#fff;}\n#lightBox .tiddler {background:#fff;}\n\n#lightBoxContent img {border:0;margin:0;padding:0;display:block;cursor:pointer;}\n\n#lightBoxTitle {padding:0px; font-weight:bold; position:absolute; left:20px;bottom:6px; font-size:1.1em; color:#000;}\n\n/*}}}*/";
//}}}
[[About]]<<tag getting_started>><<tag HowTo>><<tag Training>><<tag community>>
!Using Earlham Learning Spaces with a class
I interviewed Ana Cornide, a new Spanish teacher at Earlham, to ask her about her experiences using the Earlham Learning Spaces (Elgg).
!!1. Why did you want to use a blog with your class?
Basically, Ana said that she was not clear about blogging until I showed her the Earlham Learning Spaces system.
<html>
<object type="application/x-shockwave-flash" data="audio/emff_comments.swf?src=audio/1.why_blog.mp3" width="100" height="18" align="center">
<param name="movie" value="audio/emff_comments.swf?src=audio/1.why_blog.mp3"/>
</object> <span>0:29</span>
</html>
!!2. How did you use Earlham Learning Spaces?
* the students had to watch a movie every week and write a review which they posted to their blog.
** [they were also ask to tag the blog entry with a keyword for the film so that all the posting for that tag could be seen]
* they were able to see blog entries and develop ideas and be aware of each other's writing
* improvements in grammatical expression and ideas
* students found one major review per week plus comments was exhausting
* marked and visible improvement in writing over the semester.
* especially good for 2^^nd^^ language acquisition.
* when making comments on each other's work students can easily see quality writing. Of great benefit pedgogically.
<html>
<object type="application/x-shockwave-flash" data="audio/emff_comments.swf?src=audio/2.how_used.mp3" width="120" height="18" align="center">
<param name="movie" value="audio/emff_comments.swf?src=audio/2.how_used.mp3"/>
</object><span>2:59</span>
</html>
!!3. Commenting
* students wrote comments on each other's blog postings.
* they were required to write three per week but they often wrote more. They did feel valued with these.
* Ana read all the comments and fed her remarks back to the students. Good pedagogy.
[[Catalina's blog entry|graphics/catalina_tudor_blog_comments.png]]<<imagebox>> is a good example of commenting.
!!4. Friends
* Earlham learning spaces seemed to be 'friendly'
* Similar in feel to Facebook -- comfortable space
<html>
<object type="application/x-shockwave-flash" data="audio/emff_comments.swf?src=audio/3.friends.mp3" width="120" height="18" align="center">
<param name="movie" value="audio/emff_comments.swf?src=audio/3.friends.mp3"/>
</object><span>0:35</span>
</html>
!!5. A social learning community
* environment that's comfortable, safe and friendly
* students are vulnerable -- become a community
* exposing their creations to others -- trust others
* develop a ''learning community'' inside and outside the class
<html>
<object type="application/x-shockwave-flash" data="audio/emff_comments.swf?src=audio/4.facebook_comparison.mp3" width="120" height="18" align="center">
<param name="movie" value="audio/emff_comments.swf?src=audio/4.facebook_comparison.mp3"/>
</object><span>2:51</span>
</html>
!!6. Use it again?
* ''yes''
<html>
<object type="application/x-shockwave-flash" data="audio/emff_comments.swf?src=audio/5.use_again.mp3" width="120" height="18" align="center">
<param name="movie" value="audio/emff_comments.swf?src=audio/5.use_again.mp3"/>
</object><span>0:11</span>
</html>
!!7. Postscript -- personal pictures
* value of personal pictures (avatars)
<html>
<object type="application/x-shockwave-flash" data="audio/emff_comments.swf?src=audio/6.personal_pictures.mp3" width="120" height="18" align="center">
<param name="movie" value="audio/emff_comments.swf?src=audio/6.personal_pictures.mp3"/>
</object><span>0:53</span>
</html>
!!8. Tagging/keywords
* Tagging was useful to aggregate all the blog postings for a particular film. Students used the same tag/keyword to label blog postings and then clicking on the tag/keyword revealed all the postings (termed 'category' in the screenshot):
[img[graphics/power_tagging.png]]
!What is Earlham Learning Spaces (els)?
[[Els|https://els.earlham.edu]] is a blogging system, a community collaboration system, a social networking system, an e-portfolio system, a media playing system -- all these and more.
+++!![earlham]
Like Moodle els is hosted on a powerful server managed by ECS. Compared to public blogging systems such as [[blogger|http://blogger.com]], and [[edublogs|http://edublogs.org]] or social networking systems such as [[Eduspaces|http://eduspaces.net]] its use is restricted to Earlham students and faculty thus minimizing unwelcome attention from outside the college (ie Spam).
;Outcomes:
: Potential for greater level of trust. Students post more thoughtful and deeper commentaries.
===
+++!![learning]
Els is a social networking system with an accent on learning and sharing. Compared to the frivolity of [[Facebook|http://facebook.com]] els enables students to keep academic and college life independent of their social whirl on Facebook. Students and most academics alike consider that it's a bad idea to try to bring Facebook into the classroom -- better to use something like els. It's also more permanent and focussed on the person, compared to Moodle which is oriented around classes and where discussions or uploaded work disappear when the class finishes.
;Outcomes:
:Serious conversations. Permanent presence. Can use as an e-Portfolio to track academic progress.
=== +++!![spaces]
Space for personal content as well as for groups of users known as 'communities'. There are four different content containers:
<<<
# profile,
# blog,
# files,
# folio (wiki).
<<<
A special folder type (gallery) allows uploaded images to be automatically displayed as a lightbox style gallery. The community has an owner but otherwise is a community of peers. A community is a first class space with its own profile, blog, files and folio. Compared to Moodle, Learning Spaces communities transcend classroom boundaries (both virtual and otherwise) but can be used as class groups as well.
;Outcomes:
:Encourage peer interactions and genuine group work. Very congruent with the Earlham approach to Liberal Education.
===
"People could respond to what I wrote, not just people in the class but anyone who got too curious. //It basically made me not want to suck at writing//, which for anyone who ever has taken a CP, Seminar, or Humanities class knows just how easy it is to produce absolute rubbish. I was writing to an audience, not just the professor, and I care a lot more about my content if other people besides one are reading my work."
//{{{
config.macros.version.handler = function(place)
{
createTiddlyElement(place,"span",null,null,version.major + "." + version.minor + "." + version.revision + (version.beta ? " (beta " + version.beta + ")" : "") + (version.build ? " (build #" + version.build + ")" : ""));
};
readOnly = false;
config.options.chkBackstage = true;
config.macros.changeMode.lingo.modeName[''] = 'Admin';
config.options.txtRssTag = 'toRSS';
config.options.chkGenerateAnRssFeed = true;
//}}}