feat: ajout le script lancement de modalbox present dans l'ancienne
version et dans le starter, avec une option de config pour le charger
This commit is contained in:
parent
45599117b1
commit
fc61829f75
4 changed files with 51 additions and 11 deletions
|
@ -9,24 +9,20 @@
|
||||||
<div>
|
<div>
|
||||||
#ACTION_FORMULAIRE
|
#ACTION_FORMULAIRE
|
||||||
<div class="editer_groupe">
|
<div class="editer_groupe">
|
||||||
#SET{name,version_js}
|
#SET{name,charger_modalbox}
|
||||||
#SET{erreurs,#ENV**{erreurs}|table_valeur{#GET{name}}}
|
#SET{erreurs,#ENV**{erreurs}|table_valeur{#GET{name}}}
|
||||||
#SET{obli,"obligatoire"}
|
|
||||||
<div class="editer editer_[(#GET{name})][ (#GET{obli})][ (#GET{erreurs}|oui)erreur]">
|
<div class="editer editer_[(#GET{name})][ (#GET{obli})][ (#GET{erreurs}|oui)erreur]">
|
||||||
|
<label>Charger js</label>
|
||||||
<div class="choix">
|
<div class="choix">
|
||||||
<input type="radio" class="radio" name="#GET{name}" value="" id="#GET{name}_non"[ (#ENV{#GET{name}}|=={''}|?{checked="checked"})] >
|
<input type="checkbox" class="checkbox" name="#GET{name}" id="#GET{name}_1" value="oui" [(#ENV{#GET{name}}|=={oui}|oui) checked] >
|
||||||
<label for="#GET{name}_non">js minifié</label>
|
<label for="#GET{name}_1">Oui</label>
|
||||||
<p class="explication">js/vue.min.js - 92ko (sans le debug)</p>
|
<p class="explication">Si un lien à la classe .modalbox, appelle un sq dans content</p>
|
||||||
</div>
|
|
||||||
<div class="choix">
|
|
||||||
<input type="radio" class="radio" name="#GET{name}" value="dev" id="#GET{name}_oui"[ (#ENV{#GET{name}}|=={dev}|?{checked="checked"})] >
|
|
||||||
<label for="#GET{name}_oui">Dev</label>
|
|
||||||
<p class="explication">js/vue.js - 276ko</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<input type="hidden" name="_meta_casier" value="gamutable" />
|
<input type="hidden" name="_meta_casier" value="gamutable" />
|
||||||
<p class="boutons"><span class="image_loading"> </span><input type="submit" class="submit" value="<:bouton_enregistrer:>" /></p>
|
<p class="boutons"><span class="image_loading"> </span><input type="submit" class="submit" value="<:bouton_enregistrer:>" /></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -93,4 +93,10 @@
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var nomBlocAjaxReload = "";
|
var nomBlocAjaxReload = "";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script src="[(#CHEMIN{js/localforage.min.js}|timestamp)]" type="text/javascript"></script>
|
<script src="[(#CHEMIN{js/localforage.min.js}|timestamp)]" type="text/javascript"></script>
|
||||||
|
|
||||||
|
[(#CONFIG{gamutable/charger_modalbox}|=={oui}|oui)
|
||||||
|
<script src="[(#CHEMIN{js/gamubox.js}|timestamp)]" type="text/javascript"></script>
|
||||||
|
]
|
||||||
|
|
||||||
|
|
38
js/gamubox.js
Normal file
38
js/gamubox.js
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
/*
|
||||||
|
* Pour parametrer la largeur :
|
||||||
|
* Indiquer le data-width sur le lien (exmeple data-width= "90")
|
||||||
|
* Imposer le style sur le premier bloc englobant dans la madiabox (style="width: [(#ENV{largeur})])
|
||||||
|
*/
|
||||||
|
jQuery(function () {
|
||||||
|
modalbox();
|
||||||
|
|
||||||
|
function modalbox() {
|
||||||
|
$('body').on('click', '.modalbox', function (e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
e.preventDefault();
|
||||||
|
let url = $(this).attr('href');
|
||||||
|
url += '&var_zajax=content';
|
||||||
|
let data = {};
|
||||||
|
let minHeight = $(this).data('minheight');
|
||||||
|
let minWidth = $(this).data('minwidth');
|
||||||
|
if (minHeight !== undefined) {
|
||||||
|
data.minHeight = minHeight;
|
||||||
|
}
|
||||||
|
if (minWidth !== undefined) {
|
||||||
|
data.minWidth = minWidth;
|
||||||
|
}
|
||||||
|
let width = $(this).data('width');
|
||||||
|
if (width !== undefined) {
|
||||||
|
data.width = width;
|
||||||
|
let valeur_reduite = ($(window).width() * width) / 100;
|
||||||
|
url += '&largeur=' + valeur_reduite + 'px';
|
||||||
|
}
|
||||||
|
data.onShow = () => {
|
||||||
|
if (typeof charger_require !== undefined) {
|
||||||
|
charger_require();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
$.modalbox(url, data);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
|
@ -1,7 +1,7 @@
|
||||||
<paquet
|
<paquet
|
||||||
prefix="gamutable"
|
prefix="gamutable"
|
||||||
categorie="outil"
|
categorie="outil"
|
||||||
version="4.1.0"
|
version="4.1.1"
|
||||||
etat="test"
|
etat="test"
|
||||||
compatibilite="[3.2.0-dev;4.1.*]"
|
compatibilite="[3.2.0-dev;4.1.*]"
|
||||||
logo="prive/themes/spip/images/gamutable-xx.svg"
|
logo="prive/themes/spip/images/gamutable-xx.svg"
|
||||||
|
|
Loading…
Add table
Reference in a new issue