diff options
Diffstat (limited to 'static/ts/components/vevent-description.ts')
-rw-r--r-- | static/ts/components/vevent-description.ts | 54 |
1 files changed, 54 insertions, 0 deletions
diff --git a/static/ts/components/vevent-description.ts b/static/ts/components/vevent-description.ts new file mode 100644 index 00000000..bf62c10d --- /dev/null +++ b/static/ts/components/vevent-description.ts @@ -0,0 +1,54 @@ +/** + * `<vevent-description />` + +A text representation of a VEvent. Used as the summary tab of our +popup windows, and in the sidebar. + +When redrawn, it looks for an HTML-tag inside its template having the +attribute `data-property` matching the properties name. If one is +found, it looks in the `formatters` table +({@link formatters}), for a field matching the property value, and +defaults to the key `default`. + * + * @category Web Components + * @mergeTarget components + * @module + */ +export { ComponentDescription } + +import { VEvent } from '../vevent' +import { ComponentVEvent } from './vevent' +import { format } from '../formatters' + +/* + <vevent-description /> +*/ +class ComponentDescription extends ComponentVEvent { + + constructor(uid?: string) { + super(uid); + if (!this.template) { + throw 'vevent-description template required'; + } + } + + redraw(data: VEvent) { + // update ourselves from template + + let body = (this.template!.content.cloneNode(true) as DocumentFragment).firstElementChild!; + + for (let el of body.querySelectorAll('[data-property]')) { + if (!(el instanceof HTMLElement)) continue; + format(el, data, el.dataset.property!); + } + + let repeating = body.getElementsByClassName('repeating')[0] as HTMLElement + if (data.getProperty('rrule')) { + repeating.classList.remove('hidden'); + } else { + repeating.classList.add('hidden'); + } + + this.replaceChildren(body); + } +} |