New TiddlyTools time feature: "inline EditDate control"

[Eric Shulman]

http://tiddlytools.com/timer.html#TiddlyTools%2FTimer%2FEditDate

Introduction

The edit-date macro provides a user interface that combines the features of a text input (<$edit-text> widget) with "edit-in-place" (save/cancel/delete) buttons and a popup monthly calendar. This allows you to enter custom text or select and format a date from the calendar.

Parameters

The macro supports a subset of the parameters allowed by the <$edit-text> widget:

Parameter	Description
tiddler	The tiddler in which to save the input (default=<<currentTiddler>>)
field	The field in which to save the input (default=date)
format	The TiddlyWiki Date Format used to store a date selected from the calendar (default=YYYY/0MM/0DD)
default	text to be used when the target field doesn't exist
placeholder	text to display when the target field is empty (default="select or enter a date")
size	The size of the input field in characters (default=20)
focus	Set to "yes" or "true" to automatically focus the input after creation
class	A CSS class to be assigned to the generated HTML editing element

Notes

• Use <<edit-date field:fieldname>> to embed a date input field in tiddler content.
• Unlike the <$edit-text> widget, the <<edit-date>> macro allows you to input values that are stored in the current tiddler.
• When the field receives the input focus, a set of "edit-in-place" buttons and a monthly calendar are displayed.

• [checkmark] saves changes to the field value. [X] cancels changes to the field value. [trashcan] deletes the field value.

• [<<] displays the previous month. [>>] displays the next month.

• Click a date to set the edit field contents using the indicated TiddlyWiki Date Format codes.
• You can override the default date format (YYYY/0MM/0DD) by entering a new format directly in the calendar popup.
• Note: if TiddlyTools/Timer/Calendar is not installed, the calendar popup is not displayed.

enjoy,

-e 

[TW Tones]

Eric,

Once again thanks for taking this to a complete solution.

I found a method to create a very simple date picker  attached, that returns a tiddlywiki serial number date, drop it on a wiki and put the following in a tiddler

simple-date: <<select-date simple-date>><br>
<<delete-date simple-date>><br>
<<simple-date simple-date 0DD.0MM.YYYY>><br>
Start-date: <<date-field start-date "DDth of MMM, YYYY">>

Its not finished but I think you will like the mechanism I am making use of 

\define select-date(fieldname)
<$set name=date-field value="$fieldname$" emptyValue="date-field">
<$edit-text tiddler="$:/temp/date" type=date tag="input" />
<$list filter="[{$:/temp/date}!is[blank]]" variable=nul>
   <$button tooltip={{{ [[$fieldname$]addprefix[Set ]addsuffix[ to selected date]] }}} actions=<<set-date-actions>> >
      <$list filter="[all[current]has<date-field>]" emptyMessage="Set" variable=nul>Reset</$list>
 </$button>
</$list>
</$set>
\end

Using the 

• type=date tag="input" on the edit-text widget
  
• Saving the the result to a temp field
• I need to make this temp tiddler qualified by the fieldname, to stop simultaneous popups
• Converting the temp field to tiddlywiki date serial (Noon used)

Similar options may exist for time

I expect I will publish this for users not buying into your full date solution, to simply improve date picking.

Question

• It requires a set button, have you another way to trigger the actions, after selecting a date in the popup I can use?

But I will add your, facility is very usable.

Dreaming

• I wonder if there is any javascript that allows one to set a time by dragging the hands on a clock, or on a list like google calendars?

Love you work, really, really.

Regards

Tones

[Hans Wobbe]

Eric:

Thank you very much for this contribution !

The "edit-in-place" feature is very useful for me since it reduces the need to use a second "remote" tiddler to easily edit a field.

Cheers,

Hans

[Eric Shulman]

On Monday, September 14, 2020 at 3:35:14 AM UTC-7, Hans Wobbe wrote:

The "edit-in-place" feature is very useful for me since it reduces the need to use a second "remote" tiddler to easily edit a field.

Behind the scenes, the <<edit-date>> macro automatically creates and uses a second "remote" tiddler named "$:/state/input/edit-date/$tiddlername$/$fieldname$", where "tiddlername" and "fieldname" are variables corresponding to the actual target tiddler and field being edited.  It also uses a short-lived tiddler named "$:/state/popup/edit-date/$tiddlername$/$fieldname$" that exists only while the edit-in-place buttons and the popup calendar are actively displayed.

Note also that I've updated the macro to allow use of any of the attributes supported by the TWCore <$edit-text> widget.

In particular, if you want to use the "edit-in-place" feature *without the popup calendar*, you can specify "type:input", which overrides the default "type:calendar".

See http://tiddlytools.com/timer.html#TiddlyTools%2FTimer%2FEditDate for full documentation, notes, and examples.

enjoy,

-e

[Hans Wobbe]

Thanks for reminding me to "Read the documentation".  (Blush).  I was so pleased by this set of Date functions, I just rushed right in!