81 lines
2.0 KiB
JavaScript
Executable File
81 lines
2.0 KiB
JavaScript
Executable File
/*
|
|
* Class CustomOverlay
|
|
*
|
|
* Creates a custom overlay with given html content;
|
|
* Requires JQuery, blockUI, generic.js and CustomOverlay.css.
|
|
*
|
|
* @elementId - the html DOM element id for the overlay
|
|
* @width - optional width of the overlay
|
|
* @height - optional height of the overlay
|
|
*/
|
|
|
|
var CustomOverlay = function(elementId, width, height) {
|
|
var _defaultWidth = "60%",
|
|
_defaultHeight = "70%";
|
|
|
|
var _elementId = elementId,
|
|
_width = width,
|
|
_height = height;
|
|
|
|
//$("body").append("<div class='overlay' id='" + elementId + "'></div>");
|
|
$("body").append(
|
|
$("<div>")
|
|
.addClass("overlay")
|
|
.attr("id", elementId)
|
|
)
|
|
|
|
var _element = $("#" + _elementId);
|
|
var close = (0)
|
|
var width = (_width) ? _width : _defaultWidth;
|
|
var height = (_height) ? _height : _defaultHeight;
|
|
|
|
_element.css("width", width);
|
|
_element.css("height", height);
|
|
|
|
function showOverlay(content) {
|
|
blockUIOnly();
|
|
// For disabling the scrolling underneath
|
|
$("body").addClass("no-scroll");
|
|
// Reposition before showing
|
|
updatePosition();
|
|
_element
|
|
.empty()
|
|
.append(
|
|
$("<div>")
|
|
.addClass("overlay-close")
|
|
.attr("title", "Close")
|
|
.on("click", hideOverlay)
|
|
)
|
|
.append(content);
|
|
|
|
$(document).keyup(function(e) {
|
|
//console.log("pressed");
|
|
if (e.keyCode == 27) {hideOverlay();}
|
|
})
|
|
|
|
_element.fadeIn("fast");
|
|
}
|
|
|
|
function updatePosition() {
|
|
_element.css("left", $(window).width()/2 - width/2);
|
|
_element.css("top", $(window).height()/2 - height/2);
|
|
}
|
|
|
|
function hideOverlay(){
|
|
_element.fadeOut();
|
|
|
|
// Re-enable scrolling
|
|
$("body").removeClass("no-scroll");
|
|
|
|
$(document).unbind("keyup");
|
|
|
|
unBlock();
|
|
}
|
|
|
|
return {
|
|
showOverlay: showOverlay,
|
|
hideOverlay: hideOverlay,
|
|
};
|
|
|
|
};
|