Пожалуйста, введите текст сообщения
'); return false; } return true; } -function showMoreReplies(id) { - $('#'+id+' .msg-comments').hide(); +function showMoreReplies(el, id) { + el.closest('li').querySelector('.msg-comments').style.display = 'none'; - var replies=$('#replies>li'); - var flagshow=0; - for(var i=0; i');
+function replyForm(mid, rid) {
+ var form = document.createElement('form');
+ form.setAttribute('action', '/comment');
+ form.setAttribute('method', 'POST');
+ form.setAttribute('enctype', 'multipart/form-data');
+ var input = document.createElement('input');
+ input.setAttribute('type', 'hidden');
+ input.setAttribute('name', 'mid');
+ input.setAttribute('value', mid);
+ form.appendChild(input);
+ if (rid) {
+ var inputRid = document.createElement('input');
+ inputRid.setAttribute('type', 'hidden');
+ inputRid.setAttribute('name', 'rid');
+ inputRid.setAttribute('value', rid);
+ form.appendChild(inputRid);
}
- // $('#replies #'+rid+' .msg-links').hide();
- $('#replies #'+rid+' .msg-comment').show();
- $('#replies #'+rid+' textarea')[0].focus();
- $('#replies #'+rid+' textarea').autoResize({
- extraSpace: 0,
- minHeight: 1
- });
- return false;
+ return form;
}
-function showCommentFooter(e) {
- var a=$(e).closest("article");
- if(a.find("footer.comm").length==0) {
- a.append('');
- a.find('textarea').autoResize({
- extraSpace: 0,
- minHeight: 1
- });
+function taWrapper() {
+ var txtarea = document.createElement('textarea');
+ 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;
+}
+
+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);
+ form.appendChild(newNode);
+ newNode.appendChild(taWrapper());
+ var subm = document.createElement('input');
+ subm.setAttribute('type', 'submit');
+ subm.setAttribute('value', 'OK');
+ newNode.appendChild(subm);
+ c.parentNode.insertBefore(form, c);
+ c.remove();
}
- a.find('textarea')[0].focus();
- return false;
+ var commentBlock = reply.querySelector('div.msg-cont > form > div.msg-comment');
+ commentBlock.style.display = 'block';
+ var commentText = commentBlock.querySelector('textarea');
+ if (commentText) {
+ autosize(commentText);
+ commentText.focus();
+ }
+}
+
+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');
+ footer.setAttribute('class', 'comm');
+ footer.appendChild(taWrapper());
+ var subm = document.createElement('input');
+ subm.setAttribute('type', 'submit');
+ subm.setAttribute('value', 'OK');
+ footer.appendChild(subm);
+ form.appendChild(footer);
+ a.appendChild(form);
+ autosize(a.querySelector('textarea'));
+ }
+ a.querySelector('textarea').focus();
+}
+
+function attachInput() {
+ var inp = document.createElement('input');
+ inp.setAttribute('type', 'file');
+ inp.setAttribute('name', 'attach');
+ inp.setAttribute('accept', 'image/jpeg,image/png');
+ inp.style.visibility = 'hidden';
+ return inp;
}
function attachCommentPhoto(div) {
- if($(div).children().length===0) {
- var inp=$('');
- inp.on('change',function() {
- $(this).parent().attr('class','attach-photo-active');
+ if (div.children.length === 0) {
+ var inp = attachInput();
+ inp.addEventListener('change', function () {
+ inp.parentNode.classList.add('attach-photo-active');
});
- inp.trigger('click');
- $(div).append(inp);
+ inp.click();
+ div.appendChild(inp);
} else {
- $(div).empty();
- $(div).attr('class','attach-photo');
+ div.innerHTML = null;
+ div.classList.add('attach-photo');
}
}
function attachMessagePhoto(div) {
- var f=$(div).closest('form');
- if(f.find('input:file').length===0) {
- var inp=$('');
- inp.on('change',function() {
- $(div).text("загрузить (✓)");
+ var f = div.closest('form');
+ var finput = f.querySelector('input[type="file"]');
+ if (!finput) {
+ var inp = attachInput();
+ inp.style.float = 'left';
+ inp.style.width = 0;
+ inp.style.height = 0;
+ inp.addEventListener('change', function () {
+ div.textContent = 'загрузить (✓)';
});
- f.append(inp);
- inp.trigger('click');
+ f.appendChild(inp);
+ inp.click();
} else {
- f.find('input:file').remove();
- $(div).text("загрузить");
+ finput.remove();
+ div.textContent = 'загрузить';
}
}
function unfoldReply() {
- if((0+window.location.hash.substring(1))>0) {
- var el=$(window.location.hash);
- while(el.is(":hidden")) {
- el=el.prev();
+ if ((0 + window.location.hash.substring(1)) > 0) {
+ var el = window.location.hash;
+ while (el.matches('[type="hidden"]')) {
+ el = el.previousSibling();
}
- showMoreReplies(el.attr('id'));
+ showMoreReplies(el.getAttribute('id'));
window.location.replace(window.location.hash);
}
}
-function showMessageLinksDialog(mid,rid) {
- var hlink=window.location.protocol+"//juick.com/"+mid;
- var mlink="#"+mid;
- if(rid>0) {
- hlink+="#"+rid;
- mlink+="/"+rid;
+function showMessageLinksDialog(mid, rid) {
+ var hlink = window.location.protocol + '//juick.com/' + mid;
+ var mlink = '#' + mid;
+ if (rid > 0) {
+ hlink += '#' + rid;
+ mlink += '/' + rid;
}
- var hlinkenc=encodeURIComponent(hlink);
-
- var html="
Ссылка на сообщение:";
- html+="
";
+ var hlinkenc = encodeURIComponent(hlink);
+
+ var html = '"+hlink+"
";
- html+="Номер сообщения:";
- html+=""+mlink+"
";
- html+="Поделиться:Ссылка на сообщение:';
+ html += '
';
openDialog(html);
}
function showPhotoDialog(fname) {
- var width=$(window).width();
- var height=$(window).height()*0.9;
- if(width<640) {
+ var width = window.width;
+ var height = window.height * 0.9;
+ if (width < 640) {
return true;
- } else if(width<1280) {
- openDialog("' + hlink + '
';
+ html += 'Номер сообщения:';
+ html += '' + mlink + '
';
+ html += 'Поделиться:";
- dhtml+=html;
- dhtml+=" |
';
+ dhtml += html;
+ dhtml += ' |
OK!
"); - }).fail(function() { - $(e).closest("article").append("Ошибка
"); - }); +function resultMessage(str) { + var result = document.createElement('p'); + result.textContent = str; + return result; +} + +function likeMessage(e, mid) { + if (confirm('Are you sure?')) { + fetch('//juick.com/like?mid=' + mid, { + method: 'POST' + }) + .then(function (response) { + if (response.ok) { + e.closest('article').appendChild(resultMessage('OK!')); + } + }) + .catch(function () { + e.closest('article').appendChild(resultMessage('Ошибка')); + }); } return false; } /******************************************************************************/ -function setPopular(e,mid,popular) { - $.ajax('//api.juick.com/messages/set_popular?mid='+mid+'&popular='+popular+'&hash='+hash).done(function() { - var a=$(e).closest("article"); - a.append("OK!
"); - }); +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) + .then(function () { + var a = e.closest('article'); + a.append(resultMessage('OK!')); + }); return false; } -function setPrivacy(e,mid) { - $.ajax('//api.juick.com/messages/set_privacy?mid='+mid+'&hash='+hash).done(function() { - var a=$(e).closest("article"); - a.append("OK!
"); - }); +function setPrivacy(e, mid) { + var hash = document.getElementById('body').getAttribute('data-hash'); + fetch('//api.juick.com/messages/set_privacy?mid=' + mid + '&hash=' + hash) + .then(function () { + var a = e.closest('article'); + a.append(resultMessage('OK!')); + }); return false; } /******************************************************************************/ -function readerLinkReplace(e) { - var a=$(e); - a.attr('href','/_out?lid='+a.data('lid')); -} - -/******************************************************************************/ - -jQuery.fn.selectText = function(){ +Element.prototype.selectText = function () { var d = document; if (d.body.createTextRange) { var range = d.body.createTextRange(); - range.moveToElementText(this[0]); + range.moveToElementText(this); range.select(); } else if (window.getSelection) { - var selection = window.getSelection(); - var range = d.createRange(); - range.selectNodeContents(this[0]); + var selection = window.getSelection(); + var rangeSel = d.createRange(); + rangeSel.selectNodeContents(this); selection.removeAllRanges(); - selection.addRange(range); + selection.addRange(rangeSel); } }; -/* - * jQuery.fn.autoResize 1.14 - */ - -(function($){ - - var uid = 'ar' + +new Date, - - defaults = autoResize.defaults = { - onResize: function(){}, - onBeforeResize: function(){ - return 123 - }, - onAfterResize: function(){ - return 555 - }, - animate: { - duration: 200, - complete: function(){} - }, - extraSpace: 50, - minHeight: 'original', - maxHeight: 500, - minWidth: 'original', - maxWidth: 500 - }; - - autoResize.cloneCSSProperties = [ - 'lineHeight', 'textDecoration', 'letterSpacing', - 'fontSize', 'fontFamily', 'fontStyle', 'fontWeight', - 'textTransform', 'textAlign', 'direction', 'wordSpacing', 'fontSizeAdjust', - 'paddingTop', 'paddingLeft', 'paddingBottom', 'paddingRight', 'width' - ]; - - autoResize.cloneCSSValues = { - position: 'absolute', - top: -9999, - left: -9999, - opacity: 0, - overflow: 'hidden' - }; - - autoResize.resizableFilterSelector = [ - 'textarea:not(textarea.' + uid + ')', - 'input:not(input[type])', - 'input[type=text]', - 'input[type=password]', - 'input[type=email]', - 'input[type=url]' - ].join(','); - - autoResize.AutoResizer = AutoResizer; - - $.fn.autoResize = autoResize; - - function autoResize(config) { - this.filter(autoResize.resizableFilterSelector).each(function(){ - new AutoResizer( $(this), config ); - }); - return this; - } - - function AutoResizer(el, config) { - - if (el.data('AutoResizer')) { - el.data('AutoResizer').destroy(); - } - - config = this.config = $.extend({}, autoResize.defaults, config); - this.el = el; - - this.nodeName = el[0].nodeName.toLowerCase(); - - this.originalHeight = el.height(); - this.previousScrollTop = null; - - this.value = el.val(); - - if (config.maxWidth === 'original') config.maxWidth = el.width(); - if (config.minWidth === 'original') config.minWidth = el.width(); - if (config.maxHeight === 'original') config.maxHeight = el.height(); - if (config.minHeight === 'original') config.minHeight = el.height(); - - if (this.nodeName === 'textarea') { - el.css({ - resize: 'none', - overflowY: 'hidden' - }); - } - - el.data('AutoResizer', this); - - // Make sure onAfterResize is called upon animation completion - config.animate.complete = (function(f){ - return function() { - config.onAfterResize.call(el); - return f.apply(this, arguments); - }; - }(config.animate.complete)); - - this.bind(); - +function ready(fn) { + if (document.readyState != 'loading') { + fn(); + } else { + document.addEventListener('DOMContentLoaded', fn); } +} - AutoResizer.prototype = { - - bind: function() { - - var check = $.proxy(function(){ - this.check(); - return true; - }, this); - - this.unbind(); - - this.el - .bind('keyup.autoResize', check) - //.bind('keydown.autoResize', check) - .bind('change.autoResize', check) - .bind('paste.autoResize', function() { - setTimeout(function() { - check(); - }, 0); - }); - - if (!this.el.is(':hidden')) { - this.check(null, true); - } - - }, - - unbind: function() { - this.el.unbind('.autoResize'); - }, - - createClone: function() { - - var el = this.el, - clone = this.nodeName === 'textarea' ? el.clone() : $(''); - - this.clone = clone; - - $.each(autoResize.cloneCSSProperties, function(i, p){ - clone[0].style[p] = el.css(p); +ready(function () { + autosize(document.querySelectorAll('textarea')); + var insertButtons = function (e) { + var textarea = e.target; + textarea.classList.add('narrow'); + textarea.insertAdjacentHTML('afterend', ''); + textarea.parentNode.insertAdjacentHTML('afterend', ''); + 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', ''); + e.target.removeEventListener('click', insertPMButtons); + e.preventDefault(); + }; + 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) { + document.querySelectorAll('.msg-comments').forEach(function(e) { + var rid = e.parentNode.parentNode.id; + e.addEventListener('click', function (e) { + showMoreReplies(e.target, rid); + e.preventDefault(); + }); }); - - clone - .removeAttr('name') - .removeAttr('id') - .addClass(uid) - .attr('tabIndex', -1) - .css(autoResize.cloneCSSValues); - - if (this.nodeName === 'textarea') { - clone.height('auto'); - } else { - clone.width('auto').css({ - whiteSpace: 'nowrap' + document.querySelectorAll('.a-thread-comment').forEach(function(e) { + var rid = e.closest('li').id; + e.addEventListener('click', function (e) { + showCommentForm(pageMID, rid); + e.preventDefault(); }); - } - - }, - - check: function(e, immediate) { - - if (!this.clone) { - this.createClone(); - this.injectClone(); - } - - var config = this.config, - clone = this.clone, - el = this.el, - value = el.val(); - - // Do nothing if value hasn't changed - if (value === this.prevValue) { - return true; - } - this.prevValue = value; - - if (this.nodeName === 'input') { - - clone.text(value); - - // Calculate new width + whether to change - var cloneWidth = clone.width(), - newWidth = (cloneWidth + config.extraSpace) >= config.minWidth ? - cloneWidth + config.extraSpace : config.minWidth, - currentWidth = el.width(); - - newWidth = Math.min(newWidth, config.maxWidth); - - if ( - (newWidth < currentWidth && newWidth >= config.minWidth) || - (newWidth >= config.minWidth && newWidth <= config.maxWidth) - ) { - - config.onBeforeResize.call(el); - config.onResize.call(el); - - el.scrollLeft(0); - - if (config.animate && !immediate) { - el.stop(1,1).animate({ - width: newWidth - }, config.animate); - } else { - el.width(newWidth); - config.onAfterResize.call(el); - } - - } - - return; - - } - - // TEXTAREA - - clone.width(el.width()).height(0).val(value).scrollTop(10000); - - var scrollTop = clone[0].scrollTop; - - // Don't do anything if scrollTop hasen't changed: - if (this.previousScrollTop === scrollTop) { - return; - } - - this.previousScrollTop = scrollTop; - - if (scrollTop + config.extraSpace >= config.maxHeight) { - el.css('overflowY', ''); - scrollTop = config.maxHeight; - immediate = true; - } else if (scrollTop <= config.minHeight) { - scrollTop = config.minHeight; - } else { - el.css('overflowY', 'hidden'); - scrollTop += config.extraSpace; - } - - config.onBeforeResize.call(el); - config.onResize.call(el); - - // Either animate or directly apply height: - if (config.animate && !immediate) { - el.stop(1,1).animate({ - height: scrollTop - }, config.animate); - } else { - el.height(scrollTop); - config.onAfterResize.call(el); - } - - }, - - destroy: function() { - this.unbind(); - this.el.removeData('AutoResizer'); - this.clone.remove(); - delete this.el; - delete this.clone; - }, - - injectClone: function() { - ( - autoResize.cloneContainer || - (autoResize.cloneContainer = $('