From 846b1a9fb33f6df139bd2dee2def842fda4073d8 Mon Sep 17 00:00:00 2001 From: yflory Date: Wed, 4 Oct 2017 15:39:18 +0200 Subject: [PATCH] Improve description UI in poll. Enable tags and mediatag --- customize.dist/pages.js | 1 + customize.dist/translations/messages.fr.js | 4 +- customize.dist/translations/messages.js | 4 +- www/poll/app-poll.less | 7 +++ www/poll/inner.js | 53 ++++++++++++++++++++-- 5 files changed, 62 insertions(+), 7 deletions(-) diff --git a/customize.dist/pages.js b/customize.dist/pages.js index b944e2624..9e249b6db 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -650,6 +650,7 @@ define([ h('textarea#cp-app-poll-description', { rows: "5", cols: "50", + placeholder: Msg.poll_descriptionHint, disabled: true }), h('div#cp-app-poll-description-published'), diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js index fb04d7bc0..0c2756d49 100644 --- a/customize.dist/translations/messages.fr.js +++ b/customize.dist/translations/messages.fr.js @@ -246,7 +246,9 @@ define(function () { out.poll_removeUser = "Êtes-vous sûr de vouloir supprimer cet utilisateur ?"; out.poll_titleHint = "Titre"; - out.poll_descriptionHint = "Description"; + out.poll_descriptionHint = "Décrivez votre sondage puis cliquer sur le bouton ✓ (Publier).\n" + + "La description peut contenir de la syntaxe markdown, et vous pouvez y ajouter des images stockées dans votre CryptDrive.\n" + + "Toutes les personnes possédant le lien d'édition de ce sondage peuvent modifier la description, bien que ce soit déconseillé."; out.poll_remove = "Supprimer"; out.poll_edit = "Modifier"; diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js index 755c52a53..29c969628 100644 --- a/customize.dist/translations/messages.js +++ b/customize.dist/translations/messages.js @@ -248,7 +248,9 @@ define(function () { out.poll_removeUser = "Are you sure you'd like to remove this user?"; out.poll_titleHint = "Title"; - out.poll_descriptionHint = "Describe your poll, and use the 'publish' button when you're done. Anyone with the link can change the description, but this is discouraged."; + out.poll_descriptionHint = "Describe your poll, and use the ✓ (publish) button when you're done.\n" + + "The description can be written using markdown syntax and you can embed media elements from your CryptDrive.\n" + + "Anyone with the link can change the description, but this is discouraged."; out.poll_remove = "Remove"; out.poll_edit = "Edit"; diff --git a/www/poll/app-poll.less b/www/poll/app-poll.less index 4c2ecadae..b6ed472cb 100644 --- a/www/poll/app-poll.less +++ b/www/poll/app-poll.less @@ -124,6 +124,9 @@ table#cp-app-poll-table { width: 80%; min-height: 200px; border: 1px solid black; + .CodeMirror-placeholder { + color: #777; + } } } #cp-app-poll-description-published { @@ -139,6 +142,10 @@ table#cp-app-poll-table { background-color: #eeeeee; font: @colortheme_app-font; text-align: left; + media-tag > * { + max-width: 100%; + max-height: 20em; + } } .cp-app-poll-published { #cp-app-poll-description { diff --git a/www/poll/inner.js b/www/poll/inner.js index 23b565ac9..8e7bd8af3 100644 --- a/www/poll/inner.js +++ b/www/poll/inner.js @@ -16,6 +16,7 @@ define([ '/common/sframe-common-codemirror.js', 'cm/lib/codemirror', + 'cm/addon/display/placeholder', 'cm/mode/markdown/markdown', 'css!cm/lib/codemirror.css', @@ -685,11 +686,13 @@ define([ // If readOnly, always put the app in published mode bool = true; } + $(APP.$mediaTagButton).toggle(!bool); setTablePublished(bool); /*['textarea'].forEach(function (sel) { $(sel).attr('disabled', bool); });*/ updatePublishButton(); + APP.editor.refresh(); }; var updateHelpButton = function () { @@ -736,10 +739,11 @@ define([ var updatePublishedDescription = function () { var v = APP.editor.getValue(); - DiffMd.apply(DiffMd.render(v || Messages.poll_descriptionHint), APP.$descriptionPublished); + DiffMd.apply(DiffMd.render(v || ''), APP.$descriptionPublished); }; var updateDescription = function (old, n) { - var o = APP.$description.val(); + var o = APP.editor.getValue(); + console.error(n); SframeCM.setValueAndCursor(APP.editor, o, n, TextPatcher); updatePublishedDescription(); common.notify(); @@ -749,6 +753,18 @@ define([ updatePublishedDescription(); }; + var checkDeletedCells = function () { + // faster than forEach? + var c; + for (var k in APP.proxy.content.cells) { + c = Render.getCoordinates(k); + if (APP.proxy.content.colsOrder.indexOf(c[0]) === -1 || + APP.proxy.content.rowsOrder.indexOf(c[1]) === -1) { + console.log('deleting ' + k); + delete APP.proxy.content.cells[k]; + } + } + }; var onReady = function (info, userid) { var proxy = APP.proxy; @@ -767,6 +783,8 @@ define([ proxy.content = proxy.table; delete proxy.table; } + checkDeletedCells(); + if (proxy && proxy.metadata) { metadataMgr.updateMetadata(proxy.metadata); } @@ -878,7 +896,7 @@ define([ $('#cp-app-poll-table-scroll').html('').prepend($table); updateDisplayedTable(); - updateDescription(null, APP.proxy.description); + updateDescription(null, APP.proxy.description || ''); $table .click(handleClick) @@ -998,6 +1016,31 @@ define([ .click(function () { publish(!APP.proxy.published); }).appendTo($rightside); APP.$publishButton = $publish; updatePublishButton(); + + var fileDialogCfg = { + onSelect: function (data) { + if (data.type === 'file' && APP.editor) { + var mt = ''; + APP.editor.replaceSelection(mt); + return; + } + } + }; + common.initFilePicker(fileDialogCfg); + APP.$mediaTagButton = $('