diff --git a/customize.dist/pages.js b/customize.dist/pages.js index 5bf87b928..b944e2624 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -646,12 +646,13 @@ define([ ]), h('div.cp-app-poll-realtime', [ h('br'), - h('center', [ + h('div', [ h('textarea#cp-app-poll-description', { rows: "5", cols: "50", disabled: true }), + h('div#cp-app-poll-description-published'), h('br') ]), h('div#cp-app-poll-table-container', [ diff --git a/www/common/metadata-manager.js b/www/common/metadata-manager.js index e319c3ecb..1c8994d00 100644 --- a/www/common/metadata-manager.js +++ b/www/common/metadata-manager.js @@ -68,7 +68,6 @@ define(['json.sortify'], function (Sortify) { }; var change = function (lazy) { dirty = true; - console.error('METADATA CHANGE CALLED'); setTimeout(function () { checkUpdate(lazy); }); diff --git a/www/common/sframe-common-codemirror.js b/www/common/sframe-common-codemirror.js index 6686a9a55..098972161 100644 --- a/www/common/sframe-common-codemirror.js +++ b/www/common/sframe-common-codemirror.js @@ -9,6 +9,58 @@ define([ var saveAs = window.saveAs; var module = {}; + var cursorToPos = function(cursor, oldText) { + var cLine = cursor.line; + var cCh = cursor.ch; + var pos = 0; + var textLines = oldText.split("\n"); + for (var line = 0; line <= cLine; line++) { + if(line < cLine) { + pos += textLines[line].length+1; + } + else if(line === cLine) { + pos += cCh; + } + } + return pos; + }; + + var posToCursor = function(position, newText) { + var cursor = { + line: 0, + ch: 0 + }; + var textLines = newText.substr(0, position).split("\n"); + cursor.line = textLines.length - 1; + cursor.ch = textLines[cursor.line].length; + return cursor; + }; + + module.setValueAndCursor = function (editor, oldDoc, remoteDoc, TextPatcher) { + var scroll = editor.getScrollInfo(); + //get old cursor here + var oldCursor = {}; + oldCursor.selectionStart = cursorToPos(editor.getCursor('from'), oldDoc); + oldCursor.selectionEnd = cursorToPos(editor.getCursor('to'), oldDoc); + + editor.setValue(remoteDoc); + editor.save(); + + var op = TextPatcher.diff(oldDoc, remoteDoc); + var selects = ['selectionStart', 'selectionEnd'].map(function (attr) { + return TextPatcher.transformCursor(oldCursor[attr], op); + }); + + if(selects[0] === selects[1]) { + editor.setCursor(posToCursor(selects[0], remoteDoc)); + } + else { + editor.setSelection(posToCursor(selects[0], remoteDoc), posToCursor(selects[1], remoteDoc)); + } + + editor.scrollTo(scroll.left, scroll.top); + }; + module.create = function (Common, defaultMode, CMeditor) { var exp = {}; var Messages = Cryptpad.Messages; @@ -253,56 +305,8 @@ define([ onLocal(); }; - var cursorToPos = function(cursor, oldText) { - var cLine = cursor.line; - var cCh = cursor.ch; - var pos = 0; - var textLines = oldText.split("\n"); - for (var line = 0; line <= cLine; line++) { - if(line < cLine) { - pos += textLines[line].length+1; - } - else if(line === cLine) { - pos += cCh; - } - } - return pos; - }; - - var posToCursor = function(position, newText) { - var cursor = { - line: 0, - ch: 0 - }; - var textLines = newText.substr(0, position).split("\n"); - cursor.line = textLines.length - 1; - cursor.ch = textLines[cursor.line].length; - return cursor; - }; - exp.setValueAndCursor = function (oldDoc, remoteDoc, TextPatcher) { - var scroll = editor.getScrollInfo(); - //get old cursor here - var oldCursor = {}; - oldCursor.selectionStart = cursorToPos(editor.getCursor('from'), oldDoc); - oldCursor.selectionEnd = cursorToPos(editor.getCursor('to'), oldDoc); - - editor.setValue(remoteDoc); - editor.save(); - - var op = TextPatcher.diff(oldDoc, remoteDoc); - var selects = ['selectionStart', 'selectionEnd'].map(function (attr) { - return TextPatcher.transformCursor(oldCursor[attr], op); - }); - - if(selects[0] === selects[1]) { - editor.setCursor(posToCursor(selects[0], remoteDoc)); - } - else { - editor.setSelection(posToCursor(selects[0], remoteDoc), posToCursor(selects[1], remoteDoc)); - } - - editor.scrollTo(scroll.left, scroll.top); + return module.setValueAndCursor(editor, oldDoc, remoteDoc, TextPatcher); }; return exp; diff --git a/www/common/sframe-common-title.js b/www/common/sframe-common-title.js index b716c090e..6e0712011 100644 --- a/www/common/sframe-common-title.js +++ b/www/common/sframe-common-title.js @@ -41,7 +41,6 @@ define(['jquery'], function ($) { }; metadataMgr.onChange(function () { - console.error('METADATA CHANGE'); var md = metadataMgr.getMetadata(); if ($title) { $title.find('span.cp-toolbar-title-value').text(md.title || md.defaultTitle); diff --git a/www/poll/app-poll.less b/www/poll/app-poll.less index f310acf9f..4c2ecadae 100644 --- a/www/poll/app-poll.less +++ b/www/poll/app-poll.less @@ -21,6 +21,8 @@ @poll-td-bg: @poll-th-bg; @poll-td-fg: @poll-th-fg; +@poll-help-bg: #bbffbb; // lightgreen + @poll-uncommitted-cell: #eee; @poll-uncommitted-bg: #ddd; //lighten(@poll-th-bg, 50%); @poll-uncommitted-text: black; @@ -116,29 +118,48 @@ table#cp-app-poll-table { display: inline-block; } #cp-app-poll-description { + &~ .CodeMirror { + margin: auto; + min-width: 80%; + width: 80%; + min-height: 200px; + border: 1px solid black; + } +} +#cp-app-poll-description-published { + display: none; padding: 15px; margin: auto; min-width: 80%; width: 80%; min-height: 7em; - font: @colortheme_app-font; - //font-size: 20px; - /*font-weight: bold;*/ - border: 1px solid black; - -} -#cp-app-poll-description[disabled] { - resize: none; color: #000; border: 1px solid transparent; background-color: #eeeeee; font: @colortheme_app-font; + text-align: left; +} +.cp-app-poll-published { + #cp-app-poll-description { + display: none; + &~ .CodeMirror { + display: none; + } + } + #cp-app-poll-description-published { + display: block; + &:empty { + display: none; + } + } } #cp-app-poll-help { - width: 80%; + width: 100%; margin: auto; + padding: 20px 10%; + background: @poll-help-bg; } // from cryptpad.less diff --git a/www/poll/inner.js b/www/poll/inner.js index d8610ae9e..23b565ac9 100644 --- a/www/poll/inner.js +++ b/www/poll/inner.js @@ -12,6 +12,12 @@ define([ '/common/sframe-chainpad-listmap.js', '/customize/pages.js', '/poll/render.js', + '/common/diffMarked.js', + '/common/sframe-common-codemirror.js', + + 'cm/lib/codemirror', + 'cm/mode/markdown/markdown', + 'css!cm/lib/codemirror.css', '/bower_components/file-saver/FileSaver.min.js', @@ -31,7 +37,10 @@ define([ AppConfig, Listmap, Pages, - Renderer) + Renderer, + DiffMd, + SframeCM, + CMeditor) { var Messages = Cryptpad.Messages; var saveAs = window.saveAs; @@ -138,7 +147,7 @@ define([ Set the user id (user column) in the pad attributes */ var setUserId = function (id, cb) { - cb =cb || $.noop; + cb = cb || $.noop; APP.userid = id; common.setPadAttribute('userid', id, function (e) { if (e) { @@ -213,6 +222,7 @@ define([ var styleUserColumn = function () { var userid = APP.userid; + if (!userid) { return; } // Enable input for the userid column $('input[disabled="disabled"][data-rt-id^="' + userid + '"]').removeAttr('disabled') @@ -538,6 +548,7 @@ define([ /* Called whenever an event is fired on a span */ var handleSpan = function (span) { + if (!span) { return; } var id = span.getAttribute('data-rt-id'); var type = Render.typeofId(id); var isRemove = span.className && span.className.split(' ') @@ -570,6 +581,7 @@ define([ if (!res) { return; } Render.removeColumn(APP.proxy, id, function () { change(); + if (id === APP.userid) { setUserId(''); } }); }); } else if (isBookmark) { @@ -674,9 +686,9 @@ define([ bool = true; } setTablePublished(bool); - ['textarea'].forEach(function (sel) { + /*['textarea'].forEach(function (sel) { $(sel).attr('disabled', bool); - }); + });*/ updatePublishButton(); }; @@ -722,23 +734,19 @@ define([ } }; + var updatePublishedDescription = function () { + var v = APP.editor.getValue(); + DiffMd.apply(DiffMd.render(v || Messages.poll_descriptionHint), APP.$descriptionPublished); + }; var updateDescription = function (old, n) { var o = APP.$description.val(); - var op = TextPatcher.diff(o, n || ''); - var el = APP.$description[0]; - - var selects = ['selectionStart', 'selectionEnd'].map(function (attr) { - return TextPatcher.transformCursor(el[attr], op); - }); - APP.$description.val(n); - if (op) { - el.selectionStart = selects[0]; - el.selectionEnd = selects[1]; - } + SframeCM.setValueAndCursor(APP.editor, o, n, TextPatcher); + updatePublishedDescription(); common.notify(); }; var updateLocalDescription = function (n) { APP.proxy.description = n; + updatePublishedDescription(); }; var onReady = function (info, userid) { @@ -847,6 +855,7 @@ define([ APP.$createCol = $('#cp-app-poll-create-user').click(function () { var uncommittedCopy = { content: getUncommitted('col') }; var id = uncommittedCopy.content.colsOrder[0]; + if (!APP.userid) { setUserId(id); } mergeUncommitted(proxy, uncommittedCopy, true); change(null, null, null, null, function() { handleSpan($('.cp-app-poll-table-lock[data-rt-id="' + id + '"]')[0]); @@ -861,21 +870,11 @@ define([ }); }); - if (!APP.readOnly) { - setUserId(userid); - } - // Description - var resize = function () { - var lineCount = APP.$description.val().split('\n').length; - APP.$description.css('height', lineCount + 'rem'); - }; - APP.$description.on('change keyup', function () { - var val = APP.$description.val(); + APP.editor.on('change', function () { + var val = APP.editor.getValue(); updateLocalDescription(val); - resize(); }); - resize(); $('#cp-app-poll-table-scroll').html('').prepend($table); updateDisplayedTable(); @@ -1031,9 +1030,18 @@ define([ APP.$body = $('body'); APP.$bar = $('#cp-toolbar'); APP.$content = $('#cp-app-poll-content'); + APP.$descriptionPublished = $('#cp-app-poll-description-published'); APP.$description = $('#cp-app-poll-description') .attr('placeholder', Messages.poll_descriptionHint || 'description'); + APP.editor = CMeditor.fromTextArea(APP.$description[0], { + lineNumbers: true, + lineWrapping: true, + styleActiveLine : true, + mode: "markdown", + }); + + var listmapConfig = { data: {}, common: common,