hestiacp/web/js/floating_layer.js

(function (jQuery) {
	jQuery.fn.flayer_close = function () {
		try {
			jQuery(this).flayer.close();
		} catch (e) {
			fb.error(e);
		}
	};
	jQuery.fn.flayer = function (params) {
		var elm = this;
		var ref = {};
		var customConfig = params;
		var config = {
			bgcolor: "#333",
			opacity: 0.6,
			id: "floating-box",
			className: "floating-box-class",
			zIndex: 5000,
			beforeStart: function () {},
			beforeEnd: function () {},
			afterStart: function () {},
			close: null,
			closeClass: "close-floating-layer",
			outerClose: false,
			returnParent: jQuery(elm).parent(),
		};

		jQuery.fn.flayer.close = function () {
			flayer_destroy();
		};

		function init() {
			jQuery.extend(config, customConfig);
		}

		function start_ovservers() {
			jQuery(window).bind("scroll.fl", function () {
				setTimeout(function () {
					reposition();
				}, 5);
			});

			jQuery(window).bind("resize.fl", function () {
				setTimeout(function () {
					reposition();
				}, 5);
			});

			jQuery(ref.container).bind("click.fl", function (evt) {
				jQuery(evt.target).hasClass(config.closeClass) ? flayer_destroy() : -1;
				if (config.outerClose) jQuery(evt.target).hasClass("fl-cloud") ? flayer_destroy() : -1;
			});

			// todo:
			config.outerClose
				? jQuery(window).bind("keypress.fl", function (evt) {
						evt.keyCode == 27 ? flayer_destroy() : -1;
				  })
				: -1;
		}

		function position() {
			var viewport = {};
			viewport.left = jQuery(window).scrollLeft();
			viewport.top = jQuery(window).scrollTop();
			viewport.height = window.innerHeight ? window.innerHeight : jQuery(window).height(); //jQuery(document.body).height();
			viewport.width = jQuery(window).width(); //jQuery(document.body).width();

			var had = jQuery("<div>")
				.attr("id", "truth-is-out-there")
				.css({ position: "absolute", left: "-50000px" });
			var dolly = jQuery(elm).clone(true).addClass("dolly");
			jQuery(had).append(jQuery(dolly).removeClass("u-hidden"));
			jQuery(document.body).prepend(had);
			var dims = { width: jQuery(dolly).width(), height: jQuery(dolly).height() };
			jQuery(had).remove();

			//dims.height = 350;
			//dims.width = 350;

			jQuery(ref.overlay).height(jQuery(document).height());
			jQuery(ref.overlay).width(jQuery(document).width());

			jQuery(ref.content).height(dims.height);
			jQuery(ref.content).width(dims.width);

			jQuery(ref.close).css({ top: viewport.top, left: viewport.left });

			jQuery(ref.content).css({
				left: Math.round((viewport.width - dims.width) / 2) + viewport.left,
				top: Math.round((viewport.height - dims.height) / 2) + viewport.top,
			});
		}

		function reposition() {
			var viewport = {};
			viewport.left = jQuery(window).scrollLeft();
			viewport.top = jQuery(window).scrollTop();
			viewport.height = window.innerHeight ? window.innerHeight : jQuery(window).height();
			viewport.width = jQuery(window).width();

			jQuery(ref.overlay).height(jQuery(document).height());
			jQuery(ref.overlay).width(jQuery(document).width());

			jQuery(ref.close).css({ top: viewport.top, left: viewport.left });

			jQuery(ref.content).css({
				left: Math.round((viewport.width - jQuery(elm).width()) / 2) + viewport.left,
				top: Math.round((viewport.height - jQuery(elm).height()) / 2) + viewport.top,
			});
		}

		function flayer_destroy() {
			config.beforeEnd(elm);
			jQuery(window).unbind("scroll.fl");
			jQuery(window).unbind("resize.fl");
			jQuery(ref.container).unbind("click.fl");
			config.outerClose ? jQuery(window).unbind("keypress.fl") : -1;
			jQuery(config.returnParent).append(jQuery(elm).addClass("u-hidden"));
			jQuery(ref.container).remove();
			jQuery.browser.msie && jQuery.browser.version.substr(0, 1) < 7 ? show_selects() : -1;

			return true;
		}

		function embed() {
			ref.container = jQuery("<div>");
			jQuery(ref.container).addClass(config.className + "-container");
			jQuery(ref.container)
				.css({
					position: "absolute",
					left: "0",
					top: "0",
					display: "none",
					zIndex: config.zIndex,
				})
				.addClass("fl-cloud")
				.addClass("u-hidden");

			ref.overlay = jQuery("<div>").addClass(config.className + "-layer");
			jQuery(ref.overlay)
				.css({
					position: "absolute",
					zIndex: config.zIndex,
					backgroundColor: config.bgcolor,
					opacity: config.opacity,
					zoom: 1,
				})
				.addClass("fl-cloud");

			ref.content = jQuery("<div>").addClass(config.className);
			jQuery(ref.content).attr("id", config.id);
			jQuery(ref.content)
				.css({
					position: "absolute",
					zIndex: config.zIndex + 1,
				})
				.addClass("fl-cloud");

			if (null == config.close || typeof config.close == "undefined") {
				ref.close = jQuery("<div>").addClass(config.className);
				jQuery(ref.close).attr("id", config.closeClass);
				jQuery(ref.close)
					.css({
						position: "absolute",
						zIndex: config.zIndex + 1,
						color: "white",
						cursor: "pointer",
					})
					.addClass(config.closeClass);
				//jQuery(ref.close).text('[X]Close');
			} else {
				ref.close = jQuery(config.close).clone().addClass(config.closeClass);
			}

			jQuery(ref.container).append(ref.overlay);
			jQuery(ref.container).append(ref.iframe);
			jQuery(ref.container).append(ref.content);
			jQuery(ref.container).append(ref.close);

			return jQuery(document.body).prepend(ref.container);
		}

		function hide_selects() {
			/*jQuery('select').each(function(index, sb)
            {
                jQuery(sb).hide();
                var dummy = jQuery('<input>');
                jQuery(dummy).attr({'type':'text', 'value': jQuery(sb).val()});
                jQuery(dummy).addClass('dummy-select-box-ie6');
                jQuery(sb).after(dummy);
            });*/
		}

		function show_selects() {
			/*jQuery('select').each(function(index, sb)
            {
                jQuery(sb).show();
                jQuery(jQuery(sb).next('.dummy-select-box-ie6')).remove();
            });*/
		}

		function start() {
			//jQuery.browser.msie && jQuery.browser.version.substr(0,1)<7 ? hide_selects() : -1;
			config.beforeStart(elm);
			init();
			embed();
			position();
			jQuery(ref.content).append(jQuery(elm).removeClass("u-hidden"));
			start_ovservers();
			jQuery(ref.container).removeClass("u-hidden").css({ display: "block" });
			config.afterStart(elm);
		}
		//
		// Entry point
		start();
	};
})(jQuery);