nicolo/scaenae
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

Add modal controller

Browse Source
This commit is contained in:
Nicolò P.
2026-05-21 09:36:17 +02:00
parent 4dccd58bf3
commit c837a6e55f
4 changed files with 43 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
js/controllers/menu_controller.js
View File

@@ -249,36 +249,4 @@ export default class extends Controller {
domainList.innerHTML += domainItem;
}
}
/**
*
* @param {Event} event
*/
showSemanticModal(event) {
console.debug('I have been triggered...');
const modal = document.querySelector('#semanticModal');
const title = modal.querySelector('.modal-title');
// Clear any existing content first
title.innerHTML = '';
title.innerHTML = event.content?.title;
const body = modal.querySelector('.modal-body');
body.innerHTML = '';
const contentType = event.content?.type;
const content = document.createElement(contentType);
if (contentType === 'img') {
content.src = event.content?.imgSrc;
content.classList.add('img-fluid');
}
const description = document.createElement('p');
description.textContent = event.content?.description;
description.classList.add('py-3', 'my-2', 'fst-italic');
body.appendChild(content);
body.appendChild(description);
bootstrap.Modal.getOrCreateInstance(modal).show();
}
}

39
js/controllers/modal_controller.js Normal file
View File

@@ -0,0 +1,39 @@
import { Controller } from "@hotwired/stimulus";
export default class extends Controller {
static targets = ['modal'];
connect() {
console.log('#modal controller connected');
}
/**
*
* @param {Event} event
*/
showSemanticModal(event) {
const modal = this.modalTarget;
const title = modal.querySelector('.modal-title');
// Clear any existing content first
title.innerHTML = '';
title.innerHTML = event.content?.title;
const body = modal.querySelector('.modal-body');
body.innerHTML = '';
const contentType = event.content?.type;
const content = document.createElement(contentType);
if (contentType === 'img') {
content.src = event.content?.imgSrc;
content.classList.add('img-fluid');
}
const description = document.createElement('p');
description.textContent = event.content?.description;
description.classList.add('py-3', 'my-2', 'fst-italic');
body.appendChild(content);
body.appendChild(description);
bootstrap.Modal.getOrCreateInstance(modal).show();
}
}

2
js/utils/stimulus.js
View File

@@ -3,6 +3,7 @@ import SettingController from '../controllers/settings_controller.js';
import ToolbarController from '../controllers/toolbar_controller.js';
import ClipperController from '../controllers/clipper_controller.js';
import MenuController from '../controllers/menu_controller.js';
import ModalController from '../controllers/modal_controller.js';
/**
* Initialize Stimulus controllers
@@ -13,4 +14,5 @@ export function initStimulus() {
Stimulus.register("toolbar", ToolbarController);
Stimulus.register("clipper", ClipperController);
Stimulus.register("menu", MenuController);
Stimulus.register("modal", ModalController);
}