├── source └── timelines │ ├── images │ ├── right-arrow.svg.meta │ └── right-arrow.svg │ ├── styles │ ├── colors │ │ ├── dark.json.meta │ │ ├── info.json.meta │ │ ├── light.json.meta │ │ ├── danger.json.meta │ │ ├── primary.json.meta │ │ ├── success.json.meta │ │ ├── warning.json.meta │ │ ├── secondary.json.meta │ │ ├── info.json │ │ ├── light.json │ │ ├── danger.json │ │ ├── dark.json │ │ ├── primary.json │ │ ├── success.json │ │ ├── warning.json │ │ └── secondary.json │ ├── timeline-vertical.css.meta │ ├── sequence-horizontal.css.meta │ ├── timeline-horizontal.css.meta │ ├── vertical-sequence.css.meta │ ├── timeline-horizontal │ │ └── navigation-img.tid │ ├── sequence-horizontal.css │ ├── sequence-vertical-colors.tid │ ├── timeline-horizontal-colors.tid │ ├── timeline-vertical-colors.css.tid │ ├── sequence-horizontal-colors.tid │ ├── vertical-sequence.css │ ├── timeline-vertical.css │ └── timeline-horizontal.css │ ├── templates │ ├── sequence-horizontal.tid │ ├── timeline-horizontal.tid │ ├── timeline-vertical.tid │ └── sequence-vertical.tid │ ├── readme.tid │ ├── history.tid │ ├── plugin.info │ ├── procedures │ ├── sequence-vertical.tid │ ├── timeline-vertical.tid │ ├── sequence-horizontal.tid │ ├── timeline-horizontal-left-pos.tid │ └── timeline-horizontal.tid │ └── license.tid ├── README.md ├── LICENSE ├── packaged └── timelines.tid └── timelines.tid /source/timelines/images/right-arrow.svg.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/images/right-arrow 2 | type: image/svg+xml -------------------------------------------------------------------------------- /source/timelines/styles/colors/dark.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/dark 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/info.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/info 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/light.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/light 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/danger.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/danger 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/primary.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/primary 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/success.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/success 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/warning.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/warning 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/colors/secondary.json.meta: -------------------------------------------------------------------------------- 1 | title: $:/plugins/kookma/timelines/styles/colors/secondary 2 | type: application/json -------------------------------------------------------------------------------- /source/timelines/styles/timeline-vertical.css.meta: -------------------------------------------------------------------------------- 1 | tags: $:/tags/Stylesheet 2 | title: $:/plugins/kookma/timelines/styles/timeline-vertical.css 3 | type: text/css -------------------------------------------------------------------------------- /source/timelines/styles/sequence-horizontal.css.meta: -------------------------------------------------------------------------------- 1 | tags: $:/tags/Stylesheet 2 | title: $:/plugins/kookma/timelines/styles/sequence-horizontal.css 3 | type: text/css -------------------------------------------------------------------------------- /source/timelines/styles/timeline-horizontal.css.meta: -------------------------------------------------------------------------------- 1 | tags: $:/tags/Stylesheet 2 | title: $:/plugins/kookma/timelines/styles/timeline-horizontal.css 3 | type: text/css -------------------------------------------------------------------------------- /source/timelines/images/right-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /source/timelines/templates/sequence-horizontal.tid: -------------------------------------------------------------------------------- 1 | code-body: yes 2 | title: $:/plugins/kookma/timelines/templates/sequence-horizontal 3 | type: text/vnd.tiddlywiki 4 | 5 | <$transclude $mode=block/> -------------------------------------------------------------------------------- /source/timelines/styles/vertical-sequence.css.meta: -------------------------------------------------------------------------------- 1 | tags: $:/tags/Stylesheet 2 | title: $:/plugins/kookma/timelines/styles/vertical-sequence.css 3 | type: text/css 4 | url: https://codepen.io/letsbleachthis/pen/YJgNpv -------------------------------------------------------------------------------- /source/timelines/styles/colors/info.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "info", 3 | "color": "#0c5460", 4 | "background": "#d1ecf1", 5 | "border": "#bee5eb", 6 | "link":"#062c33", 7 | "light-background":"#ebf7f9" 8 | } -------------------------------------------------------------------------------- /source/timelines/styles/colors/light.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "light", 3 | "color": "#818182", 4 | "background": "#fefefe", 5 | "border": "#818182", 6 | "link":"#686868", 7 | "light-background":"#ededed" 8 | } -------------------------------------------------------------------------------- /source/timelines/styles/colors/danger.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "danger", 3 | "color": "#721c24", 4 | "background": "#f8d7da", 5 | "border": "#f5c6cb", 6 | "link":"#491217", 7 | "light-background":"#fdf4f5" 8 | } -------------------------------------------------------------------------------- /source/timelines/styles/colors/dark.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "dark", 3 | "color": "#1b1e21", 4 | "background": "#d6d8d9", 5 | "border": "#c6c8ca", 6 | "link":"#040505", 7 | "light-background":"#f0f1f2" 8 | } 9 | -------------------------------------------------------------------------------- /source/timelines/styles/colors/primary.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "primary", 3 | "color": "#004085", 4 | "background": "#cce5ff", 5 | "border": "#b8daff", 6 | "link": "#002752", 7 | "light-background":"#eef6ff" 8 | } -------------------------------------------------------------------------------- /source/timelines/styles/colors/success.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "success", 3 | "color": "#155724", 4 | "background": "#d4edda", 5 | "border": "#c3e6cb", 6 | "link":"#0b2e13", 7 | "light-background":"#ecf7ef" 8 | } -------------------------------------------------------------------------------- /source/timelines/styles/colors/warning.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "warning", 3 | "color": "#856404", 4 | "background": "#fff3cd", 5 | "border": "#ffeeba", 6 | "link":"#533f03", 7 | "light-background":"#fffbef" 8 | } -------------------------------------------------------------------------------- /source/timelines/styles/colors/secondary.json: -------------------------------------------------------------------------------- 1 | { 2 | "class": "secondary", 3 | "color": "#383d41", 4 | "background": "#e2e3e5", 5 | "border": "#d6d8db", 6 | "link":"#202326", 7 | "light-background":"#f4f4f5" 8 | } -------------------------------------------------------------------------------- /source/timelines/templates/timeline-horizontal.tid: -------------------------------------------------------------------------------- 1 | code-body: yes 2 | title: $:/plugins/kookma/timelines/templates/timeline-horizontal 3 | type: text/vnd.tiddlywiki 4 | 5 |

