mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-23 18:17:20 +00:00
Docs updates
This commit is contained in:
Jeremy Ruston
parent
db0b82d4ef
commit
b251a2bfa1
@ -8,4 +8,4 @@ TiddlyWiki5 stands on the shoulders of giants, by reusing these projects:
|
||||
|
||||
* [[Twitter Bootstrap|http://twitter.github.com/bootstrap/]]'s CSS
|
||||
* [[LESS dynamic stylesheet language|http://lesscss.org/]], used by Bootstrap
|
||||
* [[Esprima|http://esprima.org]], a JavaScript parsing infrastructure for multipurpose analysis
|
||||
* [[The Stanford Javascript Crypto Library|http://crypto.stanford.edu/sjcl/]]
|
||||
|
||||
@ -3,4 +3,4 @@ tags: navigation
|
||||
|
||||
Current tiddlers:
|
||||
|
||||
<<list all>>
|
||||
<_list type="all" />
|
||||
|
||||
@ -6,7 +6,7 @@ modified: 201208121934
|
||||
|
||||
Welcome to TiddlyWiki5, a reboot of TiddlyWiki, the reusable non-linear personal web notebook [[first released in 2004|History]]. It is a complete interactive wiki in JavaScript that can be run from a single HTML file in the browser or as a powerful [[node.js application|node.js]].
|
||||
|
||||
TiddlyWiki is designed to fit around your brain, giving you a better way of managing information compared to traditional documents and emails. The fundamental idea is that information is more useful and reusable if we cut it up into the smallest semantically meaningful chunks -- [[tiddlers|Tiddlers]] -- and give them titles so that they can be structured with links, tags and macros. TiddlyWiki aims to provide a fluid interface for working with tiddlers, allowing them to be aggregated and composed into longer narratives.
|
||||
TiddlyWiki is designed to fit around your brain, giving you a better way of managing information than traditional documents and emails. The fundamental idea is that information is more useful and reusable if we cut it up into the smallest semantically meaningful chunks -- [[tiddlers|Tiddlers]] -- and give them titles so that they can be structured with links, tags and macros. TiddlyWiki aims to provide a fluid interface for working with tiddlers, allowing them to be aggregated and composed into longer narratives.
|
||||
|
||||
//''28th December 2012'' - the TiddlyWiki5 core code is in the midst of some major refactoring upheavals, and there have been several regressions that will be fixed over the next few days, along with bringing the documentation back up to date//
|
||||
|
||||
@ -16,8 +16,3 @@ TiddlyWiki5 has many [[improvements|Improvements]] over the original. It is curr
|
||||
* Get involved in the [[development on GitHub|https://github.com/Jermolene/TiddlyWiki5]]
|
||||
* Join the discussions on [[the TiddlyWikiDev Google Group|http://groups.google.com/group/TiddlyWikiDev]]
|
||||
* Follow [[@TiddlyWiki on Twitter|http://twitter.com/#!/TiddlyWiki]] for the latest news
|
||||
|
||||
<<reveal state:[[$:/CurrentView]] type:match text:zoomin><
|
||||
<<tiddler target:Introduction>>
|
||||
|
||||
>>
|
||||
|
||||
@ -3,18 +3,18 @@ tags: introduction
|
||||
|
||||
! Welcome to TiddlyWiki5
|
||||
|
||||
<<tiddler HelloThere>>
|
||||
{{HelloThere}}
|
||||
|
||||
! Usage
|
||||
|
||||
<<tiddler CommandLineInterface>>
|
||||
{{CommandLineInterface}}
|
||||
|
||||
! Architecture
|
||||
|
||||
<<tiddler TiddlyWikiArchitecture>>
|
||||
{{TiddlyWikiArchitecture}}
|
||||
|
||||
! Boot Mechanism
|
||||
|
||||
<<tiddler BootMechanism>>
|
||||
{{BootMechanism}}
|
||||
|
||||
//This `readme` file was automatically generated by TiddlyWiki5//
|
||||
|
||||
@ -5,8 +5,6 @@ A TextReference identifies a chunk of text from a tiddler that can be retrieved
|
||||
|
||||
TextReferences are made up of several parts, most of which can be optional:
|
||||
|
||||
* `<tiddler title>` - the text field of the specified tiddler
|
||||
* `<tiddler title>!!<metadata field>` - a tiddler metadata field (eg, `modified`, `modifier`, `type` etc)
|
||||
* `<tiddler title>##<data field>` - a data field within a tiddler
|
||||
* `!!<metadata field>` - a metadata field of the current tiddler
|
||||
* `##<data field>` - a datafield of the current tiddler
|
||||
|
||||
|
||||
@ -6,7 +6,7 @@ tags: docs internals
|
||||
|
||||
The heart of TiddlyWiki can be seen as an extensible representation transformation engine. Given the text of a tiddler and its associated ContentType, the engine can produce a rendering of the tiddler in a new ContentType. Furthermore, it can efficiently selectively update the rendering to track any changes in the tiddler or its dependents.
|
||||
|
||||
The most important transformations are from `text/vnd.tiddlywiki` wikitext into `text/html` or `text/plain` but the engine is used throughout the system for other transformations, such as converting images for display in HTML, sanitising fragments of JavaScript, and processing CSS.
|
||||
The most important transformations are from `text/vnd.tiddlywiki` wikitext into `text/html` or `text/plain` but the engine is used throughout the system for other transformations.
|
||||
|
||||
You can explore this mechanism by opening the JavaScript console in your browser. Typing this command will replace the text of the tiddler `HelloThere` with new content:
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
title: ContextTiddler
|
||||
tags: docs concepts
|
||||
|
||||
The ContextTiddler is the current tiddler during WikiText processing. It allows you to write a macro like `<<view title link>>` without explicitly specifying the tiddler that it applies to.
|
||||
The ContextTiddler is the current tiddler during WikiText processing. It allows you to write a widget like `<_view field="title" format="link"/>` in TiddlerTemplates without explicitly specifying the tiddler that it applies to.
|
||||
|
||||
@ -7,4 +7,4 @@ Thus, even an apparently empty TiddlyWiki actually contains dozens of tiddlers t
|
||||
|
||||
The current shadow tiddlers are:
|
||||
|
||||
<<list shadows>>
|
||||
<_list type="shadows" />
|
||||
|
||||
@ -7,7 +7,7 @@ Filters are used in TiddlyWiki to choose tiddlers by specifying simple match cri
|
||||
|
||||
The mechanism is easiest to understand by first presenting some example filter strings:
|
||||
|
||||
{{table-condensed{
|
||||
@@.table-condensed
|
||||
|!Filter |!Results |
|
||||
|`HelloThere` |The single tiddler titled `HelloThere` (if it exists) |
|
||||
|`[[A Title With Several Words]]` |The single tiddler titled `A Title With Several Words` (if it exists) |
|
||||
@ -23,7 +23,7 @@ The mechanism is easiest to understand by first presenting some example filter s
|
||||
|`[[MyTiddler]tags[]]` |All tiddlers being used as tags on the tiddler `MyTiddler` |
|
||||
|`[[MyTiddler]tagging[]]` |All tiddlers being tagged with `MyTiddler` |
|
||||
|`[list[MyList]]` |All tiddlers listed in `MyList` |
|
||||
}}}
|
||||
@@
|
||||
|
||||
! Operators
|
||||
|
||||
@ -55,9 +55,9 @@ The operands available with the `is` operator are:
|
||||
|
||||
Operators are combined into runs that function as logically ANDed expressions by bashing them together and merging the square brackets:
|
||||
|
||||
{{{
|
||||
```
|
||||
[tag[one]] [tag[two]] ---> [tag[one]tag[two]]
|
||||
}}}
|
||||
```
|
||||
|
||||
Runs can be preceded with `-` to negate their action, removing the selected tiddlers from the results. For example, `[tag[Tommy]] -HelloThere -[[Another One]]` selects all tiddlers tagged with `Tommy` except those titled `HelloThere` or `Another One`.
|
||||
|
||||
|
||||
@ -3,10 +3,4 @@ tags: docs concepts
|
||||
|
||||
Groups of uniquely titled tiddlers are contained in WikiStore objects.
|
||||
|
||||
The WikiStore also manages the plugin modules used for macros, and operations like serializing, deserializing, parsing and rendering tiddlers.
|
||||
|
||||
!! ~WikiStore Events
|
||||
|
||||
Clients can register event handlers with the WikiStore object. Event handlers can be registered to be triggered for modifications to any tiddler in the store, or with a filter to only be invoked when a particular tiddler or set of tiddlers changes.
|
||||
|
||||
Whenever a change is made to a tiddler, the wikistore registers a `nexttick` handler (if it hasn't already done so). The `nexttick` handler looks back at all the tiddler changes, and dispatches any matching event handlers.
|
||||
The WikiStore also manages the plugin modules used for widgets, and operations like serializing, deserializing, parsing and rendering tiddlers.
|
||||
|
||||
@ -9,16 +9,16 @@ WikiText is a concise, expressive way of typing a wide range of text formatting,
|
||||
A key capability of WikiText is the ability to make links to other tiddlers or to external websites. There are several ways of doing this:
|
||||
|
||||
* To link to a tiddler by title: `[[Tiddler Title]]`
|
||||
* To link to a tiddler and specify the text of the link: `[[Tiddler Title|Displayed Link Title]]`
|
||||
* To link to a tiddler and specify the text of the link: `[[Displayed Link Title|Tiddler Title]]`
|
||||
* For tiddler titles that match the CamelCase rules, just typing the title will automatically create a link
|
||||
* To link to an external website, type the full URL of the site: `http://five.tiddlywiki.com/`
|
||||
|
||||
You can suppress a link from being recognised by preceding it with `~`. For example:
|
||||
|
||||
{{{
|
||||
```
|
||||
* ~HelloThere is not a link
|
||||
* ~http://google.com/ is not a link
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
@ -29,22 +29,20 @@ Renders as:
|
||||
|
||||
To mark the end of a paragraph in TiddlyWiki you need to type `enter` twice to create a double line break:
|
||||
|
||||
{{{
|
||||
```
|
||||
This is the first paragraph.
|
||||
|
||||
And this is the second paragraph.
|
||||
}}}
|
||||
```
|
||||
|
||||
Single line breaks are ignored within paragraphs. For example:
|
||||
|
||||
{{{
|
||||
```
|
||||
This is a
|
||||
paragraph made
|
||||
up of
|
||||
short lines
|
||||
|
||||
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
@ -57,43 +55,72 @@ short lines
|
||||
|
||||
Available character formatting includes:
|
||||
|
||||
* {{{`backticks`}}} for `code`
|
||||
* <code>`backticks`</code> for `code`
|
||||
* `''bold''` for ''bold text''
|
||||
* `//italic//` for //italic text//
|
||||
* `__underscore__` for __underscored text__
|
||||
* `^^superscript^^` for ^^superscript^^ text
|
||||
* `~~subscript~~` for ~~subscripted~~ text
|
||||
* `--strikethrough--` for --strikethrough-- text
|
||||
* `,,subscript,,` for ,,subscripted,, text
|
||||
* `~~strikethrough~~` for ~~strikethrough~~ text
|
||||
|
||||
You can also use `{{{` to mark code blocks:
|
||||
You can also use triple backticks <code>```</code> to mark code blocks:
|
||||
|
||||
{{{
|
||||
{{{
|
||||
This will be monospaced
|
||||
}}}
|
||||
}}}
|
||||
<pre>
|
||||
```
|
||||
This will be monospaced
|
||||
```
|
||||
</pre>
|
||||
|
||||
Renders as:
|
||||
|
||||
```
|
||||
This will be monospaced
|
||||
```
|
||||
|
||||
! Transclusion
|
||||
|
||||
You can incorporate the content of one tiddler within another using the transclusion notation:
|
||||
|
||||
* `{{JeremyRuston}}` transcludes a single tiddler
|
||||
* `{{MyTiddler}}` transcludes a single tiddler
|
||||
* `{{MyTiddler|tooltip}}` adds a tooltip
|
||||
* `{{MyTiddler||TemplateTitle}}` displays the tiddler through a specified [[TiddlerTemplate|TiddlerTemplates]]
|
||||
* `{{MyTiddler|tooltip||TemplateTitle}}` specifies both a tooltip and a template for the transcluded content
|
||||
* `{{MyTiddler}width:40;height:50;}.firstClass.secondClass` transcludes a single tiddler, adding the specified styles and classes to the transcluded content
|
||||
|
||||
A template can also be specified, in which case the tiddler(s) are rendered through that [[TiddlerTemplate|TiddlerTemplates]]. Templates can either be specified directly or instead a tiddler can be specified from which the template is extracted.
|
||||
A similar syntax can be used to transclude a list of tiddlers matching a specified [[TiddlerFilter|TiddlerFilters]]:
|
||||
|
||||
* `{{MyTiddler} <<view title>> by <<view modified>>}` renders the tiddler `MyTiddler` through a template that will yield `MyTiddler by JeremyRuston`, if the `modified` field is set to "JeremyRuston"
|
||||
* `{{MyTiddler}{MyTemplate}}` renders the tiddler `MyTiddler` through the template `MyTemplate`
|
||||
```
|
||||
{{{ [tag[docs]] }}}
|
||||
{{{ [tag[docs]] |tooltip}}}
|
||||
{{{ [tag[docs]] ||TemplateTitle}}}
|
||||
{{{ [tag[docs]] |tooltip||TemplateTitle}}}
|
||||
{{{ [tag[docs]] }}width:40;height:50;}.class.class
|
||||
```
|
||||
|
||||
! Images
|
||||
|
||||
To display an image stored in a tiddler just transclude that tiddler
|
||||
|
||||
```
|
||||
{{Motovun Jack.jpg}}
|
||||
```
|
||||
|
||||
Displays as:
|
||||
|
||||
{{Motovun Jack.jpg}}
|
||||
|
||||
See ImageWikiText for more details.
|
||||
|
||||
! Lists
|
||||
|
||||
You can create unordered lists with `*` characters:
|
||||
|
||||
{{{
|
||||
```
|
||||
* First list item
|
||||
* Second list item
|
||||
** A subitem
|
||||
* Third list item
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
@ -110,14 +137,14 @@ Ordered lists use `#` instead of `*`:
|
||||
|
||||
You can also mix ordered and unordered list items:
|
||||
|
||||
{{{
|
||||
```
|
||||
* To do today
|
||||
*# Eat
|
||||
* To get someone else to do
|
||||
*# This
|
||||
*# That
|
||||
*## And the other
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
@ -130,12 +157,12 @@ Renders as:
|
||||
|
||||
You can also create HTML definition lists:
|
||||
|
||||
{{{
|
||||
```
|
||||
; Term being defined
|
||||
: Definition of that term
|
||||
; Another term
|
||||
: Another definition
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
@ -144,49 +171,70 @@ Renders as:
|
||||
; Another term
|
||||
: Another definition
|
||||
|
||||
! Cascading Stylesheets
|
||||
! Adding styles and classes
|
||||
|
||||
You can use this construction to cause the wrapped content to be assigned a specified CSS class:
|
||||
You can use this construction to cause the wrapped content to be assigned specified CSS classes or styles:
|
||||
|
||||
{{{
|
||||
{{myStyle{
|
||||
* List One
|
||||
* List Two
|
||||
}}}
|
||||
}}}
|
||||
```
|
||||
@@.myStyle
|
||||
* List One
|
||||
* List Two
|
||||
@@
|
||||
```
|
||||
|
||||
The resulting HTML looks like this:
|
||||
|
||||
{{{
|
||||
```
|
||||
<ul class="myStyle">
|
||||
<li>List One</li>
|
||||
<li>List Two</li>
|
||||
</ul>
|
||||
}}}
|
||||
```
|
||||
|
||||
You can also assign a CSS class to an individual member of a list with this notation:
|
||||
Similar syntax is used to assign styles. For example:
|
||||
|
||||
{{{
|
||||
```
|
||||
@@background-color:red;
|
||||
* List One
|
||||
*.MyClass List Two
|
||||
* List Three
|
||||
}}}
|
||||
* List Two
|
||||
@@
|
||||
```
|
||||
|
||||
The resulting HTML looks like this:
|
||||
|
||||
{{{
|
||||
```
|
||||
<ul style="background-color:red;">
|
||||
<li>List One</li>
|
||||
<li>List Two</li>
|
||||
</ul>
|
||||
```
|
||||
|
||||
Multiple styles and classes can be mixed. For example:
|
||||
|
||||
```
|
||||
@@.aClass
|
||||
@@width:400px;
|
||||
Some text
|
||||
@@
|
||||
```
|
||||
|
||||
You can also assign a CSS class to an individual member of a list with this notation:
|
||||
|
||||
```
|
||||
* List One
|
||||
*.MyClass List Two
|
||||
* List Three
|
||||
```
|
||||
|
||||
The resulting HTML looks like this:
|
||||
|
||||
```
|
||||
<ul>
|
||||
<li>List One</li>
|
||||
<li class="MyClass">List Two</li>
|
||||
<li> List Three</li>
|
||||
</ul>
|
||||
}}}
|
||||
|
||||
The same syntax can be used with headings:
|
||||
|
||||
{{{
|
||||
!.myStyle This heading has the class `myStyle`
|
||||
}}}
|
||||
```
|
||||
|
||||
! Typographic Features
|
||||
|
||||
@ -194,60 +242,52 @@ You can create an n-dash with a double hyphen `--` and an m-dash with a triple h
|
||||
|
||||
You can include a horizontal rule with three or more dashes on their own on a line:
|
||||
|
||||
{{{
|
||||
```
|
||||
---
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
---
|
||||
|
||||
! Images
|
||||
|
||||
To display an image stored in a tiddler:
|
||||
|
||||
{{{
|
||||
[img[Motovun Jack.jpg]]
|
||||
}}}
|
||||
|
||||
Displays as:
|
||||
|
||||
[img[Motovun Jack.jpg]]
|
||||
|
||||
See ImageWikiText for more details.
|
||||
|
||||
! HTML in WikiText
|
||||
|
||||
HTML tags and comments can be used directly in WikiText. For example:
|
||||
|
||||
{{{
|
||||
```
|
||||
<article class="hello">
|
||||
This is my nice and simple block of text. HelloThere
|
||||
<!-- This comment will not appear in the wikified output -->
|
||||
</article>
|
||||
}}}
|
||||
```
|
||||
|
||||
! Macros
|
||||
! Widgets
|
||||
|
||||
Macros provide rich functionality within WikiText. For example, the `<<video>>` macro can be used to embed videos from YouTube, Vimeo or the Internet Archive:
|
||||
Macros provide rich functionality within WikiText. For example, the `<_video>` widget can be used to embed videos from YouTube, Vimeo or the Internet Archive:
|
||||
|
||||
{{{
|
||||
<<video src:32001208 type:vimeo>>
|
||||
}}}
|
||||
```
|
||||
<_video src="32001208" type="vimeo" />
|
||||
```
|
||||
|
||||
For full details of the available macros, see the [[Docs]].
|
||||
For full details of the available widgets, see the [[Docs]].
|
||||
|
||||
! Headings
|
||||
|
||||
Headings are specified with one or more leading `!` characters:
|
||||
|
||||
{{{
|
||||
```
|
||||
! This is a level 1 heading
|
||||
|
||||
!! This is a level 2 heading
|
||||
|
||||
!!! This is a level 3 heading
|
||||
}}}
|
||||
```
|
||||
|
||||
CSS classes can be assigned to individual headings like this:
|
||||
|
||||
```
|
||||
!.myStyle This heading has the class `myStyle`
|
||||
```
|
||||
|
||||
! Other WikiText features
|
||||
|
||||
@ -255,11 +295,11 @@ Headings are specified with one or more leading `!` characters:
|
||||
|
||||
You can incorporate text of a different type within blocks of WikiText. For example:
|
||||
|
||||
{{{
|
||||
```
|
||||
$$$.js
|
||||
return 2 + "string";
|
||||
$$$
|
||||
}}}
|
||||
```
|
||||
|
||||
Renders as:
|
||||
|
||||
@ -268,23 +308,3 @@ return 2 + "string";
|
||||
$$$
|
||||
|
||||
See TypedBlockWikiText for more details
|
||||
|
||||
!! Style Blocks
|
||||
|
||||
You can apply HTML attributes to blocks of content with this syntax:
|
||||
|
||||
{{{
|
||||
@@color:#f00;
|
||||
@@text-decoration:underline;
|
||||
This is in red!
|
||||
@@
|
||||
}}}
|
||||
|
||||
Generates the results:
|
||||
|
||||
@@color:#f00;
|
||||
@@text-decoration:underline;
|
||||
This is in red!
|
||||
@@
|
||||
|
||||
See StyleBlockWikiText for more details.
|
||||
|
||||
@ -1,26 +0,0 @@
|
||||
title: ImageMacro
|
||||
tags: docs macro
|
||||
|
||||
The ImageMacro displays an image with an optional tooltip.
|
||||
|
||||
! Parameters
|
||||
|
||||
! Examples
|
||||
|
||||
{{{
|
||||
<<tiddler [[Motovun Jack.jpg]]>>
|
||||
}}}
|
||||
|
||||
Appears as:
|
||||
|
||||
<<tiddler [[Motovun Jack.jpg]]>>
|
||||
|
||||
{{{
|
||||
<<image [[Motovun Jack.jpg]] text:"A kitten">>
|
||||
}}}
|
||||
|
||||
Appears as:
|
||||
|
||||
<<image [[Motovun Jack.jpg]] text:"A kitten">>
|
||||
|
||||
(Hover over the image to see the tooltip).
|
||||
@ -1,22 +0,0 @@
|
||||
title: SliderMacro
|
||||
tags: docs macro
|
||||
|
||||
The status of this slider is stored in the tiddler JackSlider:
|
||||
|
||||
<<slider JackSlider "Motovun Jack.jpg" "TiddlyWiki Kitten »" "See the kitten">>
|
||||
|
||||
And here's another slider that is also keyed to JackSlider:
|
||||
|
||||
<<slider JackSlider Introduction "HelloThere »">>
|
||||
|
||||
And here's another slider that contains a video, with the state stored in VideoSlider (currently <<tiddler VideoSlider>>):
|
||||
|
||||
<<slider VideoSlider VideoTests "VideoTests »">>
|
||||
|
||||
And here's a MiniSlider that works with text, rather than a separate tiddler.
|
||||
|
||||
<<slider state:MiniSlider label:"Click me! »"><This is the //content// of the slider. The state is stored in MiniSlider>>
|
||||
|
||||
And here's a slider that doesn't use a state tiddler:
|
||||
|
||||
<<slider label:"Click me! »"><This is the //content// of the slider. The state is not retained.>>
|
||||
@ -1,10 +0,0 @@
|
||||
title: VideoMacro
|
||||
tags: docs macro
|
||||
|
||||
Here is a collection of embedded videos. Try opening and closing tiddlers while the videos are playing; they should not be affected.
|
||||
|
||||
<<video src:32001208 type:vimeo>>
|
||||
|
||||
<<video src:wvWHnK2FiCk type:youtube>>
|
||||
|
||||
<<video src:santa_claus_conquers_the_martians_ipod type:archiveorg>>
|
||||
10
editions/tw5.com/tiddlers/widgets/VideoWidget.tid
Normal file
10
editions/tw5.com/tiddlers/widgets/VideoWidget.tid
Normal file
@ -0,0 +1,10 @@
|
||||
title: VideoWidget
|
||||
tags: docs widget
|
||||
|
||||
Here is a collection of embedded videos. Try opening and closing tiddlers while the videos are playing; they should not be affected.
|
||||
|
||||
<_video src="32001208" type="vimeo" />
|
||||
|
||||
<_video src="wvWHnK2FiCk" type="youtube" />
|
||||
|
||||
<_video src="santa_claus_conquers_the_martians_ipod" type="archiveorg" />
|
||||
@ -1,45 +0,0 @@
|
||||
title: ImageWikiText
|
||||
tags: docs wikitextrule
|
||||
|
||||
The WikiText markup for images provides a shortcut for the ImageMacro, with an optional link and tooltip:
|
||||
|
||||
{{{
|
||||
[img[<tiddlertitle>]]
|
||||
[img[<url>]]
|
||||
[img[<tooltip>|<tiddlertitle>]]
|
||||
[img[<tooltip>|<tiddlertitle>][<link>]]
|
||||
}}}
|
||||
|
||||
! Examples
|
||||
|
||||
Simple usage:
|
||||
|
||||
{{{
|
||||
[img[Motovun Jack.jpg]]
|
||||
[img[Tiddler Fishes.svg]]
|
||||
}}}
|
||||
|
||||
Appears as:
|
||||
|
||||
[img[Motovun Jack.jpg]]
|
||||
[img[Tiddler Fishes.svg]]
|
||||
|
||||
With a tooltip:
|
||||
|
||||
{{{
|
||||
[img[tooltip|Motovun Jack.jpg]]
|
||||
}}}
|
||||
|
||||
Appears as:
|
||||
|
||||
[img[tooltip|Motovun Jack.jpg]]
|
||||
|
||||
With a tooltip and a link:
|
||||
|
||||
{{{
|
||||
[img[tooltip|Motovun Jack.jpg][http://google.com/]]
|
||||
}}}
|
||||
|
||||
Appears as:
|
||||
|
||||
[img[tooltip|Motovun Jack.jpg][http://google.com/]]
|
||||
@ -1,7 +1,7 @@
|
||||
title: $:/DefaultTiddlers
|
||||
|
||||
HelloThere
|
||||
CecilySubView
|
||||
Introduction
|
||||
Improvements
|
||||
WikiText
|
||||
Docs
|
||||
10
readme.md
10
readme.md
@ -1,2 +1,10 @@
|
||||
<h1 class=''>Welcome to <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a></h1><<Undefined macro: tiddler>><h1 class=''>Usage</h1><<Undefined macro: tiddler>><h1 class=''>Architecture</h1><<Undefined macro: tiddler>><h1 class=''>Boot Mechanism</h1><<Undefined macro: tiddler>><p><em>This <code>readme</code> file was automatically generated by <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a></em>
|
||||
<h1 class=''>Welcome to <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a></h1><div><p>Welcome to <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a>, a reboot of <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a>, the reusable non-linear personal web notebook <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='History'>first released in 2004</a>. It is a complete interactive wiki in <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> that can be run from a single HTML file in the browser or as a powerful <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='node.js'>node.js application</a>.</p><p><a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a> is designed to fit around your brain, giving you a better way of managing information than traditional documents and emails. The fundamental idea is that information is more useful and reusable if we cut it up into the smallest semantically meaningful chunks – <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='Tiddlers'>tiddlers</a> – and give them titles so that they can be structured with links, tags and macros. <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a> aims to provide a fluid interface for working with tiddlers, allowing them to be aggregated and composed into longer narratives.</p><p><em><strong>28th December 2012</strong> - the <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a> core code is in the midst of some major refactoring upheavals, and there have been several regressions that will be fixed over the next few days, along with bringing the documentation back up to date</em></p><p><a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a> has many <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='Improvements'>improvements</a> over the original. It is currently labelled alpha, meaning it is working but incomplete. It is the best possible time to get involved and support its future development. You can:</p><ul><li>Explore its features online at <a class='tw-tiddlylink tw-tiddlylink-external' href='http://five.tiddlywiki.com/'>http://five.tiddlywiki.com/</a></li><li>Get involved in the <a class='tw-tiddlylink tw-tiddlylink-external' href='https://github.com/Jermolene/TiddlyWiki5'>development on GitHub</a></li><li>Join the discussions on <a class='tw-tiddlylink tw-tiddlylink-external' href='http://groups.google.com/group/TiddlyWikiDev'>the TiddlyWikiDev Google Group</a></li><li>Follow <a class='tw-tiddlylink tw-tiddlylink-external' href='http://twitter.com/#!/TiddlyWiki'>@TiddlyWiki on Twitter</a> for the latest news</li></ul></div><h1 class=''>Usage</h1><div class='tw-tiddler-missing'/><h1 class=''>Architecture</h1><div><h1 class=''>Overview</h1><p>The heart of <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a> can be seen as an extensible representation transformation engine. Given the text of a tiddler and its associated <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='ContentType'>ContentType</a>, the engine can produce a rendering of the tiddler in a new <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='ContentType'>ContentType</a>. Furthermore, it can efficiently selectively update the rendering to track any changes in the tiddler or its dependents.</p><p>The most important transformations are from <code>text/vnd.tiddlywiki</code> wikitext into <code>text/html</code> or <code>text/plain</code> but the engine is used throughout the system for other transformations.</p><p>You can explore this mechanism by opening the <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> console in your browser. Typing this command will replace the text of the tiddler <code>HelloThere</code> with new content:</p><p>{{{
|
||||
$tw.wiki.addTiddler({title: "<a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='HelloThere'>HelloThere</a>", text: "This is some new content"});
|
||||
}}}</p><p>If the tiddler <code>HelloThere</code> is visible then you'll see it instantly change to reflect the new content. If you create a tiddler that doesn't currently exist then you'll see any displayed links to it instantly change from italicised to normal:</p><p>{{{
|
||||
$tw.wiki.addTiddler({title: "<a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a>", text: "This tiddler now exists"});
|
||||
}}}</p><p>The power of this mechanism also drives the interactive features of <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a>. For example, try typing the following into the <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> console:</p><p>{{{
|
||||
$tw.wiki.addTiddler({title: "<a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='ViewDropDownState'>ViewDropDownState</a>", text: "(50,50,200,200)"});
|
||||
}}}</p><p>You should see the view dropdown appear in the middle of the screen. The underlying mechanism is that the creation of the tiddler with this title triggers the display of the popup at the specified location.</p><p>If you're interested in understanding more about the internal operation of <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a>, it is recommended that you review the <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='Docs'>Docs</a> and read the code – start with the boot kernel <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='%24%3A%2Fcore%2Fboot.js'>$:/core/boot.js</a>.
|
||||
</p></div><h1 class=''>Boot Mechanism</h1><div><h1 class=''>Introduction</h1><p><a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a> is based on a 1,000 line boot kernel that runs on node.js or in the browser, with all other functionality added via dynamically loaded modules.</p><p>The kernel boots just enough of the <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a> environment to allow it to load tiddlers and execute <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> modules. Plugin modules are written like <code>node.js</code> modules.</p><p>There are many <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='ModuleType'>different types of module</a>: parsers, serializers, deserializers, macros etc. It goes much further than you might expect. For example, individual tiddler fields are modules, too: there's a module that knows how to handle the <code>tags</code> field, and another that knows how to handle the special behaviour of the <code>modified</code> and <code>created</code> fields.</p><p>Some plugin modules have further sub-plugins: the wikitext parser, for instance, accepts rules as individual plugin modules.</p><h1 class=''>Plugins and Modules</h1><p>In <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a>, <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='Plugins'>Plugins</a> are bundles of tiddlers that are distributed and managed as one; <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='Modules'>Modules</a> are <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> tiddlers with a module type identifying when and how they should be executed.</p><p>The tiddler <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='%24%3A%2Fcore%2Fboot.js'>$:/core/boot.js</a> is a barebones <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-resolves' href='TiddlyWiki'>TiddlyWiki</a> kernel that is just sufficient to load the core plugin modules and trigger a startup module to load up the rest of the application.</p><p>The kernel includes:</p><ul><li>Several short shared utility functions</li><li>A handful of methods implementing the plugin module mechanism</li><li>The <code>$tw.Tiddler</code> class (and field definition plugins)</li><li>The <code>$tw.Wiki</code> class (and tiddler deserialization methods)</li><li>Code for the browser to load tiddlers from the HTML DOM</li><li>Code for the server to load tiddlers from the file system</li></ul><p>Each module is an ordinary <code>node.js</code>-style module, using the <code>require()</code> function to access other modules and the <code>exports</code> global to return <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> values. The boot kernel smooths over the differences between <code>node.js</code> and the browser, allowing the same plugin modules to execute in both environments.</p><p>In the browser, <code>core/boot.js</code> is packed into a template HTML file that contains the following elements in order:</p><ul><li>Ordinary and shadow tiddlers, packed as HTML <code><DIV></code> elements</li><li><code>core/bootprefix.js</code>, containing a few lines to set up the plugin environment</li><li><a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='JavaScript'>JavaScript</a> modules, packed as HTML <code><SCRIPT></code> blocks</li><li><code>core/boot.js</code>, containing the boot kernel</li></ul><p>On the server, <code>core/boot.js</code> is executed directly. It uses the <code>node.js</code> local file API to load plugins directly from the file system in the <code>core/modules</code> directory. The code loading is performed synchronously for brevity (and because the system is in any case inherently blocked until plugins are loaded).</p><p>The boot kernel sets up the <code>$tw</code> global variable that is used to store all the state data of the system.
|
||||
</p></div><p><em>This <code>readme</code> file was automatically generated by <a class='tw-tiddlylink tw-tiddlylink-internal tw-tiddlylink-missing' href='TiddlyWiki5'>TiddlyWiki5</a></em>
|
||||
</p>
|
||||
Loading…
Reference in New Issue
Block a user