| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596 |
- app.views.ListFold = class ListFold extends app.View {
- static targetClass = "_list-dir";
- static handleClass = "_list-arrow";
- static activeClass = "open";
- static events = { click: "onClick" };
- static shortcuts = {
- left: "onLeft",
- right: "onRight",
- };
- open(el) {
- if (el && !el.classList.contains(this.constructor.activeClass)) {
- el.classList.add(this.constructor.activeClass);
- $.trigger(el, "open");
- }
- }
- close(el) {
- if (el && el.classList.contains(this.constructor.activeClass)) {
- el.classList.remove(this.constructor.activeClass);
- $.trigger(el, "close");
- }
- }
- toggle(el) {
- if (el.classList.contains(this.constructor.activeClass)) {
- this.close(el);
- } else {
- this.open(el);
- }
- }
- reset() {
- let el;
- while ((el = this.findByClass(this.constructor.activeClass))) {
- this.close(el);
- }
- }
- getCursor() {
- return (
- this.findByClass(app.views.ListFocus.activeClass) ||
- this.findByClass(app.views.ListSelect.activeClass)
- );
- }
- onLeft() {
- const cursor = this.getCursor();
- if (cursor?.classList?.contains(this.constructor.activeClass)) {
- this.close(cursor);
- }
- }
- onRight() {
- const cursor = this.getCursor();
- if (
- cursor != null
- ? cursor.classList.contains(this.constructor.targetClass)
- : undefined
- ) {
- this.open(cursor);
- }
- }
- onClick(event) {
- if (event.which !== 1 || event.metaKey || event.ctrlKey) {
- return;
- }
- if (!event.pageY) {
- return;
- } // ignore fabricated clicks
- let el = $.eventTarget(event);
- if (el.parentNode.tagName.toUpperCase() === "SVG") {
- el = el.parentNode;
- }
- if (el.classList.contains(this.constructor.handleClass)) {
- $.stopEvent(event);
- this.toggle(el.parentNode);
- } else if (el.classList.contains(this.constructor.targetClass)) {
- if (el.hasAttribute("href")) {
- if (el.classList.contains(this.constructor.activeClass)) {
- if (el.classList.contains(app.views.ListSelect.activeClass)) {
- this.close(el);
- }
- } else {
- this.open(el);
- }
- } else {
- this.toggle(el);
- }
- }
- }
- };
|