mirror of
https://github.com/friendica/friendica
synced 2025-04-26 20:30:11 +00:00
frio: formating, otherwise untouched
This commit is contained in:
Extarys
parent
cb24e8987c
commit
91d3e72be7
25 changed files with 3300 additions and 2937 deletions
|
|
@ -9,16 +9,16 @@
|
|||
*
|
||||
*/
|
||||
$(document).ready(function () {
|
||||
let $body = $('body');
|
||||
let $body = $("body");
|
||||
// Prevents normal click action on click hovercard elements
|
||||
$body.on('click', '.userinfo.click-card', function (e) {
|
||||
$body.on("click", ".userinfo.click-card", function (e) {
|
||||
e.preventDefault();
|
||||
});
|
||||
// This event listener needs to be declared before the one that removes
|
||||
// all cards so that we can stop the immediate propagation of the event
|
||||
// Since the manual popover appears instantly and the hovercard removal is
|
||||
// on a 100ms delay, leaving event propagation immediately hides any click hovercard
|
||||
$body.on('mousedown', '.userinfo.click-card', function (e) {
|
||||
$body.on("mousedown", ".userinfo.click-card", function (e) {
|
||||
e.stopImmediatePropagation();
|
||||
let timeNow = new Date().getTime();
|
||||
|
||||
|
|
@ -26,14 +26,14 @@ $(document).ready(function () {
|
|||
let targetElement = $(this);
|
||||
|
||||
// get href-attribute
|
||||
if (targetElement.is('[href]')) {
|
||||
contactUrl = targetElement.attr('href');
|
||||
if (targetElement.is("[href]")) {
|
||||
contactUrl = targetElement.attr("href");
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
|
||||
// no hovercard for anchor links
|
||||
if (contactUrl.substring(0, 1) === '#') {
|
||||
if (contactUrl.substring(0, 1) === "#") {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
|
@ -41,59 +41,62 @@ $(document).ready(function () {
|
|||
});
|
||||
|
||||
// hover cards should be removed very easily, e.g. when any of these events happens
|
||||
$body.on('mouseleave touchstart scroll mousedown submit keydown', function (e) {
|
||||
$body.on("mouseleave touchstart scroll mousedown submit keydown", function (e) {
|
||||
// remove hover card only for desktiop user, since on mobile we open the hovercards
|
||||
// by click event insteadof hover
|
||||
removeAllHovercards(e, new Date().getTime());
|
||||
});
|
||||
|
||||
$body.on('mouseover', '.userinfo.hover-card, .wall-item-responses a, .wall-item-bottom .mention a', function (e) {
|
||||
let timeNow = new Date().getTime();
|
||||
removeAllHovercards(e, timeNow);
|
||||
let contactUrl = false;
|
||||
let targetElement = $(this);
|
||||
$body
|
||||
.on("mouseover", ".userinfo.hover-card, .wall-item-responses a, .wall-item-bottom .mention a", function (e) {
|
||||
let timeNow = new Date().getTime();
|
||||
removeAllHovercards(e, timeNow);
|
||||
let contactUrl = false;
|
||||
let targetElement = $(this);
|
||||
|
||||
// get href-attribute
|
||||
if (targetElement.is('[href]')) {
|
||||
contactUrl = targetElement.attr('href');
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
|
||||
// no hover card if the element has the no-hover-card class
|
||||
if (targetElement.hasClass('no-hover-card')) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// no hovercard for anchor links
|
||||
if (contactUrl.substring(0, 1) === '#') {
|
||||
return true;
|
||||
}
|
||||
|
||||
targetElement.attr('data-awaiting-hover-card', timeNow);
|
||||
|
||||
// Delay until the hover-card does appear
|
||||
setTimeout(function () {
|
||||
if (
|
||||
targetElement.is(':hover')
|
||||
&& parseInt(targetElement.attr('data-awaiting-hover-card'), 10) === timeNow
|
||||
&& $('.hovercard').length === 0
|
||||
) {
|
||||
openHovercard(targetElement, contactUrl, timeNow);
|
||||
// get href-attribute
|
||||
if (targetElement.is("[href]")) {
|
||||
contactUrl = targetElement.attr("href");
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}, 500);
|
||||
}).on('mouseleave', '.userinfo.hover-card, .wall-item-responses a, .wall-item-bottom .mention a', function (e) { // action when mouse leaves the hover-card
|
||||
removeAllHovercards(e, new Date().getTime());
|
||||
});
|
||||
|
||||
// no hover card if the element has the no-hover-card class
|
||||
if (targetElement.hasClass("no-hover-card")) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// no hovercard for anchor links
|
||||
if (contactUrl.substring(0, 1) === "#") {
|
||||
return true;
|
||||
}
|
||||
|
||||
targetElement.attr("data-awaiting-hover-card", timeNow);
|
||||
|
||||
// Delay until the hover-card does appear
|
||||
setTimeout(function () {
|
||||
if (
|
||||
targetElement.is(":hover") &&
|
||||
parseInt(targetElement.attr("data-awaiting-hover-card"), 10) === timeNow &&
|
||||
$(".hovercard").length === 0
|
||||
) {
|
||||
openHovercard(targetElement, contactUrl, timeNow);
|
||||
}
|
||||
}, 500);
|
||||
})
|
||||
.on("mouseleave", ".userinfo.hover-card, .wall-item-responses a, .wall-item-bottom .mention a", function (e) {
|
||||
// action when mouse leaves the hover-card
|
||||
removeAllHovercards(e, new Date().getTime());
|
||||
});
|
||||
|
||||
// if we're hovering a hover card, give it a class, so we don't remove it
|
||||
$body.on('mouseover', '.hovercard', function (e) {
|
||||
$(this).addClass('dont-remove-card');
|
||||
$body.on("mouseover", ".hovercard", function (e) {
|
||||
$(this).addClass("dont-remove-card");
|
||||
});
|
||||
|
||||
$body.on('mouseleave', '.hovercard', function (e) {
|
||||
$(this).removeClass('dont-remove-card');
|
||||
$(this).popover('hide');
|
||||
$body.on("mouseleave", ".hovercard", function (e) {
|
||||
$(this).removeClass("dont-remove-card");
|
||||
$(this).popover("hide");
|
||||
});
|
||||
}); // End of $(document).ready
|
||||
|
||||
|
|
@ -101,20 +104,20 @@ $(document).ready(function () {
|
|||
function removeAllHovercards(event, priorTo) {
|
||||
// don't remove hovercards until after 100ms, so user have time to move the cursor to it (which gives it the dont-remove-card class)
|
||||
setTimeout(function () {
|
||||
$.each($('.hovercard'), function () {
|
||||
let title = $(this).attr('data-orig-title');
|
||||
$.each($(".hovercard"), function () {
|
||||
let title = $(this).attr("data-orig-title");
|
||||
// don't remove card if it was created after removeAllhoverCards() was called
|
||||
if ($(this).data('card-created') < priorTo) {
|
||||
if ($(this).data("card-created") < priorTo) {
|
||||
// don't remove it if we're hovering it right now!
|
||||
if (!$(this).hasClass('dont-remove-card')) {
|
||||
let $handle = $('[data-hover-card-active="' + $(this).data('card-created') + '"]');
|
||||
$handle.removeAttr('data-hover-card-active');
|
||||
if (!$(this).hasClass("dont-remove-card")) {
|
||||
let $handle = $('[data-hover-card-active="' + $(this).data("card-created") + '"]');
|
||||
$handle.removeAttr("data-hover-card-active");
|
||||
|
||||
// Restoring the popover handle title
|
||||
let title = $handle.attr('data-orig-title');
|
||||
$handle.attr({'data-orig-title': '', title: title});
|
||||
let title = $handle.attr("data-orig-title");
|
||||
$handle.attr({ "data-orig-title": "", title: title });
|
||||
|
||||
$(this).popover('hide');
|
||||
$(this).popover("hide");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -124,35 +127,40 @@ function removeAllHovercards(event, priorTo) {
|
|||
function openHovercard(targetElement, contactUrl, timeNow) {
|
||||
// store the title in a data attribute because Bootstrap
|
||||
// popover destroys the title attribute.
|
||||
let title = targetElement.attr('title');
|
||||
targetElement.attr({'data-orig-title': title, title: ''});
|
||||
let title = targetElement.attr("title");
|
||||
targetElement.attr({ "data-orig-title": title, title: "" });
|
||||
|
||||
// get an additional data atribute if the card is active
|
||||
targetElement.attr('data-hover-card-active', timeNow);
|
||||
targetElement.attr("data-hover-card-active", timeNow);
|
||||
// get the whole html content of the hover card and
|
||||
// push it to the bootstrap popover
|
||||
getHoverCardContent(contactUrl, function (data) {
|
||||
if (data) {
|
||||
targetElement.popover({
|
||||
html: true,
|
||||
placement: function () {
|
||||
// Calculate the placement of the the hovercard (if top or bottom)
|
||||
// The placement depence on the distance between window top and the element
|
||||
// which triggers the hover-card
|
||||
let get_position = $(targetElement).offset().top - $(window).scrollTop();
|
||||
if (get_position < 270) {
|
||||
return 'bottom';
|
||||
}
|
||||
return 'top';
|
||||
},
|
||||
trigger: 'manual',
|
||||
template: '<div class="popover hovercard" data-card-created="' + timeNow + '"><div class="arrow"></div><div class="popover-content hovercard-content"></div></div>',
|
||||
content: data,
|
||||
container: 'body',
|
||||
sanitizeFn: function (content) {
|
||||
return DOMPurify.sanitize(content)
|
||||
},
|
||||
}).popover('show');
|
||||
targetElement
|
||||
.popover({
|
||||
html: true,
|
||||
placement: function () {
|
||||
// Calculate the placement of the the hovercard (if top or bottom)
|
||||
// The placement depence on the distance between window top and the element
|
||||
// which triggers the hover-card
|
||||
let get_position = $(targetElement).offset().top - $(window).scrollTop();
|
||||
if (get_position < 270) {
|
||||
return "bottom";
|
||||
}
|
||||
return "top";
|
||||
},
|
||||
trigger: "manual",
|
||||
template:
|
||||
'<div class="popover hovercard" data-card-created="' +
|
||||
timeNow +
|
||||
'"><div class="arrow"></div><div class="popover-content hovercard-content"></div></div>',
|
||||
content: data,
|
||||
container: "body",
|
||||
sanitizeFn: function (content) {
|
||||
return DOMPurify.sanitize(content);
|
||||
},
|
||||
})
|
||||
.popover("show");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -176,7 +184,7 @@ function getHoverCardContent(contact_url, callback) {
|
|||
}
|
||||
|
||||
$.ajax({
|
||||
url: baseurl + '/contact/hovercard',
|
||||
url: baseurl + "/contact/hovercard",
|
||||
data: postdata,
|
||||
success: function (data, textStatus, request) {
|
||||
getHoverCardContent.cache[nurl] = data;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue