From b4cb801bcb8614c6ac7e420249b789e08bd82207 Mon Sep 17 00:00:00 2001 From: iou1name Date: Fri, 7 Sep 2018 12:56:13 -0400 Subject: [PATCH] added text post editing --- quest/events.py | 24 +++++++++++++++++++++++ quest/static/quest.css | 5 +++++ quest/static/questQM.js | 42 +++++++++++++++++++++++++++++------------ todo | 2 -- 4 files changed, 59 insertions(+), 14 deletions(-) diff --git a/quest/events.py b/quest/events.py index 4d87f41..64ec613 100644 --- a/quest/events.py +++ b/quest/events.py @@ -261,6 +261,30 @@ def poll_post(socket, data): socket.send('new_post', data) +def edit_post(socket, data): + """ + Called when the QM saves an edited post. + """ + post_id = data.get('post_id') + post_text = data.get('post_text') + + # cleaning + post_text = bleach.clean(post_text.strip()) + post_text = post_text.replace("\n", "
") + + # handle image + + p = Post.objects.get(id=post_id) + p.post_text = post_text + p.save() + + data = {} + data['post_text'] = post_text + data['post_type'] = 'text' + data['post_id'] = p.id + socket.send('update_post', data) + + def close_post(socket, data): """ Called when the QM closes an open post. diff --git a/quest/static/quest.css b/quest/static/quest.css index 768a5d7..ef7829f 100644 --- a/quest/static/quest.css +++ b/quest/static/quest.css @@ -37,6 +37,11 @@ h3 { display: flex; } +.editPostText { + width: 100%; + box-sizing: border-box; +} + #QMPostTabs { display: inline-block; list-style-type: none; diff --git a/quest/static/questQM.js b/quest/static/questQM.js index 61a1a3a..e017228 100644 --- a/quest/static/questQM.js +++ b/quest/static/questQM.js @@ -12,7 +12,7 @@ socket.events['new_post'] = function(data) { post_str += '
' + data.date; /* QM only */ if (data.post_type === 'text') { - post_str += '
Edit'; + post_str += '
Edit'; post_str += ''; } else if (data.post_type === 'dice' || data.post_type === 'poll') { post_str += '
Close'; @@ -53,6 +53,15 @@ function makePost() { if (text === '') { return; } socket.send('text_post', {text: text, page_num: page_num, quest_id: quest_id}); } +function save_post(post_id) { + let post = document.getElementById('questPostData-' + post_id); + let post_text = post.firstElementChild.value.trim(); + socket.send('edit_post', {post_text: post_text, post_id: post_id}); + post_text = post_text.replace(/\n/g, '
') + post.innerHTML = post_text; + document.getElementById('savePost-' + post_id).style.display = 'none'; + document.getElementById('editPost-' + post_id).style.display = 'initial'; +} function form_post(form_id, event) { let formData = new FormData(document.getElementById(form_id)); let obj = {}; @@ -86,17 +95,14 @@ function open_post_send(post_id) { } /* DOM editing */ -function openPostTab(event, modeName) { - let QMPostTabContent = document.getElementsByClassName("QMPostTabContent"); - for (let i = 0; i < QMPostTabContent.length; i++) { - QMPostTabContent[i].style.display = "none"; - } - let QMPostTab = document.getElementsByClassName("QMPostTab"); - for (let i = 0; i < QMPostTab.length; i++) { - QMPostTab[i].className = QMPostTab[i].className.replace(" active", ""); - } - document.getElementById(modeName).style.display = "block"; - event.currentTarget.className += " active"; +function edit_post(post_id) { + let post = document.getElementById('questPostData-' + post_id); + let post_text = post.innerHTML.trim(); + post_text = post_text.replace(/
/g, '\n'); + post.innerHTML = ''; + post.firstElementChild.style.height = post.firstElementChild.scrollHeight + 'px'; + document.getElementById('savePost-' + post_id).style.display = 'initial'; + document.getElementById('editPost-' + post_id).style.display = 'none'; } function close_post(post_id) { let post = document.getElementById('questPostData-' + post_id); @@ -137,6 +143,18 @@ function open_post(post_id) { } } } +function openPostTab(event, modeName) { + let QMPostTabContent = document.getElementsByClassName("QMPostTabContent"); + for (let i = 0; i < QMPostTabContent.length; i++) { + QMPostTabContent[i].style.display = "none"; + } + let QMPostTab = document.getElementsByClassName("QMPostTab"); + for (let i = 0; i < QMPostTab.length; i++) { + QMPostTab[i].className = QMPostTab[i].className.replace(" active", ""); + } + document.getElementById(modeName).style.display = "block"; + event.currentTarget.className += " active"; +} function insertPollOption() { let opts = document.getElementById('pollOptions'); let num = opts.children.length+1; diff --git a/todo b/todo index d7761c1..c5fe03a 100644 --- a/todo +++ b/todo @@ -16,7 +16,6 @@ Quote backlinks Make chat hideable Improvements: -Revamp post editing More options for text posts (lists and so on) More rigorous input checking in events.py New post displays chat message @@ -30,5 +29,4 @@ Only last 100 (50?) chat messages are loaded on page load Adjust quote preview postioning Port from old code: -Edit post Images