some work on comment_item.tpl

This commit is contained in:
marijus 2014-05-20 17:33:06 +02:00
parent 6d01707a72
commit c530a7a936
6 changed files with 77 additions and 176 deletions

View File

@ -199,60 +199,21 @@
/* comment_item */ /* comment_item */
.comment-wwedit-wrapper.threaded > .comment-edit-form > .comment-edit-photo {
width: 40px;
}
.comment-wwedit-wrapper.threaded > .comment-edit-form > .comment-edit-text-empty {
height: 1.5em;
}
.comment-wwedit-wrapper.threaded > .comment-edit-form > .comment-edit-submit-wrapper > .comment-edit-submit {
margin-left: 50px;
}
.comment-edit-photo {
margin: 10px 10px 10px 7px;
float: left;
}
[class^="comment-edit-bb"] {
display: none;
margin: 0px 0 -5px 0px;
padding: 0px;
width: 75%;
min-width: 170px
}
[class^="comment-edit-bb"] > li {
display: inline-block;
margin: 10px 10px 0 0;
visibility: none;
}
[class^="comment-edit-bb-end"] {
clear: both;
}
.comment-edit-text-empty, .comment-edit-text-full { .comment-edit-text-empty, .comment-edit-text-full {
float: left; float: left;
margin-top: 10px; width: 100%;
padding: 3px 1px 1px 3px;
padding: 8px; padding: 8px;
} }
.comment-edit-text-empty { .comment-edit-text-empty {
height: 2.8em; height: 2.8em;
width: 30%;
min-width: 170px;
overflow: auto; overflow: auto;
margin-bottom: 10px; resize: none;
} }
.comment-edit-text-full { .comment-edit-text-full {
height: 150px; height: 150px;
width: 50%;
min-width: 170px;
overflow: auto; overflow: auto;
} }
@ -280,14 +241,12 @@
filter:alpha(opacity=100); filter:alpha(opacity=100);
} }
.comment-edit-text-end { .comment-tools {
clear: both; display: none;
margin-top: 7px;
} }
.comment-edit-submit { .comment-edit-preview {
margin: 10px 0px 10px 52px; display: none;
} margin-top: 7px;
.comment-preview-icon {
margin-left: 15px;
} }

View File

