fix issues with mention suggestions

This commit is contained in:
Hannes Mannerheim 2014-11-26 00:58:56 +01:00
parent 3701985e7f
commit e442a6d67d
4 changed files with 42 additions and 21 deletions

View File

@ -102,7 +102,7 @@ class QvitterAction extends ApiAction
<title><?php print $sitetitle; ?></title> <title><?php print $sitetitle; ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
<link rel="stylesheet" type="text/css" href="<?php print $qvitterpath; ?>css/qvitter.css?v=40" /> <link rel="stylesheet" type="text/css" href="<?php print $qvitterpath; ?>css/qvitter.css?v=41" />
<link rel="stylesheet" type="text/css" href="<?php print $qvitterpath; ?>css/jquery.minicolors.css" /> <link rel="stylesheet" type="text/css" href="<?php print $qvitterpath; ?>css/jquery.minicolors.css" />
<link rel="shortcut icon" type="image/x-icon" href="<?php print $qvitterpath; ?>/img/favicon.ico?v=4"> <link rel="shortcut icon" type="image/x-icon" href="<?php print $qvitterpath; ?>/img/favicon.ico?v=4">
<?php <?php
@ -715,11 +715,11 @@ class QvitterAction extends ApiAction
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/lib/jquery.minicolors.min.js"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/lib/jquery.minicolors.min.js"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/lib/jquery.jWindowCrop.js"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/lib/jquery.jWindowCrop.js"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/lib/load-image.min.js"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/lib/load-image.min.js"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/dom-functions.js?v=41"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/dom-functions.js?v=42"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/misc-functions.js?v=40"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/misc-functions.js?v=40"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/ajax-functions.js?v=40"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/ajax-functions.js?v=40"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/lan.js?v=40"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/lan.js?v=41"></script>
<script type="text/javascript" src="<?php print $qvitterpath; ?>js/qvitter.js?v=42"></script> <script type="text/javascript" src="<?php print $qvitterpath; ?>js/qvitter.js?v=43"></script>
</body> </body>
</html> </html>

View File

