aboutsummaryrefslogtreecommitdiff
path: root/juick-www/src/main
diff options
context:
space:
mode:
Diffstat (limited to 'juick-www/src/main')
-rw-r--r--juick-www/src/main/static/scripts.js207
1 files changed, 107 insertions, 100 deletions
diff --git a/juick-www/src/main/static/scripts.js b/juick-www/src/main/static/scripts.js
index 0785325a4..2d50cc92b 100644
--- a/juick-www/src/main/static/scripts.js
+++ b/juick-www/src/main/static/scripts.js
@@ -5,23 +5,21 @@ require('element-closest');
NodeList.prototype.forEach = Array.prototype.forEach;
HTMLCollection.prototype.forEach = Array.prototype.forEach;
-var ws = null;
-var pageTitle;
+var ws,
+ pageTitle;
function initWS() {
var content = document.getElementById('content');
if (!content) { return }
var pageMID = content.getAttribute('data-mid');
if (!pageMID) { return }
- var url;
- var protocolPrefix = (window.location.protocol === 'https:') ? 'wss:' : 'ws:';
- if (typeof (juickDebug) != 'undefined') {
- url = protocolPrefix + '//ws.juick.com/_replies';
- } else {
- url = protocolPrefix + '//ws.juick.com/' + pageMID;
- }
- var hash = document.getElementById('body').getAttribute('data-hash');
- if (typeof (hash) != 'undefined' && hash) {
+
+ var url = (window.location.protocol === 'https:' ? 'wss' : 'ws') + ":"
+ + (typeof juickDebug !== 'undefined' ?
+ '//ws.juick.com/_replies' : ('//ws.juick.com/' + pageMID)),
+ hash = document.getElementById('body').getAttribute('data-hash');
+
+ if (hash) {
url += '?hash=' + hash;
}
@@ -38,7 +36,7 @@ function initWS() {
};
ws.onclose = function () {
console.log('offline');
- ws = null;
+ ws = false;
setTimeout(function () {
initWS();
}, 2000);
@@ -73,19 +71,15 @@ function wsShutdown() {
}
function wsIncomingReply(msg) {
- var p;
- if (msg.replyto > 0) {
- p = document.getElementById(msg.replyto);
- }
var li = document.createElement('li');
li.setAttribute('class', 'msg reply-new');
li.setAttribute('id', msg.rid);
li.addEventListener('click', function (e) {
- onclickNewReply(this);
+ newReply(this);
e.preventDefault();
});
li.addEventListener('mouseover', function (e) {
- onclickNewReply(this);
+ newReply(this);
e.preventDefault();
});
var msgAvatar = document.createElement('div');
@@ -97,6 +91,7 @@ function wsIncomingReply(msg) {
msgAvatarLink.appendChild(msgAvatarImg);
msgAvatar.appendChild(msgAvatarLink);
li.appendChild(msgAvatar);
+
var msgCont = document.createElement('div');
msgCont.setAttribute('class', 'msg-cont');
var msgMenu = document.createElement('div');
@@ -145,8 +140,11 @@ function wsIncomingReply(msg) {
msgCont.appendChild(msgLinks);
msgCont.appendChild(msgComment);
li.appendChild(msgCont);
+
li.querySelector('.msg-txt').textContent = msg.body;
- if (p) {
+
+ if (msg.replyto > 0) {
+ var p = document.getElementById(msg.replyto);
li.style.marginLeft = p.style.marginLeft + '20px';
p.parentNode.insertBefore(li, p.nextSibling);
} else {
@@ -156,8 +154,7 @@ function wsIncomingReply(msg) {
updateRepliesCounter();
}
-function onclickNewReply(el) {
- var li = el;
+function newReply(li) {
li.classList.remove('reply-new');
li.removeEventListener('click');
li.removeEventListener('mouseover');
@@ -176,7 +173,7 @@ function onclickNextReply() {
function updateRepliesCounter() {
var replies = document.querySelectorAll('#replies>li.reply-new').length;
- if (replies > 0) {
+ if (replies) {
var wsthread = document.querySelector('#wsthread');
wsthread.textContent = replies;
wsthread.style.display = 'block';
@@ -203,8 +200,9 @@ function postformListener(formEl, ev) {
function unfoldPostForm() {
if (window.location.pathname === '/' && window.location.hash === '#post') {
document.querySelector('#newmessage>div').style.display = 'block';
- document.querySelector('#newmessage textarea').style.minHeight = '70px';
- document.querySelector('#newmessage textarea').focus();
+ var ta = document.querySelector('#newmessage textarea');
+ ta.style.minHeight = '70px';
+ ta.focus();
}
}
@@ -219,9 +217,10 @@ function onsubmitNewMessage() {
function showMoreReplies(el, id) {
el.closest('li').querySelector('.msg-comments').style.display = 'none';
- var replies = document.querySelectorAll('#replies>li');
- var flagshow = 0;
- for (var i = 0; i < replies.length; i++) {
+ var replies = document.querySelectorAll('#replies>li'),
+ flagshow = 0,
+ i = 0;
+ for (; i < replies.length; i += 1) {
if (flagshow == 1) {
if (replies[i].style.display == 'none') {
replies[i].style.display = 'block';
@@ -261,31 +260,29 @@ function taWrapper() {
txtarea.setAttribute('name', 'body');
txtarea.setAttribute('rows', 1);
txtarea.setAttribute('class', 'reply narrow');
- txtarea.setAttribute('placeholder', 'Написать комментарий...');
- var txtKeypress = function (e) {
- postformListener(e.target, e);
-
- };
- txtarea.addEventListener('keypress', txtKeypress);
- var wrapper = document.createElement('div');
- wrapper.setAttribute('class', 'ta-wrapper');
- wrapper.appendChild(txtarea);
- var att = document.createElement('div');
- att.setAttribute('class', 'attach-photo');
- var attClick = function () {
- attachCommentPhoto(this);
- };
- att.addEventListener('click', attClick);
- wrapper.appendChild(att);
- return wrapper;
+ txtarea.setAttribute('placeholder', 'Написать комментарий...');
+ var txtKeypress = function (e) {
+ postformListener(e.target, e);
+ };
+ txtarea.addEventListener('keypress', txtKeypress);
+ var wrapper = document.createElement('div');
+ wrapper.setAttribute('class', 'ta-wrapper');
+ wrapper.appendChild(txtarea);
+ var att = document.createElement('div');
+ att.setAttribute('class', 'attach-photo');
+ att.addEventListener('click', function () {
+ attachCommentPhoto(this);
+ });
+ wrapper.appendChild(att);
+ return wrapper;
}
function showCommentForm(mid, rid) {
var reply = document.getElementById(rid);
if (reply && !reply.querySelector('textarea')) {
- var c = reply.querySelector('div.msg-cont > .msg-comment');
- var newNode = c.cloneNode(true);
- var form = replyForm(mid, rid);
+ var c = reply.querySelector('div.msg-cont > .msg-comment'),
+ newNode = c.cloneNode(true),
+ form = replyForm(mid, rid);
form.appendChild(newNode);
newNode.appendChild(taWrapper());
var subm = document.createElement('input');
@@ -295,6 +292,7 @@ function showCommentForm(mid, rid) {
c.parentNode.insertBefore(form, c);
c.remove();
}
+
var commentBlock = reply.querySelector('div.msg-cont > form > div.msg-comment');
commentBlock.style.display = 'block';
var commentText = commentBlock.querySelector('textarea');
@@ -307,8 +305,8 @@ function showCommentForm(mid, rid) {
function showCommentFooter(e, mid, rid) {
var a = e.closest('article');
if (!a.querySelector('footer.comm')) {
- var form = replyForm(mid, rid);
- var footer = document.createElement('footer');
+ var form = replyForm(mid, rid),
+ footer = document.createElement('footer');
footer.setAttribute('class', 'comm');
footer.appendChild(taWrapper());
var subm = document.createElement('input');
@@ -346,8 +344,8 @@ function attachCommentPhoto(div) {
}
function attachMessagePhoto(div) {
- var f = div.closest('form');
- var finput = f.querySelector('input[type="file"]');
+ var f = div.closest('form'),
+ finput = f.querySelector('input[type="file"]');
if (!finput) {
var inp = attachInput();
inp.style.float = 'left';
@@ -367,6 +365,7 @@ function attachMessagePhoto(div) {
function unfoldReply() {
if ((0 + window.location.hash.substring(1)) > 0) {
var el = window.location.hash;
+ //https://developer.mozilla.org/en/docs/Web/API/Element/matches#Polyfill
while (el.matches('[type="hidden"]')) {
el = el.previousSibling();
}
@@ -376,31 +375,30 @@ function unfoldReply() {
}
function showMessageLinksDialog(mid, rid) {
- var hlink = window.location.protocol + '//juick.com/' + mid;
- var mlink = '#' + mid;
+ var hlink = window.location.protocol + '//juick.com/' + mid,
+ mlink = '#' + mid;
if (rid > 0) {
hlink += '#' + rid;
mlink += '/' + rid;
}
- var hlinkenc = encodeURIComponent(hlink);
-
- var html = '<div class="dialogshare">Ссылка на сообщение:';
- html += '<div onclick="this.selectText()" class="dialogl">' + hlink + '</div>';
- html += 'Номер сообщения:';
- html += '<div onclick="this.selectText()" class="dialogl">' + mlink + '</div>';
- html += 'Поделиться:<ul>';
- html += '<li><a href="https://www.facebook.com/sharer/sharer.php?u=' + hlinkenc + '" onclick="return openSocialWindow(this)"></a></li>';
- html += '<li><a href="https://twitter.com/intent/tweet?url=' + hlinkenc + '" onclick="return openSocialWindow(this)" style="background-position: -32px 0;"></a></li>';
- html += '<li><a href="https://vk.com/share.php?url=' + hlinkenc + '" onclick="return openSocialWindow(this)" style="background-position: -64px 0;"></a></li>';
- html += '<li><a href="https://plus.google.com/share?url=' + hlinkenc + '" onclick="return openSocialWindow(this)" style="background-position: -96px 0;"></a></li>';
- html += '</ul></div>';
+ var hlinkenc = encodeURIComponent(hlink),
+ html = '<div class="dialogshare">Ссылка на сообщение:'
+ + '<div onclick="this.selectText()" class="dialogl">' + hlink + '</div>'
+ + 'Номер сообщения:'
+ + '<div onclick="this.selectText()" class="dialogl">' + mlink + '</div>'
+ + 'Поделиться:<ul>'
+ + '<li><a href="https://www.facebook.com/sharer/sharer.php?u=' + hlinkenc + '" onclick="return openSocialWindow(this)"></a></li>'
+ + '<li><a href="https://twitter.com/intent/tweet?url=' + hlinkenc + '" onclick="return openSocialWindow(this)" style="background-position: -32px 0;"></a></li>'
+ + '<li><a href="https://vk.com/share.php?url=' + hlinkenc + '" onclick="return openSocialWindow(this)" style="background-position: -64px 0;"></a></li>'
+ + '<li><a href="https://plus.google.com/share?url=' + hlinkenc + '" onclick="return openSocialWindow(this)" style="background-position: -96px 0;"></a></li>'
+ + '</ul></div>';
openDialog(html);
}
function showPhotoDialog(fname) {
- var width = window.width;
- var height = window.height * 0.9;
+ var width = window.width,
+ height = window.height * 0.9;
if (width < 640) {
return true;
} else if (width < 1280) {
@@ -415,9 +413,7 @@ function showPhotoDialog(fname) {
}
function openDialog(html) {
- var dhtml = '<table id="dialogt"><tr><td><div id="dialogb"></div><div id="dialogw"><div id="dialogc"></div>';
- dhtml += html;
- dhtml += '</div></td></tr></table>';
+ var dhtml = '<table id="dialogt"><tr><td><div id="dialogb"></div><div id="dialogw"><div id="dialogc"></div>' + html + '</div></td></tr></table>';
document.querySelector('body').insertAdjacentHTML('afterbegin', dhtml);
document.querySelector('#dialogb').addEventListener('click', closeDialog);
document.querySelector('#dialogc').addEventListener('click', closeDialog);
@@ -435,13 +431,14 @@ function openSocialWindow(a) {
}
function checkUsername() {
- var uname = document.querySelector('#username').textContent;
+ var uname = document.querySelector('#username').textContent,
+ style = document.querySelector('#username').style;
fetch('//api.juick.com/users?uname=' + uname)
.then(function () {
- document.querySelector('#username').style.background = '#FFCCCC';
+ style.background = '#FFCCCC';
})
.catch(function () {
- document.querySelector('#username').style.background = '#CCFFCC';
+ style.background = '#CCFFCC';
});
}
@@ -489,25 +486,23 @@ function likeMessage(e, mid) {
/******************************************************************************/
function setPopular(e, mid, popular) {
- var hash = document.getElementById('body').getAttribute('data-hash');
- fetch('//api.juick.com/messages/set_popular?mid=' + mid + '&popular=' + popular + '&hash=' + hash)
+ fetch('//api.juick.com/messages/set_popular?mid=' + mid
+ + '&popular=' + popular
+ + '&hash=' + document.getElementById('body').getAttribute('data-hash'))
.then(function () {
- var a = e.closest('article');
- a.append(resultMessage('OK!'));
+ e.closest('article').append(resultMessage('OK!'));
});
return false;
}
function setPrivacy(e, mid) {
- var hash = document.getElementById('body').getAttribute('data-hash');
- fetch('//api.juick.com/messages/set_privacy?mid=' + mid + '&hash=' + hash)
+ fetch('//api.juick.com/messages/set_privacy?mid=' + mid
+ + '&hash=' + document.getElementById('body').getAttribute('data-hash'))
.then(function () {
- var a = e.closest('article');
- a.append(resultMessage('OK!'));
+ e.closest('article').append(resultMessage('OK!'));
});
return false;
}
-
/******************************************************************************/
Element.prototype.selectText = function () {
@@ -535,6 +530,7 @@ function ready(fn) {
ready(function () {
autosize(document.querySelectorAll('textarea'));
+
var insertButtons = function (e) {
var textarea = e.target;
textarea.classList.add('narrow');
@@ -543,10 +539,10 @@ ready(function () {
textarea.removeEventListener('click', insertButtons);
e.preventDefault();
};
-
document.querySelectorAll('textarea.reply').forEach(function(e) {
e.addEventListener('click', insertButtons);
});
+
var insertPMButtons = function (e) {
e.target.classList.add('narrowpm');
e.target.parentNode.insertAdjacentHTML('afterend', '<input type="submit" value="OK"/>');
@@ -556,19 +552,21 @@ ready(function () {
document.querySelectorAll('textarea.replypm').forEach(function(e) {
e.addEventListener('click', insertPMButtons);
});
+
var content = document.getElementById('content');
if (content) {
var pageMID = content.getAttribute('data-mid');
if (pageMID > 0) {
+ var rid;
document.querySelectorAll('.msg-comments').forEach(function(e) {
- var rid = e.parentNode.parentNode.id;
+ rid = e.parentNode.parentNode.id;
e.addEventListener('click', function (e) {
showMoreReplies(e.target, rid);
e.preventDefault();
});
});
document.querySelectorAll('.a-thread-comment').forEach(function(e) {
- var rid = e.closest('li').id;
+ rid = e.closest('li').id;
e.addEventListener('click', function (e) {
showCommentForm(pageMID, rid);
e.preventDefault();
@@ -578,45 +576,53 @@ ready(function () {
}
document.querySelectorAll('.msg-menu a').forEach(function(e) {
- var mid = e.closest('section').getAttribute('data-mid');
- var rid = parseInt(e.closest('li').id);
e.addEventListener('click', function(e) {
- showMessageLinksDialog(mid, rid);
+ showMessageLinksDialog(
+ e.closest('section').getAttribute('data-mid'),
+ parseInt(e.closest('li').id)); // rid
e.preventDefault();
});
});
document.querySelectorAll('.l .a-comment').forEach(function(e) {
e.addEventListener('click', function (e) {
- var mid = e.target.closest('article').getAttribute('data-mid');
- showCommentFooter(e.target, mid);
+ showCommentFooter(
+ e.target,
+ e.target.closest('article').getAttribute('data-mid'));
e.preventDefault();
});
});
document.querySelectorAll('.l .a-privacy').forEach(function(e) {
e.addEventListener('click', function (e) {
- var mid = e.target.closest('article').getAttribute('data-mid');
- setPrivacy(e.target, mid);
+ setPrivacy(
+ e.target,
+ e.target.closest('article').getAttribute('data-mid'));
e.preventDefault();
});
});
document.querySelectorAll('.l .a-popular-plus').forEach(function(e) {
e.addEventListener('click', function (e) {
- var mid = e.target.closest('article').getAttribute('data-mid');
- setPopular(e.target, mid, 2);
+ setPopular(
+ e.target,
+ e.target.closest('article').getAttribute('data-mid'),
+ 2);
e.preventDefault();
});
});
document.querySelectorAll('.l .a-popular-minus').forEach(function(e) {
e.addEventListener('click', function (e) {
- var mid = e.target.closest('article').getAttribute('data-mid');
- setPopular(e.target, mid, -1);
+ setPopular(
+ e.target,
+ e.target.closest('article').getAttribute('data-mid'),
+ -1);
e.preventDefault();
});
});
document.querySelectorAll('.l .a-popular-delete').forEach(function(e) {
e.addEventListener('click', function (e) {
- var mid = e.target.closest('article').getAttribute('data-mid');
- setPopular(e.target, mid, -2);
+ setPopular(
+ e.target,
+ e.target.closest('article').getAttribute('data-mid'),
+ -2);
e.preventDefault();
});
});
@@ -642,8 +648,9 @@ ready(function () {
document.querySelectorAll('.l .a-like').forEach(function(e) {
e.addEventListener('click', function (e) {
- var mid = e.target.closest('article').getAttribute('data-mid');
- likeMessage(e.target, mid);
+ likeMessage(
+ e.target,
+ e.target.closest('article').getAttribute('data-mid'));
e.preventDefault();
});
});
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-13 20:59:06 +0000