diff --git a/README.md b/README.md index 8eb4fbf..6a34199 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,11 @@ # orfeo-django-toolkit -Un set de composants utile pour les applications web. \ No newline at end of file +Un set de composants utile pour les applications web. + +--- + +## Installation + +pip install git+https://git.booflix.fr/Orfeo/orfeo-django-toolkit.git + +--- diff --git a/docs/recipes/confimation_modla.md b/docs/recipes/confimation_modla.md new file mode 100644 index 0000000..462d630 --- /dev/null +++ b/docs/recipes/confimation_modla.md @@ -0,0 +1,21 @@ +## Initialisation de la modale + +Dans le fichier template de base, ajouter : + +- `{% include 'orfeo_generic_confirmation_modal.html' %}` +- `{% include 'orfeo_generic_confirmation_modal.html' %}` + +La modale générique peut maintenant être utilisé partout, avec des fonctions de cette forme : + +``` +async function deletePressed(){ + const confirmed = await confirmDialog.show({ + title: "Suppression", + message: "Supprimer cet élément ?" + }); + + if (confirmed) { + // suppression, fetch ect... + } +} +``` \ No newline at end of file diff --git a/pyproject.toml b/pyproject.toml index 86587d7..6413c86 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -11,6 +11,11 @@ requires-python = ">=3.13" dependencies = [ "Django>=5.2", ] +authors = [ + {name = "Charles Goffart"} +] +license = {text = "MIT"} + [tool.setuptools] package-dir = {"" = "src"} diff --git a/src/orfeo_django_toolkit/static/orfeo_django_toolkit/js/orfeo_generic_confirmation_modal.js b/src/orfeo_django_toolkit/static/orfeo_django_toolkit/js/orfeo_generic_confirmation_modal.js new file mode 100644 index 0000000..41eb402 --- /dev/null +++ b/src/orfeo_django_toolkit/static/orfeo_django_toolkit/js/orfeo_generic_confirmation_modal.js @@ -0,0 +1,63 @@ +class ConfirmDialog { + + constructor() { + this.modalElement = document.getElementById("orfeo_generic_confirmation_modal"); + this.modal = new bootstrap.Modal(this.modalElement); + + this.title = this.modalElement.querySelector(".modal-title"); + this.body = this.modalElement.querySelector(".modal-body"); + this.ok = document.getElementById("confirmModalOk"); + } + + show(options = {}) { + + this.title.textContent = options.title ?? "Confirmation"; + this.body.innerHTML = options.message ?? "Êtes-vous sûr ?"; + + this.ok.textContent = options.confirmText ?? "Confirmer"; + + this.ok.className = "btn"; + this.ok.classList.add(options.confirmClass ?? "btn-danger"); + + return new Promise(resolve => { + + const confirm = () => { + cleanup(); + this.modal.hide(); + resolve(true); + }; + + const cancel = () => { + cleanup(); + resolve(false); + }; + + const cleanup = () => { + this.ok.removeEventListener("click", confirm); + this.modalElement.removeEventListener("hidden.bs.modal", cancel); + }; + + this.ok.addEventListener("click", confirm, { once: true }); + this.modalElement.addEventListener("hidden.bs.modal", cancel, { once: true }); + + this.modal.show(); + }); + } +} + +const confirmDialog = new ConfirmDialog(); +/* exemple d'utilisation + +async function deletePressed(){ + const confirmed = await confirmDialog.show({ + title: "Suppression", + message: "Supprimer cet élément ?" + }); + + if (confirmed) { + // suppression, fetch ect... + } +} + + +*/ \ No newline at end of file diff --git a/src/orfeo_django_toolkit/templates/orfeo_django_toolkit/orfeo_generic_confirmation_modal.html b/src/orfeo_django_toolkit/templates/orfeo_django_toolkit/orfeo_generic_confirmation_modal.html new file mode 100644 index 0000000..d5306e9 --- /dev/null +++ b/src/orfeo_django_toolkit/templates/orfeo_django_toolkit/orfeo_generic_confirmation_modal.html @@ -0,0 +1,26 @@ + +
\ No newline at end of file