var Mediabox; (function() { var options, images, activeImage, prevImage, nextImage, top, mTop, left, mLeft, winWidth, winHeight, fx, preload, preloadPrev = new Image(), preloadNext = new Image(), foxfix = false, iefix = false, overlay, center, image, bottom, captionSplit, title, caption, prevLink, number, nextLink, URL, WH, WHL, elrel, mediaWidth, mediaHeight, mediaType = "none", mediaSplit, mediaId = "mediaBox", mediaFmt; window.addEvent("domready", function() { $(document.body).adopt($$([overlay = new Element("div", { id: "mbOverlay" }).addEvent("click", close), center = new Element("div", { id: "mbCenter" })]).setStyle("display", "none")); image = new Element("div", { id: "mbImage" }).injectInside(center); bottom = new Element("div", { id: "mbBottom" }).injectInside(center).adopt(new Element("a", { id: "mbCloseLink", href: "#" }).addEvent("click", close), nextLink = new Element("a", { id: "mbNextLink", href: "#" }).addEvent("click", next), prevLink = new Element("a", { id: "mbPrevLink", href: "#" }).addEvent("click", previous), title = new Element("div", { id: "mbTitle" }), number = new Element("div", { id: "mbNumber" }), caption = new Element("div", { id: "mbCaption" })); fx = { overlay: new Fx.Tween(overlay, { property: "opacity", duration: 360 }).set(0), image: new Fx.Tween(image, { property: "opacity", duration: 360, onComplete: captionAnimate }), bottom: new Fx.Tween(bottom, { property: "opacity", duration: 240 }).set(0)} }); Mediabox = { close: function() { close() }, open: function(_images, startImage, _options) { options = $extend({ loop: false, stopKey: true, overlayOpacity: 0.7, resizeOpening: true, resizeDuration: 240, resizeTransition: false, initialWidth: 320, initialHeight: 180, defaultWidth: 640, defaultHeight: 360, showCaption: true, showCounter: true, counterText: '({x} of {y})', imgBackground: false, imgPadding: 70, scriptaccess: 'true', fullscreen: 'true', fullscreenNum: '1', autoplay: 'true', autoplayNum: '1', autoplayYes: 'yes', bgcolor: '#000000', wmode: 'opaque', playerpath: '/js/player.swf', backcolor: '000000', frontcolor: '999999', lightcolor: '000000', screencolor: '000000', controlbar: 'over', useNB: true, NBpath: '/js/NonverBlaster.swf', NBloop: 'true', controlColor: '0xFFFFFF', controlBackColor: '0x000000', showTimecode: 'false', controller: 'true', flInfo: 'true', revverID: '187866', revverFullscreen: 'true', revverBack: '000000', revverFront: 'ffffff', revverGrad: '000000', usViewers: 'true', ytBorder: '0', ytColor1: '000000', ytColor2: '333333', ytQuality: '&ap=%2526fmt%3D18', ytRel: '0', ytInfo: '1', ytSearch: '0', vuPlayer: 'basic', vmTitle: '1', vmByline: '1', vmPortrait: '1', vmColor: 'ffffff' }, _options || {}); if ((Browser.Engine.gecko) && (Browser.Engine.version < 19)) { foxfix = true; options.overlayOpacity = 1; overlay.className = 'mbOverlayFF' } if (typeof _images == "string") { _images = [[_images, startImage, _options]]; startImage = 0 } images = _images; options.loop = options.loop && (images.length > 1); if ((Browser.Engine.trident) && (Browser.Engine.version < 5)) { iefix = true; overlay.className = 'mbOverlayIE'; overlay.setStyle("position", "absolute"); position() } size(); setup(true); top = window.getScrollTop() + (window.getHeight() / 2); left = window.getScrollLeft() + (window.getWidth() / 2); fx.resize = new Fx.Morph(center, $extend({ duration: options.resizeDuration, onComplete: imageAnimate }, options.resizeTransition ? { transition: options.resizeTransition} : {})); center.setStyles({ top: top, left: left, width: options.initialWidth, height: options.initialHeight, marginTop: -(options.initialHeight / 2), marginLeft: -(options.initialWidth / 2), display: "" }); fx.overlay.start(options.overlayOpacity); return changeImage(startImage) } }; Element.implement({ mediabox: function(_options, linkMapper) { $$(this).mediabox(_options, linkMapper); return this } }); Elements.implement({ mediabox: function(_options, linkMapper, linksFilter) { linkMapper = linkMapper || function(el) { elrel = el.rel.split(/[\[\]]/); elrel = elrel[1]; return [el.href, el.title, elrel] }; linksFilter = linksFilter || function() { return true }; var links = this; links.addEvent('contextmenu', function(e) { if (this.toString().match(/\.gif|\.jpg|\.png/i)) e.stop() }); links.removeEvents("click").addEvent("click", function() { var filteredArray = links.filter(linksFilter, this); var filteredLinks = []; var filteredHrefs = []; filteredArray.each(function(item, index) { if (filteredHrefs.indexOf(item.toString()) < 0) { filteredLinks.include(filteredArray[index]); filteredHrefs.include(filteredArray[index].toString()) } }); return Mediabox.open(filteredLinks.map(linkMapper), filteredHrefs.indexOf(this.toString()), _options) }); return links } }); function position() { overlay.setStyles({ top: window.getScrollTop(), left: window.getScrollLeft() }) } function size() { winWidth = window.getWidth(); winHeight = window.getHeight(); overlay.setStyles({ width: winWidth, height: winHeight }) } function setup(open) { ["object", window.ie ? "select" : "embed"].forEach(function(tag) { Array.forEach(document.getElementsByTagName(tag), function(el) { if (open) el._mediabox = el.style.visibility; el.style.visibility = open ? "hidden" : el._mediabox }) }); overlay.style.display = open ? "" : "none"; var fn = open ? "addEvent" : "removeEvent"; if (iefix) window[fn]("scroll", position); window[fn]("resize", size); document[fn]("keydown", keyDown) } function keyDown(event) { switch (event.code) { case 27: case 88: case 67: close(); break; case 37: case 80: previous(); break; case 39: case 78: next() } if (options.stopKey) { return false } } function previous() { return changeImage(prevImage) } function next() { return changeImage(nextImage) } function changeImage(imageIndex) { if (imageIndex >= 0) { image.set('html', ''); activeImage = imageIndex; prevImage = ((activeImage || !options.loop) ? activeImage : images.length) - 1; nextImage = activeImage + 1; if (nextImage == images.length) nextImage = options.loop ? 0 : -1; stop(); center.className = "mbLoading"; WH = images[imageIndex][2].split(' '); WHL = WH.length; if (WHL > 1) { mediaWidth = (WH[WHL - 2].match("%")) ? (window.getWidth() * ("0." + (WH[WHL - 2].replace("%", "")))) + "px" : WH[WHL - 2] + "px"; mediaHeight = (WH[WHL - 1].match("%")) ? (window.getHeight() * ("0." + (WH[WHL - 1].replace("%", "")))) + "px" : WH[WHL - 1] + "px" } else { mediaWidth = ""; mediaHeight = "" } URL = images[imageIndex][0]; URL = encodeURI(URL).replace("(", "%28").replace(")", "%29"); captionSplit = images[activeImage][1].split('::'); if (URL.match(/quietube\.com/i)) { mediaSplit = URL.split('v.php/'); URL = mediaSplit[1] } else if (URL.match(/\/\/yfrog/i)) { mediaType = (URL.substring(URL.length - 1)); if (mediaType.match(/b|g|j|p|t/i)) mediaType = 'image'; if (mediaType == 's') mediaType = 'flash'; if (mediaType.match(/f|z/i)) mediaType = 'video'; URL = URL + ":iphone" } if (URL.match(/\.gif|\.jpg|\.png|twitpic\.com/i) || mediaType == 'image') { mediaType = 'img'; URL = URL.replace(/twitpic\.com/i, "twitpic.com/show/full"); preload = new Image(); preload.onload = startEffect; preload.src = URL } else if (URL.match(/\.flv|\.mp4/i) || mediaType == 'video') { mediaType = 'obj'; mediaWidth = mediaWidth || options.defaultWidth; mediaHeight = mediaHeight || options.defaultHeight; if (options.useNB) { preload = new Swiff('' + options.NBpath + '?mediaURL=' + URL + '&allowSmoothing=true&autoPlay=' + options.autoplay + '&buffer=6&showTimecode=' + options.showTimecode + '&loop=' + options.NBloop + '&controlColor=' + options.controlColor + '&controlBackColor=' + options.controlBackColor + '&scaleIfFullScreen=true&showScalingButton=true&crop=false', { id: 'MediaboxSWF', width: mediaWidth, height: mediaHeight, params: { wmode: options.wmode, bgcolor: options.bgcolor, allowscriptaccess: options.scriptaccess, allowfullscreen: options.fullscreen} }) } else { preload = new Swiff('' + options.playerpath + '?file=' + URL + '&backcolor=' + options.backcolor + '&frontcolor=' + options.frontcolor + '&lightcolor=' + options.lightcolor + '&screencolor=' + options.screencolor + '&autostart=' + options.autoplay + '&controlbar=' + options.controlbar, { id: 'MediaboxSWF', width: mediaWidth, height: mediaHeight, params: { wmode: options.wmode, bgcolor: options.bgcolor, allowscriptaccess: options.scriptaccess, allowfullscreen: options.fullscreen} }) } startEffect() } else if (URL.match(/\.mp3|\.aac|tweetmic\.com|tmic\.fm/i) || mediaType == 'audio') { mediaType = 'obj'; mediaWidth = mediaWidth || options.defaultWidth; mediaHeight = mediaHeight || "20px"; if (URL.match(/tweetmic\.com|tmic\.fm/i)) { URL = URL.split('/'); URL[4] = URL[4] || URL[3]; URL = "http://media4.fjarnet.net/tweet/tweetmicapp-" + URL[4] + '.mp3' } if (options.useNB) { preload = new Swiff('' + options.NBpath + '?mediaURL=' + URL + '&allowSmoothing=true&autoPlay=' + options.autoplay + '&buffer=6&showTimecode=' + options.showTimecode + '&loop=' + options.NBloop + '&controlColor=' + options.controlColor + '&controlBackColor=' + options.controlBackColor + '&scaleIfFullScreen=true&showScalingButton=true&crop=false', { id: 'MediaboxSWF', width: mediaWidth, height: mediaHeight, params: { wmode: options.wmode, bgcolor: options.bgcolor, allowscriptaccess: options.scriptaccess, allowfullscreen: options.fullscreen} }) } else { preload = new Swiff('' + options.playerpath + '?file=' + URL + '&backcolor=' + options.backcolor + '&frontcolor=' + options.frontcolor + '&lightcolor=' + options.lightcolor + '&screencolor=' + options.screencolor + '&autostart=' + options.autoplay, { id: 'MediaboxSWF', width: mediaWidth, height: mediaHeight, params: { wmode: options.wmode, bgcolor: options.bgcolor, allowscriptaccess: options.scriptaccess, allowfullscreen: options.fullscreen} }) } startEffect() } else if (URL.match(/\#mb_/i)) { mediaType = 'inline'; mediaWidth = mediaWidth || options.defaultWidth; mediaHeight = mediaHeight || options.defaultHeight; URLsplit = URL.split('#'); preload = $(URLsplit[1]).get('html'); startEffect() } else { mediaType = 'url'; mediaWidth = mediaWidth || options.defaultWidth; mediaHeight = mediaHeight || options.defaultHeight; mediaId = "mediaId_" + new Date().getTime(); preload = new Element('iframe', { 'src': URL, 'id': mediaId, 'width': mediaWidth, 'height': mediaHeight, 'frameborder': 0 }); startEffect() } } return false } function startEffect() { if (mediaType == "img") { mediaWidth = preload.width; mediaHeight = preload.height; if (options.imgBackground) { image.setStyles({ backgroundImage: "url(" + URL + ")", display: "" }) } else { if (mediaHeight >= winHeight - options.imgPadding) { mediaHeight = winHeight - options.imgPadding; mediaWidth = preload.width = parseInt((mediaHeight / preload.height) * mediaWidth); preload.height = mediaHeight } else if (mediaWidth >= winWidth - options.imgPadding) { mediaWidth = winWidth - options.imgPadding; mediaHeight = preload.height = parseInt((mediaWidth / preload.width) * mediaHeight); preload.width = mediaWidth } if (Browser.Engine.trident) preload = $(preload); preload.addEvent('mousedown', function(e) { e.stop() }).addEvent('contextmenu', function(e) { e.stop() }); image.setStyles({ backgroundImage: "none", display: "" }); preload.inject(image) } } else if (mediaType == "obj") { if (Browser.Plugins.Flash.version < 8) { image.setStyles({ backgroundImage: "none", display: "" }); image.set('html', '<div id="mbError"><b>Error</b><br/>Adobe Flash is either not installed or not up to date, please visit <a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" title="Get Flash" target="_new">Adobe.com</a> to download the free player.</div>'); mediaWidth = options.DefaultWidth; mediaHeight = options.DefaultHeight } else { image.setStyles({ backgroundImage: "none", display: "" }); preload.inject(image) } } else if (mediaType == "inline") { image.setStyles({ backgroundImage: "none", display: "" }); image.set('html', preload) } else if (mediaType == "url") { image.setStyles({ backgroundImage: "none", display: "" }); preload.inject(image) } else { image.setStyles({ backgroundImage: "none", display: "" }); image.set('html', '<div id="mbError"><b>Error</b><br/>A file type error has occoured, please visit <a href="iaian7.com/webcode/mediaboxAdvanced" title="mediaboxAdvanced" target="_new">iaian7.com</a> or contact the website author for more information.</div>'); mediaWidth = options.defaultWidth; mediaHeight = options.defaultHeight } image.setStyles({ width: mediaWidth, height: mediaHeight }); title.set('html', (options.showCaption) ? captionSplit[0] : ""); caption.set('html', (options.showCaption && (captionSplit.length > 1)) ? captionSplit[1] : ""); number.set('html', (options.showCounter && (images.length > 1)) ? options.counterText.replace(/{x}/, activeImage + 1).replace(/{y}/, images.length) : ""); if ((prevImage >= 0) && (images[prevImage][0].match(/\.gif|\.jpg|\.png|twitpic\.com/i))) preloadPrev.src = images[prevImage][0].replace(/twitpic\.com/i, "twitpic.com/show/full"); if ((nextImage >= 0) && (images[nextImage][0].match(/\.gif|\.jpg|\.png|twitpic\.com/i))) preloadNext.src = images[nextImage][0].replace(/twitpic\.com/i, "twitpic.com/show/full"); mediaWidth = image.offsetWidth; mediaHeight = image.offsetHeight + bottom.offsetHeight; if (mediaHeight >= top + top - 10) { mTop = -(top - 10) } else { mTop = -(mediaHeight / 2) }; if (mediaWidth >= left + left - 10) { mLeft = -(left - 10) } else { mLeft = -(mediaWidth / 2) }; if (options.resizeOpening) { fx.resize.start({ width: mediaWidth, height: mediaHeight, marginTop: mTop, marginLeft: mLeft }) } else { center.setStyles({ width: mediaWidth, height: mediaHeight, marginTop: mTop, marginLeft: mLeft }); imageAnimate() } } function imageAnimate() { fx.image.start(1) } function captionAnimate() { center.className = ""; if (prevImage >= 0) prevLink.style.display = ""; if (nextImage >= 0) nextLink.style.display = ""; fx.bottom.start(1) } function stop() { if (preload) preload.onload = $empty; fx.resize.cancel(); fx.image.cancel().set(0); fx.bottom.cancel().set(0); $$(prevLink, nextLink).setStyle("display", "none") } function close() { if (activeImage >= 0) { preload.onload = $empty; image.set('html', ''); for (var f in fx) fx[f].cancel(); center.setStyle("display", "none"); fx.overlay.chain(setup).start(0) } return false } })(); Mediabox.scanPage = function() { var links = $$("a").filter(function(el) { return el.rel && el.rel.test(/^lightbox/i) }); $$(links).mediabox({}, null, function(el) { var rel0 = this.rel.replace(/[[]|]/gi, " "); var relsize = rel0.split(" "); return (this == el) || ((this.rel.length > 8) && el.rel.match(relsize[1])) }) }; window.addEvent("domready", Mediabox.scanPage);