Remplacement de flatPickr

This commit is contained in:
Fred Tempez 2023-02-17 10:59:25 +01:00
parent 29b825bfbb
commit f92653b202
20 changed files with 69 additions and 369 deletions

View File

@ -224,6 +224,7 @@ class template
* Crée un champ date
* @param string $nameId Nom et id du champ
* @param array $attributes Attributs ($key => $value)
* @param string type date time datetime-local month week
* @return string
*/
public static function date($nameId, array $attributes = [])
@ -241,8 +242,9 @@ class template
'label' => '',
'name' => $nameId,
'placeholder' => '',
'readonly' => true,
'value' => ''
'readonly' => false,
'value' => '',
'type'=> 'date',
], $attributes);
// Traduction de l'aide et de l'étiquette
$attributes['label'] = helper::translate($attributes['label']);
@ -272,21 +274,18 @@ class template
// Date visible
$html .= '<div class="inputDateManagerWrapper">';
$html .= sprintf(
'<input type="text" class="datepicker %s" value="%s" %s>',
'<input type="' . $attributes['type'] . '" class="datepicker %s" value="%s" %s>',
$attributes['class'],
$attributes['value'],
helper::sprintAttributes($attributes, ['class', 'value'])
);
$html .= self::button($attributes['id'] . 'Delete', [
'class' => 'inputDateDelete',
'value' => self::ico('cancel')
]);
$html .= '</div>';
// Fin du wrapper
$html .= '</div>';
// Retourne le html
return $html;
}
}
/**
* Crée un champ d'upload de fichier

View File

@ -127,7 +127,6 @@ class common
'normalize',
'lity',
'filemanager',
//'flatpickr', Appelé par les modules désactivé par défaut
// 'tinycolorpicker', Désactivé par défaut
// 'tinymce', Désactivé par défaut
// 'codemirror', // Désactivé par défaut
@ -2598,7 +2597,7 @@ class core extends common
$css .= 'span.mce-text{background-color: unset !important;}';
$css .= 'body,.row > div{font-size:' . $this->getData(['theme', 'text', 'fontSize']) . '}';
$css .= 'body{color:' . $this->getData(['theme', 'text', 'textColor']) . '}';
$css .= 'select,input[type=\'password\'],input[type=\'email\'],input[type=\'text\'],.inputFile,select,textarea{color:' . $this->getData(['theme', 'text', 'textColor']) . ';background-color:' . $this->getData(['theme', 'site', 'backgroundColor']) . ';}';
$css .= 'select,input[type=password],input[type=email],input[type=text],input[type=date],input[type=time],input[type=week],input[type=month],input[type=datetime-local],.inputFile,select,textarea{color:' . $this->getData(['theme', 'text', 'textColor']) . ';background-color:' . $this->getData(['theme', 'site', 'backgroundColor']) . ';}';
// spécifiques au module de blog
$css .= '.blogDate {color:' . $this->getData(['theme', 'text', 'textColor']) . ';}.blogPicture img{border:1px solid ' . $this->getData(['theme', 'text', 'textColor']) . '; box-shadow: 1px 1px 5px ' . $this->getData(['theme', 'text', 'textColor']) . ';}';
// Couleur fixée dans admin.css
@ -2624,13 +2623,13 @@ class core extends common
: '';
$css .= '#site{background-color:' . $this->getData(['theme', 'site', 'backgroundColor']) . ';border-radius:' . $this->getData(['theme', 'site', 'radius']) . ';box-shadow:' . $this->getData(['theme', 'site', 'shadow']) . ' #212223;}';
$colors = helper::colorVariants($this->getData(['theme', 'button', 'backgroundColor']));
$css .= '.speechBubble,.button,.button:hover,button[type=\'submit\'],.pagination a,.pagination a:hover,input[type=\'checkbox\']:checked + label:before,input[type=\'radio\']:checked + label:before,.helpContent{background-color:' . $colors['normal'] . ';color:' . $colors['text'] . '}';
$css .= '.speechBubble,.button,.button:hover,button[type=submit],.pagination a,.pagination a:hover,input[type=checkbox]:checked + label:before,input[type=radio]:checked + label:before,.helpContent{background-color:' . $colors['normal'] . ';color:' . $colors['text'] . '}';
$css .= '.helpButton span{color:' . $colors['normal'] . '}';
$css .= 'input[type=\'text\']:hover,input[type=\'password\']:hover,.inputFile:hover,select:hover,textarea:hover{border-color:' . $colors['normal'] . '}';
$css .= 'input[type=text]:hover,input[type=date]:hover,input[type=time\']:hover,input[type=week]:hover,input[type=month]:hover,input[type=datetime-local]:hover,input[type=password]:hover,.inputFile:hover,select:hover,textarea:hover{border-color:' . $colors['normal'] . '}';
$css .= '.speechBubble:before{border-color:' . $colors['normal'] . ' transparent transparent transparent}';
$css .= '.button:hover,button[type=\'submit\']:hover,.pagination a:hover,input[type=\'checkbox\']:not(:active):checked:hover + label:before,input[type=\'checkbox\']:active + label:before,input[type=\'radio\']:checked:hover + label:before,input[type=\'radio\']:not(:checked):active + label:before{background-color:' . $colors['darken'] . '}';
$css .= '.button:hover,button[type=submit]:hover,.pagination a:hover,input[type=checkbox]:not(:active):checked:hover + label:before,input[type=checkbox]:active + label:before,input[type=radio\:checked:hover + label:before,input[type=radio]:not(:checked):active + label:before{background-color:' . $colors['darken'] . '}';
$css .= '.helpButton span:hover{color:' . $colors['darken'] . '}';
$css .= '.button:active,button[type=\'submit\']:active,.pagination a:active{background-color:' . $colors['veryDarken'] . '}';
$css .= '.button:active,button[type=submit]:active,.pagination a:active{background-color:' . $colors['veryDarken'] . '}';
$colors = helper::colorVariants($this->getData(['theme', 'title', 'textColor']));
$css .= 'h1,h2,h3,h4,h5,h6,h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:' . $colors['normal'] . ';font-family:' . $fonts[$this->getData(['theme', 'title', 'font'])] . ';font-weight:' . $this->getData(['theme', 'title', 'fontWeight']) . ';text-transform:' . $this->getData(['theme', 'title', 'textTransform']) . '}';
$css .= 'h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{color:' . $colors['darken'] . '}';
@ -2818,7 +2817,7 @@ class core extends common
$css .= 'table thead tr, table thead tr .zwiico-help{ background-color:' . $colors['normal'] . '; color:' . $colors['text'] . ';}';
$css .= 'table thead th { color:' . $colors['text'] . ';}';
$colors = helper::colorVariants($this->getData(['admin', 'backgroundColorButton']));
$css .= 'input[type="checkbox"]:checked + label::before,.speechBubble{background-color:' . $colors['normal'] . ';color:' . $colors['text'] . ';}';
$css .= 'input[type=checkbox]:checked + label::before,.speechBubble{background-color:' . $colors['normal'] . ';color:' . $colors['text'] . ';}';
$css .= '.speechBubble::before {border-color:' . $colors['normal'] . ' transparent transparent transparent;}';
$css .= '.button {background-color:' . $colors['normal'] . ';color:' . $colors['text'] . ';}.button:hover {background-color:' . $colors['darken'] . ';color:' . $colors['text'] . ';}.button:active {background-color:' . $colors['veryDarken'] . ';color:' . $colors['text'] . ';}';
$colors = helper::colorVariants($this->getData(['admin', 'backgroundColorButtonGrey']));
@ -2831,7 +2830,7 @@ class core extends common
$css .= '.button.buttonGreen, button[type=submit] {background-color: ' . $colors['normal'] . ';color: ' . $colors['text'] . ';}.button.buttonGreen:hover, button[type=submit]:hover {background-color: ' . $colors['darken'] . ';color: ' . $colors['text'] . ';}.button.buttonGreen:active, button[type=submit]:active {background-color: ' . $colors['darken'] . ';color: ' . $colors['text'] . ';}';
$colors = helper::colorVariants($this->getData(['admin', 'backgroundBlockColor']));
$css .= '.buttonTab, .block {border: 1px solid ' . $this->getData(['admin', 'borderBlockColor']) . ';}.buttonTab, .block h4 {background-color: ' . $colors['normal'] . ';color:' . $colors['text'] . ';}';
$css .= 'table tr,input[type=email],input[type=text],input[type=password],select:not(#barSelectLanguage),select:not(#barSelectPage),textarea:not(.editorWysiwyg), textarea:not(.editorWysiwygComment),.inputFile{background-color: ' . $colors['normal'] . ';color:' . $colors['text'] . ';border: 1px solid ' . $this->getData(['admin', 'borderBlockColor']) . ';}';
$css .= 'table tr,input[type=email],input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local],input[type=text],input[type=password],select:not(#barSelectLanguage),select:not(#barSelectPage),textarea:not(.editorWysiwyg), textarea:not(.editorWysiwygComment),.inputFile{background-color: ' . $colors['normal'] . ';color:' . $colors['text'] . ';border: 1px solid ' . $this->getData(['admin', 'borderBlockColor']) . ';}';
// Bordure du contour TinyMCE
$css .= '.mce-tinymce{border: 1px solid ' . $this->getData(['admin', 'borderBlockColor']) . '!important;}';
// Enregistre la personnalisation

View File

@ -948,6 +948,10 @@ if ($this->getData(['core', 'dataVersion']) < 12300) {
unlink ('module/' . $value . '/i18n/gr_GR.json');
}
}
// Nettoyage de flatPickr
$this->removeDir('core\vendor\flatpickr');
// Mise à jour
$this->setData(['core', 'dataVersion', 12300]);
}

View File

@ -217,7 +217,7 @@ Signature dans les articles blog et news
.table tbody tr {
background: #F6F7F8;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
.table tbody tr:nth-child(2n + 2) {
@ -418,7 +418,7 @@ td>.col12 {
display: inline-block;
padding: 0 12px;
color: #FFF;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
#bar a:hover {
@ -617,7 +617,7 @@ nav li:hover ul {
nav a {
display: inherit;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
nav a:hover {
@ -892,7 +892,7 @@ footer #footerSocials span {
margin: 0 5px;
display: inline-block;
border-radius: 2px;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
footer #footerSocials .zwiico-facebook {
@ -973,7 +973,7 @@ footer #footerSocials .zwiico-github:hover {
margin: 16px auto;
text-align: left;
border-radius: 2px;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
.speechBubble:before {
@ -1001,7 +1001,7 @@ footer #footerSocials .zwiico-github:hover {
cursor: pointer;
display: none;
border-radius: 50%;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
#backToTop:hover {
@ -1041,7 +1041,7 @@ footer #footerSocials .zwiico-github:hover {
margin-left: 10px;
padding: 4px 8px;
display: inline-block;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
#cookieConsentConfirm:hover {
@ -1134,6 +1134,11 @@ footer #footerSocials .zwiico-github:hover {
input[type='email'],
input[type='text'],
input[type='password'],
input[type='date'],
input[type='datetime-local'],
input[type='time'],
input[type='month'],
input[type='week'],
.inputFile,
select,
textarea {
@ -1154,6 +1159,11 @@ select {
input[type='email']:hover,
input[type='text']:hover,
input[type='password']:hover,
input[type='date']:hover,
input[type='datetime-local']:hover,
input[type='time']:hover,
input[type='month']:hover,
input[type='week']:hover,
.inputFile:hover,
select:hover,
textarea:hover {
@ -1163,6 +1173,11 @@ textarea:hover {
input[type='email'].notice,
input[type='text'].notice,
input[type='password'].notice,
input[type='date'].notice,
input[type='datetime-local'].notice,
input[type='time'].notice,
input[type='month'].notice,
input[type='week'].notice,
.inputFile.notice,
select.notice,
textarea.notice {
@ -1172,7 +1187,12 @@ textarea.notice {
input[type='email'].notice:hover,
input[type='text'].notice:hover,
input[type='password'].notice:hover,
input[type='password'].notice:hover
input[type='date'].notice:hover,
input[type='datetime-local'].notice:hover,
input[type='time'].notice:hover,
input[type='month'].notice:hover,
input[type='week'].notice:hover,
.inputFile.notice:hover,
select.notice:hover,
textarea.notice:hover {
@ -1199,7 +1219,7 @@ button {
cursor: pointer;
font-family: inherit;
border-radius: 2px;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
textarea {
@ -1244,7 +1264,7 @@ label {
user-select: none;
cursor: pointer;
border-radius: 2px;
transition: background .3s ease-out;
transition: background-color .3s ease-out;
}
@ -1269,15 +1289,20 @@ label {
/* Upload de fichiers */
.inputFile,
.datepicker {
.inputFile {
margin: 0;
display: inline-block;
width: 88% !important;
}
/*
.datepicker {
margin: 0;
display: inline-block;
width: 100% !important;
}
*/
.inputFileDelete,
.inputDateDelete {
.inputFileDelete {
display: block;
width: 10%;
padding: 10px 0;
@ -1294,13 +1319,11 @@ label {
/* Empêche le débordement et les sauts de ligne */
.inputFileManagerWrapper,
.inputDateManagerWrapper {
.inputFileManagerWrapper {
display: inline;
}
.inputFileManagerWrapper>.inputFile,
.inputDateManagerWrapper>.inputFile {
.inputFileManagerWrapper>.inputFile {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

View File

@ -27,6 +27,7 @@
<div class="col6">
<?php echo template::date('translateEditDate', [
'label' => 'Date de publication',
'type' => 'datetime-local',
'value' => $this->getData(['languages', $this->getUrl(2), 'date'])
]); ?>
</div>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,10 +0,0 @@
[
"flatpickr.min.css",
"flatpickr.min.js",
"l10n/fr.js",
"l10n/es.js",
"l10n/it.js",
"l10n/pt.js",
"l10n/el.js",
"init.js"
]

View File

@ -1,14 +0,0 @@
/**
* Initialisation du sélecteur de date
*/
$(function() {
$(".datepicker").flatpickr({
altInput: true,
altFormat: "d/m/Y H:i",
enableTime: true,
time_24hr: true,
locale: "fr",
regional:"fr",
dateFormat: "Y-m-d H:i"
});
});

View File

@ -1,64 +0,0 @@
var fp = typeof window !== "undefined" && window.flatpickr !== undefined
? window.flatpickr
: {
l10ns: {},
};
export var Greek = {
weekdays: {
shorthand: ["Κυ", "Δε", "Τρ", "Τε", "Πέ", "Πα", "Σά"],
longhand: [
"Κυριακή",
"Δευτέρα",
"Τρίτη",
"Τετάρτη",
"Πέμπτη",
"Παρασκευή",
"Σάββατο",
],
},
months: {
shorthand: [
"Ιαν",
"Φεβ",
"Μάρ",
"Απρ",
"Μάι",
"Ιούν",
"Ιούλ",
"Αύγ",
"Σεπ",
"Οκτ",
"Νοέ",
"Δεκ",
],
longhand: [
"Ιανουάριος",
"Φεβρουάριος",
"Μάρτιος",
"Απρίλιος",
"Μάιος",
"Ιούνιος",
"Ιούλιος",
"Αύγουστος",
"Σεπτέμβριος",
"Οκτώβριος",
"Νοέμβριος",
"Δεκέμβριος",
],
},
firstDayOfWeek: 1,
ordinal: function () {
return "";
},
weekAbbreviation: "Εβδ",
rangeSeparator: " έως ",
scrollTitle: "Μετακυλήστε για προσαύξηση",
toggleTitle: "Κάντε κλικ για αλλαγή",
amPM: ["ΠΜ", "ΜΜ"],
yearAriaLabel: "χρόνος",
monthAriaLabel: "μήνας",
hourAriaLabel: "ώρα",
minuteAriaLabel: "λεπτό",
};
fp.l10ns.gr = Greek;
export default fp.l10ns;

View File

@ -1,57 +0,0 @@
var fp = typeof window !== "undefined" && window.flatpickr !== undefined
? window.flatpickr
: {
l10ns: {},
};
export var Spanish = {
weekdays: {
shorthand: ["Dom", "Lun", "Mar", "Mié", "Jue", "Vie", "Sáb"],
longhand: [
"Domingo",
"Lunes",
"Martes",
"Miércoles",
"Jueves",
"Viernes",
"Sábado",
],
},
months: {
shorthand: [
"Ene",
"Feb",
"Mar",
"Abr",
"May",
"Jun",
"Jul",
"Ago",
"Sep",
"Oct",
"Nov",
"Dic",
],
longhand: [
"Enero",
"Febrero",
"Marzo",
"Abril",
"Mayo",
"Junio",
"Julio",
"Agosto",
"Septiembre",
"Octubre",
"Noviembre",
"Diciembre",
],
},
ordinal: function () {
return "º";
},
firstDayOfWeek: 1,
rangeSeparator: " a ",
time_24hr: true,
};
fp.l10ns.es = Spanish;
export default fp.l10ns;

View File

@ -1,75 +0,0 @@
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
typeof define === 'function' && define.amd ? define(['exports'], factory) :
(global = global || self, factory(global.fr = {}));
}(this, function (exports) { 'use strict';
var fp = typeof window !== "undefined" && window.flatpickr !== undefined
? window.flatpickr
: {
l10ns: {}
};
var French = {
firstDayOfWeek: 1,
weekdays: {
shorthand: ["dim", "lun", "mar", "mer", "jeu", "ven", "sam"],
longhand: [
"dimanche",
"lundi",
"mardi",
"mercredi",
"jeudi",
"vendredi",
"samedi",
]
},
months: {
shorthand: [
"janv",
"févr",
"mars",
"avr",
"mai",
"juin",
"juil",
"août",
"sept",
"oct",
"nov",
"déc",
],
longhand: [
"janvier",
"février",
"mars",
"avril",
"mai",
"juin",
"juillet",
"août",
"septembre",
"octobre",
"novembre",
"décembre",
]
},
ordinal: function (nth) {
if (nth > 1)
return "";
return "er";
},
rangeSeparator: " au ",
weekAbbreviation: "Sem",
scrollTitle: "Défiler pour augmenter la valeur",
toggleTitle: "Cliquer pour basculer",
time_24hr: true
};
fp.l10ns.fr = French;
var fr = fp.l10ns;
exports.French = French;
exports.default = fr;
Object.defineProperty(exports, '__esModule', { value: true });
}));

View File

@ -1,58 +0,0 @@
var fp = typeof window !== "undefined" && window.flatpickr !== undefined
? window.flatpickr
: {
l10ns: {},
};
export var Italian = {
weekdays: {
shorthand: ["Dom", "Lun", "Mar", "Mer", "Gio", "Ven", "Sab"],
longhand: [
"Domenica",
"Lunedì",
"Martedì",
"Mercoledì",
"Giovedì",
"Venerdì",
"Sabato",
],
},
months: {
shorthand: [
"Gen",
"Feb",
"Mar",
"Apr",
"Mag",
"Giu",
"Lug",
"Ago",
"Set",
"Ott",
"Nov",
"Dic",
],
longhand: [
"Gennaio",
"Febbraio",
"Marzo",
"Aprile",
"Maggio",
"Giugno",
"Luglio",
"Agosto",
"Settembre",
"Ottobre",
"Novembre",
"Dicembre",
],
},
firstDayOfWeek: 1,
ordinal: function () { return "°"; },
rangeSeparator: " al ",
weekAbbreviation: "Se",
scrollTitle: "Scrolla per aumentare",
toggleTitle: "Clicca per cambiare",
time_24hr: true,
};
fp.l10ns.it = Italian;
export default fp.l10ns;

View File

@ -1,53 +0,0 @@
var fp = typeof window !== "undefined" && window.flatpickr !== undefined
? window.flatpickr
: {
l10ns: {},
};
export var Portuguese = {
weekdays: {
shorthand: ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sáb"],
longhand: [
"Domingo",
"Segunda-feira",
"Terça-feira",
"Quarta-feira",
"Quinta-feira",
"Sexta-feira",
"Sábado",
],
},
months: {
shorthand: [
"Jan",
"Fev",
"Mar",
"Abr",
"Mai",
"Jun",
"Jul",
"Ago",
"Set",
"Out",
"Nov",
"Dez",
],
longhand: [
"Janeiro",
"Fevereiro",
"Março",
"Abril",
"Maio",
"Junho",
"Julho",
"Agosto",
"Setembro",
"Outubro",
"Novembro",
"Dezembro",
],
},
rangeSeparator: " até ",
time_24hr: true,
};
fp.l10ns.pt = Portuguese;
export default fp.l10ns;

View File

@ -89,6 +89,7 @@
<?php echo template::date('blogAddPublishedOn', [
'help' => 'L\'article n\'est visible qu\'après la date de publication prévue.',
'label' => 'Date de publication',
'type' => 'datetime-local',
'value' => time()
]); ?>
</div>

View File

@ -94,6 +94,7 @@
<div class="col4">
<?php echo template::date('blogEditPublishedOn', [
'help' => 'L\'article n\'est visible qu\'après la date de publication prévue.',
'type' => 'datetime-local',
'label' => 'Publication',
'value' => $this->getData(['module', $this->getUrl(0), 'posts', $this->getUrl(2), 'publishedOn'])
]); ?>

View File

@ -12,9 +12,10 @@
/**
* Paramétrage du format de date
*/
$(function() {
$(".datepicker").flatpickr({
enableTime: false,
});
});
*/

View File

@ -35,6 +35,7 @@
<?php echo template::date('formInput[' . $index . ']', [
'id' => 'formInput_' . $index,
'label' => $input['name'],
'type' => 'date',
'vendor' => 'flatpickr'
]); ?>
<?php elseif ($input['type'] === $module::TYPE_CHECKBOX): ?>

View File

@ -51,6 +51,7 @@
<?php echo template::date('newsAddPublishedOn', [
'help' => 'La news est consultable à partir du moment ou la date de publication est passée.',
'label' => 'Date de publication',
'type' => 'datetime-local',
'value' => time()
]); ?>
</div>
@ -58,6 +59,7 @@
<?php echo template::date('newsAddPublishedOff', [
'help' => 'La news est consultable Jusqu\'à cette date si elle est spécifiée. Pour annuler la date de dépublication, sélectionnez une date antérieure à la publication.',
'label' => 'Date de dépublication',
'type' => 'datetime-local',
'value' => $this->getData(['module', $this->getUrl(0),'posts', $this->getUrl(2), 'publishedOff'])
]); ?>
</div>

View File

@ -53,6 +53,7 @@
<?php echo template::date('newsEditPublishedOn', [
'help' => 'La news est consultable à partir du moment ou la date de publication est passée.',
'label' => 'Date de publication',
'type' => 'datetime-local',
'value' => $this->getData(['module', $this->getUrl(0),'posts', $this->getUrl(2), 'publishedOn'])
]); ?>
</div>
@ -60,6 +61,7 @@
<?php echo template::date('newsEditPublishedOff', [
'help' => 'La news est consultable Jusqu\'à cette date si elle est spécifiée. Pour annuler la date de dépublication, sélectionnez une date antérieure à la publication.',
'label' => 'Date de dépublication',
'type' => 'datetime-local',
'value' => $this->getData(['module', $this->getUrl(0),'posts', $this->getUrl(2), 'publishedOff'])
]); ?>
</div>