/*
	Alterted script and fixed to 620px. See colorbox unpacked for alterations
*/
(function($) { var settings, loadedWidth, loadedHeight, interfaceHeight, interfaceWidth, index, related, loadingElement, $modal, modalWrap, $loadingOverlay, $overlay, $modalContent, $loaded, $close, $borderTopCenter, $borderMiddleLeft, $borderMiddleRight, $borderBottomCenter; function setModalOverlay() { $overlay.css({ "position": "absolute", width: $(window).width(), height: $(window).height(), top: $(window).scrollTop(), left: $(window).scrollLeft() }) } function keypressEvents(e) { if (e.keyCode == 37) { e.preventDefault(); $(document).unbind('keydown', keypressEvents); $("a#contentPrevious").click() } else if (e.keyCode == 39) { e.preventDefault(); $(document).unbind('keydown', keypressEvents); $("a#contentNext").click() } } function clearLoading() { if ($("#colorboxInlineTemp").length > 0) { $loaded.children().insertAfter("#colorboxInlineTemp") } if (loadingElement) { $(loadingElement).remove() } } function setSize(size, dimension) { return (typeof size == 'string') ? (size.match(/%/) ? (dimension / 100) * parseInt(size, 10) : parseInt(size, 10)) : size } $(function() { $("body").append($overlay = $('<div id="modalBackgroundOverlay" />').hide(), $modal = $('<div id="colorbox" />').css("opacity", 0)); $('<div id="modalWrap" />').appendTo($modal).append($('<div><div id="borderTopLeft" /><div id="borderTopCenter" /><div id="borderTopRight" /></div>'), $borderMiddleLeft = $('<div id="borderMiddleLeft" />'), $modalContent = $('<div id="modalContent" />'), $borderMiddleRight = $('<div id="borderMiddleRight" />'), $('<div><div id="borderBottomLeft" /><div id="borderBottomCenter" /><div id="borderBottomRight" /></div>')); $modalContent.append($loaded = $('<div id="modalLoadedContent"><a id="contentNext" href="#"></a><a id="contentPrevious" href="#"></a><span id="contentCurrent"></span><span id="contentTitle"></span><div id="preloadPrevious"></div><div id="preloadNext"></div><div id="preloadClose"></div></div>'), $loadingOverlay = $('<div id="modalLoadingOverlay" />'), $close = $('<a id="modalClose" href="#"></a>')); $(document).bind("keydown.colorClose", function(e) { if (e.keyCode == 27) { e.preventDefault(); $.fn.colorbox.close() } }); $close.click(function(event) { event.preventDefault(); $.fn.colorbox.close() }); $borderTopCenter = $("#borderTopCenter"); $borderBottomCenter = $("#borderBottomCenter"); interfaceHeight = $borderTopCenter.height() + $borderBottomCenter.height() + $modalContent.outerHeight(true) - $modalContent.height(); interfaceWidth = $borderMiddleLeft.width() + $borderMiddleRight.width() + $modalContent.outerWidth(true) - $modalContent.width(); loadedHeight = $loaded.outerHeight(true); loadedWidth = $loaded.outerWidth(true); $loaded.empty(); $modal.css({ "padding-bottom": interfaceHeight, "padding-right": interfaceWidth }).hide(); $("#contentPrevious, #contentNext, #modalClose").live('mouseover', function() { $(this).addClass("hover") }); $("#contentPrevious, #contentNext, #modalClose").live('mouseout', function() { $(this).removeClass("hover") }) }); $.fn.colorbox = function(settings, callback) { function modalPosition(mWidth, mHeight, speed, loadedCallback) { var winHeight = document.documentElement.clientHeight; var posTop = winHeight / 2 - mHeight / 2; var posLeft = document.documentElement.clientWidth / 2 - mWidth / 2; if (mHeight > winHeight) { posTop -= (mHeight - winHeight) } if (posTop < 0) { posTop = 0 } if (posLeft < 0) { posLeft = 0 } posTop += $(window).scrollTop(); posLeft += $(window).scrollLeft(); mWidth = mWidth - interfaceWidth; mHeight = mHeight - interfaceHeight; function modalDimensions(that) { $modalContent[0].style.width = $borderTopCenter[0].style.width = $borderBottomCenter[0].style.width = that.style.width; $modalContent[0].style.height = $borderMiddleLeft[0].style.height = $borderMiddleRight[0].style.height = that.style.height } $modal.animate({ height: mHeight, width: mWidth, top: posTop, left: posLeft }, { duration: speed, complete: function() { if (loadedCallback) { loadedCallback() } modalDimensions(this); if ($.browser.msie && $.browser.version < 7) { setModalOverlay() } }, step: function() { modalDimensions(this) } }) } var preloads = []; function preload() { if (settings.preloading !== false && related.length > 1 && related[index].href.match(/\.(gif|png|jpg|jpeg|bmp)(?:\?([^#]*))?(?:#(.*))?$/i)) { var previous, next; previous = index > 0 ? related[index - 1].href : related[related.length - 1].href; next = index < related.length - 1 ? related[index + 1].href : related[0].href; return [$("<img />").attr("src", next), $("<img />").attr("src", previous)] } return false } function contentNav() { $loadingOverlay.show(); if ($(this).attr("id") == "contentPrevious") { index = index > 0 ? index - 1 : related.length - 1 } else { index = index < related.length - 1 ? index + 1 : 0 } loadModal(related[index].href, related[index].title); return false } function centerModal(object, contentInfo) { if ($modal.data("open") !== true) { return false } var speed = settings.transition == "none" ? 0 : settings.transitionSpeed; $loaded.remove(); $loaded = $(object); $loaded.hide().appendTo('body').css('width', '620px').css({ height: (settings.fixedHeight) ? settings.fixedHeight - loadedHeight - interfaceHeight : $loaded.height() }).attr({ id: "modalLoadedContent" }).append(contentInfo).prependTo($modalContent); if ($("#modalPhoto").length > 0 && settings.fixedHeight) { var topMargin = (parseInt($loaded[0].style.height, 10) - parseInt($("#modalPhoto")[0].style.height, 10)) / 2; $("#modalPhoto").css({ marginTop: (topMargin > 0 ? topMargin : 0) }) } function setPosition(s) { modalPosition(parseInt($loaded[0].style.width, 10) + loadedWidth + interfaceWidth, parseInt($loaded[0].style.height, 10) + loadedHeight + interfaceHeight, s, function() { if ($modal.data("open") !== true) { return false } $loaded.show(); $loadingOverlay.hide(); $(document).bind('keydown', keypressEvents); if (callback) { callback() } if (settings.transition === "fade") { $modal.animate({ "opacity": 1 }, speed) } return true }) } if (settings.transition == "fade") { $modal.animate({ "opacity": 0 }, speed, function() { setPosition(0) }) } else { setPosition(speed) } var preloads = preload(); return true } function loadModal(href, title) { clearLoading(); var contentInfo = "<p id='contentTitle'>" + title + "</p>"; if (related.length > 1) { contentInfo += "<span id='contentCurrent'> " + settings.contentCurrent + "</span>"; contentInfo = contentInfo.replace(/\{current\}/, index + 1).replace(/\{total\}/, related.length); contentInfo += "<a id='contentPrevious' href='#'>" + settings.contentPrevious + "</a><a id='contentNext' href='#'>" + settings.contentNext + "</a> " } if (settings.inline) { loadingElement = $('<div id="colorboxInlineTemp" />').hide().insertBefore($(href)[0]); centerModal($(href).wrapAll("<div />").parent(), contentInfo) } else if (settings.iframe) { centerModal($("<div><iframe name='iframe_" + new Date().getTime() + " 'frameborder=0 src =" + href + "></iframe></div>"), contentInfo) } else if (href.match(/\.(gif|png|jpg|jpeg|bmp)(?:\?([^#]*))?(?:#(.*))?$/i)) { loadingElement = new Image(); loadingElement.onload = function() { loadingElement.onload = null; centerModal($("<div />").css({ width: this.width, height: this.height }).append($(this).css({ width: this.width, height: this.height, display: "block", margin: "auto" }).attr('id', 'modalPhoto')), contentInfo); if (related.length > 1) { $(this).css({ cursor: 'pointer' }).click(contentNav) } }; loadingElement.src = href } else { loadingElement = $('<div />').load(href, function(data, textStatus) { if (textStatus == "success") { centerModal($(this), contentInfo) } else { centerModal($("<p>Request unsuccessful.</p>")) } }) } } settings = $.extend({}, $.fn.colorbox.settings, settings); $(this).unbind("click.colorbox").bind("click.colorbox", function() { if (settings.fixedWidth) { settings.fixedWidth = setSize(settings.fixedWidth, document.documentElement.clientWidth) } if (settings.fixedHeight) { settings.fixedHeight = setSize(settings.fixedHeight, document.documentElement.clientHeight) } if (this.rel && 'nofollow' != this.rel) { related = $("a[rel='" + this.rel + "']"); index = $(related).index(this) } else { related = $(this); index = 0 } if ($modal.data("open") !== true) { $(document).bind('keydown', keypressEvents); $close.html(settings.modalClose); $overlay.css({ "opacity": settings.bgOpacity }).show(); $modal.data("open", true).css({ "opacity": 1 }); modalPosition(setSize(settings.initialWidth, document.documentElement.clientWidth), setSize(settings.initialHeight, document.documentElement.clientHeight), 0); if ($.browser.msie && $.browser.version < 7) { $(window).bind("resize scroll", setModalOverlay) } } loadModal(settings.href ? settings.href : related[index].href, settings.title ? settings.title : related[index].title); $("a#contentPrevious, a#contentNext").die().live("click", contentNav); if (settings.overlayClose !== false) { $overlay.css({ "cursor": "pointer" }).click(function() { $.fn.colorbox.close() }) } return false }); if (settings.open !== false && $modal.data("open") !== true) { $(this).triggerHandler('click.colorbox') } return this.each(function() { }) }; $.fn.colorbox.close = function() { $('#contentTitle').remove(); clearLoading(); $overlay.css({ cursor: "auto" }).fadeOut("fast"); $modal.stop(true, false).removeData("open").fadeOut("fast", function() { $loaded.remove() }); $(document).unbind('keydown', keypressEvents); $(window).unbind('resize scroll', setModalOverlay); return false }; $.fn.colorbox.settings = { transition: "elastic", transitionSpeed: 350, initialWidth: "400", initialHeight: "400", fixedWidth: false, fixedHeight: false, inline: false, iframe: false, href: false, title: false, bgOpacity: 0.85, preloading: true, contentCurrent: "image {current} of {total}", contentPrevious: "previous", contentNext: "next", modalClose: "close", open: false, overlayClose: true} })(jQuery);