diff options
author | Hugo Hörnquist <hugo@lysator.liu.se> | 2021-01-13 22:50:51 +0100 |
---|---|---|
committer | Hugo Hörnquist <hugo@lysator.liu.se> | 2021-01-13 22:50:51 +0100 |
commit | 641278c624a3a0c06856656255f648f2cf4f6a92 (patch) | |
tree | 49c47c4c61dd0704e89cfd75681bc16f171e7ad5 /doc/ref | |
parent | Add debug buttons in popup for dumping xcal and jcal. (diff) | |
parent | Document (vcompenent control). (diff) | |
download | calp-641278c624a3a0c06856656255f648f2cf4f6a92.tar.gz calp-641278c624a3a0c06856656255f648f2cf4f6a92.tar.xz |
Merge branch 'doc' into jcal
Diffstat (limited to 'doc/ref')
-rw-r--r-- | doc/ref/Makefile | 7 | ||||
-rw-r--r-- | doc/ref/calp.texi | 71 | ||||
-rw-r--r-- | doc/ref/guile.texi | 17 | ||||
-rw-r--r-- | doc/ref/javascript.texi | 35 | ||||
-rw-r--r-- | doc/ref/javascript/arbitary_kv.texi | 3 | ||||
-rw-r--r-- | doc/ref/javascript/binders.texi | 47 | ||||
-rw-r--r-- | doc/ref/javascript/clock.texi | 84 | ||||
-rw-r--r-- | doc/ref/javascript/date_time.texi | 39 | ||||
-rw-r--r-- | doc/ref/javascript/draggable.texi | 24 | ||||
-rw-r--r-- | doc/ref/javascript/input_list.texi | 51 | ||||
-rw-r--r-- | doc/ref/javascript/jcal.texi | 4 | ||||
-rw-r--r-- | doc/ref/javascript/lib.texi | 147 | ||||
-rw-r--r-- | doc/ref/javascript/popup.texi | 5 | ||||
-rw-r--r-- | doc/ref/javascript/rrule.texi | 4 | ||||
-rw-r--r-- | doc/ref/javascript/script.texi | 60 | ||||
-rw-r--r-- | doc/ref/javascript/server_connect.texi | 2 | ||||
-rw-r--r-- | doc/ref/javascript/types.texi | 39 |
17 files changed, 639 insertions, 0 deletions
diff --git a/doc/ref/Makefile b/doc/ref/Makefile new file mode 100644 index 00000000..2232a70e --- /dev/null +++ b/doc/ref/Makefile @@ -0,0 +1,7 @@ +TEXI_FILES := $(shell find . -type f -name \*.texi) +INFOFLAGS := + +all: calp.info + +calp.info: $(TEXI_FILES) + makeinfo $(INFOFLAGS) calp.texi diff --git a/doc/ref/calp.texi b/doc/ref/calp.texi new file mode 100644 index 00000000..e5c4baab --- /dev/null +++ b/doc/ref/calp.texi @@ -0,0 +1,71 @@ +\input texinfo +@settitle Calp + +@copying +Copyright @copyright{} 2020 Hugo Hörnquist +@end copying + +@c Borrowed from guile.texi +@c @nicode{S} is plain S in info, or @code{S} elsewhere. This can be used +@c when the quotes that @code{} gives in info aren't wanted, but the +@c fontification in tex or html is wanted. @alias is used rather +@c than @macro because backslashes don't work properly in an @macro. +@ifinfo +@alias nicode=asis +@end ifinfo +@ifnotinfo +@alias nicode=code +@end ifnotinfo + +@c @ifinfo +@c @macro i{text} +@c [3m\text\[0m +@c @end macro +@c @end ifinfo + +@c for use with deftp for extended classes +@macro extends{class} +@w{@i{extends} \class\} +@end macro + +@c For things that should be fixed in the (actual) code. +@c An ``invitation'' to the reader +@macro TODO{text} +text @footnote{Improvements welcome} +@end macro + +@macro githash{hash,path,line} +@url{https://git.hornquist.se/calp/tree/\path\?id=\hash\#n\line\,\hash\} +@end macro + +@titlepage +@title Calp +@author Hugo Hörnquist + +@page +@vskip 0pt plus 1filll +@insertcopying +@end titlepage + +@contents + +@ifnottex +@node Top +@top Calp +@end ifnottex + +@c @menu +@c * Index:: +@c @end menu + +@include guile.texi +@include javascript.texi + +@node Index +@unnumbered Index +@printindex cp +@printindex fn +@printindex tp +@printindex vr + +@bye diff --git a/doc/ref/guile.texi b/doc/ref/guile.texi new file mode 100644 index 00000000..8468021e --- /dev/null +++ b/doc/ref/guile.texi @@ -0,0 +1,17 @@ +@node Guile +@chapter Guile + +@c TODO +This chapter will probably in the future be replaced by a proper +system overview in the future. + +@c module (vcomponent control) + +@defmac with-replaced-properties (component (key value) ...) body ... +Through the extent of @var{body} each @var{key}'s value in +@var{component} is replaced by its repspective @var{value}. + +Note that @var{body} is guarded through a dynamic-wind, meaning that +even non-local exits will restore @var{component} to its initial +state. +@end defmac diff --git a/doc/ref/javascript.texi b/doc/ref/javascript.texi new file mode 100644 index 00000000..6fbd7cdc --- /dev/null +++ b/doc/ref/javascript.texi @@ -0,0 +1,35 @@ +@node Javascript +@chapter Javascript + +@node Concepts +@section Concepts + +@subsection ``Componenents'' + +@deftp {} date_time +@cindex date-time + +@ref{date_time} +@end deftp + +@deftp {} draggable +@end deftp + +@deftp {} input_list +@end deftp + +@node Reference +@section Reference +@include javascript/arbitary_kv.texi +@include javascript/binders.texi +@include javascript/clock.texi +@include javascript/date_time.texi +@include javascript/draggable.texi +@include javascript/input_list.texi +@include javascript/jcal.texi +@include javascript/lib.texi +@include javascript/popup.texi +@include javascript/rrule.texi +@include javascript/script.texi +@include javascript/server_connect.texi +@include javascript/types.texi diff --git a/doc/ref/javascript/arbitary_kv.texi b/doc/ref/javascript/arbitary_kv.texi new file mode 100644 index 00000000..b28c8b92 --- /dev/null +++ b/doc/ref/javascript/arbitary_kv.texi @@ -0,0 +1,3 @@ +@node arbitary_kv +@subsection arbitary_kv.js + diff --git a/doc/ref/javascript/binders.texi b/doc/ref/javascript/binders.texi new file mode 100644 index 00000000..2b64b230 --- /dev/null +++ b/doc/ref/javascript/binders.texi @@ -0,0 +1,47 @@ + +@node binders +@subsection binders.js + +The bind system allows HTML-elements to specify that they want to be +updated whenever its corresponding (vcalendar) object changes. +The bind system is currently set up in +@code{bind_properties} (@pxref{bind_properties}) +(which at the time of writing is (badly) located in @ref{script}). + +All (HTML) components with the class @code{bind} are bound. By default +the (HTML) attribute @code{data-property} is checked for a property +name, and @code{object.innerHTML} is set whenever that property field +changes. +Alternatively an (HTML) component may specify a specific binder +through the HTML attribute @code{data-bindby}, which should be the +name of a JavaScript function taking two arguments, an @TODO{event +component} +@footnote{Root ``root'' HTML component of a given calendar event +(something which @code{get_property} can be called on}, +and the component in question. + +@c Also sets up event listeners, which most doesn't do. + +Binder functions are generally placed in @file{binders.js}, and +shouldn't be called manually. + +@defun bind_recur el e +Handles recurrence rules. +Uses a sub-binder system on components with class containing +``bind-rr''. +@end defun + +@defun bind_edit el e +Cases for @code{input} and @code{textarea} elements @TODO{(should also +handle @code{select}s?)} +@end defun + +@defun bind_view el e +The same as the default binder???? +@end defun + +@defun bind_wholeday el e +Binder for the wholeday toggle button. +While CSS would suffice, this sets the disabled flags on the time +inputs, giving a better user experience. +@end defun diff --git a/doc/ref/javascript/clock.texi b/doc/ref/javascript/clock.texi new file mode 100644 index 00000000..5c2bd954 --- /dev/null +++ b/doc/ref/javascript/clock.texi @@ -0,0 +1,84 @@ +@node clock +@subsection clock.js + +@deftp {(abstract) class} Clock +Interface for ``things'' which wants to get updated on a human timescale. + +@defmethod Clock update now +Called every now and then, with @var{now} being the current time. +@end defmethod + +All instances are expected to implement @code{update}, but are free to +implement any other methods they see fit. +@end deftp + +Below, only the methods (including @code{constructor} and +@code{update} which do something of note (excluding the expected)) +are noted. + +@deftp {class} Timebar @extends{Clock} +The (blue) vertical line which show the current time in the current day. + +@c @defmethod Timebar constructor ∅ +@c @end defmethod +@c +@c @defmethod Timebar update now +@c @end defmethod +@end deftp + +@deftp {class} SmallcalCellHighlight @extends{Clock} +Highlights the current date in the small calendar to the side. +Currently directly sets a border +@TODO{but should preferably set a class instead}. + +@defmethod SmallcalCellHighlight constructor small_cal +@var{small_cal} is the DOM-node of the calendar. +(it should support querySelector). +@end defmethod + +@c @defmethod SmallcalCellHighlight update now +@c @end defmethod +@end deftp + +@deftp {class} ButtonUpdater @extends{Clock} +Updates the ``Today'' link in the side panel to point directly to the +correct web-address. The link works without JavaScript, but then +requires a redirect from the server. + +All actual updating logic is already abstracted away. It would be +desirable if something more was done with this. + +@defmethod ButtonUpdater el proc +Takes the element @var{el} to be updated, and the procedure @var{proc} +which will be called with the element, and the current time. +@end defmethod +@end deftp + + +As of commit +@githash{c9719ce7937f0f0f2aa371ced1d585f67af22457,static/script.js,231} +all objects required manual setup. See static/script.js: + +@verbatim + 231 let start_time = document.querySelector("meta[name='start-time']").content; + 232 let end_time = document.querySelector("meta[name='end-time']").content; + 233 + 234 const button_updater = new ButtonUpdater( + 235 document.getElementById("today-button"), + 236 (e, d) => e.href = d.format('~Y-~m-~d') + ".html" + 237 ); + 238 + 239 const sch = new SmallcalCellHighlight( + 240 document.querySelector('.small-calendar')) + 241 + 242 const timebar = new Timebar(start_time, end_time); + 243 + 244 timebar.update(new Date); + 245 window.setInterval(() => { + 246 let d = new Date; + 247 timebar.update(d); + 248 button_updater.update(d); + 249 sch.update(d); + 250 }, 1000 * 60); + 251 +@end verbatim diff --git a/doc/ref/javascript/date_time.texi b/doc/ref/javascript/date_time.texi new file mode 100644 index 00000000..fb2563f1 --- /dev/null +++ b/doc/ref/javascript/date_time.texi @@ -0,0 +1,39 @@ +@node date_time +@subsection date_time.js + +@defun init_date_time +@c possibly have special index for these +@cindex dummy component +Procedure which initializes the dummy component for date-time input. +When called, finds all elements with class ``date-time'', and makes +them date-time inputs. + +@c <input type='date-time'/> + +The expected HTML form is +@example +<div class="date-time" name="@var{name}"> + <input type="date"/> + <input type="time"/> +</div> +@end example + +Each date-time gets the following fields: + +@defivar date_time value +The current date-time value as a string, +on the form @code{YYYY-mm-ddTHH:MM[:SS]} +(@code{SS} if the underlying time input has it). + +A new date-time can also be set to the field, the same format as above +is expected. +@end defivar + +@defivar date_time name +The ``name'' field of the date-time input. Since @code{name} note that +this is an addition, since name is actually invalid on non-input +components. We nevertheless use it here since we are emulating an +input element. +@end defivar + +@end defun diff --git a/doc/ref/javascript/draggable.texi b/doc/ref/javascript/draggable.texi new file mode 100644 index 00000000..d1851ec4 --- /dev/null +++ b/doc/ref/javascript/draggable.texi @@ -0,0 +1,24 @@ +@node dragable +@subsection dragable.js + +@c TODO This text is just yanked from the old org file, along with the +@c source codes header. It should probably be rewritten. + +Manually apply =bind_popup_control= to the statusbar of a floating +"window". Nothing is required from the component, but the "window" +must have 'popup-container' ∈ =class= + +@defun bind_popup_control nav +Apply to a given component to make it draggable. +Drag area (usually a title bar) should be be the only argument. +It is REQUIRED that the object which should be moved have the class +@code{popup-container}. + +@example +<div class='popup-container'> + ... + <nav /> + ... +</div> +@end example +@end defun diff --git a/doc/ref/javascript/input_list.texi b/doc/ref/javascript/input_list.texi new file mode 100644 index 00000000..65db81a4 --- /dev/null +++ b/doc/ref/javascript/input_list.texi @@ -0,0 +1,51 @@ +@node input_list +@subsection input_list.js +@cindex dummy component + +All elements with the class @code{input-list} are treated as a +collection of input fields. Uses including setting tags on calendar +entries. + +All direct children of the ``input-list'' @emph{must} have the class +@code{unit}, and one direct child @code{unit} have the class @code{final}. + +@c All elements having 'input-list' ∈ =class= + +@c Direct children must all have 'unit' ∈ =class= +@c One direct child must have 'final' ∈ =class= + +@defmethod input_list get_value + +@example +querySelectorAll('input') + .map(x => x.value) + .join(@var{joinby}) +@end example +@end defmethod + +@defivar input_list [data-]joinby + Alternative character to join by +@end defivar + +@defivar input_list [data-]bindby + replacement for get_value +@end defivar + +binds =get_value= on instances, by default returning the value +of all =<input/>= tags joined by =,=. This can be overwritten with + +TODO: instead, override value? + +=addEventList('input',= is overwritten, registering the listener for all input +elements. + + + ∀ children('.input-list') => 'unit' ∈ classList(child) + + <div class="input-list"> + <div class="unit"><input/></div> + <div class="unit final"><input/></div> + </div> + +@defun init_input_list +@end defun diff --git a/doc/ref/javascript/jcal.texi b/doc/ref/javascript/jcal.texi new file mode 100644 index 00000000..4be8d33b --- /dev/null +++ b/doc/ref/javascript/jcal.texi @@ -0,0 +1,4 @@ + +@node jcal +@subsection jcal.js + diff --git a/doc/ref/javascript/lib.texi b/doc/ref/javascript/lib.texi new file mode 100644 index 00000000..ec5d4450 --- /dev/null +++ b/doc/ref/javascript/lib.texi @@ -0,0 +1,147 @@ + +@node lib +@subsection lib.js + +General procedures which in theory could be used anywhere. + +@defvar xcal +The xml namespace name for xcalendar, which is +``urn:ietf:params:xml:ns:icalendar-2.0''. +@end defvar + + +@node Default prototype extensions +@subsubsection Default prototype extensions + +HTMLElement extensions + +@defmethod HTMLElement addEventListener name proc +Replace the default @code{addEventListener} with a version that stores +all listeners in the dictionary @var{listeners}. +@end defmethod + +@defivar HTMLElement listeners +Dictionary of all registered listeners to this element. +Keys are taken from @code{addEventListener}. +@end defivar + +@defmethod DOMTokenList find regexp +Finds the first element of the DOMTokenList whichs value matches +the supplied regexp. Returns a pair of the index and the value. +@end defmethod + +@defmethod Object format args ... +Returns a string representation of the given object. +Allows extending for custom types, +@ref{date-format} +@end defmethod + +@node General +@subsubsection General + +@defun zip args ... +Takes a list of lists, and returns a single list of tuples. +@example +» zip([1,2,3,4,5], "Hello") +← [[1,'H'],[2,'e'],[3,'l'],[4,'l'],[5,'o']] +@end example +@end defun + +@defun makeElement name [attr=@{@}] +Creates a new DOM element of type @var{name}, with all keys in +@var{attr} transfered to it. For example, the equivalent of +@example +<input type='number'/> +@end example +would be +@verbatim +values.push(makeElement('input', { + type: 'number', +})); +@end verbatim +. +@end defun + +@defun round_time time fraction +TODO +@end defun + +@defun date_to_percent date +Retuns how far along the date specified by @var{date} is, between 0 +and 100, where 00:00 maps to 0, and 23:59 to ~100. +@end defun + +@defun gensym [pxrefix='gensym'] +Generates a new string which is (hopefully) globally unique. +Compare with @code{gensym} from Lisp. +@end defun + +@defun setVar str val +Set the CSS var @var{str} to @var{val} on the root element. +@end defun + +@defun asList thing +Ensures that @var{thing} is a list. Returning it outright if it +already is one, otherwise wrapping it in a list. +@end defun + +@node Date +@subsubsection Date + +Some extensions to the builtin class ``Date'' is made. + +@defivar Date utc +Boolean indicating if the given timestamp is in UTC or local time. +true means UTC. +@end defivar + +@defivar Date dateonly +Boolean indicating if the time component of the Date object should be disregarded. +@end defivar + +@defun parseDate str +Takes a string @var{str}, which should be in ISO-8601 date-format, and +returns a javascript Date object. +@end defun + +@defun copyDate date +Creates a new instance of the given Date @var{date}, also transfers my +custom fields. +@end defun + +@defun to_local date +@anchor{to_local} +Returns a Date object (which may be new) which is guaranteed in local +time. +This means that the @var{utc} field is @code{false}, and that +@code{to_local(current_time())} should show what your wall-clock shows. +@end defun + +@defmethod Date format str args ... +@anchor{date-format} +Formats a Date object according to the format specification @var{str}. +Keeping with Guile each format specifier starts with a ~. + +@c table formatting borrowed from Gulie Reference (SRFI-19 Date to string) +@multitable {MMMM} {MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM} +@item @nicode{~~} @tab literal ~ +@c Almost all fields are left padded. How do I signify this +@c with a single footnote? +@item @nicode{~Y} @tab year, left-padding with zeroes. +@item @nicode{~m} @tab month number, left padded with zeroes. +@item @nicode{~d} @tab day of month. +@item @nicode{~H} @tab hour +@item @nicode{~M} @tab minute +@item @nicode{~S} @tab second +@item @nicode{~Z} @tab 'Z' if Date is UTC, otherwise nothing + +@item @nicode{~L} @tab Converts the date to local time +(@pxref{to_local}) (doesn't modify source object). Outputs nothing +@end multitable +@end defmethod + +@defun format_date date str +Equivalent to @code{(@var{date}).format(@var{str})}. +@c TODO link +@end defun + diff --git a/doc/ref/javascript/popup.texi b/doc/ref/javascript/popup.texi new file mode 100644 index 00000000..2dd8f48f --- /dev/null +++ b/doc/ref/javascript/popup.texi @@ -0,0 +1,5 @@ + + +@node popup +@subsection popup.js + diff --git a/doc/ref/javascript/rrule.texi b/doc/ref/javascript/rrule.texi new file mode 100644 index 00000000..5d7a7576 --- /dev/null +++ b/doc/ref/javascript/rrule.texi @@ -0,0 +1,4 @@ + +@node rrule +@subsection rrule.js + diff --git a/doc/ref/javascript/script.texi b/doc/ref/javascript/script.texi new file mode 100644 index 00000000..a60343e4 --- /dev/null +++ b/doc/ref/javascript/script.texi @@ -0,0 +1,60 @@ + +@node script +@subsection script.js + +@dfn{Main} for my javascript, and also currently dumping ground for stuff. + +@deftp {class} EventCreator + +@defmethod EventCreator create_empty_event +@end defmethod + +@defmethod EventCreator create_event_down intended_target +@end defmethod + +@defmethod EventCreator create_event_move pos_in [round=1] [wide_element=false] +@end defmethod + +@defmethod EventCreator create_event_finisher callback +@end defmethod + +@end deftp + +@defun place_in_edit_mode event +@end defun + +@c window.onload is here in source file + +@defun get_property event field default_value +Returns the @emph{value} slot of given field in @var{event}, creating it if needed. + +@itemize +@item +@var{el}: the event to work on + +@item +@var{field}: name of the field + +@item +@var{default_value}: default value when creating + +@item +@var{bind_to_ical} should this property be added to the icalendar subtree? +@end itemize +@end defun + +@defun bind_properties el [wide_event=false] +@anchor{bind_properties} +@ref{binders} + Properties are icalendar properties. + + p['name'] to get and set value (also updates any connected slots) + + p['_value_name'] for raw value + p['_slot_name'] for connected slots, Vector of pairs, where the + car should be a reference to the slot, and the + cdr a procedure which takes a slot and a value + and binds the value to the slot. +@end defun + + diff --git a/doc/ref/javascript/server_connect.texi b/doc/ref/javascript/server_connect.texi new file mode 100644 index 00000000..2f50f02d --- /dev/null +++ b/doc/ref/javascript/server_connect.texi @@ -0,0 +1,2 @@ +@node server_connect +@subsection server_connect.js diff --git a/doc/ref/javascript/types.texi b/doc/ref/javascript/types.texi new file mode 100644 index 00000000..73a58550 --- /dev/null +++ b/doc/ref/javascript/types.texi @@ -0,0 +1,39 @@ +@node types +@subsection types.js + +Collection of type information for calendar data. + +@defvar all_types +Name of all valid icalendar types. + + text, uri, binary, float, integer, date-time, date, duration, + period, utc-offset, cal-address, recur, boolean, +@end defvar + +@defvar property_names +All known names properties (top level keys) can have. +Such as ``calscale'', ``dtstart'', ... +@end defvar + +@defvar valid_fields +Which property fields each component can hold. + +@verbatim +{ 'VCALENDAR': ['PRODID', 'VERSION', 'CALSCALE', 'METHOD'], + ... +} +@end verbatim +@end defvar + +@defvar valid_input_types +Which types are valid to store under each property. +If multiple values are an option for that property, then +the list of possibilities will contain a sub-list (see example). + +@verbatim +{ 'DTSTART': ['date', 'date-time'], + 'CATEGORIES': [['text']], + ... +} +@end verbatim +@end defvar |