diff --git a/create_date_poll.php b/create_date_poll.php index 12109a4..eb0b3bc 100644 --- a/create_date_poll.php +++ b/create_date_poll.php @@ -79,22 +79,21 @@ switch ($step) { // Step 2/4 : Select dates of the poll // Prefill form->choices - foreach ($form->getChoices() as $c) { - /** @var Choice $c */ - $count = 3 - count($c->getSlots()); - for ($i = 0; $i < $count; $i++) { - $c->addSlot(''); - } - } + // foreach ($form->getChoices() as $c) { + // /** @var Choice $c */ + // $count = 2 - count($c->getSlots()); + // for ($i = 0; $i < $count; $i++) { + // $c->addSlot(''); + // } + // } - $count = 3 - count($form->getChoices()); - for ($i = 0; $i < $count; $i++) { - $c = new Choice(''); - $c->addSlot(''); - $c->addSlot(''); - $c->addSlot(''); - $form->addChoice($c); - } + // $count = 2 - count($form->getChoices()); + // for ($i = 0; $i < $count; $i++) { + // $c = new Choice(''); + // $c->addSlot(''); + // $c->addSlot(''); + // $form->addChoice($c); + // } $_SESSION['form'] = serialize($form); @@ -145,7 +144,7 @@ switch ($step) { if (!empty($day)) { // Add choice to Form data - $date = DateTime::createFromFormat(__('Date', 'Y-m-d'), $_POST['days'][$i])->setTime(0, 0, 0); + $date = DateTime::createFromFormat('Y-m-d', $_POST['days'][$i])->setTime(0, 0, 0); $time = (string) $date->getTimestamp(); $choice = new Choice($time); $form->addChoice($choice); @@ -177,7 +176,7 @@ switch ($step) { } $summary .= ''; - $end_date_str = utf8_encode(strftime($date_format['txt_date'], $max_expiry_time)); // textual date + $end_date_str = utf8_encode(strftime('%Y-%m-%d', $max_expiry_time)); // textual date $_SESSION['form'] = serialize($form); diff --git a/js/app/adminstuds.js b/js/app/adminstuds.js index cd1e988..9985c73 100644 --- a/js/app/adminstuds.js +++ b/js/app/adminstuds.js @@ -12,6 +12,7 @@ $(document).ready(function() { * @param adminPolls */ function setAdminPolls(adminPolls) { + localStorage.removeItem('current_poll'); localStorage.setItem('admin_polls', JSON.stringify(adminPolls)); } diff --git a/js/app/date_poll.js b/js/app/date_poll.js index cb7535f..e7f7f7b 100644 --- a/js/app/date_poll.js +++ b/js/app/date_poll.js @@ -60,28 +60,28 @@ $(document).ready(function () { - /** - * Parse a string date - * @param dateStr The string date - * @param format The format PHP style (allowed: %Y, %m and %d) - */ - var parseDate = function (dateStr, format) { - var dtsplit = dateStr.split(/[\/ .:-]/); - var dfsplit = format.split(/[\/ .:-]/); + // /** + // * Parse a string date + // * @param dateStr The string date + // * @param format The format PHP style (allowed: %Y, %m and %d) + // */ + // var parseDate = function (dateStr, format) { + // var dtsplit = dateStr.split(/[\/ .:-]/); + // var dfsplit = format.split(/[\/ .:-]/); - if (dfsplit.length != dtsplit.length) { - return null; - } + // if (dfsplit.length != dtsplit.length) { + // return null; + // } - // creates assoc array for date - var df = []; - for (var dc = 0; dc < dtsplit.length; dc++) { - df[dfsplit[dc]] = dtsplit[dc]; - } + // // creates assoc array for date + // var df = []; + // for (var dc = 0; dc < dtsplit.length; dc++) { + // df[dfsplit[dc]] = dtsplit[dc]; + // } - // Build date - return new Date(parseInt(df['%Y']), parseInt(df['%m']) - 1, parseInt(df['%d']), 0, 0, 0, 0); - }; + // // Build date + // return new Date(parseInt(df['%Y']), parseInt(df['%m']) - 1, parseInt(df['%d']), 0, 0, 0, 0); + // }; var formatDate = function (date, format) { return format @@ -97,7 +97,7 @@ $(document).ready(function () { return parseInt(/^d([0-9]+)-h[0-9]+$/.exec($(last_day).find('.hours').filter(':first').attr('id'))[1]) } - function newDateFields(dateStr) { + function newDateFields(date) { var last_day = $selected_days.find('fieldset').filter(':last'); var last_day_title = last_day.find('legend input').attr('title'); var new_day_number = getLastDayNumber(last_day) + 1; @@ -115,7 +115,7 @@ $(document).ready(function () { last_day .after('
' + new_day_html + '
') - .next().find('legend input').val(dateStr); + .next().find('legend input').val(date.toISOString()); $('#day' + (new_day_number)).focus(); updateButtonState(); } @@ -128,12 +128,12 @@ $(document).ready(function () { } } - var useFirstEmptyDateField = function (dateStr) { + var useFirstEmptyDateField = function (date) { var used = false; $selected_days.find('fieldset legend input').each(function () { if (!used) { if ($(this).val() == '') { - $(this).val(dateStr); + $(this).val(date.toISOString()); used = true; } } @@ -280,24 +280,25 @@ $(document).ready(function () { $('#interval_add').on('click', function (ev) { var startDateField = $('#range_start'); var endDateField = $('#range_end'); - var startDate = parseDate(startDateField.val(), window.date_formats.DATE); - var endDate = parseDate(endDateField.val(), window.date_formats.DATE); + var startDate = dateFns.parse(startDateField.val()); + var endDate = dateFns.parse(endDateField.val()); // Clear error classes startDateField.parent().removeClass('has-error'); endDateField.parent().removeClass('has-error'); - var maxDates = 123; // 123 = 4 months - var tooMuchDates = endDate - startDate > maxDates * 86400 * 1000; + var maxDate = dateFns.addMonths(startDate, 4); + var tooMuchDates = dateFns.isAfter(endDate, maxDate); if (startDate != null && endDate != null && !tooMuchDates) { - if (startDate <= endDate) { - while (startDate <= endDate) { - var dateStr = formatDate(startDate, window.date_formats.DATE); - if (!useFirstEmptyDateField(dateStr)) { - newDateFields(dateStr); + if (dateFns.isBefore(startDate, endDate)) { + console.log('ready for while', dateFns.isBefore(startDate, endDate)); + while (dateFns.isBefore(startDate, endDate)) { + // var dateStr = formatDate(startDate, window.date_formats.DATE); + if (!useFirstEmptyDateField(startDate)) { + newDateFields(startDate); } - startDate.setDate(startDate.getDate() + 1); + startDate = dateFns.addDays(startDate, 1); } // Hide modal diff --git a/js/app/framadatepicker.js b/js/app/framadatepicker.js index 10847c6..24c8ea5 100644 --- a/js/app/framadatepicker.js +++ b/js/app/framadatepicker.js @@ -16,36 +16,36 @@ * Auteurs de Framadate/OpenSondage : Framasoft (https://github.com/framasoft) */ $(document).ready(function () { - var init_datepicker = function () { - $('.input-group.date').datepicker({ - format: window.date_formats.DATEPICKER || "dd/mm/yyyy", - todayBtn: "linked", - orientation: "top left", - autoclose: true, - language: lang, - todayHighlight: true, - beforeShowDay: function (date) { - // Retrieve selected dates from text fields - var selected_days = []; - $('#selected-days').find('input[id^="day"]').each(function () { - if ($(this).val() != '') { - selected_days.push($(this).val()); - } - }); + // var init_datepicker = function () { + // $('.input-group.date').datepicker({ + // format: 'Y-m-d', + // todayBtn: "linked", + // orientation: "top left", + // autoclose: true, + // language: lang, + // todayHighlight: true, + // beforeShowDay: function (date) { + // // Retrieve selected dates from text fields + // var selected_days = []; + // $('#selected-days').find('input[id^="day"]').each(function () { + // if ($(this).val() != '') { + // selected_days.push($(this).val()); + // } + // }); - // Disable selected dates in DatePicker - for (var i = 0; i < selected_days.length; i++) { - var selected_date = selected_days[i].split('/'); + // // Disable selected dates in DatePicker + // for (var i = 0; i < selected_days.length; i++) { + // var selected_date = selected_days[i].split('/'); - if (date.getFullYear() == selected_date[2] && (date.getMonth() + 1) == selected_date[1] && date.getDate() == selected_date[0]) { - return { - classes: 'disabled selected' - }; - } - } - } - }); - }; + // if (date.getFullYear() == selected_date[2] && (date.getMonth() + 1) == selected_date[1] && date.getDate() == selected_date[0]) { + // return { + // classes: 'disabled selected' + // }; + // } + // } + // } + // }); + // }; $(document).on('click', '.input-group.date .input-group-addon, .input-group.date input', function () { // Re-init datepicker config before displaying @@ -95,4 +95,4 @@ $(document).ready(function () { } }); -}); \ No newline at end of file +}); diff --git a/js/app/new_date_poll.js b/js/app/new_date_poll.js new file mode 100644 index 0000000..f1fc69e --- /dev/null +++ b/js/app/new_date_poll.js @@ -0,0 +1,175 @@ +class Slot { + constructor(text) { + this.text = text || ''; + } +} + +class Choice { + constructor(day, slots) { + this.day = day || ''; + this.slots = slots || [new Slot(), new Slot()]; + } +} + +$(document).ready(function () { + var app = new Vue({ + delimiters: ['%%', '%%'], + el: '#date-poll', + template: '#date-poll-component', + data() { + return { + choices: JSON.parse(localStorage.getItem('current_poll')) || [new Choice(), new Choice()], + interval: { + start: null, + end: null, + }, + modal_open: false, + }; + }, + created() { + console.log('created choices', this.choices); + }, + mounted() { + console.log('mounted', this.choices); + }, + computed: { + twoDate: function() { + return this.choices.filter(choice => !this.isChoiceCompletelyEmpty(choice)).length <= 2; + }, + noSlots: function() { + console.log(this.choiceSlotsEmpty(this.choices[0])); + return this.choiceSlotsEmpty(this.choices[0]); + } + }, + watch: { + choices: { + handler(newList, oldList) { + console.log('choices changed'); + let j = 0; + // while (j < this.choices.length) { + // if (this.choices.length > 2) { + // if (this.choices[j].day === '' && this.choices.length > (j + 1) && this.choices[j+1].day !== '') { + // this.choices.splice(j, 1); + // console.log('removing empty choice before value', this.choices); + // break; + // } + // if (this.choices[j].day === '' && this.choices.length > (j + 1) && this.choices[j+1].day === '') { + // this.choices.splice(j + 1, 1); + // console.log('removing empty choice before another empty choice', this.choices); + // break; + // } + // } + // if (this.choices[j].text !== '' && this.choices.length === (j + 1)) { + // console.log('adding extra empty choice'); + // this.choices.push(new Choice()); + // break; + // } + // j = j+1; + // } + + if (this.choices.length >= 2 && this.choices[this.choices.length - 1].day !== '') { + const filteredList = this.choices.filter(choice => !this.isChoiceCompletelyEmpty(choice)); + console.log('filtered list', filteredList); + if (filteredList.length >= 2) { + this.choices = filteredList; + this.choices.push(new Choice()); + console.log('adding extra empty choice'); + } + } + this.choices.forEach((choice) => { + let i = 0; + while (i < choice.slots.length) { + console.log('processing slot ', i); + if (choice.slots.length > 2) { + if (choice.slots[i].text === '' && choice.slots.length > (i + 1) && choice.slots[i+1].text !== '') { + choice.slots.splice(i, 1); + console.log('removing empty slot before value', choice.slots); + break; + } + if (choice.slots[i].text === '' && choice.slots.length > (i + 1) && choice.slots[i+1].text === '') { + choice.slots.splice(i + 1, 1); + console.log('removing empty slot before another empty slot', choice.slots); + break; + } + } + if (choice.slots[i].text !== '' && choice.slots.length === (i + 1)) { + console.log('adding extra empty slot'); + choice.slots.push(new Slot()); + break; + } + i = i+1; + } + // if (choice.slots.length >= 2 && choice.slots[choice.slots.length - 1].text !== '') { + // console.log('choice slots before', choice.slots); + // choice.slots = choice.slots.filter(slot => slot.text !== ''); + // console.log('choice slots after', choice.slots); + // choice.slots.push(new Slot()); + // } + console.log('slots nb', choice.slots.length); + }); + }, + deep: true, + }, + }, + methods: { + addChoice() { + this.choices.push(new Choice()); + }, + removeChoice(index) { + this.choices.splice(index, 1); + if (this.choices.length < 2) { + this.choices.push(new Choice()); + } + }, + removeLastChoice() { + this.removeChoice(-1); + }, + addSlot(choice) { + choice.slots = [...choice.slots, '']; + }, + removeLastSlot(choice) { + choice.slots = choice.slots.slice(0, -1); + }, + removeAllDays() { + this.choices = [new Choice(), new Choice()]; + }, + removeAllSlots() { + this.choices.forEach((choice) => { + choice.slots = ['', '', '']; + }); + }, + addInterval(res) { + if (res !== 'ok') { + return; + } + this.choices = this.choices.filter(choice => !this.isChoiceCompletelyEmpty(choice)); + while (dayjs(this.interval.start).isBefore(this.interval.end) || dayjs(this.interval.start).isSame(this.interval.end)) { + this.choices.push(new Choice(this.interval.start)); + this.interval.start = dayjs(this.interval.start).add(1, 'day').format('YYYY-MM-DD'); + } + this.choices.push(new Choice()); + }, + onSubmit(e) { + localStorage.setItem('current_poll', JSON.stringify(this.choices)); + }, + copyTimesFromFirstDay() { + i = 1; + slots = this.choices[0].slots; + while (i < this.choices.length) { + let newChoice = new Choice(this.choices[i].day, slots.slice()); + this.choices.splice(i, 1, newChoice); + i = i+1; + } + }, + isChoiceCompletelyEmpty(choice) { + return this.choiceDayEmpty(choice) && this.choiceSlotsEmpty(choice); + }, + choiceDayEmpty(choice) { + return choice.day === ''; + }, + choiceSlotsEmpty(choice) { + return choice.slots.every((slot) => slot.text === ''); + } + }, + }); +}); diff --git a/tpl/create_date_poll_step_2.tpl b/tpl/create_date_poll_step_2.tpl index a69d4ab..8810de6 100644 --- a/tpl/create_date_poll_step_2.tpl +++ b/tpl/create_date_poll_step_2.tpl @@ -7,166 +7,218 @@ DATEPICKER: '{__('Date', 'yyyy-mm-dd')}' }; - - + + {* *} + + + {* *} + {/block} - {block name=main} -
-
-
-

{__('Step 2 date', 'Choose dates for your poll')}

+ +
{/block} diff --git a/tpl/create_poll_step_3.tpl b/tpl/create_poll_step_3.tpl index fdb0518..3f033b9 100644 --- a/tpl/create_poll_step_3.tpl +++ b/tpl/create_poll_step_3.tpl @@ -7,11 +7,10 @@ DATEPICKER: '{__('Date', 'yyyy-mm-dd')}' }; - {/block} {block name="main"} - +
@@ -26,7 +25,7 @@
- +
{__('Date', 'yyyy-mm-dd')}