This is an automated email from the git hooks/post-receive script. New commit to branch develop in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit 2e1ba2214005e39241bf3b8050dfa886569c2b2e Author: Sylvain Bavencoff <bavencoff@codelutin.com> Date: Tue Mar 21 10:05:48 2017 +0100 Ajout d'un modal pour la description des choix + amelioration du chargement des resultats --- pollen-ui-riot-js/src/main/web/i18n.json | 4 +++ pollen-ui-riot-js/src/main/web/js/Poll.js | 7 ++-- .../src/main/web/tag/poll/ChoiceView.tag.html | 42 ++++++++++++++++------ .../src/main/web/tag/poll/Polls.tag.html | 4 +-- .../src/main/web/tag/poll/Results.tag.html | 7 ++-- .../src/main/web/tag/poll/Votes.tag.html | 35 +++++++++++++----- 6 files changed, 71 insertions(+), 28 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/i18n.json b/pollen-ui-riot-js/src/main/web/i18n.json index 4bb936a..52f70af 100644 --- a/pollen-ui-riot-js/src/main/web/i18n.json +++ b/pollen-ui-riot-js/src/main/web/i18n.json @@ -33,6 +33,8 @@ "poll_votes_addChoice": "Ajouter un choix", "poll_votes_delete": "Supprimer le vote ?", "poll_votes_results": "Resultats", + "poll_votes_noVote": "Aucun vote", + "poll_votes_vote": "vote", "poll_votes_votes": "votes", "poll_votes_voteNotOpen": "Les votes ne sont pas encore ouverts.", "polls_createdPolls": "Mes sondages", @@ -290,6 +292,8 @@ "poll_votes_addChoice": "Add choice", "poll_votes_delete": "Delete vote?", "poll_votes_results": "Results", + "poll_votes_noVote": "No vote", + "poll_votes_vote": "vote", "poll_votes_votes": "votes", "poll_votes_voteNotOpen": "Votes are not open.", "polls_createdPolls": "My polls", diff --git a/pollen-ui-riot-js/src/main/web/js/Poll.js b/pollen-ui-riot-js/src/main/web/js/Poll.js index 685eec4..244473f 100644 --- a/pollen-ui-riot-js/src/main/web/js/Poll.js +++ b/pollen-ui-riot-js/src/main/web/js/Poll.js @@ -113,6 +113,9 @@ class Poll { .then(results => { this.results = results; this.results.winners = results.scores.filter(score => score.scoreOrder === 0); + this.choices.forEach(choice => { + choice.score = this.results.scores.find(score => score.choiceId === choice.id); + }); return Promise.resolve(this); } ); @@ -120,10 +123,6 @@ class Poll { return Promise.reject("Init poll after load results"); } - getScoreByChoice(choice) { - return this.results.scores.find(score => score.choiceId === choice.id); - } - loadComments() { if (this.id) { let paginationParameter = new Pagination(); diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html index 7d51302..9c99052 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html @@ -1,5 +1,7 @@ <ChoiceView> - <div class="choice" title={opts.choice.description}> + <div class="choice" + onclick={openModalImage} + title={opts.choice.description}> <span class="choice-text" if={opts.choice.choiceType === "TEXT"}> {opts.choice.choiceValue} @@ -13,18 +15,31 @@ {formatDate(parseInt(opts.choice.choiceValue, 10))} </span> <div class="choice-ressource" - if={opts.choice.choiceType === "RESOURCE"} - onclick={openModalImage}> + if={opts.choice.choiceType === "RESOURCE"}> <img class="image-preview" src="{session.configuration.endPoint}/v1/resources/{opts.choice.choiceValue}/preview"/> </div> + </div> - <div if={showModalImage} onclick={closeModalImage}> - <div class="c-overlay"></div> - <div class="modal-image o-modal o-modal--ghost"> - <div class="c-card"> - <div class="c-card__body"> - <img src="{session.configuration.endPoint}/v1/resources/{opts.choice.choiceValue}"/> + <div if={showModalImage} onclick={closeModalImage}> + <div class="c-overlay"></div> + <div class="modal-image o-modal"> + <div class="c-card"> + <header class="c-card__header"> + <h2 if={opts.choice.choiceType === "TEXT"}> + {opts.choice.choiceValue} + </h2> + <h2 if={opts.choice.choiceType === "DATE"}> + {formatDate(parseInt(opts.choice.choiceValue, 10),"LLL")} + </h2> + <h2 if={opts.choice.choiceType === "DATETIME"}> + {formatDate(parseInt(opts.choice.choiceValue, 10))} + </h2> + <div if={opts.choice.choiceType === "RESOURCE"}> + <img class="image-preview" src="{session.configuration.endPoint}/v1/resources/{opts.choice.choiceValue}"/> </div> + </header> + <div class="c-card__body"> + {opts.choice.description} </div> </div> </div> @@ -35,7 +50,9 @@ this.showModalImage = false; this.openModalImage = () => { - this.showModalImage = true; + if (this.opts.choice.description || this.opts.choice.choiceType === "RESOURCE") { + this.showModalImage = true; + } }; this.closeModalImage = () => { @@ -52,6 +69,11 @@ height: 1.5em; } + .modal-image { + font-size: 1rem; + width: auto; + } + .modal-image img { max-width: 100%; max-height:100%; diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Polls.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Polls.tag.html index 9fdeae4..b4178f8 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Polls.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Polls.tag.html @@ -12,8 +12,8 @@ require("./PollCard.tag.html"); <div class="o-field"> <select class="c-field" onchange={selectSort}> - <option value="title">{__.name}</option> <option value="topiaCreateDate">{__.createDate}</option> + <option value="title">{__.name}</option> </select> </div> <button class="c-button c-button--brand" @@ -42,7 +42,7 @@ require("./PollCard.tag.html"); this.pagination = { order: "title", - desc: false, // means asc + desc: true, pageSize: 5, pageNumber: 0 }; diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Results.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Results.tag.html index 05651a3..4056598 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Results.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Results.tag.html @@ -25,10 +25,9 @@ require("./ChoiceView.tag.html"); this.poll = {}; this.opts.pollPromise.then(poll => { this.poll = poll; - return Promise.all([ - poll.loadChoices(), - poll.loadResults() - ]); + return poll.loadChoices().then(() =>{ + return poll.loadResults(); + }); }).then(() => { this.loaded = true; this.update(); diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html index 672bd24..d2f3901 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html @@ -77,8 +77,13 @@ require("./ChoiceView.tag.html"); <div class="result-label"> <i class="fa fa-trophy fa-15x"></i> {__.results} </div> - <div each={choice in poll.choices} class="score-choice" score={poll.getScoreByChoice(choice)}> - {poll.getScoreByChoice(choice).scoreOrder + 1} ({poll.getScoreByChoice(choice).scoreValue} {parent.__.votes}) + <div each={choice in poll.choices} class="score-choice"> + <span if={!choice.score}>{parent.__.noVote}</span> + <span if={choice.score}> + {choice.score.scoreOrder + 1 } + ({choice.score.scoreValue} + {choice.score.scoreValue > 1 ? parent.__.votes : parent.__.vote}) + </span> </div> <div class="results-actions"> <button type="button" @@ -215,10 +220,12 @@ require("./ChoiceView.tag.html"); poll.loadVotes(), poll.loadVoteCountingType() ]; - if (this.poll.resultIsVisible) { - promises.push(poll.loadResults()); - } - return Promise.all(promises); + return Promise.all(promises).then(() =>{ + if (this.poll.resultIsVisible) { + return poll.loadResults(); + } + return Promise.resolve(); + }); }).then(() => { this.loaded = true; this.update(); @@ -279,7 +286,13 @@ require("./ChoiceView.tag.html"); } }); this.error = {}; - this.update(); + if (this.poll.resultIsVisible) { + this.poll.loadResults().then(() => { + this.update(); + }); + } else { + this.update(); + } }, (error) => { this.error = error; @@ -306,7 +319,13 @@ require("./ChoiceView.tag.html"); this.poll.updateVote(updateVote).then(() => { this.voteId = null; this.error = {}; - this.update(); + if (this.poll.resultIsVisible) { + this.poll.loadResults().then(() => { + this.update(); + }); + } else { + this.update(); + } }, (error) => { this.error = error; -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.