harukin/core
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rewrite comment form handling

Browse Source
This commit is contained in:
git-marijus 2017-08-28 23:42:17 +02:00
parent 187f19b170
commit e70bf97508
5 changed files with 70 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
Zotlabs/Lib/ThreadItem.php
View File

@ -758,9 +758,9 @@ class ThreadItem {
'$sourceapp' => \App::$sourcename,
'$observer' => get_observer_hash(),
'$anoncomments' => (($conv->get_mode() === 'channel' && perm_is_allowed($conv->get_profile_owner(),'','post_comments')) ? true : false),
'$anonname' => [ 'anonname', t('Your full name (required)'),'','','','onBlur="commentCloseUI(this,\'' . $this->get_id() . '\')"' ],
'$anonmail' => [ 'anonmail', t('Your email address (required)'),'','','','onBlur="commentCloseUI(this,\'' . $this->get_id() . '\')"' ],
'$anonurl' => [ 'anonurl', t('Your website URL (optional)'),'','','','onBlur="commentCloseUI(this,\'' . $this->get_id() . '\')"' ]
'$anonname' => [ 'anonname', t('Your full name (required)') ],
'$anonmail' => [ 'anonmail', t('Your email address (required)') ],
'$anonurl' => [ 'anonurl', t('Your website URL (optional)') ]
));
return $comment_box;

15
view/css/conversation.css
View File