<$transclude $field="title"/>

6 | <$transclude mode="block"/> -------------------------------------------------------------------------------- /source/timelines/templates/timeline-vertical.tid: -------------------------------------------------------------------------------- 1 | code-body: yes 2 | title: $:/plugins/kookma/timelines/templates/timeline-vertical 3 | type: text/vnd.tiddlywiki 4 | 5 |
<$link class="item-link"><$text text=<>/>
6 |
<$transclude mode="block"/>
7 |
<$view field=<
8 | -------------------------------------------------------------------------------- /source/timelines/styles/timeline-horizontal/navigation-img.tid: -------------------------------------------------------------------------------- 1 | tags: $:/tags/Stylesheet 2 | title: $:/plugins/kookma/timelines/styles/timeline-horizontal/navigation-img 3 | type: text/vnd.tiddlywiki 4 | 5 | .kk-tl-timeline-horizontal .navigation::after { 6 | /*background: url(img/cd-arrow.svg) no-repeat 0 0*/ 7 | background: url(<>) no-repeat 0 0; 8 | } -------------------------------------------------------------------------------- /source/timelines/readme.tid: -------------------------------------------------------------------------------- 1 | tags: 2 | title: $:/plugins/kookma/timelines/readme 3 | type: text/vnd.tiddlywiki 4 | 5 | ; Timelines 6 | A chronological arrangement of events in the order of their occurrence. 7 | 8 | ;Code and demo 9 | For learning plugin features, syntax, tutorial and examples see the plugin demo and code pages 10 | 11 | * Demo: https://kookma.github.io/TW-Timelines/ 12 | * Code: https://github.com/kookma/TW-Timelines 13 | -------------------------------------------------------------------------------- /source/timelines/templates/sequence-vertical.tid: -------------------------------------------------------------------------------- 1 | code-body: yes 2 | title: $:/plugins/kookma/timelines/templates/sequence-vertical 3 | type: text/vnd.tiddlywiki 4 | 5 |
<$link class="item-link"><$text text=<>/>
6 |
<$view field="modified" format="date" template={{$:/language/Tiddler/DateFormat}}/>
7 | <$transclude $mode="block"/> 8 |
<$view field=<
>/>
-------------------------------------------------------------------------------- /source/timelines/history.tid: -------------------------------------------------------------------------------- 1 | tags: 2 | title: $:/plugins/kookma/timelines/history 3 | type: text/vnd.tiddlywiki 4 | 5 | Full change log https://kookma.github.io/TW-Timelines/#ChangeLog 6 | 7 | * ''1.5.0'' -- 2024.10.31 -- update to Tiddlywiki 5.3.5 and Gatha development studio 8 | * ''1.2.0'' -- 2022.11.12 -- update to Tiddlywiki 5.2.3 9 | * ''1.0.0'' -- 2020.08.09 -- stable release 10 | * ''0.6.0'' -- 2020.07.31 -- beta release 11 | * ''0.5.0'' -- 2019.07.28 -- first release 12 | -------------------------------------------------------------------------------- /source/timelines/plugin.info: -------------------------------------------------------------------------------- 1 | { 2 | "title": "$:/plugins/kookma/timelines", 3 | "version": "1.5.0", 4 | "stability": "STABILITY_2_STABLE", 5 | "name": "Timelines", 6 | "description": "Graphical representation of a period of time", 7 | "author": "Mohammad Rahmani", 8 | "source": "https://github.com/kookma/TW-Timelines", 9 | "list": "readme license history", 10 | "plugin-priority": "", 11 | "parent-plugin": "", 12 | "dependents": "", 13 | "plugin-type": "plugin", 14 | "core-version": ">=5.3.5", 15 | "packaged-by": "Gatha on 31st October 2024, 21:41:09" 16 | } 17 | -------------------------------------------------------------------------------- /source/timelines/styles/sequence-horizontal.css: -------------------------------------------------------------------------------- 1 | .kk-tl-horizontal-sequence{ 2 | width:60%; 3 | margin: 10px auto; 4 | box-sizing:border-box; 5 | } 6 | 7 | .kk-tl-horizontal-sequence-content{ 8 | padding:15px; 9 | min-height:140px; 10 | /* border-width:1px; 11 | border-style:dotted; */ 12 | } 13 | 14 | .kk-tl-horizontal-sequence ul{ 15 | padding:0; 16 | text-align:center; 17 | } 18 | .kk-tl-horizontal-sequence ul li { 19 | width: 2em; 20 | height: 2em; 21 | line-height: 2em; 22 | text-align: center; 23 | border-radius: 50%; 24 | display: inline-block; 25 | position: relative; 26 | margin: 8px 5px; 27 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # TW-Timelines 2 | create timeline and sequence in Tiddlywiki 3 | 4 | Timelines is a collection of four macros for creating vertical and horizontal timeline and sequence. The content or description and data of events are stored in individual tiddlers. 5 | 6 | Timelines contain two timeline macros and two sequence macros. A sequence macro shows event contents in sequence not necessarily in chronological order. The order can be determined by tag or list field or other methods. 7 | 8 | The date of events can be stored in a separate field or the modified field can be used. 9 | 10 | ## Demo 11 | A working demo can be found at https://kookma.github.io/TW-Timelines 12 | -------------------------------------------------------------------------------- /source/timelines/procedures/sequence-vertical.tid: -------------------------------------------------------------------------------- 1 | tags: $:/tags/Global 2 | title: $:/plugins/kookma/timelines/procedures/sequence-vertical 3 | type: text/vnd.tiddlywiki 4 | 5 | \procedure sequence-vertical(filter, limit:10, date:"modified", footer:"footer", template:"", class:"primary" ) 6 |
7 | 8 | <$list filter="[subfilterlimit]" emptyMessage="Timeline: no tiddler found or wrong filter is passed!" > 9 |
10 | <$transclude $tiddler={{{ [