tomasz.sowa/winix
1
0
Fork 0
Code Issues 5 Pull Requests Releases Activity

add the easepick - a date and time picker

Browse Source
This commit is contained in:
Tomasz Sowa
2022-10-14 01:56:44 +02:00
parent 8edd0ef07a
commit f3d6494ae5
3 changed files with 78 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
winixd/html/index_head_adder.html
View File

@@ -20,6 +20,9 @@
[def? winix_load_litepicker false]
[def? winix_load_easepick false]
[def? winix_easepick_version "1.2.0"]
[def? winix_load_winixjs true]
@@ -485,7 +488,7 @@ cm.save()
[# in bundle.js there are all plugins, you can use litepicker.js to load the datepicker without plugins]
<script src="[doc_base_url_common]/litepicker/2.0.11/bundle.js"></script>
<script src="[doc_base_url_common]/litepicker/2.0.12/bundle.js"></script>
[if false]
[# can be inserted in this way: ]
@@ -493,13 +496,75 @@ cm.save()
const picker = new Litepicker(\{
element: document.getElementById('my-input-id'),
plugins: \['mobilefriendly'\],
lang: "{winix_html_lang_attr}"
lang: '{winix_html_lang_attr}'
\});
</script>
[end]
[end]
[if winix_load_easepick]
[# https://easepick.com/]
<script src="[doc_base_url_common]/easepick/[winix_easepick_version]/index.umd.min.js"></script>
[if false]
[# can be inserted in this way (only date picker with a lock plugin - remove lock plugin if you don't need it) ]
<script>
const picker = new easepick.create(\{
element: document.getElementById('my-input-id'),
date: "2000-10-10 00:00",
plugins: \['LockPlugin'\],
lang: '{winix_html_lang_attr}',
format: 'YYYY-MM-DD',
css: \[
'[doc_base_url_common]/easepick/[winix_easepick_version]/core.css',
'[doc_base_url_common]/easepick/[winix_easepick_version]/lock.css',
\],
LockPlugin: \{
minDate: "2000-10-10 00:00",
maxDate: "2000-10-11 00:00",
\},
\});
</script>
[# or this way (two panels date and time picker with a range selection plugin and cancel and apply buttons) ]
<script>
const picker = new easepick.create(\{
element: document.getElementById('op-input-[object.object_items.template_item.id]-[object.object_groups.group_index]-id'),
date: "2000-10-10 00:00",
grid: 2,
calendars: 2,
plugins: \['RangePlugin', 'LockPlugin', 'TimePlugin'\],
lang: '{winix_html_lang_attr}',
format: 'YYYY-MM-DD HH:mm',
autoApply: false,
locale: \{cancel:'{easepick_cancel_button}', apply: '{easepick_apply_button}'\},
css: \[
'[doc_base_url_common]/easepick/[winix_easepick_version]/core.css',
'[doc_base_url_common]/easepick/[winix_easepick_version]/range.css',
'[doc_base_url_common]/easepick/[winix_easepick_version]/lock.css',
'[doc_base_url_common]/easepick/[winix_easepick_version]/time.css',
\],
RangePlugin: \{
elementEnd: document.getElementById('op-input-[object.object_items.template_item.id]-[object.object_groups.group_index]-id-3'),
tooltip: true,
locale: \{ one: '{easepick_one_day}', other: '{easepick_more_days}' \},
\},
LockPlugin: \{
minDate: "2000-10-10 00:00",
maxDate: "2000-10-11 00:00",
\},
\});
</script>
[end]
[end]
[if false]
[# temporarily blocked]
[if winix_has_plugin "stats"]