mirror of
https://github.com/Jermolene/TiddlyWiki5.git
synced 2026-03-10 08:43:08 -07:00
Add start- and endactions to link-widget, list-links-draggable and list-tagged-draggable macros (#9621)
* Add start- endactions to link-widget + documentation * Add start- endactions to list-links-draggable and list-tagged-draggable macros * Add changenote * Update docs with actionTiddler info
This commit is contained in:
parent
599933c34d
commit
1bbb7fd53b
6 changed files with 83 additions and 28 deletions
|
|
@ -86,7 +86,7 @@ LinkWidget.prototype.renderLink = function(parent,nextSibling) {
|
|||
classes.push(this.linkClasses);
|
||||
}
|
||||
} else if(this.overrideClasses !== "") {
|
||||
classes.push(this.overrideClasses)
|
||||
classes.push(this.overrideClasses);
|
||||
}
|
||||
if(classes.length > 0) {
|
||||
domNode.setAttribute("class",classes.join(" "));
|
||||
|
|
@ -97,7 +97,7 @@ LinkWidget.prototype.renderLink = function(parent,nextSibling) {
|
|||
if(wikilinkTransformFilter) {
|
||||
// Use the filter to construct the href
|
||||
wikiLinkText = this.wiki.filterTiddlers(wikilinkTransformFilter,this,function(iterator) {
|
||||
iterator(self.wiki.getTiddler(self.to),self.to)
|
||||
iterator(self.wiki.getTiddler(self.to),self.to);
|
||||
})[0];
|
||||
} else {
|
||||
// Expand the tv-wikilink-template variable to construct the href
|
||||
|
|
@ -121,12 +121,12 @@ LinkWidget.prototype.renderLink = function(parent,nextSibling) {
|
|||
var tooltipWikiText = this.tooltip || this.getVariable("tv-wikilink-tooltip");
|
||||
if(tooltipWikiText) {
|
||||
var tooltipText = this.wiki.renderText("text/plain","text/vnd.tiddlywiki",tooltipWikiText,{
|
||||
parseAsInline: true,
|
||||
variables: {
|
||||
currentTiddler: this.to
|
||||
},
|
||||
parentWidget: this
|
||||
});
|
||||
parseAsInline: true,
|
||||
variables: {
|
||||
currentTiddler: this.to
|
||||
},
|
||||
parentWidget: this
|
||||
});
|
||||
domNode.setAttribute("title",tooltipText);
|
||||
}
|
||||
if(this.role) {
|
||||
|
|
@ -135,7 +135,7 @@ LinkWidget.prototype.renderLink = function(parent,nextSibling) {
|
|||
this.assignAttributes(domNode,{
|
||||
sourcePrefix: "aria-",
|
||||
destPrefix: "aria-"
|
||||
})
|
||||
});
|
||||
// Add a click event handler
|
||||
$tw.utils.addEventListeners(domNode,[
|
||||
{name: "click", handlerObject: this, handlerMethod: "handleClickEvent"},
|
||||
|
|
@ -145,6 +145,8 @@ LinkWidget.prototype.renderLink = function(parent,nextSibling) {
|
|||
$tw.utils.makeDraggable({
|
||||
domNode: domNode,
|
||||
dragTiddlerFn: function() {return self.to;},
|
||||
startActions: self.startActions,
|
||||
endActions: self.endActions,
|
||||
widget: this
|
||||
});
|
||||
} else if(this.draggable === "no") {
|
||||
|
|
@ -203,6 +205,8 @@ LinkWidget.prototype.execute = function() {
|
|||
this.overrideClasses = this.getAttribute("overrideClass");
|
||||
this.tabIndex = this.getAttribute("tabindex");
|
||||
this.draggable = this.getAttribute("draggable","yes");
|
||||
this.startActions = this.getAttribute("startactions");
|
||||
this.endActions = this.getAttribute("endactions");
|
||||
this.linkTag = this.getAttribute("tag","a");
|
||||
// Determine the link characteristics
|
||||
this.isMissing = !this.wiki.tiddlerExists(this.to);
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ tags: $:/tags/Macro
|
|||
<$action-listops $tiddler=<<targetTiddler>> $field=<<targetField>> $subfilter="+[insertbefore<actionTiddler>,<currentTiddler>]"/>
|
||||
\end
|
||||
|
||||
\define list-links-draggable(tiddler,field:"list",emptyMessage,type:"ul",subtype:"li",class:"",itemTemplate, displayField:"caption")
|
||||
\define list-links-draggable(tiddler,field:"list",emptyMessage,type:"ul",subtype:"li",class:"",itemTemplate,displayField:"caption",startactions,endactions)
|
||||
\whitespace trim
|
||||
<$set name="_tiddler" value="""$tiddler$""" emptyValue=<<currentTiddler>> >
|
||||
<$let field-reference={{{ [<_tiddler>] "!!" [[$field$]] +[join[]] }}}
|
||||
|
|
@ -39,8 +39,11 @@ tags: $:/tags/Macro
|
|||
>
|
||||
<div class="tc-droppable-placeholder"/>
|
||||
<div>
|
||||
<$transclude tiddler="""$itemTemplate$""">
|
||||
<$link to={{!!title}}>
|
||||
<$transclude tiddler=<<__itemTemplate__>>>
|
||||
<$link to={{!!title}}
|
||||
startactions=<<__startactions__>>
|
||||
endactions=<<__endactions__>>
|
||||
>
|
||||
<$let tv-wikilinks="no">
|
||||
<$transclude field=<<__displayField__>>>
|
||||
<$view field="title"/>
|
||||
|
|
@ -92,7 +95,7 @@ tags: $:/tags/Macro
|
|||
</$set>
|
||||
\end
|
||||
|
||||
\define list-tagged-draggable(tag,subFilter,emptyMessage,itemTemplate,elementTag:"div",storyview:"",displayField:"title")
|
||||
\define list-tagged-draggable(tag,subFilter,emptyMessage,itemTemplate,elementTag:"div",storyview:"",displayField:"title",startactions,endactions)
|
||||
\whitespace trim
|
||||
<span class="tc-tagged-draggable-list">
|
||||
<$set name="tag" value=<<__tag__>>>
|
||||
|
|
@ -108,8 +111,11 @@ tags: $:/tags/Macro
|
|||
>
|
||||
<$genesis $type=<<__elementTag__>> class="tc-droppable-placeholder"/>
|
||||
<$genesis $type=<<__elementTag__>>>
|
||||
<$transclude tiddler="""$itemTemplate$""">
|
||||
<$link to={{!!title}}>
|
||||
<$transclude tiddler=<<__itemTemplate__>>>
|
||||
<$link to={{!!title}}
|
||||
startactions=<<__startactions__>>
|
||||
endactions=<<__endactions__>>
|
||||
>
|
||||
<$let tv-wikilinks="no">
|
||||
<$transclude field=<<__displayField__>>>
|
||||
<$view field="title"/>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
caption: list-links-draggable
|
||||
created: 20170328204925306
|
||||
modified: 20211214141650488
|
||||
modified: 20260206131823536
|
||||
tags: Macros [[Core Macros]]
|
||||
title: list-links-draggable Macro
|
||||
type: text/vnd.tiddlywiki
|
||||
|
|
@ -31,9 +31,16 @@ The <<.def list-links-draggable>> [[macro|Macros]] renders the ListField of a ti
|
|||
; itemTemplate
|
||||
: Optional title of a tiddler to use as the template for rendering list items
|
||||
|
||||
;displayField
|
||||
: <<.from-version 5.4.0>> Optional name of the field to display when the list is rendered. Defaults to the "caption" field; if "caption" is not present, the "title" field is used instead
|
||||
; displayField <<.from-version 5.4.0>>
|
||||
: Optional name of the field to display when the list is rendered. Defaults to the "caption" field; if "caption" is not present, the "title" field is used instead
|
||||
|
||||
; startactions <<.from-version "5.4.0">>
|
||||
: Optional action string that gets invoked when link ''dragging starts''
|
||||
: <<.var actionTiddler>> variable is available in this action
|
||||
|
||||
; endactions <<.from-version "5.4.0">>
|
||||
: Optional action string that gets invoked when link ''dragging ends''
|
||||
: <<.var actionTiddler>> variable is available in this action
|
||||
|
||||
If the `itemTemplate` parameter is not provided then the list items are rendered as simple links. Within the `itemTemplate`, the [[currentTiddler Variable]] refers to the current list item.
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
caption: list-tagged-draggable
|
||||
created: 20170329092723939
|
||||
modified: 20180109171254045
|
||||
modified: 20260206131803841
|
||||
tags: Macros [[Core Macros]]
|
||||
title: list-tagged-draggable Macro
|
||||
type: text/vnd.tiddlywiki
|
||||
|
|
@ -9,19 +9,30 @@ The <<.def list-tagged-draggable>> [[macro|Macros]] renders the tiddlers with a
|
|||
|
||||
!! Parameters
|
||||
|
||||
;tag
|
||||
; tag
|
||||
: The title of the tag
|
||||
;subFilter
|
||||
|
||||
; subFilter
|
||||
: An optional subfilter to filter out unwanted items (eg `!tag[done]`)
|
||||
;itemTemplate
|
||||
|
||||
; itemTemplate
|
||||
: Optional title of a tiddler to use as the template for rendering list items
|
||||
;emptyMessage
|
||||
|
||||
; emptyMessage
|
||||
: Optional wikitext to display if there are no tiddlers with the specified tag
|
||||
|
||||
;displayField
|
||||
: <<.from-version 5.4.0>> Optional name of the field to display when the list is rendered. Defaults to `title` field.
|
||||
; displayField <<.from-version 5.4.0>>
|
||||
: Optional name of the field to display when the list is rendered. Defaults to `title` field
|
||||
|
||||
Note that the [[ordering|Order of Tagged Tiddlers]] is accomplished by assigning a new list to the `list` field of the tag tiddler. Any `list-before` or `list-after` fields on any of the other tiddlers carrying the tag are also removed to ensure the `list` field is respected.
|
||||
; startactions <<.from-version "5.4.0">>
|
||||
: Optional action string that gets invoked when link ''dragging starts''
|
||||
: <<.var actionTiddler>> variable is available in this action.
|
||||
|
||||
; endactions <<.from-version "5.4.0">>
|
||||
: Optional action string that gets invoked when link ''dragging ends''
|
||||
: <<.var actionTiddler>> variable is available in this action
|
||||
|
||||
Note that the [[ordering|Order of Tagged Tiddlers]] is accomplished by assigning a new list to the `list` field of the tag tiddler. Any `list-before` or `list-after` fields on any of the other tiddlers carrying the tag are also removed to ensure the `list` field is respected
|
||||
|
||||
If the `itemTemplate` parameter is not provided then the list items are rendered as simple links. Within the `itemTemplate`, the [[currentTiddler Variable]] refers to the current list item.
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
change-category: usability
|
||||
change-type: enhancement
|
||||
created: 20260126125300
|
||||
description: Add start- and endactions to link-widget, list-links-draggable and list-tagged-draggable macros
|
||||
github-contributors: pmario
|
||||
github-links: https://github.com/TiddlyWiki/TiddlyWiki5/pull/9621
|
||||
modified: 20260126125300
|
||||
release: 5.4.0
|
||||
tags: $:/tags/ChangeNote
|
||||
title: $:/changenotes/5.4.0/#9621
|
||||
type: text/vnd.tiddlywiki
|
||||
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
caption: link
|
||||
created: 20131024141900000
|
||||
modified: 20250720025154474
|
||||
modified: 20260206131722044
|
||||
tags: Widgets
|
||||
title: LinkWidget
|
||||
type: text/vnd.tiddlywiki
|
||||
|
|
@ -27,6 +27,8 @@ The content of the link widget is rendered within the `<a>` tag representing the
|
|||
|data-* |<<.from-version "5.3.2">> Optional [[data attributes|https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes]] to be assigned to the HTML element |
|
||||
|style.* |<<.from-version "5.3.2">> Optional [[CSS properties|https://developer.mozilla.org/en-US/docs/Web/CSS/Reference]] to be assigned to the HTML element |
|
||||
|aria-* |<<.from-version "5.4.0">> Optional [[ARIA attributes|https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes]] to be assigned to the HTML element |
|
||||
|startactions |<<.from-version "5.4.0">> Optional action string that gets invoked when ''dragging starts''. The <<.var actionTiddler>> variable is available in this action.|
|
||||
|endactions |<<.from-version "5.4.0">> Optional action string that gets invoked when ''dragging ends''. The <<.var actionTiddler>> variable is available in this action. |
|
||||
|
||||
The draggable functionality is equivalent to using the DraggableWidget with the ''tiddler'' attribute set to the link target.
|
||||
|
||||
|
|
@ -67,6 +69,19 @@ A useful convention is to set the tooltip like this:
|
|||
|
||||
This causes the tooltip to be the ''tooltip'' field of the target tiddler. If the field isn't present, then the title is used instead.
|
||||
|
||||
! Action Variables
|
||||
|
||||
<<.from-version "5.4.0">> The <<.var actionTiddler>> variable is available to <<.param startaction>> and <<.param endaction>>.
|
||||
|
||||
To see all variables available to an action you can use this code and see the variables in the browser dev-console (F12)
|
||||
|
||||
<<wikitext-example-without-html """\procedure endActions()
|
||||
<$action-log/>
|
||||
\end
|
||||
|
||||
<$link to=HelloThere endactions=<<endActions>>>drag me!</$link>
|
||||
""">>
|
||||
|
||||
! CSS Classes
|
||||
|
||||
The link widget automatically determines and applies the following classes to links:
|
||||
|
|
@ -95,7 +110,7 @@ The following process is used to generate the `href` attribute of the generated
|
|||
# If <<.vlink tv-wikilink-template>> is defined it is treated as a specialised macro body that can perform limited conversion of the target tiddler title to the `href` value
|
||||
# Otherwise, the target tiddler title is URI encoded to create the `href`
|
||||
|
||||
! Configuration variables
|
||||
! Configuration Variables
|
||||
|
||||
* <<.vlink tv-wikilinks>>
|
||||
* <<.vlink tv-filter-export-link>>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue