wamo/Qvitter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

show embedded content in tooltips and when notice is expanded, if user opt-out:ed

Browse Source
This commit is contained in:
Hannes Mannerheim 2016-01-24 22:03:33 +01:00
parent 30fc0b2d3b
commit cb635d6e04
4 changed files with 86 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
css/qvitter.css
View File

@ -1446,6 +1446,15 @@ body.rtl #history-container.menu-container a .chev-right {
hyphens: auto;
word-wrap: break-word;
}
.tooltip.oembed {
border-radius: 3px;
max-width:400px;
}
.tooltip.quote {
padding:10px 20px;
border-radius: 3px;
max-width:400px;
}
.tooltip-caret {
z-index: 10000;
display:block;
@ -1453,7 +1462,7 @@ body.rtl #history-container.menu-container a .chev-right {
position:absolute;
width:0;
height:0;
border:5px solid #333;
border:6px solid #333;
border-top:0 none;
border-left-color: transparent;
border-right-color: transparent;
@ -1464,7 +1473,7 @@ body.rtl #history-container.menu-container a .chev-right {
transition-delay: 0.6s;
}
.tooltip-caret.bottom {
border-top:5px solid #333;
border-top:6px solid #333;
border-bottom:0 none;
}
@ -1495,14 +1504,14 @@ body.rtl #history-container.menu-container a .chev-right {
position:absolute;
width:0;
height:0;
border:5px solid #fff;
border:6px solid #fff;
border-top:0 none;
border-left-color: transparent;
border-right-color: transparent;
transition: opacity 0.1s ease-in 0;
}
.hover-card-caret.bottom {
border-top:5px solid #fff;
border-top:6px solid #fff;
border-bottom:0 none;
}
@ -2090,6 +2099,9 @@ body.rtl .queet.rtl .expanded-content {
margin:0 10px 0 0;
float: left;
}
.tooltip .oembed-img-container {
margin:5px 10px 5px 0;
}
.quoted-notice-attachments-num-1 .quoted-notice-img-container {
height: 100%;
@ -2195,7 +2207,8 @@ body.rtl .queet.rtl .expanded-content {
display:block;
}
.queet .thumb-container {
.queet .thumb-container,
.tooltip .thumb-container {
display: inline-block;
overflow: hidden;
position: relative;
@ -2214,6 +2227,17 @@ body.rtl .queet.rtl .expanded-content {
height:250px;
}
.tooltip .thumb-container {
max-width:300px;
min-height:0;
max-height:200px;
margin:5px 0 0 0;
}
.tooltip .thumb-container img {
max-width:100%;
opacity:0;
}
.stream-item:not(.expanded) .queet .queet-thumbs.thumb-num-1 .thumb-container.play-button:before,
.queet .queet-thumbs:not(.thumb-num-1) .thumb-container.play-button:before,
.modal-content .queet .thumb-container.play-button:before {
@ -2452,17 +2476,25 @@ body.rtl .queet.rtl .expanded-content {
}
#feed-body.embedded-content-hidden-by-user .queet-content > .oembed-data,
#feed-body.embedded-content-hidden-by-user .queet-content > .queet-thumbs,
#feed-body.quotes-hidden-by-user .queet-text .quote-link-container,
#feed-body.embedded-content-hidden-by-user .stream-item:not(.expanded) > .queet .queet-content > .oembed-data,
#feed-body.embedded-content-hidden-by-user .stream-item:not(.expanded) > .queet .queet-content > .queet-thumbs,
#feed-body.quotes-hidden-by-user .stream-item:not(.expanded) > .queet .queet-text .quote-link-container,
.queet-text a.hidden-embedded-link-in-queet-text,
.queet-text a.hidden-quote-link-in-queet-text {
display:none;
}
#feed-body.embedded-content-hidden-by-user .stream-item.collapsing > .queet .queet-content > .oembed-data,
#feed-body.embedded-content-hidden-by-user .stream-item.collapsing > .queet .queet-content > .queet-thumbs,
#feed-body.quotes-hidden-by-user .stream-item.collapsing > .queet .queet-text .quote-link-container {
display:none !important;
}
#feed-body.embedded-content-hidden-by-user .queet-text a.hidden-embedded-link-in-queet-text,
#feed-body.quotes-hidden-by-user .queet-text a.hidden-quote-link-in-queet-text {
#feed-body.quotes-hidden-by-user .stream-item:not(.expanded) > .queet .queet-text a.hidden-quote-link-in-queet-text {
display:inline;
}
#feed-body.quotes-hidden-by-user .stream-item.collapsing > .queet .queet-text a.hidden-quote-link-in-queet-text {
display:inline !important;
}
.stream-item.activity .created-at a {

12
js/dom-functions.js
View File

@ -2145,6 +2145,7 @@ function placeQuotedNoticesInQueetText(quotedNotices,queetText) {
if($(this).next().is('.quote-link-container')) {
$(this).addClass('hidden-quote-link-in-queet-text');
$(this).attr('data-quote-url',qoutedNotice.url);
$(this).next().attr('data-quote-url',qoutedNotice.url);
$(this).next().addClass(qoutedNotice.class);
$(this).next().attr('href',qoutedNotice.href);
$(this).next().html(qoutedNotice.html);
@ -2370,13 +2371,16 @@ function buildAttachmentHTML(attachments){
var img_url = this.thumb_url;
}
attachmentHTML += '<a style="background-image:url(\'' + img_url + '\')" class="thumb-container' + noCoverClass + playButtonClass + youTubeClass + animatedGifClass + '" href="' + this.url + '"><img class="attachment-thumb" data-mime-type="' + this.mimetype + '" src="' + img_url + '"/ data-width="' + this.width + '" data-height="' + this.height + '" data-full-image-url="' + this.url + '" data-thumb-url="' + img_url + '"></a>';
urlsToHide.push(window.siteInstanceURL + 'attachment/' + this.id); // hide this attachment url from the queet text
var urlToHide = window.siteInstanceURL + 'attachment/' + this.id;
attachmentHTML += '<a data-local-attachment-url="' + urlToHide + '" style="background-image:url(\'' + img_url + '\')" class="thumb-container' + noCoverClass + playButtonClass + youTubeClass + animatedGifClass + '" href="' + this.url + '"><img class="attachment-thumb" data-mime-type="' + this.mimetype + '" src="' + img_url + '"/ data-width="' + this.width + '" data-height="' + this.height + '" data-full-image-url="' + this.url + '" data-thumb-url="' + img_url + '"></a>';
urlsToHide.push(urlToHide); // hide this attachment url from the queet text
attachmentNum++;
}
else if (this.mimetype == 'image/svg+xml') {
attachmentHTML += '<a style="background-image:url(\'' + this.url + '\')" class="thumb-container" href="' + this.url + '"><img class="attachment-thumb" data-mime-type="' + this.mimetype + '" src="' + this.url + '"/></a>';
urlsToHide.push(window.siteInstanceURL + 'attachment/' + this.id); // hide this attachment url from the queet text
var urlToHide = window.siteInstanceURL + 'attachment/' + this.id;
attachmentHTML += '<a data-local-attachment-url="' + urlToHide + '" style="background-image:url(\'' + this.url + '\')" class="thumb-container" href="' + this.url + '"><img class="attachment-thumb" data-mime-type="' + this.mimetype + '" src="' + this.url + '"/></a>';
urlsToHide.push(urlToHide); // hide this attachment url from the queet text
attachmentNum++;
}
});

2
js/misc-functions.js
View File

@ -404,7 +404,7 @@ function alignTooltipTohoveredElement(tooltipElement,tooltipCaret,hovered) {
// tooltip at top
else {
var tooltipCaretPosX = targetPosX+targetWidth/2-5;
var tooltipCaretPosY = targetPosY-7;
var tooltipCaretPosY = targetPosY-8;
// caret always directly on top of element
tooltipCaret.css('left',tooltipCaretPosX + 'px');

37
js/qvitter.js
View File

@ -138,8 +138,43 @@ $('body').on({
// regular tooltips
if($(e.target).is('[data-tooltip]')) {
var tooltipClass = '';
tooltip_data = $(e.target).attr('data-tooltip');
var tooltipElement = $('<div class="tooltip" lang="' + window.selectedLanguage + '">' + tooltip_data + '</div>');
// if embedded content is hidden, we show it in tooltips
if($('#feed-body').hasClass('embedded-content-hidden-by-user')
&& !$(e.target).is('.oembed-item')
&& $(e.target).closest('.queet').length > 0
&& $(e.target).closest('.queet').find('.oembed-item[href="' + $(e.target).attr('href') + '"]').length > 0) {
tooltip_data = $(e.target).closest('.queet').find('.oembed-item[href="' + $(e.target).attr('href') + '"]').html();
tooltipClass = 'oembed';
}
else if($('#feed-body').hasClass('embedded-content-hidden-by-user')
&& !$(e.target).is('.attachment-thumb')
&& $(e.target).closest('.queet').length > 0
&& $(e.target).text().indexOf('/attachment/') > -1) {
// local attachments has /attachment/-url in its href attribute
if($(e.target).closest('.queet').find('.thumb-container[data-local-attachment-url="' + $(e.target).attr('href') + '"]').length>0) {
tooltip_data = $(e.target).closest('.queet').find('.thumb-container[data-local-attachment-url="' + $(e.target).attr('href') + '"]').outerHTML();
tooltipClass = 'thumb';
}
// remote attachments are identified by full url
else if($(e.target).closest('.queet').find('.thumb-container[href="' + $(e.target).attr('data-tooltip') + '"]').length>0) {
tooltip_data = $(e.target).closest('.queet').find('.thumb-container[href="' + $(e.target).attr('data-tooltip') + '"]').outerHTML();
tooltipClass = 'thumb';
}
}
else if($('#feed-body').hasClass('quotes-hidden-by-user')
&& !$(e.target).is('.quote-link-container')
&& $(e.target).is('[data-quote-url]')
&& $(e.target).closest('.queet-text').find('.quote-link-container[data-quote-url="' + $(e.target).attr('data-quote-url') + '"]').length > 0) {
tooltip_data = $(e.target).closest('.queet-text').find('.quote-link-container[data-quote-url="' + $(e.target).attr('data-quote-url') + '"]').html();
tooltipClass = 'quote';
}
var tooltipElement = $('<div class="tooltip ' + tooltipClass + '" lang="' + window.selectedLanguage + '">' + tooltip_data + '</div>');
var tooltipCaret = $('<div class="tooltip-caret"></div>');
$('body').prepend(tooltipElement);
$('body').prepend(tooltipCaret);