Your IP : 216.73.216.68
/*
* Corner Popup v1.30 - 13/12/2021
* Author: Łukasz Brzostek
*
* This work is licensed under the Creative Commons
* Attribution 4.0 International License:
* https://creativecommons.org/licenses/by/4.0
*/
if ("undefined" == typeof jQuery)
throw new Error("Corner Popup requires jQuery");
(function($) {
$.fn.cornerpopup = function(options) {
// Default plugin options
// ----------------------
var options = $.extend(
{
popupName: 'jcpopup',
expireAfter: 0,
active: true,
displayOnce: false,
timeOut: 0,
delay: 0,
slide: false,
slideTop: false,
closeBtn: true,
shadow: true,
escClose: false,
stickToBottom: false,
topCorner: false,
link: "https://www.jeromecourville.com, _self",
header: "Jérôme Courville",
text: '',
button: "OK",
width: "390px",
beforePopup: function() {},
afterPopup: function() {},
onBtnClick: function() {},
},
options
);
cp = "#corner-popup";
// Read/save data in localStorage
// ------------------------------
function saveToLocalStorage(key, value, ttl) {
var now = new Date();
var item = {
value: value,
expiry: now.getTime() + ttl,
}
localStorage.setItem(key, JSON.stringify(item));
}
function readFromLocalStorage(key) {
var itemStr = localStorage.getItem(key)
// if the item doesn't exist, return null
if (!itemStr) {
return null
}
const item = JSON.parse(itemStr)
const now = new Date()
// compare the expiry time of the item with the current time
if (item.expiry > 0 && now.getTime() > item.expiry) {
// If the item is expired, delete the item from storage
// and return null
localStorage.removeItem(key)
return null
}
return item.value
}
// Check for slide option, set slide orientation, insert content and show popup
// ----------------------------------------------------------------------------
function popupShow() {
options.beforePopup.call(this);
if (!options.slide) {
$(cp).html(popupContent).css("display", "flex").hide().fadeIn(800);
if (options.delay != 0) {
$(cp).hide();
setTimeout(function() {
$(cp).fadeIn(800);
}, options.delay);
}
} else if (options.slideTop) {
$(cp).addClass("slide-top");
}
$(cp).html(popupContent).css("display", "flex").show();
if (options.delay != 0) {
$(cp).hide();
setTimeout(function() {
$(cp).show();
}, options.delay);
}
}
// Check slide option, remove popup
// --------------------------------
function popupClose() {
if (!options.slide) {
$(cp).fadeOut(400, function() {
$(this).remove();
options.afterPopup.call(this);
});
} else {
popupSlideUndo();
}
}
// Check slide orientation, reverse slide, remove popup after animation
// --------------------------------------------------------------------
function popupSlideUndo() {
if (options.slideTop) {
$(cp).removeClass("slide-top").addClass("slide-top-rev");
}
cpTemp = $(cp);
cpTemp.animation = "none";
cpTemp.offsetHeight;
cpTemp.animation = null;
cpTemp.one(
"webkitAnimationEnd oanimationend msAnimationEnd animationend",
function() {
cpTemp.remove();
options.afterPopup.call(this);
}
);
}
// Close popup after specified time
// --------------------------------
function popupTimeOut(time) {
setTimeout(function() {
if (!options.slide) {
$(cp).fadeOut(400, function() {
$(this).remove();
options.afterPopup.call(this);
});
} else {
popupSlideUndo();
}
}, time);
}
// Check if plugin is already used and remove previous occurrences
// ---------------------------------------------------------------
if ($(cp).length) {
$(cp).remove();
}
// Add popup div into DOM if it is active
// --------------------------------------
if (options.active) {
if (!options.displayOnce || (options.displayOnce && readFromLocalStorage(options.popupName) === null)) {
$("<div/>", { id: "corner-popup", class: "popup-xs" }).appendTo("body");
}
// Check popup width and setup columns for px and %
// ------------------------------------------------
if (options.width.substr(-1) == "%") {
widthPercent = true;
noPercents = options.width.slice(0, -1);
} else {
widthPercent = false;
if (options.width.match(/^\d+$/)) {
noUnit = options.width;
} else {
noUnit = options.width.replace(/\D/g, "");
}
}
if (noUnit > 700 || (widthPercent == true && noPercents > 50)) {
columnOne = "p-sm-2";
columnTwo = "p-sm-10";
} else if (noUnit > 450 || (widthPercent == true && noPercents > 25)) {
columnOne = "p-sm-3";
columnTwo = "p-sm-9";
} else {
columnOne = "p-sm-4";
columnTwo = "p-sm-8";
}
// Split link variable into array and check target value
// -----------------------------------------------------
options.link = options.link.replace(/\s/g, "").split(",");
if (!options.link[1]) options.link[1] = "_self";
// Check variant and insert proper content into variable
// -----------------------------------------------------
popupContent =
'<div class="p-col p-xs-12 p-sm-12"><div class="corner-close" tabindex="0"></div><div class="corner-container-2"><p class="corner-head">' +
options.header +
'</p><p class="corner-text">' +
options.text +
'</p><a href="' +
options.link[0] +
'" class="corner-btn-close" target="' +
options.link[1] +
'">' +
options.button +
"</a></div></div>";
// Popup show
// ----------
popupShow();
if (options.displayOnce) {
saveToLocalStorage(options.popupName, true, options.expireAfter);
} else {
localStorage.removeItem(options.popupName);
}
// Top corner option check
// -----------------------
if (options.topCorner) {
$(cp).addClass("corner-top");
verticalPosition = "top";
} else {
$(cp).removeClass("corner-top");
verticalPosition = "bottom";
}
// Close button visibility
// -----------------------
if (!options.closeBtn) {
$(".corner-close").remove();
if ($(window).width() > 768) {
$(cp).css("right", "70px");
}
$(".corner-container").css({
bottom: "15px",
"padding-top": "30px",
});
$(".corner-container-1").css({
bottom: "0",
"padding-bottom": "10px",
"padding-top": "20px",
});
$(".corner-container-2").css({
bottom: "12px",
"padding-top": "30px",
});
}
// Shadow visibility
// -----------------
if (!options.shadow) $(cp).css("box-shadow", "none");
// Popup width
// -----------
if (options.width !== "390px") $(cp).css("width", options.width);
window.onresize = function() {
if ($(window).width() < 768) {
$(cp).css("width", "100%");
} else {
$(cp).css("width", options.width);
}
};
// Stick to bottom option
// ----------------------
if (options.stickToBottom && $(window).width() > 768) {
$(cp).css(verticalPosition, "0");
$(cp).css({ right: "0" });
}
// Popup timeout
// -------------
if (options.timeOut !== 0) popupTimeOut(options.timeOut);
// Popup close
// -----------
$(".corner-close").click(function() {
popupClose();
});
$(".corner-close").keyup(function(event) {
if (event.key === "Enter")
popupClose();
});
// Button click / keydown usage
// ----------------------------
$(".corner-btn, .corner-btn-close, .corner-btn-cookie").click(function(event) {
elementClassName = $(this).attr("class");
if (options.onBtnClick.toString().length > 13) {
event.preventDefault();
options.onBtnClick.call(this);
} else {
popupClose();
}
});
// Close on ESC
// ------------
$(document).keyup(function(event) {
if (options.escClose && event.key === "Escape")
popupClose();
});
// Public functions
// ----------------
$.fn.cornerpopup.popupClose = function(timing) {
setTimeout(popupClose, timing);
};
$.fn.cornerpopup.popupHide = function(timing) {
$(cp).delay(timing).fadeOut(400);
};
$.fn.cornerpopup.popupShow = function(timing) {
$(cp).delay(timing).fadeIn(800);
};
}
};
})(jQuery);