Theodor-Springmann-Stiftung/musenalm
1
0
Fork 0
mirror of https://github.com/Theodor-Springmann-Stiftung/musenalm.git synced 2025-10-28 08:45:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

started reimplementing the thing

Browse Source
This commit is contained in:
Simon Martens
2025-06-04 16:55:12 +02:00
parent dccc3ed8ca
commit 715be79115
10 changed files with 4976 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4866
fields.json Normal file
View File

File diff suppressed because it is too large Load Diff

7
views/assets/css/easymde.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

7
views/assets/js/easymde.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
views/assets/scripts.js
View File

@@ -1648,7 +1648,7 @@ class ee extends HTMLElement {
const i = `
<div class="${et}">
<ul class="${it}">
<li class="${st}">All items are currently shown.</li>
<li class="${st}"></li>
</ul>
</div>
`;

2
views/assets/style.css
View File

File diff suppressed because one or more lines are too long

7
views/public/css/easymde.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

7
views/public/js/easymde.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

43
views/routes/almanach/edit/body.gohtml
View File

@@ -108,6 +108,17 @@ type AlmanachResult struct {
}
});
});
const closeButtons = document.querySelectorAll(".close-button");
closeButtons.forEach((el) => {
el.addEventListener("click", (ev) => {
ev.preventDefault();
const inputWrapper = el.closest(".inputwrapper");
if (inputWrapper) {
inputWrapper.classList.add("hidden");
}
});
});
</script>
<div class="container-normal mx-auto px-8 mt-4">
@@ -137,12 +148,7 @@ type AlmanachResult struct {
<label for="title" class="inputlabel menu-label">Titel <i class="ri-text"></i></label>
<div class="text-xs">
<reset-button controls="title" wrapper-class="inputwrapper" modified-class-suffix="modified" class="text-sm"></reset-button>
<button
@click="(ev) => {
ev.preventDefault();
$el.parentNode.parentNode.parentNode.classList.add('hidden');
}"
class="text-sm cursor-pointer">
<button class="close-button text-sm cursor-pointer">
<i class="ri-close-line"></i>
</button>
</div>
@@ -155,12 +161,7 @@ type AlmanachResult struct {
<label for="subtitle" class="inputlabel menu-label">Untertitel <i class="ri-text"></i></label>
<div>
<reset-button controls="subtitle" wrapper-class="inputwrapper" modified-class-suffix="modified" class="text-sm"></reset-button>
<button
@click="(ev) => {
ev.preventDefault();
$el.parentNode.parentNode.parentNode.classList.add('hidden');
}"
class="text-sm cursor-pointer">
<button class="close-button text-sm cursor-pointer">
<i class="ri-close-line"></i>
</button>
</div>
@@ -170,15 +171,10 @@ type AlmanachResult struct {
<div class="mt-3 inputwrapper {{ if eq $model.result.Entry.VariantTitle "" }}hidden{{ end }}" data-value="varianttitle">
<div class="flex flex-row justify-between">
<label for="varianttitle" class="inputlabel menu-label">Titelvariante(n) <i class="ri-text"></i></label>
<label for="varianttitle" class="inputlabel menu-label">Titelvarianten <i class="ri-text"></i></label>
<div>
<reset-button controls="varianttitle" wrapper-class="inputwrapper" modified-class-suffix="modified" class="text-sm"></reset-button>
<button
@click="(ev) => {
ev.preventDefault();
$el.parentNode.parentNode.parentNode.classList.add('hidden');
}"
class="text-sm cursor-pointer">
<button class="close-button text-sm cursor-pointer">
<i class="ri-close-line"></i>
</button>
</div>
@@ -188,15 +184,10 @@ type AlmanachResult struct {
<div class="mt-3 inputwrapper {{ if eq $model.result.Entry.ParallelTitle "" }}hidden{{ end }}" data-value="paralleltitle">
<div class="flex flex-row justify-between">
<label for="paralleltitle" class="inputlabel menu-label">Titel (übersetzt) <i class="ri-text"></i></label>
<label for="paralleltitle" class="inputlabel menu-label">Übersetzter Titel <i class="ri-text"></i></label>
<div>
<reset-button controls="paralleltitle" wrapper-class="inputwrapper" modified-class-suffix="modified" class="text-sm"></reset-button>
<button
@click="(ev) => {
ev.preventDefault();
$el.parentNode.parentNode.parentNode.classList.add('hidden');
}"
class="text-sm cursor-pointer">
<button class="close-button text-sm cursor-pointer">
<i class="ri-close-line"></i>
</button>
</div>

66
views/transform/div-menu.js
View File

