branch ramonville updated (d06512c2 -> 302399a3)
This is an automated email from the git hooks/post-receive script. New change to branch ramonville in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git from d06512c2 alt sur les image des preview new e3e097f1 Fix missing '{' in js new 302399a3 - Improve UX on vote for mobile - Make Pollen more responsive... The 2 revisions listed above as "new" are entirely new to this repository and will be described in separate emails. The revisions listed as "adds" were already present in the repository and have only been added to this reference. Detailed log of new commits: commit 302399a31a4f1e32543df4aa0eed2da9c006b253 Author: jcouteau <couteau@codelutin.com> Date: Wed Dec 19 14:04:43 2018 +0100 - Improve UX on vote for mobile - Make Pollen more responsive... commit e3e097f1381b57ce9725806073893ac01fd04a2b Author: jcouteau <couteau@codelutin.com> Date: Mon Dec 17 10:22:22 2018 +0100 Fix missing '{' in js Summary of changes: pollen-ui-riot-js/src/main/web/css/main.css | 4 + .../main/web/tag/components/GtuValidation.tag.html | 1 + .../web/tag/components/MultiLineLabel.tag.html | 2 +- .../src/main/web/tag/poll/Choice.tag.html | 4 +- .../src/main/web/tag/poll/ChoiceView.tag.html | 116 ++++++++++++--------- .../src/main/web/tag/poll/EditVote.tag.html | 5 + .../main/web/tag/popup/ChoiceDetailModal.tag.html | 12 +-- 7 files changed, 84 insertions(+), 60 deletions(-) -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.
This is an automated email from the git hooks/post-receive script. New commit to branch ramonville in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit e3e097f1381b57ce9725806073893ac01fd04a2b Author: jcouteau <couteau@codelutin.com> Date: Mon Dec 17 10:22:22 2018 +0100 Fix missing '{' in js --- pollen-ui-riot-js/src/main/web/tag/poll/Choice.tag.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Choice.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Choice.tag.html index 9e7a2119..531bfdc6 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Choice.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Choice.tag.html @@ -53,7 +53,7 @@ import "../components/time-picker.tag.html"; </button> <div if="{originalFile}" class="original-file {opts.choice.choiceType === 'RESOURCE' ? 'selected' : 'hidden'}"> - <img src="{resourceService.getPreviewUrl(originalFile)}" alt="_t.originalFilePreview"/> + <img src="{resourceService.getPreviewUrl(originalFile)}" alt="{_t.originalFilePreview}"/> <span> {originalFile.name} <i class="fa fa-remove" aria-hidden="true" @@ -63,7 +63,7 @@ import "../components/time-picker.tag.html"; </div> <div if="{!originalFile}" class="add-file {opts.choice.choiceType === 'RESOURCE' ? 'selected' : 'hidden'}"> - <img if={newFile && newFile.image} ref="imagePreview" alt="_t.imagePreview"/> + <img if={newFile && newFile.image} ref="imagePreview" alt="{_t.imagePreview}"/> <div> <span if={!opts.disabled && !newFile} onclick="{addFile}"> -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.
This is an automated email from the git hooks/post-receive script. New commit to branch ramonville in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit 302399a31a4f1e32543df4aa0eed2da9c006b253 Author: jcouteau <couteau@codelutin.com> Date: Wed Dec 19 14:04:43 2018 +0100 - Improve UX on vote for mobile - Make Pollen more responsive... --- pollen-ui-riot-js/src/main/web/css/main.css | 4 + .../main/web/tag/components/GtuValidation.tag.html | 1 + .../web/tag/components/MultiLineLabel.tag.html | 2 +- .../src/main/web/tag/poll/ChoiceView.tag.html | 116 ++++++++++++--------- .../src/main/web/tag/poll/EditVote.tag.html | 5 + .../main/web/tag/popup/ChoiceDetailModal.tag.html | 12 +-- 6 files changed, 82 insertions(+), 58 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/css/main.css b/pollen-ui-riot-js/src/main/web/css/main.css index b9a624f2..8ebe18af 100644 --- a/pollen-ui-riot-js/src/main/web/css/main.css +++ b/pollen-ui-riot-js/src/main/web/css/main.css @@ -427,6 +427,10 @@ pollenheader { pollenheader .header-home { font-family: pacifico; color: #10b8ca; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + flex-grow: 99; } pollenheader .header-actions { diff --git a/pollen-ui-riot-js/src/main/web/tag/components/GtuValidation.tag.html b/pollen-ui-riot-js/src/main/web/tag/components/GtuValidation.tag.html index 0d324ed2..f7e4c3b4 100644 --- a/pollen-ui-riot-js/src/main/web/tag/components/GtuValidation.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/components/GtuValidation.tag.html @@ -55,6 +55,7 @@ .c-field.c-field--choice.gtu-validation { width: 100%; text-align: center; + max-width: 500px; } </style> diff --git a/pollen-ui-riot-js/src/main/web/tag/components/MultiLineLabel.tag.html b/pollen-ui-riot-js/src/main/web/tag/components/MultiLineLabel.tag.html index aab89abf..83d8455b 100644 --- a/pollen-ui-riot-js/src/main/web/tag/components/MultiLineLabel.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/components/MultiLineLabel.tag.html @@ -20,7 +20,7 @@ --> <MultiLineLabel> - <span ref="label"></span> + <p ref="label"></p> <script> this.on("update", () => { 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 871a1917..02dd2f73 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 @@ -20,40 +20,44 @@ --> import "./Report.tag.html"; import "../components/MultiLineLabel.tag.html"; -<ChoiceView> - <label class="choice-view {center-choice : opts.center} - {with-info : opts.choice.choiceType === 'RESOURCE' || opts.choice.description && !opts.showdescription}" - onclick={openModalImage} - title={standardTooltip()} +<ChoiceView align="center"> + <label class="choice-view {center-choice : opts.center}" for ="{opts.choice.id}_voteValue"> - <span class="choice-text" - if={opts.choice.choiceType === "TEXT"}> - {opts.choice.choiceValue} - </span> - <span class="choice-date" - if={opts.choice.choiceType === "DATE"}> - {formatDate(parseInt(opts.choice.choiceValue, 10),"L")} - </span> - <span class="choice-datetime" - if={opts.choice.choiceType === "DATETIME"}> - {formatDate(parseInt(opts.choice.choiceValue, 10), "L LT")} - </span> - <div class="choice-ressource" - if={opts.choice.choiceType === "RESOURCE" && meta && isImage()}> - <img class="image-preview" src="{resourceService.getPreviewUrl(opts.choice.choiceValue)}" - alt="{opts.choice.description}" title="{opts.choice.description}"/> - </div> - <div class="choice-ressource" - if={opts.choice.choiceType === "RESOURCE" && meta && !isImage()}> - {meta.name} - </div> - <div if={opts.choice.choiceType === "RESOURCE" || opts.choice.description && !opts.showdescription} class="info-label"> - <i class="fa fa-question-circle" aria-hidden="true"></i> + <div style="display:contents;" ref="label"> + <span class="choice-text" + if={opts.choice.choiceType === "TEXT"}> + {opts.choice.choiceValue} + </span> + <span class="choice-date" + if={opts.choice.choiceType === "DATE"}> + {formatDate(parseInt(opts.choice.choiceValue, 10),"L")} + </span> + <span class="choice-datetime" + if={opts.choice.choiceType === "DATETIME"}> + {formatDate(parseInt(opts.choice.choiceValue, 10), "L LT")} + </span> + <div class="choice-ressource" + if={opts.choice.choiceType === "RESOURCE" && meta && isImage()}> + <img class="image-preview" src="{resourceService.getPreviewUrl(opts.choice.choiceValue)}" + alt="{opts.choice.description}" title="{opts.choice.description}"/> + </div> + <div class="choice-ressource" + if={opts.choice.choiceType === "RESOURCE" && meta && !isImage()}> + {meta.name} + </div> + <div if={opts.choice.choiceType === "RESOURCE"} class="info-label" onclick="{openModalImage}"> + <i class="fa fa-search" aria-hidden="true"></i> + </div> + <span if="{opts.choice.description && opts.showdescription}"> : + <MultiLineLabel class="italic" label="{opts.choice.description}"></MultiLineLabel> + </span> </div> - <span if="{opts.choice.description && opts.showdescription}"> : - <MultiLineLabel class="italic" label="{opts.choice.description}"></MultiLineLabel> - </span> </label> + <a href="#" if="{opts.choice.description && !opts.showdescription}" onclick="{openDetails}" ref="plusInfo" class="plusInfoLink"> + <i class="fa fa-arrow-circle-down" aria-hidden="true"></i> Plus d'infos</a> + <div if="{opts.choice.description && !opts.showdescription}" style="display:none;" ref="details" class=plusInfo"> + <MultiLineLabel label="{opts.choice && opts.choice.description}" class="boxed"></MultiLineLabel> + </div> <Report target="{opts.choice}" if="{!opts.hidereport}"/> <script type="es6"> @@ -65,6 +69,7 @@ import "../components/MultiLineLabel.tag.html"; this.resourceService = resourceService; this.installBundle(this.session, "choice"); this.showModalImage = false; + this.detailsOpened = false; if (this.opts.choice.choiceType === "RESOURCE") { this.resourceService.getMeta(this.opts.choice.choiceValue).then(meta => { @@ -81,30 +86,32 @@ import "../components/MultiLineLabel.tag.html"; return this.opts.tooltipPlacement ? "" : this.opts.choice.description; }; - this.openModalImage = () => { - if (this.opts.choice.description && !this.opts.showdescription || this.opts.choice.choiceType === "RESOURCE") { + this.openModalImage = (e) => { + e.preventDefault(); + if (this.opts.choice.choiceType === "RESOURCE") { this.bus.trigger("openChoiceDetail", this.opts.choice, this.meta); + } }; - if (this.opts.tooltipPlacement) { - this.on("mount", () => { - // On a besoin du premier div (.choice-view) car ça ne fonctionne pas sur le composant directement - let elem = this.root.children[0]; - let config = { - placement: this.opts.tooltipPlacement, - title: this.opts.choice.description - }; - this.tooltip = new Tooltip(elem, config); - }); - } + this.openDetails = (e) => { + e.preventDefault(); + if (this.opts.choice.description && !this.opts.showdescription || this.opts.choice.choiceType === "RESOURCE") { + if (this.detailsOpened) { + this.refs.details.style.display = "none"; + this.refs.plusInfo.innerHTML="<i class='fa fa-arrow-circle-down' aria-hidden='true'></i> Plus d'info"; + this.detailsOpened = false; + } else { + this.refs.details.style.display = "block"; + this.refs.plusInfo.innerHTML="<i class='fa fa-arrow-circle-up' aria-hidden='true'></i> Masquer"; + this.detailsOpened = true; + } + } + }; </script> <style> - choiceview { - display: flex; - } .choice-view { flex-grow: 1; @@ -119,6 +126,21 @@ import "../components/MultiLineLabel.tag.html"; cursor: pointer; } + .plusInfoLink { + text-align: center; + font-size: small; + display: block; + } + + .boxed p { + text-align: justify; + background: #f8f8f8; + padding: 10px; + border-radius: 3px; + border: 1px solid #eee; + margin: 5px; + } + .choice-ressource .image-preview{ max-width: 7em; max-height: 3em; diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/EditVote.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/EditVote.tag.html index 8c9b43ed..88e11ce6 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/EditVote.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/EditVote.tag.html @@ -478,5 +478,10 @@ padding: 0 0 0 1px; } + .current-choice { + flex-shrink:0; + margin-right:5px; + } + </style> </EditVote> diff --git a/pollen-ui-riot-js/src/main/web/tag/popup/ChoiceDetailModal.tag.html b/pollen-ui-riot-js/src/main/web/tag/popup/ChoiceDetailModal.tag.html index efcfee37..4f2caf5e 100644 --- a/pollen-ui-riot-js/src/main/web/tag/popup/ChoiceDetailModal.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/popup/ChoiceDetailModal.tag.html @@ -20,8 +20,7 @@ --> import "../components/MultiLineLabel.tag.html"; <ChoiceDetailModal> - <Modal header={title} - ref="modal" + <Modal ref="modal" only-ok="true"> <div if={parent.choice && parent.choice.choiceType === "RESOURCE" && parent.meta}> <img if={parent.isImage()} @@ -37,7 +36,6 @@ import "../components/MultiLineLabel.tag.html"; {parent._t.download} </a> </div> - <MultiLineLabel label="{parent.choice && parent.choice.description}"></MultiLineLabel> </Modal> <script type="es6"> @@ -51,13 +49,7 @@ import "../components/MultiLineLabel.tag.html"; this.open = (choice, meta) => { this.choice = choice; this.meta = meta; - if (this.choice.choiceType === "TEXT") { - this.title = this.choice.choiceValue; - } else if (this.choice.choiceType === "DATE") { - this.title = this.formatDate(parseInt(this.choice.choiceValue, 10), "LLL"); - } else if (this.choice.choiceType === "DATETIME") { - this.title = this.formatDate(parseInt(this.choice.choiceValue, 10)); - } else if (this.choice.choiceType === "RESOURCE") { + if (this.choice.choiceType === "RESOURCE") { this.title = this.meta && this.meta.name; } let promise = this.refs.modal.open().then(() => { -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.
participants (1)
-
chorem.org scm