diff --git a/customize.dist/pages.js b/customize.dist/pages.js index 9e249b6db..1f28dfcb9 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -664,6 +664,19 @@ define([ h('button#cp-app-poll-create-option.btn.btn-secondary', { title: Msg.poll_create_option }, h('span.fa.fa-plus')), + ]), + h('div#cp-app-poll-comments', [ + h('h2#cp-app-poll-comments-add-title', "TODO: add comment"), + h('div#cp-app-poll-comments-add', [ + h('input.cp-app-poll-comments-add-name', { + type: 'text' + }), + h('textarea.cp-app-poll-comments-add-msg'), + h('button.cp-app-poll-comments-add-submit', "TODO: SUBMIT"), + h('button.cp-app-poll-comments-add-cancel', "TODO: CANCEL") + ]), + h('h2#cp-app-poll-comments-list-title', "TODO: comments"), + h('div#cp-app-poll-comments-list') ]) ]) ]) diff --git a/www/common/toolbar3.js b/www/common/toolbar3.js index 75102b1ad..6433906d6 100644 --- a/www/common/toolbar3.js +++ b/www/common/toolbar3.js @@ -228,7 +228,7 @@ define([ $span.append($rightCol); } else { Common.displayAvatar($span, data.avatar, name, function ($img) { - if (data.avatar && $img) { + if (data.avatar && $img.length) { avatars[data.avatar] = $img[0].outerHTML; } $span.append($rightCol); diff --git a/www/poll/app-poll.less b/www/poll/app-poll.less index b6ed472cb..2b109314b 100644 --- a/www/poll/app-poll.less +++ b/www/poll/app-poll.less @@ -5,6 +5,7 @@ @import (once) '../../customize/src/less2/include/alertify.less'; @import (once) '../../customize/src/less2/include/tokenfield.less'; @import (once) '../../customize/src/less2/include/tools.less'; +@import (once) '../../customize/src/less2/include/avatar.less'; .toolbar_main(); .fileupload_main(); @@ -487,6 +488,65 @@ div.cp-app-poll-realtime { display: none; } } + #cp-app-poll-comments { + width: 50%; + margin: 20px auto; + min-width: 400px; + #cp-app-poll-comments-add { + input, textarea { + border: 1px solid black; + width: 90%; + margin: 5px 5%; + } + input { + padding: 5px; + height: 26px; + &[disabled] { + background: #eee; + } + } + textarea { + padding: 5px; + height: 8em; + line-height: 1.5em; + } + text-align: center; + } + #cp-app-poll-comments-list { + .cp-app-poll-comments-list-el { + width: 90%; + margin: 5px 5%; + } + .cp-app-poll-comments-list-msg { + display: flex; + background: #eee; + padding: 5px 10px; + .cp-app-poll-comments-list-msg-text { + flex: 1; + white-space: pre; + } + .cp-app-poll-comments-list-msg-actions { + button { + border-radius: 0; + width: 25px; + padding: 0; + line-height: 20px; + } + } + } + .cp-app-poll-comments-list-data { + background: #ddd; + padding: 5px 10px; + display: flex; + align-items: center; + .cp-app-poll-comments-list-data-name { + margin-left: 10px; + flex: 1; + } + .cp-app-poll-comments-list-data-avatar { .avatar_main(30px); } + } + } + } } .btn { diff --git a/www/poll/inner.js b/www/poll/inner.js index 8e7bd8af3..4a2d90ffc 100644 --- a/www/poll/inner.js +++ b/www/poll/inner.js @@ -743,7 +743,6 @@ define([ }; var updateDescription = function (old, n) { var o = APP.editor.getValue(); - console.error(n); SframeCM.setValueAndCursor(APP.editor, o, n, TextPatcher); updatePublishedDescription(); common.notify(); @@ -753,6 +752,119 @@ define([ updatePublishedDescription(); }; + var getCommentId = Render.Uid('c'); + var removeComment = function (uid) { + var idx; + APP.proxy.comments.some(function (c, i) { + if (c.uid === uid) { + console.log('found'); + idx = i; + return true; + } + }); + if (idx) { + APP.proxy.comments.splice(idx, 1); + } + APP.updateComments(); + }; + /*var editComment = function (id) { + // TODO + };*/ + var avatars = {}; + var updateComments = APP.updateComments = function () { + if (!APP.proxy.comments) { APP.proxy.comments = []; } + + var profile; + if (common.isLoggedIn()) { + profile = metadataMgr.getUserData().profile; + } + + var $comments = APP.$comments.html(''); + var comments = APP.proxy.comments; + comments.forEach(function (c) { + var $c = $('
', { + 'class': 'cp-app-poll-comments-list-el' + }).prependTo($comments); + // Metadata + var $data = $('
', { 'class': 'cp-app-poll-comments-list-data' }).appendTo($c); + var $avatar = $('', { + 'class': 'cp-app-poll-comments-list-data-avatar cp-avatar' + }).appendTo($data); + if (c.avatar && avatars[c.avatar]) { + $avatar.append(avatars[c.avatar]); + } else { + common.displayAvatar($avatar, c.avatar, c.name, function ($img) { + if (c.avatar && $img.length) { avatars[c.avatar] = $img[0].outerHTML; } + }); + } + if (c.profile) { + $('', { + 'href': APP.origin + '/profile/#' + c.profile, + 'target': '_blank', + 'class': 'cp-app-poll-comments-list-data-name' + }).appendTo($data).text(c.name); + } else { + $('', { + 'class': 'cp-app-poll-comments-list-data-name' + }).appendTo($data).text(c.name); + } + $('', { + 'class': 'cp-app-poll-comments-list-data-time' + }).appendTo($data).text(new Date(c.time).toLocaleString()); + + // Message + var $msg = $('
', { 'class': 'cp-app-poll-comments-list-msg' }).appendTo($c); + $('
', { + 'class': 'cp-app-poll-comments-list-msg-text' + }).appendTo($msg).text(c.msg); + var $actions = $('
', { + 'class': 'cp-app-poll-comments-list-msg-actions' + }).appendTo($msg); + + // Actions + if (!c.profile || c.profile === profile) { + $('