@@ -1,6 +1,5 @@
// Define CSS class names as constants, above the component class
const USER_PROVIDED_MENU_BUTTON_CLASS = "div-menu-button";
const TS_MENU_COMPONENT = "ts-menu";
const TS_POPUP = "ts-menu-popup";
const TS_LIST = "ts-menu-list";
const TS_MENU_LABEL = "menu-label";
@@ -8,18 +7,77 @@ const TS_PLACEHOLDER_MESSAGE = "ts-menu-placeholder-message";
const TS_LIST_ITEM = "ts-menu-list-item";
const TS_ITEM_ACTION = "ts-menu-item-action";
const TS_ITEM_IS_SELECTED = "ts-item-is-selected";
const TS_CONTENT_CLOSE_BUTTON = "ts-content-close-button";
const TAILWIND_HIDDEN_CLASS = "hidden";
const TS_MENU_BUTTON_STATE_DISABLED = "ts-menu-button--disabled";
const TS_MENU_LABEL_IN_MENU_STATE = "ts-menu-label--in-menu";
const TS_MENU_LABEL_DISPLAYED_STATE = "ts-menu-label--displayed";
const TS_TARGET_PLACEHOLDER_CLASS = "ts-target-placeholder"; // For the target area placeholder
const TARGET_ID_ATTRIBUTE = "target-id"; // Attribute to specify the target element ID
const DM_STAY_ATTRIBUTE = "dm-stay"; // Attribute to indicate if a div should stay in the menu
const DM_TITLE_ATTRIBUTE = "dm-title"; // Attribute to indicate if a div has a title
const DM_MENU_BUTTON_CLASS = "dm-menu-button"; // Class for the menu button
const DM_TARGET_ATTRIBUTE = "dm-target"; // Attribute to specify the target element ID for the redesigned menu
//
// Prereq: child divs must have prop data-value, and a label element
// the label element must have class "menu-label"
// The child divs will be moved to the target element when selected
// The target element must be specified by the attribute target-id on the custom element
// The menu button must have the class div-menu-button
//
export class DivMenuRedesigned extends HTMLElement {
constructor() {
super();
this.#reset();
}
#reset() {
this._cildren = [];
this._target = null;
this._button = null;
this._menu = null;
}
connectedCallback() {
this._cildren = Array.from(this.children)
.filter((node) => node.nodeType === Node.ELEMENT_NODE && !node.classList.contains(DM_MENU_BUTTON_CLASS))
.map((node) => {
return {
node: node,
stay: () => node.hasAttribute(DM_STAY_ATTRIBUTE) && node.getAttribute(DM_STAY_ATTRIBUTE) == "true",
hidden: () => node.classList.contains(TAILWIND_HIDDEN_CLASS),
name: () => {
const label = node.querySelector("label");
return label ? label.innerHTML : node.hasAttribute(DM_TITLE_ATTRIBUTE) ? node.getAttribute(DM_TITLE_ATTRIBUTE) : "";
},
};
});
this._target = document.getElementById(this.getAttribute(DM_TARGET_ATTRIBUTE));
if (!this._target) {
this._target = this;
}
this._button = this.querySelector(`.${DM_MENU_BUTTON_CLASS}`);
if (!this._button) {
console.error("DivManagerMenu needs a button element.");
return;
}
for (const child of this._cildren) {
parentNode.removeChild(child.node);
}
this._button.addEventListener("click", this._toggleMenu.bind(this));
this._button.classList.add("relative");
}
renderMenu() {
this._menu += `<ul class="${TS_P}">`;
}
renderNode() {}
}
export class DivMenu extends HTMLElement {
constructor() {
@@ -53,7 +111,7 @@ export class DivMenu extends HTMLElement {
const componentPopupHTML = `
<div class="${TS_POPUP}">
<ul class="${TS_LIST}">
<li class="${TS_PLACEHOLDER_MESSAGE}">All items are currently shown.</li>
<li class="${TS_PLACEHOLDER_MESSAGE}"></li>
</ul>
</div>
`;

4
views/transform/filter-list.js
View File

@@ -293,9 +293,7 @@ export class FilterList extends HTMLElement {
hx-swap="outerHTML show:none"
hx-select="main"
hx-target="main"
class="${FILTER_LIST_ITEM} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${
index % 2 === 0 ? "bg-stone-100" : "bg-stone-50"
}"
class="${FILTER_LIST_ITEM} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${index % 2 === 0 ? "bg-stone-100" : "bg-stone-50"}"
${this.#isActive(item) ? 'aria-current="page"' : ""}>
${this.ActiveDot(item)}
${this.getLinkText(item)}