1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-12-25 17:40:29 +00:00

Revert #1330 ("implements list iterator variables")

As discussed on the ticket, there is a problem:

https://github.com/Jermolene/TiddlyWiki5/pull/1330#issuecomment-74339195
This commit is contained in:
Jermolene 2015-02-13 22:42:36 +00:00
parent e386e26b2d
commit 68165af081
2 changed files with 62 additions and 84 deletions

View File

@ -60,18 +60,16 @@ ListWidget.prototype.execute = function() {
this.variableName = this.getAttribute("variable","currentTiddler"); this.variableName = this.getAttribute("variable","currentTiddler");
this.storyViewName = this.getAttribute("storyview"); this.storyViewName = this.getAttribute("storyview");
this.historyTitle = this.getAttribute("history"); this.historyTitle = this.getAttribute("history");
this.iterator = this.getAttribute("iterator","iterator");
// Compose the list elements // Compose the list elements
this.list = this.getTiddlerList(); this.list = this.getTiddlerList();
var members = [], var members = [],
self = this, self = this;
count = self.list.length;
// Check for an empty list // Check for an empty list
if(0 === count) { if(this.list.length === 0) {
members = this.getEmptyMessage(); members = this.getEmptyMessage();
} else { } else {
$tw.utils.each(this.list,function(title,index) { $tw.utils.each(this.list,function(title,index) {
members.push(self.makeItemTemplate(title,index,count,self.iterator)); members.push(self.makeItemTemplate(title));
}); });
} }
// Construct the child widgets // Construct the child widgets
@ -98,7 +96,7 @@ ListWidget.prototype.getEmptyMessage = function() {
/* /*
Compose the template for a list item Compose the template for a list item
*/ */
ListWidget.prototype.makeItemTemplate = function(title,index,count,iterator) { ListWidget.prototype.makeItemTemplate = function(title) {
// Check if the tiddler is a draft // Check if the tiddler is a draft
var tiddler = this.wiki.getTiddler(title), var tiddler = this.wiki.getTiddler(title),
isDraft = tiddler && tiddler.hasField("draft.of"), isDraft = tiddler && tiddler.hasField("draft.of"),
@ -121,15 +119,7 @@ ListWidget.prototype.makeItemTemplate = function(title,index,count,iterator) {
} }
} }
// Return the list item // Return the list item
return { return {type: "listitem", itemTitle: title, variableName: this.variableName, children: templateTree};
type: "listitem",
itemTitle: title,
variableName: this.variableName,
children: templateTree,
index: index,
count: count,
iterator: iterator
};
}; };
/* /*
@ -301,12 +291,8 @@ ListItemWidget.prototype.render = function(parent,nextSibling) {
Compute the internal state of the widget Compute the internal state of the widget
*/ */
ListItemWidget.prototype.execute = function() { ListItemWidget.prototype.execute = function() {
var item = this.parseTreeNode;
// Set the current list item title // Set the current list item title
this.setVariable(item.variableName,item.itemTitle); this.setVariable(this.parseTreeNode.variableName,this.parseTreeNode.itemTitle);
this.setVariable(item.iterator,(item.index + 1).toString());
this.setVariable(item.iterator + "-even",item.index % 2 == 1 ? "true" : "false");
this.setVariable(item.iterator + "-last",item.index + 1 == item.count ? "true" : "false");
// Construct the child widgets // Construct the child widgets
this.makeChildWidgets(); this.makeChildWidgets();
}; };

View File

