aboutsummaryrefslogtreecommitdiff
path: root/static/ts/components/popup-element.ts
diff options
context:
space:
mode:
authorHugo Hörnquist <hugo@lysator.liu.se>2023-09-05 11:41:46 +0200
committerHugo Hörnquist <hugo@lysator.liu.se>2023-09-05 11:41:46 +0200
commitf653a01328be3b8be6af35c0c96867623765ca5b (patch)
treeaee9a5d3abfc39270f55defd7bc1a7e47920ffc3 /static/ts/components/popup-element.ts
parentMinor whitespace cleanup. (diff)
downloadcalp-f653a01328be3b8be6af35c0c96867623765ca5b.tar.gz
calp-f653a01328be3b8be6af35c0c96867623765ca5b.tar.xz
Move JS documentation into the JS-code.
Texinfo was a bad match for how TypeScript is structured. This also allows generation of jsdoc pages, which can be nice. Another large win is that this opens up for the texinfo pages to replace the Guile heading with different subheadings, including - external library - internal library - C library - ...
Diffstat (limited to 'static/ts/components/popup-element.ts')
-rw-r--r--static/ts/components/popup-element.ts40
1 files changed, 37 insertions, 3 deletions
diff --git a/static/ts/components/popup-element.ts b/static/ts/components/popup-element.ts
index 458f543c..cc011ce3 100644
--- a/static/ts/components/popup-element.ts
+++ b/static/ts/components/popup-element.ts
@@ -1,3 +1,19 @@
+/**
+ * `<popup-element />`
+ *
+ * A (small) floating window containing information, which can be dragged
+ * arround. Consists of a navigation bar with a few buttons for
+ * controlling the window, which also works as a drag handle, along with
+ * an area for contents, which can be resized by the user.
+
+ * Currently tightly coupled to VEvent's, since their color
+ * profile is derived from their owning events calendar, and they have
+ * action buttons for the event in their navigation bar.
+ *
+ * @category Web Components
+ * @mergeTarget components
+ * @module
+ */
export { PopupElement, setup_popup_element }
import { VEvent } from '../vevent'
@@ -7,12 +23,19 @@ import { ComponentVEvent } from './vevent'
import { remove_event } from '../server_connect'
-/* <popup-element /> */
+/**
+ ### Attributes
+ - visible
+ */
class PopupElement extends ComponentVEvent {
/* The popup which is the "selected" popup.
- /* Makes the popup last hovered over the selected popup, moving it to
+ * Makes the popup last hovered over the selected popup, moving it to
* the top, and allowing global keyboard bindings to affect it. */
+ /**
+ The popup which was most recently interacted with by the user. Used to
+ move it on top of all others, as well as sending relevant key events there.
+ */
static activePopup: PopupElement | null = null;
constructor(uid?: string) {
@@ -81,6 +104,12 @@ class PopupElement extends ComponentVEvent {
}
}
+ /**
+ If the popup is currently visible.
+
+ Adds the `visible` attribute to the component, which must then be handled
+ through CSS.
+ */
get visible(): boolean {
return this.hasAttribute('visible');
}
@@ -128,6 +157,10 @@ class PopupElement extends ComponentVEvent {
el.style.removeProperty('height');
}
+ /**
+ Resize the popup window to fill the current viewport (mostly). Is
+ probably bonud to the maximize button in the navigation bar.
+ */
maximize() {
/* TODO this assumes that popups are direct decendant of their parent,
which they really ought to be */
@@ -144,7 +177,8 @@ class PopupElement extends ComponentVEvent {
}
}
-/* Create a new popup element for the given VEvent, and ready it for editing the
+/**
+ Create a new popup element for the given VEvent, and ready it for editing the
event. Used when creating event (through the frontend).
The return value can safely be ignored.
*/