@ -6,21 +6,25 @@
$("#comment-edit-text-" + id).addClass("comment-edit-text-full"); $("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
$("#mod-cmnt-wrap-" + id).show(); $("#mod-cmnt-wrap-" + id).show();
openMenu("comment-edit-submit-wrapper-" + id); openMenu("comment-tools-" + id);
return true; return true;
} }
return false; return false;
} }
function commentClose(obj,id) { function commentClose(obj,id) {
if(obj.value == '') { $(document).on('click', function() {
obj.value = aStr['comment']; if(obj.value == '') {
$("#comment-edit-text-" + id).removeClass("comment-edit-text-full"); obj.value = aStr['comment'];
$("#comment-edit-text-" + id).addClass("comment-edit-text-empty"); $("#comment-edit-text-" + id).removeClass("comment-edit-text-full");
$("#mod-cmnt-wrap-" + id).hide(); $("#comment-edit-text-" + id).addClass("comment-edit-text-empty");
closeMenu("comment-edit-submit-wrapper-" + id); $("#mod-cmnt-wrap-" + id).hide();
return true; closeMenu("comment-tools-" + id);
} return true;
return false; }
return false;
});
} }
function showHideCommentBox(id) { function showHideCommentBox(id) {
@ -32,14 +36,13 @@
} }
} }
function commentInsert(obj,id) { function commentInsert(obj,id) {
var tmpStr = $("#comment-edit-text-" + id).val(); var tmpStr = $("#comment-edit-text-" + id).val();
if(tmpStr == '$comment') { if(tmpStr == '$comment') {
tmpStr = ''; tmpStr = '';
$("#comment-edit-text-" + id).addClass("comment-edit-text-full"); $("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
openMenu("comment-edit-submit-wrapper-" + id); openMenu("comment-tools-" + id);
} }
var ins = $(obj).html(); var ins = $(obj).html();
ins = ins.replace('&lt;','<'); ins = ins.replace('&lt;','<');
@ -62,7 +65,7 @@
tmpStr = ""; tmpStr = "";
$("#comment-edit-text-" + id).addClass("comment-edit-text-full"); $("#comment-edit-text-" + id).addClass("comment-edit-text-full");
$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
openMenu("comment-edit-submit-wrapper-" + id); openMenu("comment-tools-" + id);
$("#comment-edit-text-" + id).val(tmpStr); $("#comment-edit-text-" + id).val(tmpStr);
} }
@ -748,6 +751,7 @@ function updateConvItems(mode,data) {
$("#comment-edit-form-" + id).serialize(), $("#comment-edit-form-" + id).serialize(),
function(data) { function(data) {
if(data.success) { if(data.success) {
$("#comment-edit-preview-" + id).hide();
$("#comment-edit-wrapper-" + id).hide(); $("#comment-edit-wrapper-" + id).hide();
$("#comment-edit-text-" + id).val(''); $("#comment-edit-text-" + id).val('');
var tarea = document.getElementById("comment-edit-text-" + id); var tarea = document.getElementById("comment-edit-text-" + id);

View File

@ -1884,7 +1884,6 @@ img.mail-list-sender-photo {
.wall-item-content-wrapper { .wall-item-content-wrapper {
background-color: $item_colour; background-color: $item_colour;
opacity: $item_opacity;
padding: 10px; padding: 10px;
} }
@ -1893,9 +1892,6 @@ img.mail-list-sender-photo {
border-top-left-radius: $radiuspx; border-top-left-radius: $radiuspx;
} }
.wall-item-content-wrapper:hover {
z-index:99;
}
.comment .wall-item-body { .comment .wall-item-body {
padding-left: $comment_padding; padding-left: $comment_padding;
} }
@ -1905,35 +1901,23 @@ img.mail-list-sender-photo {
background-color: $comment_item_colour; background-color: $comment_item_colour;
border-left: $comment_border_left $comment_border_colour; border-left: $comment_border_left $comment_border_colour;
border-right: $comment_border_right $comment_border_colour; border-right: $comment_border_right $comment_border_colour;
border-bottom: $comment_border_bottom $comment_border_colour; border-bottom: $comment_border_bottom $comment_border_colour;
border-radius: 0px; border-radius: 0px;
padding: 7px 10px 7px 7px; padding: 7px 10px 7px 7px;
} }
/*
.thread-wrapper.toplevel_item{
border-bottom: $comment_border_bottom $comment_border_colour;
border-right: $comment_border_right $item_colour;
border-left: $comment_border_left $item_colour;
border-top-right-radius: $radiuspx;
border-top-left-radius: $radiuspx;
border-bottom-right-radius: $radiuspx;
border-bottom-left-radius: $radiuspx;
}
*/
.wall-item-comment-wrapper { .wall-item-comment-wrapper {
background-color: $comment_item_colour; padding: 7px 10px;
/* border-top: $comment_border_top $item_colour; */ background-color: $item_colour;
border-right: $comment_border_right $item_colour;
border-left: $comment_border_left $item_colour;
border-bottom: $comment_border_bottom $item_colour;
border-radius: 0px; border-radius: 0px;
border-bottom-right-radius: $radiuspx; border-bottom-right-radius: $radiuspx;
border-bottom-left-radius: $radiuspx; border-bottom-left-radius: $radiuspx;
margin-top: 3px;
} }
.wall-item-comment-wrapper-wc {
margin-top: 0px;
}
.wall-item-like, .wall-item-like,
.wall-item-dislike { .wall-item-dislike {
@ -1981,37 +1965,15 @@ img.mail-list-sender-photo {
color: $toolicon_colour; color: $toolicon_colour;
} }
.item-tool:hover {
/*color: $toolicon_activecolour;*/
}
.like-rotator { .like-rotator {
color: $toolicon_colour; color: $toolicon_colour;
} }
.my-comment-photo {
border-radius: $radiuspx;
-moz-border-radius: $radiuspx;
box-shadow: $shadowpx $shadowpx $shadowpx 0 #444444;
}
.comment-edit-photo img {
width: $reply_photo;
}
[class^="comment-edit-bb"] {
list-style: none;
}
.comment-icon { .comment-icon {
font-size: 1.2em; font-size: 0.8em;
color: $toolicon_colour; color: $toolicon_colour;
} }
.comment-icon:hover {
color: $toolicon_activecolour;
}
.comment-edit-text-empty, .comment-edit-text-empty,
.comment-edit-text-full { .comment-edit-text-full {
border: 1px solid #ccc; border: 1px solid #ccc;

View File

@ -1,23 +1,3 @@
function cmtBbOpen(comment, id) {
if($(comment).hasClass('comment-edit-text-full')) {
$(".comment-edit-bb-" + id).show();
return true;
}
return false;
}
function cmtBbClose(comment, id) {
// if($(comment).hasClass('comment-edit-text-empty')) {
// $(".comment-edit-bb-" + id).hide();
// return true;
// }
return false;
}
//document.jotpermslock = 'icon-lock';
//document.jotpermsunlock = 'icon-unlock';
$(document).ready(function() { $(document).ready(function() {
$('#expand-aside').click(function() { $('#expand-aside').click(function() {

View File

@ -10,44 +10,7 @@
<input type="hidden" name="return" value="{{$return_path}}" /> <input type="hidden" name="return" value="{{$return_path}}" />
<input type="hidden" name="jsreload" value="{{$jsreload}}" /> <input type="hidden" name="jsreload" value="{{$jsreload}}" />
<input type="hidden" name="preview" id="comment-preview-inp-{{$id}}" value="0" /> <input type="hidden" name="preview" id="comment-preview-inp-{{$id}}" value="0" />
<textarea id="comment-edit-text-{{$id}}" class="comment-edit-text-empty" name="body" onFocus="commentOpen(this,{{$id}});" onBlur="commentClose(this,{{$id}});" >{{$comment}}</textarea>
<div class="comment-edit-photo" id="comment-edit-photo-{{$id}}" >
<a class="comment-edit-photo-link" href="{{$mylink}}" title="{{$mytitle}}"><img class="my-comment-photo" src="{{$myphoto}}" alt="{{$mytitle}}" title="{{$mytitle}}" /></a>
</div>
<div class="comment-edit-photo-end"></div>
<ul class="comment-edit-bb-{{$id}}">
<li><i class="icon-bold shadow comment-icon"
style="cursor: pointer;" title="{{$edbold}}"
onclick="insertbbcomment('{{$comment}}','b', {{$id}});"></i></li>
<li><i class="icon-italic shadow comment-icon"
style="cursor: pointer;" title="{{$editalic}}"
onclick="insertbbcomment('{{$comment}}','i', {{$id}});"></i></li>
<li><i class="icon-underline shadow comment-icon"
style="cursor: pointer;" title="{{$eduline}}"
onclick="insertbbcomment('{{$comment}}','u', {{$id}});"></i></li>
<li><i class="icon-quote-left shadow comment-icon"
style="cursor: pointer;" title="{{$edquote}}"
onclick="insertbbcomment('{{$comment}}','quote', {{$id}});"></i></li>
<li><i class="icon-terminal shadow comment-icon"
style="cursor: pointer;" title="{{$edcode}}"
onclick="insertbbcomment('{{$comment}}','code', {{$id}});"></i></li>
<li><i class="icon-camera shadow comment-icon"
style="cursor: pointer;" title="{{$edimg}}"
onclick="insertbbcomment('{{$comment}}','img', {{$id}});"></i></li>
<li><i class="icon-link shadow comment-icon"
style="cursor: pointer;" title="{{$edurl}}"
onclick="insertbbcomment('{{$comment}}','url', {{$id}});"></i></li>
<li><i class="icon-facetime-video shadow comment-icon"
style="cursor: pointer;" title="{{$edvideo}}"
onclick="insertbbcomment('{{$comment}}','video', {{$id}});"></i></li>
{{if $feature_encrypt}}
<li><i class="icon-key shadow comment-icon"
style="cursor: pointer;" title="{{$encrypt}}"
onclick="red_encrypt('{{$cipher}}','#comment-edit-text-' + '{{$id}}',''); return false;"></i></li>
{{/if}}
</ul>
<div class="comment-edit-bb-end"></div>
<textarea id="comment-edit-text-{{$id}}" class="comment-edit-text-empty" name="body" onFocus="commentOpen(this,{{$id}});cmtBbOpen(this, {{$id}});" onBlur="commentClose(this,{{$id}});cmtBbClose(this,{{$id}});" >{{$comment}}</textarea>
{{if $qcomment}} {{if $qcomment}}
<select id="qcomment-select-{{$id}}" name="qcomment-{{$id}}" class="qcomment" onchange="qCommentInsert(this,{{$id}});" > <select id="qcomment-select-{{$id}}" name="qcomment-{{$id}}" class="qcomment" onchange="qCommentInsert(this,{{$id}});" >
<option value=""></option> <option value=""></option>
@ -56,17 +19,48 @@
{{/foreach}} {{/foreach}}
</select> </select>
{{/if}} {{/if}}
<div class="clear"></div>
<div class="comment-edit-text-end"></div> <div id="comment-tools-{{$id}}" class="comment-tools">
<div class="comment-edit-submit-wrapper" id="comment-edit-submit-wrapper-{{$id}}" style="display: none;" > <div id="comment-edit-bb-{{$id}}" class="btn-group pull-left">
<input type="submit" onclick="post_comment({{$id}}); return false;" id="comment-edit-submit-{{$id}}" class="comment-edit-submit" name="submit" value="{{$submit}}" /> <button class="btn btn-default btn-xs" title="{{$edbold}}" onclick="insertbbcomment('{{$comment}}','b', {{$id}}); return false;">
<i class="icon-bold comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$editalic}}" onclick="insertbbcomment('{{$comment}}','i', {{$id}}); return false;">
<i class="icon-italic comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$eduline}}" onclick="insertbbcomment('{{$comment}}','u', {{$id}}); return false;">
<i class="icon-underline comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$edquote}}" onclick="insertbbcomment('{{$comment}}','quote', {{$id}}); return false;">
<i class="icon-quote-left comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$edcode}}" onclick="insertbbcomment('{{$comment}}','code', {{$id}}); return false;">
<i class="icon-terminal comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$comment}}" onclick="insertbbcomment('{{$comment}}','img', {{$id}}); return false;">
<i class="icon-camera comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$edurl}}" onclick="insertbbcomment('{{$comment}}','url', {{$id}}); return false;">
<i class="icon-link comment-icon"></i>
</button>
<button class="btn btn-default btn-xs" title="{{$edvideo}}" onclick="insertbbcomment('{{$comment}}','video', {{$id}}); return false;">
<i class="icon-facetime-video comment-icon"></i>
</button>
{{if $feature_encrypt}}
<button class="btn btn-default btn-xs" title="{{$encrypt}}" onclick="red_encrypt('{{$cipher}}','#comment-edit-text-' + '{{$id}}',''); return false;">
<i class="icon-key comment-icon"></i>
</button>
{{/if}}
</div>
<div class="btn-group pull-right" id="comment-edit-submit-wrapper-{{$id}}">
{{if $preview}} {{if $preview}}
<span onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}" class="fakelink"><i class="icon-eye-open comment-icon comment-preview-icon" title="{{$preview}}"></i></span> <button id="comment-edit-submit-{{$id}}" class="btn btn-default btn-xs btn-preview" onclick="preview_comment({{$id}}); return false;" title="{{$preview}}">
<div id="comment-edit-preview-{{$id}}" class="comment-edit-preview" style="display:none;"></div> <i class="icon-eye-open comment-icon" ></i>
</button>
{{/if}} {{/if}}
<button id="comment-edit-submit-{{$id}}" class="btn btn-primary btn-xs" type="submit" name="submit" onclick="post_comment({{$id}}); return false;">{{$submit}}</button>
</div>
</div> </div>
<div class="clear"></div>
<div class="comment-edit-end"></div>
</form> </form>
</div> </div>

View File

@ -174,9 +174,11 @@
{{/foreach}} {{/foreach}}
{{/if}} {{/if}}
{{if $item.comment}} {{if $item.comment}}
<div class="wall-item-comment-wrapper" > <div class="wall-item-comment-wrapper{{if $item.children}} wall-item-comment-wrapper-wc{{/if}}" >
{{$item.comment}} {{$item.comment}}
</div> </div>
<div id="comment-edit-preview-{{$item.id}}" class="comment-edit-preview"></div>
<div class="clear"></div>
{{/if}} {{/if}}
</div> </div>
{{if $item.comment_lastcollapsed}} {{if $item.comment_lastcollapsed}}