This is an automated email from the git hooks/post-receive script. New commit to branch feature/pollen-riot-js in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit 55df734f27359ca42bab30e6f5cb5de13cbac79f Author: Tony CHEMIT <dev@tchemit.fr> Date: Tue Jan 31 09:59:49 2017 +0100 Amélioration settings --- .../org/chorem/pollen/services/bean/PollBean.java | 21 +- pollen-ui-riot-js/src/main/web/i18n.json | 26 +- pollen-ui-riot-js/src/main/web/js/FormHelper.js | 10 +- .../src/main/web/tag/poll/PollChoiceText.tag | 5 +- .../src/main/web/tag/poll/PollChoicesText.tag | 27 +- .../src/main/web/tag/poll/PollSettings.tag | 365 ++++++++++++++------- .../src/main/web/tag/poll/PollVotes.tag | 50 ++- 7 files changed, 352 insertions(+), 152 deletions(-) diff --git a/pollen-services/src/main/java/org/chorem/pollen/services/bean/PollBean.java b/pollen-services/src/main/java/org/chorem/pollen/services/bean/PollBean.java index 4d73aaf..d0bcddf 100644 --- a/pollen-services/src/main/java/org/chorem/pollen/services/bean/PollBean.java +++ b/pollen-services/src/main/java/org/chorem/pollen/services/bean/PollBean.java @@ -48,9 +48,10 @@ import java.util.Set; public class PollBean extends PollenBean<Poll> { public enum PollStatus { - VOTING, - ADDING_CHOICES, - CLOSED + CREATED, // when poll is created, but you still can't vote + VOTING, // when you can vote + ADDING_CHOICES, // when you can add choice + CLOSED // when poll is closed } public PollBean() { @@ -174,16 +175,24 @@ public class PollBean extends PollenBean<Poll> { if (entity.isClosed()) { setStatus(PollStatus.CLOSED); } else { - setStatus(PollStatus.VOTING); - if (entity.isChoiceAddAllowed()) { + setStatus(PollStatus.CREATED); + Date now = new Date(); + if (entity.isChoiceAddAllowed()) { Date beginChoiceDate = entity.getBeginChoiceDate(); Date endChoiceDate = entity.getEndChoiceDate(); - Date now = new Date(); if (now.after(beginChoiceDate) && now.before(endChoiceDate)) { setStatus(PollStatus.ADDING_CHOICES); } } + + if (PollStatus.ADDING_CHOICES != getStatus()) { + Date beginDate = entity.getBeginDate(); + Date endDate = entity.getEndDate(); + if (beginDate != null && now.after(beginDate) && (endDate == null || now.before(endDate))) { + setStatus(PollStatus.VOTING); + } + } } } diff --git a/pollen-ui-riot-js/src/main/web/i18n.json b/pollen-ui-riot-js/src/main/web/i18n.json index 48e1b07..948da27 100644 --- a/pollen-ui-riot-js/src/main/web/i18n.json +++ b/pollen-ui-riot-js/src/main/web/i18n.json @@ -24,6 +24,7 @@ "poll_votes_authorPlaceHolder": "Renseigner votre nom", "poll_votes_vote": "Voter", "poll_votes_delete": "Supprimer le vote ?", + "poll_votes_voteNotOpen": "Les votes ne sont pas encore ouverts.", "comment_popup_create": "Ajouter un commentaire", "comment_popup_edit": "Éditer un commentaire", "comment_popup_action": "Enregistrer", @@ -123,8 +124,7 @@ "poll_settings_voteVisibility_everybody": "Tout le monde", "poll_settings_voteVisibility_voter": "Les participants", "poll_settings_nav_poll": "Sondage", - "poll_settings_nav_voteBeginDate": "Date de début", - "poll_settings_nav_voteEndDate": "Date de fin", + "poll_settings_nav_votePeriod": "Période de vote", "poll_settings_nav_resultVisibility": "Visibilité des résultats", "poll_settings_nav_continuousResult": "Résultats continus", "poll_settings_nav_choices": "Choix", @@ -148,9 +148,13 @@ "poll_settings_voteCountingType_condorcet": "Condorcet", "poll_settings_anonymousVote": "Rendre les votes anonymes", "poll_settings_commentsConfiguration": "Configuration des commentaires", - "poll_settings_voteBeginDate": "Quand les participants peuvent commencer à voter ?", - "poll_settings_voteEndDate": "Date de fin des votes", + "poll_settings_votePeriod": "Quand les participants peuvent-ils voter ?", "poll_settings_help": "Aide", + "poll_settings_beginDate": "Début de vote", + "poll_settings_endDate": "Fin de vote", + "poll_settings_beginChoiceDate": "Début d'ajout de choix", + "poll_settings_endChoiceDate": "Fin d'ajout de choix", + "poll_settings_maxChoiceNumber": "Nombre maximum de choix", "poll_choices_label": "Choix", "poll_choices_description": "Description", "poll_choices_previous": "Précédent", @@ -158,6 +162,7 @@ "poll_choices_save": "Enregister", "poll_choices_moreChoices": "Ajouter des choix", "poll_choices_moreChoice": "Ajouter un choix", + "poll_choices_choicePeriod": "Ajout de choix", "poll_header_general": "Description", "poll_header_choices": "Choix", "poll_header_options": "Options", @@ -199,6 +204,7 @@ "poll_votes_authorPlaceHolder": "Fill your name", "poll_votes_vote": "Vote", "poll_votes_delete": "Delete vote?", + "poll_votes_voteNotOpen": "Votes are not open.", "comment_popup_create": "Add a comment", "comment_popup_edit": "Edit a comment", "comment_popup_action": "Save", @@ -299,8 +305,7 @@ "poll_settings_voteVisibility_everybody": "Everybody", "poll_settings_voteVisibility_voter": "Only voters", "poll_settings_nav_poll": "Poll", - "poll_settings_nav_voteBeginDate": "Begin date", - "poll_settings_nav_voteEndDate": "End date", + "poll_settings_nav_votePeriod": "Vote period", "poll_settings_nav_resultVisibility": "Results visibility", "poll_settings_nav_continuousResult": "Continuous results", "poll_settings_nav_choices": "Choices", @@ -324,9 +329,13 @@ "poll_settings_voteCountingType_condorcet": "Condorcet", "poll_settings_anonymousVote": "Anonymize votes", "poll_settings_commentsConfiguration": "Comments configuration", - "poll_settings_voteBeginDate": "When users can start to vote?", - "poll_settings_voteEndDate": "When poll is ending?", + "poll_settings_votePeriod": "When users can vote?", "poll_settings_help": "Help", + "poll_settings_beginDate": "Begin date", + "poll_settings_endDate": "End date", + "poll_settings_beginChoiceDate": "Begin choice date", + "poll_settings_endChoiceDate": "End choice date", + "poll_settings_maxChoiceNumber": "Maximum number of choices", "poll_choices_label": "Choice", "poll_choices_description": "Description", "poll_choices_previous": "Previous", @@ -334,6 +343,7 @@ "poll_choices_save": "Save", "poll_choices_moreChoices": "Add more choices", "poll_choices_moreChoice": "Add one choice", + "poll_choices_choicePeriod": "Add choices", "poll_header_general": "General", "poll_header_choices": "Choices", "poll_header_options": "Options", diff --git a/pollen-ui-riot-js/src/main/web/js/FormHelper.js b/pollen-ui-riot-js/src/main/web/js/FormHelper.js index 6692408..efc5bbc 100644 --- a/pollen-ui-riot-js/src/main/web/js/FormHelper.js +++ b/pollen-ui-riot-js/src/main/web/js/FormHelper.js @@ -26,7 +26,7 @@ class FormHelper { if (e.name) { if (e.type === "checkbox") { if (e.checked) { - result[e.name] = e.value || true; + result[e.name] = true; } } else if (e.type === "date") { if (e.value !== "") { @@ -34,7 +34,9 @@ class FormHelper { } } else if (e.type === "datetime-local") { if (e.value !== "") { - result[e.name] = this.toISOTZString(e.value); + // result[e.name] = this.toISOTZString(e.value); + result[e.name] = new Date(e.value).getTime(); + console.info('date: '+result[e.name]); } } else if (e.type === "radio") { Array.prototype.forEach.call(form.elements[e.name], function(r) { @@ -72,7 +74,9 @@ class FormHelper { e.checked = !!value; } else if (e.type === "datetime-local") { let d = new Date(value); - e.value = new Date(+d - d.getTimezoneOffset() * 60 * 1000).toISOString().replace("Z", ""); + if (!isNaN( d.getTime() )) { + e.value = new Date(+d - d.getTimezoneOffset() * 60 * 1000).toISOString().replace("Z", ""); + } } else if (e.type === "radio") { Array.prototype.forEach.call(form.elements[e.name], function(r) { if (r.value === value) { diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/PollChoiceText.tag b/pollen-ui-riot-js/src/main/web/tag/poll/PollChoiceText.tag index d168105..9b0bc4d 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/PollChoiceText.tag +++ b/pollen-ui-riot-js/src/main/web/tag/poll/PollChoiceText.tag @@ -36,7 +36,7 @@ </button> </div> </div> - <div ref="edit_choice" id="edit_choice_{number}" class="choice-container choice-view"> + <div ref="edit_choice" id="edit_choice_{number}" class="choice-container"> <div class="choice-container-child"> <label class="choice-wide" for="choice{number}">{__.label} {number + 1}</label> <label class="choice-wider" if="{number == 0}">{__.description}</label> @@ -66,6 +66,9 @@ if (this.number == 0 || this.edit) { this.refs.choice.required = "required"; } + if (this.edit) { + this.refs.edit_choice.classList.add('choice-view'); + } }); this.prepareSave = () => { diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/PollChoicesText.tag b/pollen-ui-riot-js/src/main/web/tag/poll/PollChoicesText.tag index 2474ff8..2abc866 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/PollChoicesText.tag +++ b/pollen-ui-riot-js/src/main/web/tag/poll/PollChoicesText.tag @@ -20,8 +20,8 @@ */ require('./PollChoiceText.tag'); <PollChoicesText> - <div if="{form.type == 'add'}"> - Période d'ajout de choix du {form.model.beginChoiceDate} au {form.model.endChoiceDate} + <div if="{choicePeriod}" class="legend"> + {__.choicePeriod} {choicePeriod} </div> <form ref="formDom" onsubmit="{action}"> @@ -40,12 +40,31 @@ require('./PollChoiceText.tag'); </form> <script> - this.installBundle(opts.session, "poll_choices"); - let choiceService = require('../../js/ChoiceService'); this.form = opts.form; + console.info(this.form.model); this.session = opts.session; this.parentTag = opts.parentTag; this.choiceTags = {}; + let moment = require('moment'); + this.i18nCallback = (locale) => { + moment.locale(locale); + this.choicePeriod = ''; + if (this.form.model.beginChoiceDate) { + this.choicePeriod += moment(this.form.model.beginChoiceDate).format('LLL'); + } + if (this.form.model.endChoiceDate) { + this.choicePeriod += ' - ' + moment(this.form.model.endChoiceDate).format('LLL'); + } + if (this.choicePeriod != '') { + this.choicePeriod = '( ' + this.choicePeriod + ' )'; + } + this.update({choicePeriod: this.choicePeriod}); + }; + + this.installBundle(opts.session, "poll_choices", this.i18nCallback); + this.i18nCallback(); + let choiceService = require('../../js/ChoiceService'); + this.on('mount', () => { this.formDom = this.refs.formDom; this.choicesCount = this.form.choices.length - 1; diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/PollSettings.tag b/pollen-ui-riot-js/src/main/web/tag/poll/PollSettings.tag index 32772fa..9955a8d 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/PollSettings.tag +++ b/pollen-ui-riot-js/src/main/web/tag/poll/PollSettings.tag @@ -1,23 +1,23 @@ /*- - * #%L - * Pollen :: UI (Riot Js) - * %% - * Copyright (C) 2009 - 2017 CodeLutin - * %% - * This program is free software: you can redistribute it and/or modify - * it under the terms of the GNU Affero General Public License as published by - * the Free Software Foundation, either version 3 of the License, or - * (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - * GNU General Public License for more details. - * - * You should have received a copy of the GNU Affero General Public License - * along with this program. If not, see <http://www.gnu.org/licenses/>. - * #L% - */ +* #%L +* Pollen :: UI (Riot Js) +* %% +* Copyright (C) 2009 - 2017 CodeLutin +* %% +* This program is free software: you can redistribute it and/or modify +* it under the terms of the GNU Affero General Public License as published by +* the Free Software Foundation, either version 3 of the License, or +* (at your option) any later version. +* +* This program is distributed in the hope that it will be useful, +* but WITHOUT ANY WARRANTY; without even the implied warranty of +* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +* GNU General Public License for more details. +* +* You should have received a copy of the GNU Affero General Public License +* along with this program. If not, see <http://www.gnu.org/licenses/>. +* #L% +*/ <PollSettings> <div class="legend"> @@ -28,80 +28,89 @@ <div class="actions"> <a if="{!showOptions}" class="button" onclick="{previousStep}">{__.previous}</a> <a if="{!showOptions}" class="button wide" onclick="{toggleShowOptions}">{__.showOptions}</a> - <a if="{showOptions}" class="button wide" onclick="{toggleShowOptions}">{__.hideOptions}</a> + <!--a if="{showOptions}" class="button wide" onclick="{toggleShowOptions}">{__.hideOptions}</a--> </div> - <form if="{showOptions}" ref="form" onsubmit="{action}"> + <form show="{showOptions}" ref="form" onsubmit="{action}"> + <div id="navigation"> - <nav class="bs-docs-sidebar"> - <ul id="sidebar" class="nav nav-stacked"> - <li> - <a onclick="{scrollTo}" href="#Poll">{__.nav_poll}</a> - <ul class="nav nav-stacked"> - <li> - <a onclick="{scrollTo}" href="#Poll_beginDate">{__.nav_voteBeginDate}</a> - </li> - <li> - <a onclick="{scrollTo}" href="#Poll_endDate">{__.nav_voteEndDate}</a> - </li> - <li> - <a onclick="{scrollTo}" href="#Poll_resultVisibility">{__.nav_resultVisibility}</a> - </li> - <li> - <a onclick="{scrollTo}" href="#Poll_continuousVisibility">{__.nav_continuousResult}</a> - </li> - </ul> - </li> - <li> - <a onclick="{scrollTo}" href="#Choice">{__.nav_choices}</a> - <ul class="nav nav-stacked"> - <li> - <a onclick="{scrollTo}" href="#Choice_addChoices">{__.nav_addChoices}</a> - </li> - <li> - <a onclick="{scrollTo}" href="#Choice_limitChoices">{__.nav_limitChoices}</a> - </li> - </ul> - </li> - <li> - <a onclick="{scrollTo}" href="#Vote">{__.nav_votes}</a> - <ul class="nav nav-stacked"> - <li> - <a onclick="{scrollTo}" href="#Vote_countingType">{__.nav_voteCountingType}</a> - </li> - <li> - <a onclick="{scrollTo}" href="#Vote_visibility">{__.nav_voteVisibility}</a> - </li> - <li> - <a onclick="{scrollTo}" href="#Vote_anonymous">{__.nav_anonymousVote}</a> - </li> - </ul> - </li> - <li> - <a onclick="{scrollTo}" href="#Comment">{__.nav_comments}</a> - <ul class="nav nav-stacked"> - <li> - <a onclick="{scrollTo}" href="#Comment_visibility">{__.nav_commentVisibility}</a> - </li> - </ul> - </li> - </ul> - </nav> + <div class="config-navigation"> + <div class="actions"> + <a if="{showOptions}" class="button wide" onclick="{toggleShowOptions}">{__.hideOptions}</a> + </div> + + <nav class="bs-docs-sidebar"> + <ul id="sidebar" class="nav nav-stacked"> + <li> + <a onclick="{scrollTo}" href="#Poll">{__.nav_poll}</a> + <ul class="nav nav-stacked"> + <li> + <a onclick="{scrollTo}" href="#Poll_votePeriod">{__.nav_votePeriod}</a> + </li> + <li> + <a onclick="{scrollTo}" href="#Poll_resultVisibility">{__.nav_resultVisibility}</a> + </li> + <li> + <a onclick="{scrollTo}" + href="#Poll_continuousVisibility">{__.nav_continuousResult}</a> + </li> + </ul> + </li> + <li> + <a onclick="{scrollTo}" href="#Choice">{__.nav_choices}</a> + <ul class="nav nav-stacked"> + <li> + <a onclick="{scrollTo}" href="#Choice_addChoices">{__.nav_addChoices}</a> + </li> + <li> + <a onclick="{scrollTo}" href="#Choice_limitChoices">{__.nav_limitChoices}</a> + </li> + </ul> + </li> + <li> + <a onclick="{scrollTo}" href="#Vote">{__.nav_votes}</a> + <ul class="nav nav-stacked"> + <li> + <a onclick="{scrollTo}" href="#Vote_countingType">{__.nav_voteCountingType}</a> + </li> + <li> + <a onclick="{scrollTo}" href="#Vote_visibility">{__.nav_voteVisibility}</a> + </li> + <li> + <a onclick="{scrollTo}" href="#Vote_anonymous">{__.nav_anonymousVote}</a> + </li> + </ul> + </li> + <li> + <a onclick="{scrollTo}" href="#Comment">{__.nav_comments}</a> + <ul class="nav nav-stacked"> + <li> + <a onclick="{scrollTo}" href="#Comment_visibility">{__.nav_commentVisibility}</a> + </li> + </ul> + </li> + </ul> + </nav> + </div> <div class="contentAndHelp"> <div ref="content" class="content" onsubmit="{action}"> <div class="config-group" id="Poll"> <div class="config-header">{__.poll_configuration}</div> - <div id="Poll_beginDate"> - <div class="config-subheader">{__.nav_voteBeginDate}<i class="fa fa-info-circle" - onclick="{help}"></i></div> - <div class="config-description">{__.voteBeginDate} + <div id="Poll_votePeriod"> + <div class="config-subheader">{__.nav_votePeriod}<i class="fa fa-info-circle" + onclick="{help}"></i></div> + <div class="config-description">{__.votePeriod}</div> + <div class="config-form config-period"> + <div> + <label for="beginDate">{__.beginDate}</label> + <input ref="beginDate" name="beginDate" type="datetime-local"> + </div> + <div> + <label for="endDate">{__.endDate}</label> + <input ref="endDate" name="endDate" type="datetime-local"> + </div> </div> </div> - <div id="Poll_endDate"> - <div class="config-subheader">{__.nav_voteEndDate}<i class="fa fa-info-circle" - onclick="{help}"></i></div> - <div class="config-description">{__.voteEndDate}</div> - </div> <div id="Poll_resultVisibility"> <div class="config-subheader">{__.nav_resultVisibility}<i class="fa fa-info-circle" onclick="{help}"></i></div> @@ -126,8 +135,11 @@ <div class="config-subheader">{__.nav_continuousResult}<i class="fa fa-info-circle" onclick="{help}"></i></div> <div class="config-description"> {__.continuousResult}</div> - <div class="config-form"> - <input type="checkbox" name="continuousResult" ref="continuousResult">{__.continuousResult} + <div class="config-form checkbox"> + <input type="checkbox" name="continuousResult" id="continuousResult" + ref="continuousResult"> + <label for="continuousResult"></label> + </div> </div> </div> @@ -139,7 +151,22 @@ onclick="{help}"></i></div> <div class="config-description">{__.addChoices}</div> <div class="config-form"> - <input type="checkbox" name="choicesAddAllowed" ref="addChoices">{__.addChoices} + <div class="checkbox"> + <input type="checkbox" name="choiceAddAllowed" id="choiceAddAllowed" + ref="addChoices" + onclick="{toggleChoiceAddAllowed}"> + <label for="choiceAddAllowed"/> + </div> + <div if="{form.model.choiceAddAllowed}" class="config-period"> + <div> + <label for="beginChoiceDate">{__.beginChoiceDate}</label> + <input ref="beginChoiceDate" name="beginChoiceDate" type="datetime-local"> + </div> + <div> + <label for="endDate">{__.endChoiceDate}</label> + <input ref="endChoiceDate" name="endChoiceDate" type="datetime-local"> + </div> + </div> </div> </div> <div id="Choice_limitChoices"> @@ -147,7 +174,17 @@ onclick="{help}"></i></div> <div class="config-description">{__.limitChoices}</div> <div class="config-form"> - <input type="checkbox" name="limitChoices" ref="limitChoices">{__.limitChoices} + <div class="checkbox"> + <input type="checkbox" name="limitChoices" id="limitChoices" ref="limitChoices" + onclick="{toggleLimitChoices}"> + <label for="limitChoices"/> + </div> + <div if="{form.model.limitChoices}"> + <div> + <label for="maxChoiceNumber">{__.maxChoiceNumber}</label> + <input ref="maxChoiceNumber" name="maxChoiceNumber" type="number"> + </div> + </div> </div> </div> </div> @@ -160,13 +197,13 @@ <div class="config-form"> <ul> <li> - <input type="radio" name="voteCountingType" VALUE="1">{__.voteCountingType_normal} + <input type="radio" name="voteCountingType" value="1">{__.voteCountingType_normal} </li> <li> - <input type="radio" name="voteCountingType" VALUE="2">{__.voteCountingType_pourcentage} + <input type="radio" name="voteCountingType" value="2">{__.voteCountingType_pourcentage} </li> <li> - <input type="radio" name="voteCountingType" VALUE="3">{__.voteCountingType_condorcet} + <input type="radio" name="voteCountingType" value="3">{__.voteCountingType_condorcet} </li> </ul> </div> @@ -179,15 +216,15 @@ <ul> <li> <input type="radio" name="voteVisibility" ref="voteVisibilityNobody" - VALUE="NOBODY">{__.voteVisibility_creator} + value="NOBODY">{__.voteVisibility_creator} </li> <li> <input type="radio" name="voteVisibility" ref="voteVisibilityVoter" - VALUE="VOTER">{__.voteVisibility_voter} + value="VOTER">{__.voteVisibility_voter} </li> <li> <input type="radio" name="voteVisibility" ref="voteVisibilityEverybody" - VALUE="EVERYBODY">{__.voteVisibility_everybody} + value="EVERYBODY">{__.voteVisibility_everybody} </li> </ul> </div> @@ -196,8 +233,10 @@ <div class="config-subheader">{__.nav_anonymousVote}<i class="fa fa-info-circle" onclick="{help}"></i></div> <div class="config-description">{__.anonoymousVote}</div> - <div class="config-form"> - <input type="checkbox" name="anonymousVoteAllowed" ref="anonymousVote">{__.anonymousVote} + <div class="config-form checkbox"> + <input type="checkbox" name="anonymousVoteAllowed" id="anonymousVoteAllowed" + ref="anonymousVote"> + <label for="anonymousVoteAllowed"/> </div> </div> </div> @@ -211,15 +250,15 @@ <ul> <li> <input type="radio" name="commentVisibility" ref="commentVisibilityCreator" - VALUE="CREATOR">{__.commentVisibility_creator} + value="CREATOR">{__.commentVisibility_creator} </li> <li> <input type="radio" name="commentVisibility" ref="commentVisibilityVoter" - VALUE="VOTER">{__.commentVisibility_voter} + value="VOTER">{__.commentVisibility_voter} </li> <li> <input type="radio" name="commentVisibility" ref="commentVisibilityEverybody" - VALUE="EVERYBODY">{__.commentVisibility_everybody} + value="EVERYBODY">{__.commentVisibility_everybody} </li> </ul> </div> @@ -246,37 +285,60 @@ this.installBundle(opts.session, "poll_settings"); this.showHelp = false; + let FormHelper = require('../../js/FormHelper'); + + this.toggleChoiceAddAllowed = (e) => { + this.form.model.choiceAddAllowed = !this.form.model.choiceAddAllowed; + }; + + this.toggleLimitChoices = (e) => { + this.form.model.limitChoices = !this.form.model.limitChoices; + }; + this.help = (e) => { let target = e.target; let helpId = 'Help_' + target.parentNode.parentNode.id; console.info(helpId); this.showHelp = true; - this.update({showHelp:this.showHelp}); + this.update({showHelp: this.showHelp}); }; this.closeHelp = (e) => { this.showHelp = false; - this.update({showHelp:this.showHelp}); + this.update({showHelp: this.showHelp}); }; this.action = (e) => { e.preventDefault(); e.stopPropagation(); + let map = FormHelper.formToMap(this.refs.form); + Object.assign(this.form.model, map); + console.info('form to model'); + console.info(map); + console.info(this.form.model); this.form.nextStep(); }; this.on('mount', () => { let model = this.form.model; + let moment = require('moment'); + model.beginDate = moment(model.beginDate).format('YYYY-MM-DDTHH:mm'); + console.info(model.beginDate); let form = this.refs.form; - if (form) { - let FormHelper = require('../../js/FormHelper'); - FormHelper.fillForm(form, model); - } + console.info('fill form with model'); + console.info(model); + FormHelper.fillForm(form, model); }); this.previousStep = (e) => { + + let map = FormHelper.formToMap(this.refs.form); + Object.assign(this.form.model, map); + console.info('form to model'); + console.info(map); + console.info(this.form.model); this.form.previousStep(); }; @@ -302,18 +364,77 @@ </script> <style> + [type="checkbox"]:not(:checked), + [type="checkbox"]:checked { + position: absolute; + left: -9999px; + } + + .checkbox { + width: 100px; + height: 40px; + background: white; + margin: 10px 50px; + border-radius: 40px; + position: relative; + } + + .checkbox:before { + content: 'Yes'; + position: absolute; + top: 12px; + left: 13px; + height: 2px; + color: #13a2ff; + font-size: 16px; + } + + .checkbox:after { + content: 'No'; + position: absolute; + top: 12px; + left: 64px; + height: 2px; + color: black; + font-size: 16px; + } + + .checkbox label { + display: block; + width: 42px; + height: 22px; + border-radius: 40px; + + transition: all .2s ease; + cursor: pointer; + position: absolute; + top: 9px; + z-index: 1; + /*left: 12px;*/ + background: black; + } + + .checkbox input[type=checkbox]:checked + label { + left: 38px; + background: #13a2ff; + } + + input[type=datetime-local] { + width: 300px; + } + .fa-info-circle { margin-left: 5px; cursor: help; } - .fa-close { float: right; - cursor: hand; + cursor: pointer; color: red; } - .config-form > ul > li > input, .config-form > input { + + .config-form > ul > li > input { display: inline; width: 50px; margin: 0; @@ -321,10 +442,20 @@ height: 16px; } + .config-period { + display: flex; + flex-direction: row; + } + .wide { width: 250px; } + .config-navigation { + display: flex; + flex-direction: column; + align-content: flex-start; + } .config-header { border-bottom: solid 2px #c8ccca; font-size: 20px; @@ -343,9 +474,6 @@ .config-group { height: 100%; - /*border: solid 2px #c8ccca;*/ - /*padding: 10px;*/ - /*border-radius: 10px;*/ } ul { @@ -358,7 +486,7 @@ } .legend { - width: 100%; + width: 1200px; border-bottom: 1px solid #b2c7d3; display: flex; justify-content: flex-start; @@ -446,7 +574,7 @@ /*}*/ #sidebar { - height: 450px; + height: 400px; width: 300px; margin-left: 10px; } @@ -464,17 +592,8 @@ } .content { - /*display: flex;*/ - /*flex-direction: column;*/ - /*justify-content: flex-start;*/ - /*background: white;*/ - /*border: solid 2px #c8ccca;*/ - /*padding: 45px 0;*/ - /*border-radius: 10px;*/ - /*text-align: center;*/ - /*align-items: flex-start;*/ width: 400px; - height: 450px; + height: 400px; overflow-y: hidden; /*padding-right: 20px;*/ align-self: flex-start; diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/PollVotes.tag b/pollen-ui-riot-js/src/main/web/tag/poll/PollVotes.tag index ca71240..a3a430e 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/PollVotes.tag +++ b/pollen-ui-riot-js/src/main/web/tag/poll/PollVotes.tag @@ -1,10 +1,13 @@ <PollVotes> <div class="vote-container"> <div class="legend"> - {__.title} + {__.title} {votePeriod} </div> <div show="{loaded}" class="body"> - <form ref="form" onsubmit="{addOrEditVote}"> + + <div if="{!voting}">{__.voteNotOpen}</div> + + <form if="{voting}" ref="form" onsubmit="{addOrEditVote}"> <table> <thead> @@ -44,7 +47,8 @@ disabled="{vote.id == voteId?'':'disabled'}" placeholder="{__.authorPlaceHolder}"> </div> - <div class="actions vote right" if="{poll.canVote && vote.permission && (!voteId || voteId != vote.id)}" + <div class="actions vote right" + if="{poll.canVote && vote.permission && (!voteId || voteId != vote.id)}" id="{vote.id}"> <a onclick="{parent.deleteVote}"><i class="fa fa-trash danger fa-15x"/></a> <a onclick="{parent.onEditVote}"><i class="fa fa-pencil-square-o fa-15x"/></a> @@ -77,21 +81,53 @@ <script> this.voteId = null; this.loaded = false; + + + this.i18nCallback = (locale) => { + moment.locale(locale); + this.votePeriod = ''; + if (this.poll.beginDate) { + this.votePeriod += moment(this.poll.beginDate).format('LLL'); + } + if (this.poll.endDate) { + this.votePeriod += ' - ' + moment(this.poll.endDate).format('LLL'); + } + if (this.votePeriod != '') { + this.votePeriod = '( ' + this.votePeriod + ' )'; + } + this.choicePeriod = ''; + if (this.poll.beginChoiceDate) { + this.choicePeriod += moment(this.poll.beginChoiceDate).format('LLL'); + } + if (this.poll.endChoiceDate) { + this.choicePeriod += ' - ' + moment(this.poll.endChoiceDate).format('LLL'); + } + if (this.choicePeriod != '') { + this.choicePeriod = '( ' + this.choicePeriod + ' )'; + } + this.update({votePeriod: this.votePeriod, choicePeriod: this.choicePeriod}); + }; + let session = require("../../js/Session"); - this.installBundle(session, "poll_votes"); + this.installBundle(session, "poll_votes", this.i18nCallback); let voteService = require("../../js/VoteService"); let choiceService = require("../../js/ChoiceService"); - + let moment = require('moment'); this.pollId = opts.pollId; this.permission = opts.permission; this.poll = opts.poll; + + this.i18nCallback(); + this.voting = this.poll.status != 'CREATED'; + + this.votes = []; this.choices = []; this.on('mount', () => { - if (session.isConnected() && this.poll.canVote) { - session.getUser().then(user=> { + if (this.voting && session.isConnected() && this.poll.canVote) { + session.getUser().then(user => { this.refs.voterName.value = user.name; }) -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.