write-in box added and split javascript into seperate files
This commit is contained in:
parent
742ee5b3e9
commit
6ae8adebad
13
anonkun.py
13
anonkun.py
|
|
@ -99,6 +99,19 @@ def get_dice_challenge(post_id):
|
||||||
return db.get_dice_call(post_id)[3]
|
return db.get_dice_call(post_id)[3]
|
||||||
|
|
||||||
|
|
||||||
|
@app.template_filter("is_write_in")
|
||||||
|
def is_write_in(post_id):
|
||||||
|
"""
|
||||||
|
Returns true if the provided post_id is a poll write-in's are
|
||||||
|
allowed in it.
|
||||||
|
"""
|
||||||
|
poll = db.get_poll(post_id)
|
||||||
|
if poll and poll[3]:
|
||||||
|
return True
|
||||||
|
else:
|
||||||
|
return False
|
||||||
|
|
||||||
|
|
||||||
@app.after_request
|
@app.after_request
|
||||||
def minify(res):
|
def minify(res):
|
||||||
"""
|
"""
|
||||||
|
|
|
||||||
|
|
@ -295,6 +295,12 @@ def insert_poll_option(post_id, option_text):
|
||||||
+ "(`post_id`, `option_text`) VALUES (%s, %s)",
|
+ "(`post_id`, `option_text`) VALUES (%s, %s)",
|
||||||
(post_id, option_text))
|
(post_id, option_text))
|
||||||
|
|
||||||
|
option_id = _DB.execute(
|
||||||
|
"SELECT `option_id` FROM `poll_options` WHERE `post_id` = %s " \
|
||||||
|
+ "ORDER BY `option_id` DESC",
|
||||||
|
(post_id,)).fetchone()[0]
|
||||||
|
return option_id
|
||||||
|
|
||||||
|
|
||||||
def get_poll_options(quest_id):
|
def get_poll_options(quest_id):
|
||||||
"""Gets all relevent poll options for a given quest or post."""
|
"""Gets all relevent poll options for a given quest or post."""
|
||||||
|
|
|
||||||
|
|
@ -296,8 +296,10 @@ def poll_post(data):
|
||||||
|
|
||||||
post_id = db.insert_quest_post(room, "poll", post, date)
|
post_id = db.insert_quest_post(room, "poll", post, date)
|
||||||
db.insert_poll(post_id, room, multi_choice, allow_writein)
|
db.insert_poll(post_id, room, multi_choice, allow_writein)
|
||||||
|
new_options = []
|
||||||
for option in options:
|
for option in options:
|
||||||
db.insert_poll_option(post_id, option)
|
option_id = db.insert_poll_option(post_id, option)
|
||||||
|
new_options.append((option_id, option))
|
||||||
db.set_post_open(post_id, room)
|
db.set_post_open(post_id, room)
|
||||||
|
|
||||||
data = {}
|
data = {}
|
||||||
|
|
@ -305,7 +307,7 @@ def poll_post(data):
|
||||||
data["post_id"] = post_id
|
data["post_id"] = post_id
|
||||||
data["post_type"] = "poll"
|
data["post_type"] = "poll"
|
||||||
data["date"] = int(time.time())
|
data["date"] = int(time.time())
|
||||||
data["options"] = options
|
data["options"] = new_options
|
||||||
emit("new_post", data, room=room)
|
emit("new_post", data, room=room)
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -336,6 +338,7 @@ def vote(data):
|
||||||
data["option_id"] = vote[0]
|
data["option_id"] = vote[0]
|
||||||
data["polarity"] = False
|
data["polarity"] = False
|
||||||
emit("vote", data, room=room)
|
emit("vote", data, room=room)
|
||||||
|
emit("toggle_option_box", data, room=request.sid)
|
||||||
|
|
||||||
db.insert_poll_vote(option_id, ip_address)
|
db.insert_poll_vote(option_id, ip_address)
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -163,6 +163,10 @@ h3 {
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#writeinInput {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
#chatPane {
|
#chatPane {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
|
|
|
||||||
212
static/anonkunQM.js
Normal file
212
static/anonkunQM.js
Normal file
|
|
@ -0,0 +1,212 @@
|
||||||
|
document.execCommand("defaultParagraphSeparator", false, "br");
|
||||||
|
var socket;
|
||||||
|
var tid = setInterval( function () {
|
||||||
|
if ( document.readyState !== 'complete' ) return;
|
||||||
|
clearInterval( tid );
|
||||||
|
|
||||||
|
document.getElementById('chatWindow').scrollTop = document.getElementById('chatWindow').scrollHeight;
|
||||||
|
socket = io.connect('https://' + document.domain + ':' + location.port);
|
||||||
|
socket.on('connect', function() {
|
||||||
|
socket.emit('joined', {room: room_id});
|
||||||
|
});
|
||||||
|
socket.on('message', function(data) {
|
||||||
|
let msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
|
||||||
|
msg_str += '<span class="messageDate">' + strftime(data.date) + '</span></div>';
|
||||||
|
msg_str += '<div class="message">' + data.message + '</div><hr>';
|
||||||
|
|
||||||
|
let mbox = document.getElementById('chatWindow');
|
||||||
|
mbox.innerHTML = mbox.innerHTML + msg_str;
|
||||||
|
mbox.scrollTop = mbox.scrollHeight;
|
||||||
|
});
|
||||||
|
socket.on('new_post', function(data) {
|
||||||
|
deactivate_post();
|
||||||
|
let qposts = document.getElementById('questPosts');
|
||||||
|
let post_str = '<div class="questPost ';
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post_str += 'textPost">';
|
||||||
|
} else if (data.post_type == 'dice') {
|
||||||
|
post_str += 'dicePost active_post">';
|
||||||
|
} else if (data.post_type == 'poll') {
|
||||||
|
post_str += 'pollPost active_post">';
|
||||||
|
}
|
||||||
|
post_str += '<div class="questPostMeta">' + strftime(data.date);
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post_str += '<br /><a href="javascript:void(0);" onclick="edit_post(\'' + data.post_id + '\')">Edit</a>';
|
||||||
|
post_str += '<a href="javascript:void(0);" id="savePost-' + data.post_id + '" onclick="save_post(\'' + data.post_id + '\')" style="display:none;">Save</a>';
|
||||||
|
} else if (data.post_type == 'dice' || data.post_type == 'poll') {
|
||||||
|
post_str += '<br /><a href="javascript:void(0);" id="close_post_id-' + data.post_id + '" onclick="close_post(' + data.post_id + ')">Close</a>';
|
||||||
|
post_str += '<a href="javascript:void(0);" id="open_post_id-' + data.post_id + '" onclick="open_post(' + data.post_id + ')" style="display:none;">Open</a>'
|
||||||
|
}
|
||||||
|
post_str += '</div><div class="questPostData" id="questPostData-' + data.post_id + '">';
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post_str += data.post;
|
||||||
|
} else if (data.post_type == 'dice') {
|
||||||
|
post_str += '<h3>' + data.post + ' - Open</h3>';
|
||||||
|
} else if (data.post_type == 'poll') {
|
||||||
|
post_str += '<h3>' + data.post + ' - Open</h3>';
|
||||||
|
post_str += '<table class="poll" id="post-' + data.post_id + '">';
|
||||||
|
post_str += '<col/><col/><col/>';
|
||||||
|
for (i = 0; i < data.options.length; i++) {
|
||||||
|
post_str += '<tr id="optionRow-' + data.options[i][0] + '">';
|
||||||
|
post_str += '<td class="pollCheckBox"><input type="checkbox" id="pollInput-' + data.options[i][0] + '" onchange="pollVote(' + data.post_id + ',' + data.options[i][0] + ')"/>';
|
||||||
|
post_str += '<label for="pollInput-' + data.options[i][0] + '"></label></td>';
|
||||||
|
post_str += '<td class="option_text">' + data.options[i][1] + '</td>';
|
||||||
|
post_str += '<td class="optionVotes">0</td></tr>';
|
||||||
|
}
|
||||||
|
post_str += '</table>';
|
||||||
|
}
|
||||||
|
post_str += '</div></div><br />';
|
||||||
|
qposts.innerHTML = qposts.innerHTML + post_str;
|
||||||
|
});
|
||||||
|
socket.on('update_post', function(data) {
|
||||||
|
let post_id = data.post_id;
|
||||||
|
let post = document.getElementById('questPostData-' + post_id);
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post.innerHTML = data.post;
|
||||||
|
}
|
||||||
|
else if (data.post_type == 'dice') {
|
||||||
|
post.innerHTML += '<b>' + data.post + '</b><br />';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('close_post', function(data) {
|
||||||
|
let post = document.getElementById('questPostData-' + data.post_id);
|
||||||
|
post.children[0].textContent = post.children[0].textContent.replace('Open', 'Closed');
|
||||||
|
document.getElementById('close_post_id-' + data.post_id).style.display = 'none';
|
||||||
|
document.getElementById('open_post_id-' + data.post_id).style.display = 'initial';
|
||||||
|
if (post.parentElement.classList.contains('pollPost')) {
|
||||||
|
let table = document.getElementById('poll-' + data.post_id);
|
||||||
|
table.getElementsByTagName("col")[0].style.visibility = 'collapse';
|
||||||
|
let writein = document.getElementById('writeinContainer');
|
||||||
|
if (writein) {
|
||||||
|
writein.style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('open_post', function(data) {
|
||||||
|
let post = document.getElementById('questPostData-' + data.post_id);
|
||||||
|
post.firstElementChild.textContent = post.firstElementChild.textContent.replace('Closed', 'Open');
|
||||||
|
document.getElementById('close_post_id-' + data.post_id).style.display = 'initial';
|
||||||
|
document.getElementById('open_post_id-' + data.post_id).style.display = 'none';
|
||||||
|
if (post.parentElement.classList.contains('pollPost')) {
|
||||||
|
table = document.getElementById('poll-' + data.post_id);
|
||||||
|
table.getElementsByTagName("col")[0].style.visibility = '';
|
||||||
|
let writein = document.getElementById('writeinContainer');
|
||||||
|
if (writein) {
|
||||||
|
writein.style.display = 'initial';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('vote', function(data) {
|
||||||
|
let row = document.getElementById('optionRow-' + data.option_id);
|
||||||
|
if (data.polarity) {
|
||||||
|
row.cells[2].textContent = Number(row.cells[2].textContent) + 1;
|
||||||
|
} else {
|
||||||
|
row.cells[2].textContent = Number(row.cells[2].textContent) - 1;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('toggle_option_box', function(data) {
|
||||||
|
document.getElementById('pollInput-' + data.option_id).checked = data.polarity;
|
||||||
|
});
|
||||||
|
let mtarea = document.getElementById('messageTextArea');
|
||||||
|
mtarea.addEventListener('keypress', function(event) {
|
||||||
|
if (event.key == 'Enter' && !event.shiftKey) {
|
||||||
|
let text = mtarea.value.trim();
|
||||||
|
mtarea.value = '';
|
||||||
|
if (text == '') { return; }
|
||||||
|
socket.emit('message', {message: text, name: 'Anonymous', room: room_id});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, 100 );
|
||||||
|
function padToTwo(number) {
|
||||||
|
if (number<=99) { number = ("0"+number).slice(-2); }
|
||||||
|
return number;
|
||||||
|
}
|
||||||
|
function strftime(date) {
|
||||||
|
date = new Date(date * 1000);
|
||||||
|
let date_str = date.getFullYear() + '-' + padToTwo(date.getMonth()+1) + '-' + padToTwo(date.getDate()) + ' ';
|
||||||
|
date_str += padToTwo(date.getHours()) + ':' + padToTwo(date.getMinutes()) + ':' + padToTwo(date.getSeconds());
|
||||||
|
return date_str;
|
||||||
|
}
|
||||||
|
function pollVote(post_id, option_id) {
|
||||||
|
let polarity = document.getElementById('pollInput-' + option_id).checked;
|
||||||
|
socket.emit('vote', {post_id: post_id, option_id: option_id, polarity: polarity, room: room_id});
|
||||||
|
}
|
||||||
|
function makePost() {
|
||||||
|
let qparea = document.getElementById('postTextArea');
|
||||||
|
let text = qparea.value.trim();
|
||||||
|
qparea.value = '';
|
||||||
|
if (text == '') { return; }
|
||||||
|
socket.emit('new_post', {post: text, room: room_id});
|
||||||
|
}
|
||||||
|
function edit_post(post_id) {
|
||||||
|
document.getElementById('questPostData-' + post_id).contentEditable = 'true';
|
||||||
|
document.execCommand("defaultParagraphSeparator", false, "br");
|
||||||
|
document.getElementById('questPostData-' + post_id).style.border = '1px solid #ccc';
|
||||||
|
document.getElementById('savePost-' + post_id).style.display = 'initial';
|
||||||
|
document.getElementById('editPost-' + post_id).style.display = 'none';
|
||||||
|
}
|
||||||
|
function save_post(post_id) {
|
||||||
|
document.getElementById('questPostData-' + post_id).contentEditable = 'false';
|
||||||
|
document.getElementById('questPostData-' + post_id).style.border = null;
|
||||||
|
let text = document.getElementById('questPostData-' + post_id).innerHTML;
|
||||||
|
socket.emit('update_post', {post_id: post_id, post: text, room: room_id});
|
||||||
|
document.getElementById('savePost-' + post_id).style.display = 'none';
|
||||||
|
document.getElementById('editPost-' + post_id).style.display = 'initial';
|
||||||
|
}
|
||||||
|
function form_post(form_id, emit_msg) {
|
||||||
|
let formData = new FormData(document.getElementById(form_id));
|
||||||
|
let obj = {};
|
||||||
|
formData.forEach(function(value, key) {
|
||||||
|
obj[key] = value;
|
||||||
|
});
|
||||||
|
obj.room = room_id;
|
||||||
|
socket.emit(emit_msg, obj);
|
||||||
|
document.getElementById(form_id).reset();
|
||||||
|
}
|
||||||
|
function close_post(post_id) {
|
||||||
|
socket.emit('close_post', {post_id: post_id, room: room_id});
|
||||||
|
}
|
||||||
|
function open_post(post_id) {
|
||||||
|
socket.emit('open_post', {post_id: post_id, room: room_id});
|
||||||
|
}
|
||||||
|
function deactivate_post() {
|
||||||
|
let post = document.getElementsByClassName('active_post');
|
||||||
|
if (post.length == 0) { return; }
|
||||||
|
post = post[0];
|
||||||
|
post.children[1].children[0].textContent = post.children[1].children[0].textContent.replace('Open', 'Closed');
|
||||||
|
post.classList.remove("active_post");
|
||||||
|
post.children[0].children[2].outerHTML = "";
|
||||||
|
post.children[0].children[1].outerHTML = "";
|
||||||
|
let writein = document.getElementById('writeinContainer');
|
||||||
|
if (writein) {
|
||||||
|
writein.outerHTML = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function insertPollOption() {
|
||||||
|
let opts = document.getElementById('pollOptions');
|
||||||
|
let num = opts.children.length+1;
|
||||||
|
let temp = document.createElement('template');
|
||||||
|
temp.innerHTML = '<div><input type="text" name="pollOption-' + num + '" class="pollOption" placeholder="Option ' + num + '" maxlength="200" /></div>';
|
||||||
|
opts.appendChild(temp.content);
|
||||||
|
}
|
||||||
|
function removePollOption() {
|
||||||
|
let opts = document.getElementById('pollOptions');
|
||||||
|
if (opts.children.length == 0) { return; }
|
||||||
|
opts.children[opts.children.length-1].outerHTML = '';
|
||||||
|
}
|
||||||
|
function openPostTab(event, modeName) {
|
||||||
|
let i, QMPostTabContent, QMPostTab;
|
||||||
|
|
||||||
|
QMPostTabContent = document.getElementsByClassName("QMPostTabContent");
|
||||||
|
for (i = 0; i < QMPostTabContent.length; i++) {
|
||||||
|
QMPostTabContent[i].style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
QMPostTab = document.getElementsByClassName("QMPostTab");
|
||||||
|
for (i = 0; i < QMPostTab.length; i++) {
|
||||||
|
QMPostTab[i].className = QMPostTab[i].className.replace(" active", "");
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById(modeName).style.display = "block";
|
||||||
|
event.currentTarget.className += " active";
|
||||||
|
}
|
||||||
137
static/anonkunUser.js
Normal file
137
static/anonkunUser.js
Normal file
|
|
@ -0,0 +1,137 @@
|
||||||
|
document.execCommand("defaultParagraphSeparator", false, "br");
|
||||||
|
var socket;
|
||||||
|
var tid = setInterval( function () {
|
||||||
|
if ( document.readyState !== 'complete' ) return;
|
||||||
|
clearInterval( tid );
|
||||||
|
|
||||||
|
document.getElementById('chatWindow').scrollTop = document.getElementById('chatWindow').scrollHeight;
|
||||||
|
socket = io.connect('https://' + document.domain + ':' + location.port);
|
||||||
|
socket.on('connect', function() {
|
||||||
|
socket.emit('joined', {room: room_id});
|
||||||
|
});
|
||||||
|
socket.on('message', function(data) {
|
||||||
|
let msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
|
||||||
|
msg_str += '<span class="messageDate">' + strftime(data.date) + '</span></div>';
|
||||||
|
msg_str += '<div class="message">' + data.message + '</div><hr>';
|
||||||
|
|
||||||
|
let mbox = document.getElementById('chatWindow');
|
||||||
|
mbox.innerHTML = mbox.innerHTML + msg_str;
|
||||||
|
mbox.scrollTop = mbox.scrollHeight;
|
||||||
|
});
|
||||||
|
socket.on('new_post', function(data) {
|
||||||
|
deactivate_post();
|
||||||
|
let qposts = document.getElementById('questPosts');
|
||||||
|
let post_str = '<div class="questPost ';
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post_str += 'textPost">';
|
||||||
|
} else if (data.post_type == 'dice') {
|
||||||
|
post_str += 'dicePost active_post">';
|
||||||
|
} else if (data.post_type == 'poll') {
|
||||||
|
post_str += 'pollPost active_post">';
|
||||||
|
}
|
||||||
|
post_str += '<div class="questPostMeta">' + strftime(data.date);
|
||||||
|
post_str += '</div><div class="questPostData" id="questPostData-' + data.post_id + '">';
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post_str += data.post;
|
||||||
|
} else if (data.post_type == 'dice') {
|
||||||
|
post_str += '<h3>' + data.post + ' - Open</h3>';
|
||||||
|
} else if (data.post_type == 'poll') {
|
||||||
|
post_str += '<h3>' + data.post + ' - Open</h3>';
|
||||||
|
post_str += '<table class="poll" id="post-' + data.post_id + '">';
|
||||||
|
post_str += '<col/><col/><col/>';
|
||||||
|
for (i = 0; i < data.options.length; i++) {
|
||||||
|
post_str += '<tr id="optionRow-' + data.options[i][0] + '">';
|
||||||
|
post_str += '<td class="pollCheckBox"><input type="checkbox" id="pollInput-' + data.options[i][0] + '" onchange="pollVote(' + data.post_id + ',' + data.options[i][0] + ')"/>';
|
||||||
|
post_str += '<label for="pollInput-' + data.options[i][0] + '"></label></td>';
|
||||||
|
post_str += '<td class="option_text">' + data.options[i][1] + '</td>';
|
||||||
|
post_str += '<td class="optionVotes">0</td></tr>';
|
||||||
|
}
|
||||||
|
post_str += '</table>';
|
||||||
|
}
|
||||||
|
post_str += '</div></div><br />';
|
||||||
|
qposts.innerHTML = qposts.innerHTML + post_str;
|
||||||
|
});
|
||||||
|
socket.on('update_post', function(data) {
|
||||||
|
let post_id = data.post_id;
|
||||||
|
let post = document.getElementById('questPostData-' + post_id);
|
||||||
|
if (data.post_type == 'text') {
|
||||||
|
post.innerHTML = data.post;
|
||||||
|
}
|
||||||
|
else if (data.post_type == 'dice') {
|
||||||
|
post.innerHTML += '<b>' + data.post + '</b><br />';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('close_post', function(data) {
|
||||||
|
let post = document.getElementById('questPostData-' + data.post_id);
|
||||||
|
post.children[0].textContent = post.children[0].textContent.replace('Open', 'Closed');
|
||||||
|
document.getElementById('close_post_id-' + data.post_id).style.display = 'none';
|
||||||
|
document.getElementById('open_post_id-' + data.post_id).style.display = 'initial';
|
||||||
|
if (post.parentElement.classList.contains('pollPost')) {
|
||||||
|
let table = document.getElementById('poll-' + data.post_id);
|
||||||
|
table.getElementsByTagName("col")[0].style.visibility = 'collapse';
|
||||||
|
let writein = document.getElementById('writeinContainer');
|
||||||
|
if (writein) {
|
||||||
|
writein.style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('open_post', function(data) {
|
||||||
|
let post = document.getElementById('questPostData-' + data.post_id);
|
||||||
|
post.firstElementChild.textContent = post.firstElementChild.textContent.replace('Closed', 'Open');
|
||||||
|
document.getElementById('close_post_id-' + data.post_id).style.display = 'initial';
|
||||||
|
document.getElementById('open_post_id-' + data.post_id).style.display = 'none';
|
||||||
|
if (post.parentElement.classList.contains('pollPost')) {
|
||||||
|
table = document.getElementById('poll-' + data.post_id);
|
||||||
|
table.getElementsByTagName("col")[0].style.visibility = '';
|
||||||
|
let writein = document.getElementById('writeinContainer');
|
||||||
|
if (writein) {
|
||||||
|
writein.style.display = 'initial';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('vote', function(data) {
|
||||||
|
let row = document.getElementById('optionRow-' + data.option_id);
|
||||||
|
if (data.polarity) {
|
||||||
|
row.cells[2].textContent = Number(row.cells[2].textContent) + 1;
|
||||||
|
} else {
|
||||||
|
row.cells[2].textContent = Number(row.cells[2].textContent) - 1;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
socket.on('toggle_option_box', function(data) {
|
||||||
|
document.getElementById('pollInput-' + data.option_id).checked = data.polarity;
|
||||||
|
});
|
||||||
|
let mtarea = document.getElementById('messageTextArea');
|
||||||
|
mtarea.addEventListener('keypress', function(event) {
|
||||||
|
if (event.key == 'Enter' && !event.shiftKey) {
|
||||||
|
let text = mtarea.value.trim();
|
||||||
|
mtarea.value = '';
|
||||||
|
if (text == '') { return; }
|
||||||
|
socket.emit('message', {message: text, name: 'Anonymous', room: room_id});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, 100 );
|
||||||
|
function padToTwo(number) {
|
||||||
|
if (number<=99) { number = ("0"+number).slice(-2); }
|
||||||
|
return number;
|
||||||
|
}
|
||||||
|
function strftime(date) {
|
||||||
|
date = new Date(date * 1000);
|
||||||
|
let date_str = date.getFullYear() + '-' + padToTwo(date.getMonth()+1) + '-' + padToTwo(date.getDate()) + ' ';
|
||||||
|
date_str += padToTwo(date.getHours()) + ':' + padToTwo(date.getMinutes()) + ':' + padToTwo(date.getSeconds());
|
||||||
|
return date_str;
|
||||||
|
}
|
||||||
|
function pollVote(post_id, option_id) {
|
||||||
|
let polarity = document.getElementById('pollInput-' + option_id).checked;
|
||||||
|
socket.emit('vote', {post_id: post_id, option_id: option_id, polarity: polarity, room: room_id});
|
||||||
|
}
|
||||||
|
function deactivate_post() {
|
||||||
|
let post = document.getElementsByClassName('active_post');
|
||||||
|
if (post.length == 0) { return; }
|
||||||
|
post = post[0];
|
||||||
|
post.children[1].children[0].textContent = post.children[1].children[0].textContent.replace('Open', 'Closed');
|
||||||
|
post.classList.remove("active_post");
|
||||||
|
let writein = document.getElementById('writeinContainer');
|
||||||
|
if (writein) {
|
||||||
|
writein.outerHTML = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -2,209 +2,11 @@
|
||||||
{% block title %}{{ quest_title }}{% endblock %}
|
{% block title %}{{ quest_title }}{% endblock %}
|
||||||
{% block head %}
|
{% block head %}
|
||||||
<script type="text/javascript" src="/static/socket.io.slim.js"></script>
|
<script type="text/javascript" src="/static/socket.io.slim.js"></script>
|
||||||
<script>
|
<script>var room_id = {{ room_id }};</script>
|
||||||
document.execCommand("defaultParagraphSeparator", false, "br");
|
|
||||||
var socket;
|
|
||||||
var tid = setInterval( function () {
|
|
||||||
if ( document.readyState !== 'complete' ) return;
|
|
||||||
clearInterval( tid );
|
|
||||||
|
|
||||||
document.getElementById('chatWindow').scrollTop = document.getElementById('chatWindow').scrollHeight;
|
|
||||||
socket = io.connect('https://' + document.domain + ':' + location.port);
|
|
||||||
socket.on('connect', function() {
|
|
||||||
socket.emit('joined', {room: {{ room_id }}});
|
|
||||||
});
|
|
||||||
socket.on('message', function(data) {
|
|
||||||
let msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
|
|
||||||
msg_str += '<span class="messageDate">' + strftime(data.date) + '</span></div>';
|
|
||||||
msg_str += '<div class="message">' + data.message + '</div><hr>';
|
|
||||||
|
|
||||||
let mbox = document.getElementById('chatWindow');
|
|
||||||
mbox.innerHTML = mbox.innerHTML + msg_str;
|
|
||||||
mbox.scrollTop = mbox.scrollHeight;
|
|
||||||
});
|
|
||||||
socket.on('new_post', function(data) {
|
|
||||||
deactivate_post();
|
|
||||||
let qposts = document.getElementById('questPosts');
|
|
||||||
let post_str = '<div class="questPost ';
|
|
||||||
if (data.post_type == 'text') {
|
|
||||||
post_str += 'textPost">';
|
|
||||||
} else if (data.post_type == 'dice') {
|
|
||||||
post_str += 'dicePost active_post">';
|
|
||||||
} else if (data.post_type == 'poll') {
|
|
||||||
post_str += 'pollPost active_post">';
|
|
||||||
}
|
|
||||||
post_str += '<div class="questPostMeta">' + strftime(data.date);
|
|
||||||
{% if session.get("user_id") == owner_id %}
|
|
||||||
if (data.post_type == 'text') {
|
|
||||||
post_str += '<br /><a href="javascript:void(0);" onclick="edit_post(\'' + data.post_id + '\')">Edit</a>';
|
|
||||||
post_str += '<a href="javascript:void(0);" id="savePost-' + data.post_id + '" onclick="save_post(\'' + data.post_id + '\')" style="display:none;">Save</a>';
|
|
||||||
} else if (data.post_type == 'dice' || data.post_type == 'poll') {
|
|
||||||
post_str += '<br /><a href="javascript:void(0);" id="close_post_id-' + data.post_id + '" onclick="close_post(' + data.post_id + ')">Close</a>';
|
|
||||||
post_str += '<a href="javascript:void(0);" id="open_post_id-' + data.post_id + '" onclick="open_post(' + data.post_id + ')" style="display:none;">Open</a>'
|
|
||||||
}
|
|
||||||
{% endif %}
|
|
||||||
post_str += '</div><div class="questPostData" id="questPostData-' + data.post_id + '">';
|
|
||||||
if (data.post_type == 'text') {
|
|
||||||
post_str += data.post;
|
|
||||||
} else if (data.post_type == 'dice') {
|
|
||||||
post_str += '<h3>' + data.post + ' - Open</h3>';
|
|
||||||
} else if (data.post_type == 'poll') {
|
|
||||||
post_str += '<h3>' + data.post + ' - Open</h3>';
|
|
||||||
post_str += '<table id="post-' + data.post_id + '">';
|
|
||||||
for (i = 0; i < data.options.length; i++) {
|
|
||||||
post_str += '<tr><td>' + data.options[i] + '</td></tr>';
|
|
||||||
}
|
|
||||||
post_str += '</table>';
|
|
||||||
}
|
|
||||||
post_str += '</div></div><br />';
|
|
||||||
qposts.innerHTML = qposts.innerHTML + post_str;
|
|
||||||
});
|
|
||||||
socket.on('update_post', function(data) {
|
|
||||||
let post_id = data.post_id;
|
|
||||||
let post = document.getElementById('questPostData-' + post_id);
|
|
||||||
if (data.post_type == 'text') {
|
|
||||||
post.innerHTML = data.post;
|
|
||||||
}
|
|
||||||
else if (data.post_type == 'dice') {
|
|
||||||
post.innerHTML += '<b>' + data.post + '</b><br />';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
socket.on('close_post', function(data) {
|
|
||||||
let post = document.getElementById('questPostData-' + data.post_id);
|
|
||||||
post.children[0].textContent = post.children[0].textContent.replace('Open', 'Closed');
|
|
||||||
document.getElementById('close_post_id-' + data.post_id).style.display = 'none';
|
|
||||||
document.getElementById('open_post_id-' + data.post_id).style.display = 'initial';
|
|
||||||
if (post.parentElement.classList.contains('pollPost')) {
|
|
||||||
table = document.getElementById('poll-' + data.post_id);
|
|
||||||
table.getElementsByTagName("col")[0].style.visibility = 'collapse';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
socket.on('open_post', function(data) {
|
|
||||||
let post = document.getElementById('questPostData-' + data.post_id);
|
|
||||||
post.firstElementChild.textContent = post.firstElementChild.textContent.replace('Closed', 'Open');
|
|
||||||
document.getElementById('close_post_id-' + data.post_id).style.display = 'initial';
|
|
||||||
document.getElementById('open_post_id-' + data.post_id).style.display = 'none';
|
|
||||||
if (post.parentElement.classList.contains('pollPost')) {
|
|
||||||
table = document.getElementById('poll-' + data.post_id);
|
|
||||||
table.getElementsByTagName("col")[0].style.visibility = '';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
socket.on('vote', function(data) {
|
|
||||||
let row = document.getElementById('optionRow-' + data.option_id);
|
|
||||||
if (data.polarity) {
|
|
||||||
row.cells[2].textContent = Number(row.cells[2].textContent) + 1;
|
|
||||||
} else {
|
|
||||||
row.cells[2].textContent = Number(row.cells[2].textContent) - 1;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
let mtarea = document.getElementById('messageTextArea');
|
|
||||||
mtarea.addEventListener('keypress', function(event) {
|
|
||||||
if (event.key == 'Enter' && !event.shiftKey) {
|
|
||||||
let text = mtarea.value.trim();
|
|
||||||
mtarea.value = '';
|
|
||||||
if (text == '') { return; }
|
|
||||||
socket.emit('message', {message: text, name: 'Anonymous', room: {{ room_id }}});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}, 100 );
|
|
||||||
</script>
|
|
||||||
<script>
|
|
||||||
function padToTwo(number) {
|
|
||||||
if (number<=99) { number = ("0"+number).slice(-2); }
|
|
||||||
return number;
|
|
||||||
}
|
|
||||||
function strftime(date) {
|
|
||||||
date = new Date(date * 1000);
|
|
||||||
let date_str = date.getFullYear() + '-' + padToTwo(date.getMonth()+1) + '-' + padToTwo(date.getDate()) + ' ';
|
|
||||||
date_str += padToTwo(date.getHours()) + ':' + padToTwo(date.getMinutes()) + ':' + padToTwo(date.getSeconds());
|
|
||||||
return date_str;
|
|
||||||
}
|
|
||||||
function pollVote(post_id, option_id) {
|
|
||||||
let polarity = document.getElementById('pollInput-' + option_id).checked;
|
|
||||||
socket.emit('vote', {post_id: post_id, option_id: option_id, polarity: polarity, room: {{ room_id }}});
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
{% if session.get("user_id") == owner_id %}
|
{% if session.get("user_id") == owner_id %}
|
||||||
<script>
|
<script type="text/javascript" src="/static/anonkunQM.js"></script>
|
||||||
function makePost() {
|
{% else %}
|
||||||
let qparea = document.getElementById('postTextArea');
|
<script type="text/javascript" src="/static/anonkunUser.js"></script>
|
||||||
let text = qparea.value.trim();
|
|
||||||
qparea.value = '';
|
|
||||||
if (text == '') { return; }
|
|
||||||
socket.emit('new_post', {post: text, room: {{ room_id }}});
|
|
||||||
}
|
|
||||||
function edit_post(post_id) {
|
|
||||||
document.getElementById('questPostData-' + post_id).contentEditable = 'true';
|
|
||||||
document.execCommand("defaultParagraphSeparator", false, "br");
|
|
||||||
document.getElementById('questPostData-' + post_id).style.border = '1px solid #ccc';
|
|
||||||
document.getElementById('savePost-' + post_id).style.display = 'initial';
|
|
||||||
document.getElementById('editPost-' + post_id).style.display = 'none';
|
|
||||||
}
|
|
||||||
function save_post(post_id) {
|
|
||||||
document.getElementById('questPostData-' + post_id).contentEditable = 'false';
|
|
||||||
document.getElementById('questPostData-' + post_id).style.border = null;
|
|
||||||
let text = document.getElementById('questPostData-' + post_id).innerHTML;
|
|
||||||
socket.emit('update_post', {post_id: post_id, post: text, room: {{ room_id }}});
|
|
||||||
document.getElementById('savePost-' + post_id).style.display = 'none';
|
|
||||||
document.getElementById('editPost-' + post_id).style.display = 'initial';
|
|
||||||
}
|
|
||||||
function form_post(form_id, emit_msg) {
|
|
||||||
let formData = new FormData(document.getElementById(form_id));
|
|
||||||
let obj = {};
|
|
||||||
formData.forEach(function(value, key) {
|
|
||||||
obj[key] = value;
|
|
||||||
});
|
|
||||||
obj.room = {{ room_id }};
|
|
||||||
socket.emit(emit_msg, obj);
|
|
||||||
document.getElementById(form_id).reset();
|
|
||||||
}
|
|
||||||
function close_post(post_id) {
|
|
||||||
socket.emit('close_post', {post_id: post_id, room: {{ room_id }}});
|
|
||||||
}
|
|
||||||
function open_post(post_id) {
|
|
||||||
socket.emit('open_post', {post_id: post_id, room: {{ room_id }}});
|
|
||||||
}
|
|
||||||
function deactivate_post() {
|
|
||||||
let post = document.getElementsByClassName('active_post');
|
|
||||||
if (post.length == 0) { return; }
|
|
||||||
post = post[0];
|
|
||||||
post.children[1].children[0].textContent = post.children[1].children[0].textContent.replace('Open', 'Closed');
|
|
||||||
post.classList.remove("active_post");
|
|
||||||
post.children[0].children[2].outerHTML = "";
|
|
||||||
post.children[0].children[1].outerHTML = "";
|
|
||||||
}
|
|
||||||
function insertPollOption() {
|
|
||||||
let opts = document.getElementById('pollOptions');
|
|
||||||
let num = opts.children.length+1;
|
|
||||||
let temp = document.createElement('template');
|
|
||||||
temp.innerHTML = '<div><input type="text" name="pollOption-' + num + '" class="pollOption" placeholder="Option ' + num + '" maxlength="200" /></div>';
|
|
||||||
opts.appendChild(temp.content);
|
|
||||||
}
|
|
||||||
function removePollOption() {
|
|
||||||
let opts = document.getElementById('pollOptions');
|
|
||||||
if (opts.children.length == 0) { return; }
|
|
||||||
opts.children[opts.children.length-1].outerHTML = '';
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<script>
|
|
||||||
function openPostTab(event, modeName) {
|
|
||||||
let i, QMPostTabContent, QMPostTab;
|
|
||||||
|
|
||||||
QMPostTabContent = document.getElementsByClassName("QMPostTabContent");
|
|
||||||
for (i = 0; i < QMPostTabContent.length; i++) {
|
|
||||||
QMPostTabContent[i].style.display = "none";
|
|
||||||
}
|
|
||||||
|
|
||||||
QMPostTab = document.getElementsByClassName("QMPostTab");
|
|
||||||
for (i = 0; i < QMPostTab.length; i++) {
|
|
||||||
QMPostTab[i].className = QMPostTab[i].className.replace(" active", "");
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById(modeName).style.display = "block";
|
|
||||||
event.currentTarget.className += " active";
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% block header %}
|
{% block header %}
|
||||||
|
|
@ -271,6 +73,11 @@
|
||||||
</tr>
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</table>
|
</table>
|
||||||
|
{% if quest_post[0] == open_post_id and quest_post[0]|is_write_in %}
|
||||||
|
<div id="writeinContainer">
|
||||||
|
Write-in: <input type="text" id="writeinInput" placeholder="Custom choice..." maxlength="200" />
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div><br />
|
</div><br />
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user