@ -183,24 +183,19 @@ a.wall-item-name-link {
/* comment_item */
.comment-edit-text-empty,
.comment-edit-text-full {
.comment-edit-text {
padding: 0.5rem;
width: 100%;
display: inherit;
}
.comment-edit-text-empty {
height: 2rem;
line-height: 1;
overflow: hidden;
height: 2rem;
resize: none;
}
.comment-edit-text-full {
height: 7rem;
.comment-edit-text.expanded {
line-height: 1.25;
overflow: auto;
height: 7rem;
resize: vertical;
}

75
view/js/main.js
View File

@ -1,6 +1,55 @@
function confirmDelete() { return confirm(aStr.delitem); }
function handle_comment_form(e) {
e.stopPropagation();
//handle eventual expanded forms
var expanded = $('.comment-edit-text.expanded');
var i = 0;
if(expanded.length) {
expanded.each(function() {
var ex_form = $(expanded[i].form);
var ex_fields = ex_form.find(':input[type=text], textarea');
var ex_fields_empty = true;
ex_fields.each(function() {
if($(this).val() != '')
ex_fields_empty = false;
});
if(ex_fields_empty) {
ex_form.find('.comment-edit-text').removeClass('expanded').attr('placeholder', aStr.comment);
ex_form.find(':not(.comment-edit-text)').hide();
}
i++
});
}
// handle clicked form
var form = $(this);
var fields = form.find(':input[type=text], textarea');
var fields_empty = true;
if(form.find('.comment-edit-text').length) {
form.find('.comment-edit-text').addClass('expanded').removeAttr('placeholder');
form.find(':not(:visible)').show();
}
// handle click outside of form (close empty forms)
$(document).on('click', function(e) {
fields.each(function() {
if($(this).val() != '')
fields_empty = false;
});
if(fields_empty) {
form.find('.comment-edit-text').removeClass('expanded').attr('placeholder', aStr.comment);
form.find(':not(.comment-edit-text)').hide();
}
});
}
/*
function commentOpenUI(obj, id) {
$(document).unbind( "click.commentOpen", handler );
@ -44,8 +93,7 @@ function commentCloseUI(obj, id) {
function commentOpen(obj, id) {
if(obj.value == aStr.comment) {
obj.value = '';
$("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
$("#comment-edit-text-" + id).addClass("expanded");
$("#mod-cmnt-wrap-" + id).show();
$("#comment-tools-" + id).show();
$("#comment-edit-anon-" + id).show();
@ -53,12 +101,11 @@ function commentOpen(obj, id) {
}
return false;
}
*/
function commentClose(obj, id) {
if(obj.value === '') {
obj.value = aStr.comment;
$("#comment-edit-text-" + id).removeClass("comment-edit-text-full");
$("#comment-edit-text-" + id).addClass("comment-edit-text-empty");
$("#comment-edit-text-" + id).removeClass("expanded");
$("#mod-cmnt-wrap-" + id).hide();
$("#comment-tools-" + id).hide();
$("#comment-edit-anon-" + id).hide();
@ -67,6 +114,7 @@ function commentClose(obj, id) {
return false;
}
function showHideCommentBox(id) {
if( $('#comment-edit-form-' + id).is(':visible')) {
$('#comment-edit-form-' + id).hide();
@ -79,8 +127,7 @@ function commentInsert(obj, id) {
var tmpStr = $("#comment-edit-text-" + id).val();
if(tmpStr == '$comment') {
tmpStr = '';
$("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
$("#comment-edit-text-" + id).addClass("expanded");
openMenu("comment-tools-" + id);
}
var ins = $(obj).html();
@ -101,8 +148,7 @@ function insertbbcomment(comment, BBcode, id) {
var tmpStr = $("#comment-edit-text-" + id).val();
if(tmpStr == comment) {
tmpStr = "";
$("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
$("#comment-edit-text-" + id).addClass("expanded");
openMenu("comment-tools-" + id);
$("#comment-edit-text-" + id).val(tmpStr);
}
@ -160,8 +206,7 @@ function insertCommentURL(comment, id) {
var tmpStr = $("#comment-edit-text-" + id).val();
if(tmpStr == comment) {
tmpStr = "";
$("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
$("#comment-edit-text-" + id).addClass("expanded");
openMenu("comment-tools-" + id);
$("#comment-edit-text-" + id).val(tmpStr);
}
@ -183,8 +228,7 @@ function qCommentInsert(obj, id) {
var tmpStr = $("#comment-edit-text-" + id).val();
if(tmpStr == aStr.comment) {
tmpStr = '';
$("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
$("#comment-edit-text-" + id).addClass("expanded");
openMenu("comment-edit-submit-wrapper-" + id);
}
var ins = $(obj).val();
@ -728,7 +772,7 @@ function collapseHeight() {
function liveUpdate() {
if(typeof profile_uid === 'undefined') profile_uid = false; /* Should probably be unified with channelId defined in head.tpl */
if((src === null) || (stopped) || (! profile_uid)) { $('.like-rotator').spin(false); return; }
if(($('.comment-edit-text-full').length) || (in_progress)) {
if(($('.comment-edit-text.expanded').length) || (in_progress)) {
if(livetime) {
clearTimeout(livetime);
}
@ -1312,9 +1356,10 @@ Array.prototype.remove = function(item) {
return this.push.apply(this, rest);
};
$(document).ready(function() {
$(document).on('click focus', '.comment-edit-form', handle_comment_form);
jQuery.timeago.settings.strings = {
prefixAgo : aStr['t01'],
prefixFromNow : aStr['t02'],

7
view/theme/redbasic/css/style.css
View File

@ -1073,16 +1073,11 @@ img.mail-conv-sender-photo {
}
.comment-edit-text-empty,
.comment-edit-text-full {
.comment-edit-text {
border: 1px solid #ccc;
border-radius: $radius;
}
.comment-edit-text-empty {
color: gray;
}
.divgrow-showmore {
display: block;
border-top: 1px dashed #ccc;

2
view/tpl/comment_item.tpl
View File

@ -18,7 +18,7 @@
{{$anon_extras}}
</div>
{{/if}}
<textarea id="comment-edit-text-{{$id}}" class="comment-edit-text-empty" name="body" onFocus="commentOpenUI(this,{{$id}});" onBlur="commentCloseUI(this,{{$id}});" ondragenter="linkdropper(event);" ondragleave="linkdropexit(event);" ondragover="linkdropper(event);" ondrop="linkdrop(event);" >{{$comment}}</textarea>
<textarea id="comment-edit-text-{{$id}}" class="comment-edit-text comment-edit-text-empty" placeholder="{{$comment}}" name="body" ondragenter="linkdropper(event);" ondragleave="linkdropexit(event);" ondragover="linkdropper(event);" ondrop="linkdrop(event);" ></textarea>
{{if $qcomment}}
<select id="qcomment-select-{{$id}}" name="qcomment-{{$id}}" class="qcomment" onchange="qCommentInsert(this,{{$id}});" >
<option value=""></option>