@ -1277,6 +1277,10 @@ button#submit-login:hover {
.stream-item.hidden { .stream-item.hidden {
display:none; display:none;
} }
.stream-item > div.last-visible,
.stream-item > div.last-visible .queet {
border-radius: 0 0 5px 5px;
}
.stream-item.conversation { .stream-item.conversation {
background-color:#F6F6F6; background-color:#F6F6F6;
border:0 none; border:0 none;
@ -1441,7 +1445,9 @@ background-repeat: no-repeat;
.stream-item.expanded .stream-item:last-child .queet { .stream-item.expanded .stream-item:last-child .queet {
border-bottom:0 none; border-bottom:0 none;
} }
.stream-item.expanded > div:last-child { .stream-item.expanded > div:last-child,
.stream-item.expanded > div:last-child .inline-reply-queetbox,
.stream-item.expanded > div:last-child .queet {
border-radius:0 0 6px 6px; border-radius:0 0 6px 6px;
} }
@ -2090,7 +2096,6 @@ ul.queet-actions li .icon.sm-fav:before {
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px;
margin:8px 0; margin:8px 0;
overflow-y: hidden;
} }
.stream-item.expanded > .queet > .attachments{ .stream-item.expanded > .queet > .attachments{
display:none; display:none;
@ -2341,7 +2346,7 @@ span.inline-reply-caret .caret-inner {
.inline-reply-queetbox .mentions-suggestions { .inline-reply-queetbox .mentions-suggestions {
left: 71px; left: 71px;
width: 436px; width: 504px;
} }
.modal-body .inline-reply-queetbox .mentions-suggestions { .modal-body .inline-reply-queetbox .mentions-suggestions {
@ -2557,7 +2562,6 @@ span.inline-reply-caret .caret-inner {
padding-left: 12px; padding-left: 12px;
position:relative; position:relative;
border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px;
overflow: hidden;
} }
#user-footer-inner img, #user-footer-inner img,
.inline-reply-queetbox img { .inline-reply-queetbox img {
@ -2699,10 +2703,10 @@ div.syntax-middle {
.mentions-suggestions { .mentions-suggestions {
background-color:rgba(238, 238, 238, 0.97); background-color:rgba(238, 238, 238, 0.97);
left: 12px; left: 13px;
position: absolute; position: absolute;
top: 100px; top: 100px;
width: 276px; width: 264px;
z-index: 100; z-index: 100;
display:none; display:none;
box-shadow:0 1px 4px rgba(0, 0, 0, 0.35); box-shadow:0 1px 4px rgba(0, 0, 0, 0.35);

View File

@ -1350,6 +1350,7 @@ function showConversation(qid) {
// loop trough this stream items conversation and show the "strict" line of replies // loop trough this stream items conversation and show the "strict" line of replies
findInReplyToStatusAndShow(qid,$('#stream-item-' + qid).attr('data-in-reply-to-status-id'),true,false); findInReplyToStatusAndShow(qid,$('#stream-item-' + qid).attr('data-in-reply-to-status-id'),true,false);
backToMyScrollPos($('#q-' + qid),qid,false); backToMyScrollPos($('#q-' + qid),qid,false);
findAndMarkLastVisibleInConversation($('#stream-item-' + qid));
} }
else { else {
remove_spinner(); remove_spinner();
@ -1358,6 +1359,16 @@ function showConversation(qid) {
} }
/* ·
·
· Add last visible class, since that's not possible to select in pure css
·
· · · · · · · · · · · · · */
function findAndMarkLastVisibleInConversation(streamItem) {
streamItem.children().removeClass('last-visible');
streamItem.children().not('.hidden-conversation').last().addClass('last-visible');
}
/* · /* ·
· ·

View File

@ -1906,13 +1906,16 @@ $('body').on('keyup', 'div.queet-box-syntax', function(e) {
· · · · · · · · · · · · · */ · · · · · · · · · · · · · */
$('body').on('click','.view-more-container-bottom', function(){ $('body').on('click','.view-more-container-bottom', function(){
var thisParentStreamItem = $(this).parent('.stream-item');
findReplyToStatusAndShow($(this).parent('.stream-item').attr('data-quitter-id'),$(this).attr('data-replies-after')); findReplyToStatusAndShow($(this).parent('.stream-item').attr('data-quitter-id'),$(this).attr('data-replies-after'));
$(this).remove(); $(this).remove();
findAndMarkLastVisibleInConversation(thisParentStreamItem);
}); });
$('body').on('click','.view-more-container-top', function(){ $('body').on('click','.view-more-container-top', function(){
var this_qid = $(this).closest('.stream-item:not(.conversation)').attr('data-quitter-id'); var this_qid = $(this).closest('.stream-item:not(.conversation)').attr('data-quitter-id');
var queet = $(this).siblings('.queet'); var queet = $(this).siblings('.queet');
var thisParentStreamItem = $(this).parent('.stream-item');
rememberMyScrollPos(queet,'moretop' + this_qid); rememberMyScrollPos(queet,'moretop' + this_qid);
@ -1922,9 +1925,10 @@ $('body').on('click','.view-more-container-top', function(){
backToMyScrollPos(queet,'moretop' + this_qid,false); backToMyScrollPos(queet,'moretop' + this_qid,false);
// remove the "show full conversation" link if nothing more to show // remove the "show full conversation" link if nothing more to show
if($('#stream-item-' + $(this).parent('.stream-item').attr('data-quitter-id')).find('.hidden-conversation').length == 0) { if($(this).parent('.stream-item').find('.hidden-conversation').length == 0) {
$('#stream-item-' + $(this).parent('.stream-item').attr('data-quitter-id')).children('.queet').find('.show-full-conversation').remove(); $(this).parent('.stream-item').children('.queet').find('.show-full-conversation').remove();
} }
findAndMarkLastVisibleInConversation(thisParentStreamItem);
}); });
@ -1939,12 +1943,13 @@ $('body').on('click','.show-full-conversation',function(){
var this_q = $(this).closest('.queet'); var this_q = $(this).closest('.queet');
var this_qid = $(this).closest('.stream-item:not(.conversation)').attr('data-quitter-id'); var this_qid = $(this).closest('.stream-item:not(.conversation)').attr('data-quitter-id');
var thisStreamItem = $('#stream-item-' + $(this).attr('data-stream-item-id'));
rememberMyScrollPos(this_q,this_qid); rememberMyScrollPos(this_q,this_qid);
$('#stream-item-' + $(this).attr('data-stream-item-id')).find('.view-more-container-top').remove(); thisStreamItem.find('.view-more-container-top').remove();
$('#stream-item-' + $(this).attr('data-stream-item-id')).find('.view-more-container-bottom').remove(); thisStreamItem.find('.view-more-container-bottom').remove();
$.each($('#stream-item-' + $(this).attr('data-stream-item-id')).find('.hidden-conversation'),function(key,obj){ $.each(thisStreamItem.find('.hidden-conversation'),function(key,obj){
$(obj).removeClass('hidden-conversation'); $(obj).removeClass('hidden-conversation');
$(obj).animate({opacity:'1'},400,function(){ $(obj).animate({opacity:'1'},400,function(){
$(obj).css('background-color','pink').animate({backgroundColor:'#F6F6F6'},1000); $(obj).css('background-color','pink').animate({backgroundColor:'#F6F6F6'},1000);
@ -1953,6 +1958,7 @@ $('body').on('click','.show-full-conversation',function(){
$(this).remove(); $(this).remove();
backToMyScrollPos(this_q,this_qid,false); backToMyScrollPos(this_q,this_qid,false);
findAndMarkLastVisibleInConversation(thisStreamItem);
}); });
@ -2462,13 +2468,13 @@ function uploadImage(e, thisUploadButton) {
var queetBox = $('img.to-upload').parent().siblings('.queet-box-syntax'); var queetBox = $('img.to-upload').parent().siblings('.queet-box-syntax');
var caretPos = uploadButton.attr('data-caret-pos').split(','); var caretPos = uploadButton.attr('data-caret-pos').split(',');
// remove http and https (not needed, just design choice)
data.shorturl = data.shorturl.replace('http://','').replace('https://','');
$('img.to-upload').attr('data-shorturl', data.shorturl); $('img.to-upload').attr('data-shorturl', data.shorturl);
$('img.to-upload').addClass('uploaded'); $('img.to-upload').addClass('uploaded');
$('img.to-upload').removeClass('to-upload'); $('img.to-upload').removeClass('to-upload');
// remove http and https (not needed, just design choice)
data.shorturl = data.shorturl.replace('http://','').replace('https://','');
// insert shorturl in queet box // insert shorturl in queet box
deleteBetweenCharacterIndices(queetBox[0], caretPos[0], caretPos[1]); deleteBetweenCharacterIndices(queetBox[0], caretPos[0], caretPos[1]);
var range = createRangeFromCharacterIndices(queetBox[0], caretPos[0], caretPos[0]); var range = createRangeFromCharacterIndices(queetBox[0], caretPos[0], caretPos[0]);