orasche
78af83d2e3
thumbnail of the actual image (hero background, intro image, insights cover), key copy in the summary line, full details expanded; card and intro-paragraph previews are wrapped in the same mechanism - New SubmarketPluginPreview for vitec_usecaselist / vitec_productfeature / vitec_productlist: instead of bare standard boxes they now list the selected story titles (flagging stories that still lack a quote), the featured product and the hand-picked products in order - Container-style collapse for whole page-module COLUMNS: a chevron at the right of every column header folds a section down to its title row, state kept per page and colPos in localStorage - the slot view of a sub-market page folds to six slim bands - Previews sit under the page module's pointer-events lock and its click-to-edit layer: pointer events are re-enabled inside the collapse markup and the toggle runs on pointerdown in the capture phase - Two more v14 removals fixed on the way, both latent in the OLDER preview classes too (Usecaseshow, Modelcard would have crashed the page module): GridColumnItem::getRecord() now returns a Domain\Record object, and StandaloneView is gone - previews normalize the record via a shared helper and render through the ViewFactory
81 lines
3.2 KiB
JavaScript
81 lines
3.2 KiB
JavaScript
/**
|
|
* Collapse toggle for .vitec-collapse previews in the page module.
|
|
*
|
|
* Two defenses against the page module's own interaction layer:
|
|
* - pointerdown in the CAPTURE phase toggles (fires before any click
|
|
* logic TYPO3 registered earlier),
|
|
* - the subsequent click on a summary is swallowed so it cannot trigger
|
|
* element editing.
|
|
* Requires pointer-events: auto on the collapse markup (see CSS) - the
|
|
* module disables pointer events on preview content by default.
|
|
*/
|
|
(function () {
|
|
function summaryOf(event) {
|
|
return event.target instanceof Element
|
|
? event.target.closest('details.vitec-collapse > summary')
|
|
: null;
|
|
}
|
|
document.addEventListener('pointerdown', function (event) {
|
|
const summary = summaryOf(event);
|
|
if (!summary) {
|
|
return;
|
|
}
|
|
event.preventDefault();
|
|
event.stopImmediatePropagation();
|
|
const details = summary.parentElement;
|
|
details.open = !details.open;
|
|
}, true);
|
|
document.addEventListener('click', function (event) {
|
|
if (summaryOf(event)) {
|
|
event.preventDefault();
|
|
event.stopImmediatePropagation();
|
|
}
|
|
}, true);
|
|
})();
|
|
|
|
/**
|
|
* Container-style collapse for whole page-module COLUMNS (the sub-market
|
|
* section slots and any other backend layout): a chevron button at the
|
|
* right of each column header folds the column down to its title row.
|
|
* State is remembered per page + colPos in localStorage.
|
|
*/
|
|
(function () {
|
|
function storageKey(colPos) {
|
|
const pageId = new URLSearchParams(window.location.search).get('id') || '0';
|
|
return 'vitecColCollapse_' + pageId + '_' + colPos;
|
|
}
|
|
function apply(column, collapsed, button) {
|
|
column.classList.toggle('vitec-col-collapsed', collapsed);
|
|
button.textContent = collapsed ? '▴' : '▾';
|
|
button.title = collapsed ? 'Section ausklappen' : 'Section einklappen';
|
|
}
|
|
function init() {
|
|
document.querySelectorAll('td.t3-page-column[data-colpos]').forEach(function (column) {
|
|
const header = column.querySelector('.t3-page-column-header');
|
|
if (!header || header.querySelector('.vitec-col-toggle')) {
|
|
return;
|
|
}
|
|
const colPos = column.dataset.colpos;
|
|
const button = document.createElement('button');
|
|
button.type = 'button';
|
|
button.className = 'vitec-col-toggle';
|
|
let collapsed = false;
|
|
try { collapsed = localStorage.getItem(storageKey(colPos)) === '1'; } catch (e) { /* egal */ }
|
|
apply(column, collapsed, button);
|
|
button.addEventListener('click', function (event) {
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
const nowCollapsed = !column.classList.contains('vitec-col-collapsed');
|
|
apply(column, nowCollapsed, button);
|
|
try { localStorage.setItem(storageKey(colPos), nowCollapsed ? '1' : '0'); } catch (e) { /* egal */ }
|
|
});
|
|
header.appendChild(button);
|
|
});
|
|
}
|
|
if (document.readyState === 'loading') {
|
|
document.addEventListener('DOMContentLoaded', init);
|
|
} else {
|
|
init();
|
|
}
|
|
})();
|