@ -1,85 +1,36 @@
created: 201310241419 created: 201310241419
modified: 20150106180000000 modified: 20141027193838998
tags: Widgets tags: Widgets
title: ListWidget title: ListWidget
caption: list caption: list
! Introduction ! Introduction
The list widget displays a sequence of tiddlers matching a [[filter|Filters]]. It is vital for a various use-cases, e.g.: The list widget displays a sequence of tiddlers that match a [[tiddler filter|Filters]]. It can be used for many purposes:
* Displaying custom lists, e.g. "all tiddlers tagged ''task'' not tagged ''done''" * Displaying custom lists of links, like in TiddlyWiki5's sidebar
* Listing the tags of a tiddler * Custom lists, such as "all tiddlers tagged 'task' that are not tagged 'done'"
* Displaying lists of links, like in the sidebar * Listing each of the tags applied to a tiddler
* Handling the main story river * Handling the main story river
! Examples The tiddlers are displayed by transcluding each in turn through a template. There are several ways to specify the template and for controlling the behaviour of the list.
''plain list''
```
<$list filter="[tag[ListWidget]sort[title]]"/>
```
Displays as:
<<<
<$list filter="[tag[ListWidget]sort[title]]"/>
<<<
''custom item output''
```
<$list filter="[tag[ListWidget]sort[title]]">
<<currentTiddler>>
{{||$:/core/ui/ViewTemplate/tags}}
</$list>
```
Displays as:
<<<
<$list filter="[tag[ListWidget]sort[title]]">
<<currentTiddler>>
{{||$:/core/ui/ViewTemplate/tags}}
</$list>
<<<
''custom item template''
```
<$list filter="[tag[ListWidget]sort[title]]" template="$:/core/ui/ViewTemplate/subtitle"/>
```
Displays as:
<<<
<$list filter="[tag[ListWidget]sort[title]]" template="$:/core/ui/ViewTemplate/subtitle"/>
<<<
!! Grouped Lists
See GroupedLists for how to generate nested and grouped lists using the ListWidget.
! Content and Attributes ! Content and Attributes
A number of options controll the list behaviour.... The content of the `<$list>` widget is an optional template to use for rendering each tiddler in the list. Alternatively, the template can be specified as a tiddler title in the ``template`` attribute. As a fallback, the default template just displays the tiddler title.
|!Attribute |!Description | |!Attribute |!Description |
|filter |The [[tiddler filter|Filters]] to display | |filter |The [[tiddler filter|Filters]] to display |
|template |The title of a template tiddler for transcluding each tiddler in the list. When no template is specified, the body of the ListWidget serves as the item template. With no body, a simple link to the tiddler is returned. | |template |The title of a template tiddler for rendering each tiddler in the list |
|editTemplate |An alternative template to use for [[DraftTiddlers|DraftMechanism]] in edit mode | |editTemplate |An alternative template to use for DraftTiddlers in edit mode |
|variable |The name for a [[variable|Variables]] in which the title of each listed tiddler is stored. Defaults to ''currentTiddler'' | |variable |The [[widget variable|WidgetVariables]] name to be assigned the title of each tiddler in the list. Defaults to ''currentTiddler'' |
|iterator|a custom iterator prefix, see IteratorVariables|
|emptyMessage |Message to be displayed when the list is empty | |emptyMessage |Message to be displayed when the list is empty |
|storyview |Optional name of module responsible for animating/processing the list | |storyview |Optional name of module responsible for animating/processing the list |
|history |The title of the tiddler containing the navigation history | |history |The title of the tiddler containing the navigation history |
!! Edit mode !! Handling edit mode
The `<$list>` widget can optionally render draft tiddlers through a different template to handle editing, see DraftMechanism. The `<$list>` widget can optionally render draft tiddlers through a different template tiddler than ordinary tiddlers -- see DraftMechanism for a discussion of how this capability is used.
!! `storyview` attribute !! `storyview` attribute
@ -91,6 +42,47 @@ The `storyview` attribute specifies the name of an optional module that can anim
In order for the storyviews to animate correctly each entry in the list should be a single block mode DOM element. In order for the storyviews to animate correctly each entry in the list should be a single block mode DOM element.
!! History and navigation !! Handling history and navigation
The optional `history` attribute specifies the name of a tiddler that is used to track the current tiddler for navigation purposes. When the history tiddler changes the list view responds by telling the listview to handle navigating to the new tiddler. See HistoryMechanism for details. The optional `history` attribute specifies the name of a tiddler that is used to track the current tiddler for navigation purposes. When the history tiddler changes the list view responds by telling the listview to handle navigating to the new tiddler. See the NavigationMechanism for more details.
! Examples
!! Creating nested lists
The ''types'' and ''recent'' tabs in the sidebar give two examples of a grouped list created by nesting.
The ''types'' listing is performed with this markup:
```
<$list filter="[!is[system]has[type]each[type]sort[type]]">
<div class="tc-menu-list-item">
<$view field="type"/>
<$list filter="[type{!!type}!is[system]sort[title]]">
<div class="tc-menu-list-subitem">
<$link to={{!!title}}><$view field="title"/></$link>
</div>
</$list>
</div>
</$list>
```
The outer list filter selects each discrete value found in the `type` field. The inner list filter selects all the (non-system) tiddlers with that type.
The ''recent'' listing is performed with this markup:
```
<$list filter="[!is[system]has[modified]!sort[modified]limit[100]eachday[modified]]">
<div class="tc-menu-list-item">
<$view field="modified" format="date" template="DDth MMM YYYY"/>
<$list filter="[sameday{!!modified}!is[system]!sort[modified]]">
<div class="tc-menu-list-subitem">
<$link to={{!!title}}><$view field="title"/></$link>
</div>
</$list>
</div>
</$list>
```
Here the outer list filter selects each discrete day found in the `modified` field, while the inner list filter selects all the tiddlers dated the same day in the `modified` field.