/* main.js */ /* Sam Sherwood, Optiem LLC */ //Main Navigation Helper function navigationHelper(){ stateLock = false; var contentID = 'main'; //Items Created for maintaining browser history in IE var hasIE = $('hasIE'); var iframeTemplate = new Template('

#{currentState}

'); var historyFrame = $('historyFrame'); //Grab the Main Navigation var navMain = $('navMain'); var navModifier = 1; //Globally set the Dimensions of the current Viewport viewportDimensions = document.viewport.getDimensions(); //Select only the top level navigation items navigationItems = navMain.select('> li'); function extendLinks(pageLinks){ if($('hasIE')){ return; } //var pageLinks = $$('a'); pageLinks.each(function(pageLink){ if(pageLink.getAttribute('rel')){ //If this isn't a normal link, do this (nothing). if(pageLink.getAttribute('rel') == 'file'){ } else { pageLink.writeAttribute('target', '_blank'); } } else if(pageLink.getAttribute('target')){ } else { var naturalHREF = pageLink.getAttribute('href').sub('/#', ''); var directoryHREF = naturalHREF.sub(document.location.protocol + "//" + document.domain, ''); var hashHREF = '/#' + directoryHREF; pageLink.writeAttribute('href', hashHREF); pageLink.observe('click', function(event){ if(stateLock == true){ event.stop(); return false; } var templateData = { currentState: hashHREF }; var templateHTML = iframeTemplate.evaluate(templateData); //console.log(historyFrame.contentWindow.window); historyFrame.contentWindow.window.document.open(); historyFrame.contentWindow.window.document.write(templateHTML); historyFrame.contentWindow.window.document.close(); document.location.href = hashHREF; //alert('You Clicked!'); //if($('hasIE')){ // top.location.replace(...); //} //pageLink.fire('lebron:updateURL', { ajaxURL: directoryHREF }); event.stop(); }); } }); } extendLinks($$('a')); if("onhashchange" in window && !($('hasIE'))){ window.onhashchange = function(event){ var directoryHREF = document.location.href.sub('/#',''); var ajaxURL = directoryHREF; if(directoryHREF.include('?')){ ajaxURL = directoryHREF + '&output=JSON'; } else { ajaxURL = directoryHREF + '?output=JSON'; } document.fire('lebron:updateURL', { ajaxURL: ajaxURL, originalURL: directoryHREF }); } } else if(navigator.userAgent.match(/iPad/i) != null || navigator.userAgent.match(/iPhone/i)) { currentState = document.location.href; //alert(currentState); var historyFrameMonitor = new PeriodicalExecuter(function(pe){ if(currentState != document.location.href){ //alert('moving!'); currentState = document.location.href; var directoryHREF = document.location.href.sub('/#', ''); var ajaxURL = directoryHREF; if(directoryHREF.include('?')){ ajaxURL = directoryHREF + '&output=JSON'; } else { ajaxURL = directoryHREF + '?output=JSON'; } document.fire('lebron:updateURL', { ajaxURL: ajaxURL, originalURL: directoryHREF }); } }, .25); } else { currentState = document.location.href; var historyFrameMonitor = new PeriodicalExecuter(function(pe){ var frameState = historyFrame.contentWindow.window.document.getElementById('state'); if(frameState != null && frameState.innerHTML != currentState){ currentState = frameState.innerHTML; var directoryHREF = document.location.protocol + "//" + document.domain + frameState.innerHTML.sub('/#', ''); //alert(frameState.innerHTML); //alert(top.location); //if(top.location.contains(frameState.innerHTML)){ top.location.replace(document.location.protocol + "//" + document.domain + frameState.innerHTML); //} var ajaxURL = directoryHREF; if(directoryHREF.include('?')){ ajaxURL = directoryHREF + '&output=JSON'; } else { ajaxURL = directoryHREF + '?output=JSON'; } document.fire('lebron:updateURL', { ajaxURL: ajaxURL, originalURL: directoryHREF }); } //console.log(historyFrame.contentWindow.window.document.getElementById('state')); }, .25); } document.observe('lebron:extendLinks', function(event){ pageLinks = event.memo.pageLinks; extendLinks(pageLinks); }); document.observe('lebron:updateURL', function(event){ if(stateLock == true){ return false; } else { stateLock = true; } var ajaxURL = event.memo.ajaxURL; var originalURL = event.memo.originalURL; //console.log(originalURL); _gaq.push(['_trackPageview', originalURL]); new Ajax.Request(ajaxURL, { method: 'get', requestHeaders: ["Content-Type", "application/json; charset=utf-8"], onSuccess: function(transport) { //console.log(transport.responseText); var pageDetails = ''; //window.history.pushState(pageDetails, "Title", ajaxURL); document.fire('lebron:updateContent', { url: originalURL, newContent: transport.responseText.evalJSON(), contentContainer: $(contentID) }); return true; }, onFailure: function() { return false; } }); }); document.observe('lebron:updateNavigation', function(event){ var url = event.memo.url; var navigationItems = $$('#navMain li'); url = url.sub('.aspx',''); url = url.sub('%20',' '); navigationItems.each(function(navigationItem){ navigationItem.removeClassName('current'); var navURL = navigationItem.down('a').readAttribute('href'); navURL = navURL.sub('/#',''); navURL = navURL.sub('.aspx',''); if(url.include(navURL)){ navigationItem.addClassName('current'); } }); }); document.observe('lebron:updateContent', function(event){ //alert('In Update Content'); var updatedContent = event.memo.newContent.html; var contentContainer = event.memo.contentContainer; var originalURL = event.memo.url; //alert('test'); document.fire('lebron:updateNavigation', { url: originalURL }); if(!$('hasIE')){ document.fire('lebron:updateBackground', { moveToX: parseInt(event.memo.newContent.xPos), moveToY: parseInt(event.memo.newContent.yPos) }); } if($('hasIE')){ return; } function hideContent(){ contentContainer.morph('opacity: 0',{ duration: .5, transition: 'sinusoidal', after: function(){ showContent(); }, delay: 0 }); return true; } function showContent(){ contentContainer.replace(updatedContent); contentContainer = $(contentID); contentContainer.setOpacity(0); /*contentContainer.observe('mousedown', function(event){ if(stateLock == true){ return false; } startWalking(event); }); contentContainer.observe('mouseup', function(event){ if(stateLock == true){ return false; } stopWalking(event); });*/ var fontMod = (viewportDimensions.height / 768); if(fontMod > 1){ fontMod = 1; } contentContainer.setStyle({ fontSize: fontMod + 'em' }); extendImages($$('img.lightbox')); carouselHelper(); promotionEntryForm(); audioFix(); facebookFeed(); twitterFeed(); contentContainer.morph('opacity: 1',{ duration: .5, transition: 'sinusoidal', after: function(){ extendLinks($$('#main a')); stateLock = false; }, delay: 0 }); } hideContent(); }); } function findCenter(width, height){ var centerX = ( width / 2 ).round(); var centerY = ( height / 2 ).round(); return { cx: centerX, cy: centerY }; } function pointerAssist(){ mouseX = 0; mouseY = 0; Event.observe(document, 'mousemove', function(event){ mouseX = Event.pointerX(event); mouseY = Event.pointerY(event); }); } //Canvas Testing function canvasInitialize() { var serviceURL = "/services/CanvasService.asmx/SelectItems"; var pageViewport = $('viewport'); var pageBackground = $('canvas'); var contentContainer = $('main'); var nx = 0; var ny = 0; var frameMod = 1; var globalScale = 1; var backgroundVersion = 'v1'; pageViewport.setStyle({ width: viewportDimensions.width + 'px', height: viewportDimensions.height + 'px' }); pageBackground.setAttribute('width', viewportDimensions.width); pageBackground.setAttribute('height', viewportDimensions.height); pageBackground.setOpacity(.1); /*if(viewportDimensions.width < 1640){ globalScale = .75; backgroundVersion = 'v2'; } if(viewportDimensions.width < 1280){ globalScale = .5; backgroundVersion = 'v3'; }*/ //globalScale = viewportDimensions.width / 2000; //var testImageData = 'data:image/gif;base64,R0lGODlhZABkAIAAAP///wAAACH5BAAAAAAALAAAAABkAGQAAALyhI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8YhMKpdMWqDpCTyhG+mUirFesRXtlivxfsEP8VhkTqvX7Hb65I7L5+8S/Y532/P8vpbkF9g3IliIh2aYKBei2Kj34Ri5BilZKRZlmWnVodl51uWpWRUqmkHaaXpaaqGKytqaeQFrmTUbmWqrqJGru8tbyPEryCk8SFx8iIlMB7LM3OwchxjNRkg9aX1ttqftZdLtTQaxLT4eXl72h24utR6x6W4e/z5fb3+Pn6+/z9/v/w8woMCBBAsaPIgwocKFDBsKKQAAOw=='; var testImageData = '/themes/lebronjames_com/images/global/blank.gif'; var patternImage = new Image(); patternImage.src = testImageData; patternImage.width = 300; patternImage.height = 300; //var iconImageData = '/themes/lebronjames_com/images/global/icon-basketball.png'; //var iconImage = new Image(); //iconImage.src = iconImageData; var textureImageData = '/themes/lebronjames_com/images/global/noise1.png'; var textureImage = new Image(); textureImage.src = textureImageData; var stepsX = (viewportDimensions.width / (patternImage.width * globalScale).round()).ceil() + 1; var stepsY = (viewportDimensions.height / (patternImage.height * globalScale).round()).ceil() + 1; var widthX = stepsX * patternImage.width; var widthY = stepsY * patternImage.height; //get a reference to the canvas var ctx = $('canvas').getContext("2d"); //ctx.scale(1*globalScale,1*globalScale); var tripKeys = [], trippin = "84,82,73,80,66,65,76,76,83"; document.observe('keydown', function(event){ tripKeys.push( event.keyCode ); if ( tripKeys.toString().indexOf( trippin ) >= 0 ){ ctx.globalAlpha = .5; } }); var ImageStore = Class.create({ initialize: function(imageWidth, imageHeight, startX, startY, webserviceURL) { this.images = new QuadTree(-5000,-5000,5000,5000); this.dimensions = { width: imageWidth, height: imageHeight }; this.url = webserviceURL; this.queue = new QuadTree(-5000,-5000,5000,5000); var imagesPointer = this.images; var queuePointer = this.queue; stepsX.times(function(x){ stepsY.times(function(y){ queuePointer.set(x * imageWidth + currentX, currentY - (y * imageHeight), false); }); }); }, get: function(x, y, opt_default) { var imageData = this.images.get(x, y); return imageData ? imageData : opt_default; }, addToQueue: function(xLocation, yLocation) { if(!this.images.contains(xLocation, yLocation)) { this.queue.set(xLocation, yLocation, true); } else { //console.log('Location Image Exists'); } }, processQueue: function() { if(!this.queue.isEmpty()) { this.update(); this.queue.clear(); } }, update: function() { //console.log('Update Image Well Hit'); var queueString = Object.toJSON(this.queue.getKeysFlat()); var parameters = Object.toJSON({ version: backgroundVersion, request: queueString }); var classReference = this; var fillStatus = new Ajax.Request(this.url, { method: 'post', requestHeaders: ["Content-type", "application/json; charset=utf-8"], postBody: parameters, onSuccess: function(transport) { //console.log(transport); var responseArray = transport.responseJSON; var arrayCounter = responseArray.d.size() - 1; responseArray.d.each(function(imageData){ var imageItem = new Image(); imageItem.src = 'data:image/gif;base64,' + imageData.DataURL; classReference.images.set(imageData.X, imageData.Y, imageItem); arrayCounter--; }); classReference.queue.clear(); return true; }, onFailure: function() { return false; } }); }, updateSingleImage: function(x, y) { //console.log('Update Single Image Hit'); var queueString = Object.toJSON([[x, y]]); var parameters = Object.toJSON({ version: backgroundVersion, request: queueString }); var classReference = this; var fillStatus = new Ajax.Request(this.url, { method: 'post', requestHeaders: ["Content-type", "application/json; charset=utf-8"], postBody: parameters, onSuccess: function(transport) { var responseArray = transport.responseText.evalJSON(); var arrayCounter = responseArray.d.size() - 1; responseArray.d.each(function(imageData){ var imageItem = new Image(); imageItem.src = 'data:image/gif;base64,' + imageData.DataURL; classReference.images.set(imageData.X, imageData.Y, imageItem); arrayCounter--; }); return true; }, onFailure: function() { return false; } }); }, fill: function() { //console.log('Fill Image Well Hit'); var queueString = Object.toJSON(this.queue.getKeysFlat()); var parameters = Object.toJSON({ version: backgroundVersion, request: queueString }); var classReference = this; var fillStatus = new Ajax.Request(this.url, { method: 'post', requestHeaders: ["Content-type", "application/json; charset=utf-8"], postBody: parameters, onSuccess: function(transport) { var responseArray = transport.responseJSON; var arrayCounter = responseArray.d.size() - 1; responseArray.d.each(function(imageData, index){ var imageItem = new Image(); imageItem.onload = function(){ classReference.images.set(imageData.X, imageData.Y, imageItem); //console.log('Image Loaded' + arrayCounter); arrayCounter--; if(arrayCounter < 0){ //console.log('Firing Array Updated'); document.fire('lebron:arrayInitialized'); } } //alert(imageItem.onload); imageItem.src = 'data:image/gif;base64,' + imageData.DataURL; }); classReference.queue.clear(); return true; }, onFailure: function() { return false; } }); } }); var imageWell = new ImageStore(patternImage.width, patternImage.height, 0, 0, serviceURL); imageWell.fill(); pageBackground.centerPoint = findCenter(viewportDimensions.width, viewportDimensions.height); /* Function for Drawing the Current Canvas Snapshot */ function fillCanvas(offsetX, offsetY, deltaX, deltaY){ currentX = (currentX + deltaX); currentY = (currentY + deltaY); //console.log('Current X: ' + currentX); //console.log('Offset X: ' + offsetX); //console.log('Current Y: ' + currentY); //console.log('Offset Y: ' + offsetY); var startingX = (currentX / patternImage.width).floor()*patternImage.width; var startingY = (currentY / patternImage.height).ceil()*patternImage.height; //console.log('Starting X: ' + startingX); //console.log('Starting Y: ' + startingY); //console.log('Steps X: ' + stepsX); //console.log('Steps Y: ' + stepsY); //console.log(imageWell.images); stepsY.times(function(y){ stepsX.times(function(x){ var imageData = imageWell.get(x * patternImage.width * globalScale + startingX, -(y * patternImage.height) * globalScale + startingY, false) if(imageData){ ctx.drawImage(imageData, (patternImage.width * x * globalScale) + offsetX, (patternImage.height * y * globalScale) + offsetY); } else { ctx.drawImage(patternImage, (patternImage.width * x * globalScale) + offsetX, (patternImage.height * y * globalScale) + offsetY); } //ctx.drawImage(textureImage, (patternImage.width * x) + offsetX, (patternImage.height * y) + offsetY); }); }); //ctx.drawImage(iconImage, mouseX-48, mouseY-48); } function buildQueue(buildScale){ //console.log('Build Queue Hit'); var startingX = (currentX / patternImage.width).floor()*patternImage.width; var startingY = (currentY / patternImage.height).ceil()*patternImage.height; $R(-1 * buildScale, stepsY + 1 * buildScale).each(function(y){ $R(-1 * buildScale, stepsX + 1 * buildScale).each(function(x){ var calculatedX = x * patternImage.width + startingX; var calculatedY = startingY - y * patternImage.height; imageWell.addToQueue(calculatedX, calculatedY); //imageWell.updateSingleImage(calculatedX, calculatedY); }); }); //console.log(imageWell.queue.getCount()); } function activateQueue() { imageWell.processQueue(); } function simulateClick(x, y) { var slope = lineEquation(currentX + pageBackground.centerPoint.cx, currentY - pageBackground.centerPoint.cy, x + pageBackground.centerPoint.cx, y - pageBackground.centerPoint.cy); //console.log('CurrentX: ' + currentX); //console.log('CurrentY: ' + currentY); //console.log('Slope is: ' + slope); //console.log('MoveTo X is ' + (x + pageBackground.centerPoint.cx)); //console.log('MoveTo Y is ' + (y - pageBackground.centerPoint.cy)); var moveToX = x + pageBackground.centerPoint.cx; var moveToY = y - pageBackground.centerPoint.cy; var xIntercept = pageBackground.centerPoint.cx; var yIntercept; var lineB = (currentY - pageBackground.centerPoint.cy) - slope * (currentX + pageBackground.centerPoint.cx); if(Math.abs(slope) != Infinity){ if(slope == 0){ if(moveToX >= currentX + viewportDimensions.width) { //console.log('X is Beyond and Slope 0 '); xIntercept = viewportDimensions.width + currentX; yIntercept = currentY - pageBackground.centerPoint.cy; } else if(moveToX <= currentX) { //console.log('X is Before and Slope 0'); xIntercept = 0 + currentX; yIntercept = currentY - pageBackground.centerPoint.cy; } else { //console.log('X is Between and Slope 0 ' + viewportDimensions.width); xIntercept = viewportDimensions.width + currentX; yIntercept = currentY - pageBackground.centerPoint.cy; } } else { //console.log(moveToY); //console.log((currentY - pageBackground.centerPoint.cy)); if(moveToY >= (currentY - pageBackground.centerPoint.cy)) { //console.log('moveToY Above Center of ' + (currentY - pageBackground.centerPoint.cy)); yIntercept = currentY; xIntercept = (yIntercept - lineB)/slope; if(xIntercept > currentX + viewportDimensions.width) { //console.log('xIntercept too big'); xIntercept = currentX + viewportDimensions.width; } else if (xIntercept < currentX) { //console.log('xIntercept too small'); xIntercept = currentX; } yIntercept = slope * xIntercept + lineB; } else { //console.log('moveToY Below Center'); yIntercept = currentY - viewportDimensions.height; xIntercept = (yIntercept - lineB)/slope; if(xIntercept > currentX + viewportDimensions.width) { //console.log('xIntercept too big'); xIntercept = currentX + viewportDimensions.width; } else if (xIntercept < currentX) { //console.log('xIntercept too small'); if(x > currentX + pageBackground.centerPoint.cx){ xIntercept = currentX + viewportDimensions.width; } else { xIntercept = currentX; } } yIntercept = slope * xIntercept + lineB; } } } else if(slope == Infinity) { //console.log('Y is Above and Slope Infinite'); yIntercept = currentY; xIntercept = pageBackground.centerPoint.cx + currentX; } else { //Slope == -Infinity ... below //console.log('Y is Below and Slope Infinite'); yIntercept = currentY - viewportDimensions.height; xIntercept = pageBackground.centerPoint.cx + currentX; } // console.log('X intercept is ' + xIntercept); // console.log('Y intercept is ' + yIntercept); // // console.log('Square X Intercept is ' + (xIntercept - currentX)); // console.log('Square Y Intercept is ' + (currentY - yIntercept)); $('mousePointer').setStyle({ top: (currentY - yIntercept) - 20 + 'px', left: (xIntercept - currentX) - 20 + 'px' }); return {x: xIntercept - currentX, y: currentY - yIntercept, slope: slope}; } contentContainer.observe('mousedown', function(event){ /*if(stateLock == true){ return false; } startWalking(event);*/ }); contentContainer.observe('mouseup', function(event){ /*if(stateLock == true){ return false; } stopWalking(event);*/ }); document.observe('lebron:updateBackground', function(event){ // console.log('In Update Background'); var forcedFPS = 30; var stopTrigger = false; var moveToX = event.memo.moveToX; var moveToY = event.memo.moveToY; var pseudoClick = simulateClick(moveToX, moveToY); if(navigator.userAgent.match(/iPad/i) != null || navigator.userAgent.match(/iPhone/i)){ //alert('Called Update Background'); currentX = moveToX; currentY = moveToY; //var imageWell = new ImageStore(patternImage.width, patternImage.height, moveToX, moveToY, serviceURL); //alert('Called New Well'); buildQueue(2); imageWell.fill(); //document.fire('lebron:animateBackground', { stopping: true, hitX: 0, hitY: 0, forcedFPS: 30 }); //alert('Called Fill'); } else { animationExecuter = new PeriodicalExecuter(function(pe){ if( Math.abs(currentX - moveToX) < 450 && Math.abs(currentY - moveToY) < 450) { stopTrigger = true; } if( stopTrigger == false ){ // console.log('Current X Moving: ' + currentX); // console.log('Current Y Moving: ' + currentY); document.fire('lebron:animateBackground', { stopping: false, hitX: pseudoClick.x, hitY: pseudoClick.y, forcedFPS: forcedFPS }); } else { // console.log('Current X Stopping: ' + currentX); // console.log('Current Y Stopping: ' + currentY); document.fire('lebron:animateBackground', { stopping: true, hitX: pseudoClick.x, hitY: pseudoClick.y, forcedFPS: forcedFPS }); } }, 1/forcedFPS); } }); document.observe('lebron:animateBackground', function(event){ var stopping = event.memo.stopping; var hitX = event.memo.hitX; var hitY = event.memo.hitY; var forcedFPS = event.memo.forcedFPS; var updateQueue = false; var dx = 1; var dy = 1; var velocity = 40; var acceleration = 4; // Seconds to full velocity var freq = Math.PI / (2 * acceleration * forcedFPS); // frequency var velocityMod = Math.abs(Math.sin(frameMod * freq)); //ctx.globalAlpha = .5; if(stopping == false && frameMod <= (acceleration * forcedFPS)){ frameMod++; } else if (stopping == true && frameMod > 0) { frameMod = frameMod - acceleration * (1.25 - Math.abs(dx) / velocity); } else if (stopping == true && frameMod <= 0) { //console.log('Stopping'); animationExecuter.stop(); } velocityMod = Math.abs(Math.sin(frameMod * freq)); //console.log('----------'); dx = ((hitX / viewportDimensions.width) * (velocity * velocityMod * 2 * (viewportDimensions.width / viewportDimensions.height))).ceil(); dx = dx - (velocity * velocityMod * (viewportDimensions.width / viewportDimensions.height)).ceil(); //console.log('DX: ' + dx); dy = ((hitY / viewportDimensions.height) * (velocity * velocityMod * 2)).ceil(); dy = -(dy - (velocity * velocityMod).ceil()); //console.log('DY: ' + dy); //n = n + 5; nx = nx - dx; if(nx > 0){ nx = nx - (patternImage.width * globalScale); updateQueue = true; } else if(nx <= -(patternImage.width * globalScale)) { nx = nx + (patternImage.width * globalScale); updateQueue = true; } ny = ny + dy; if(ny > 0){ ny = ny - (patternImage.height * globalScale); updateQueue = true; } else if(ny <= -(patternImage.height * globalScale)){ ny = ny + (patternImage.height * globalScale); updateQueue = true; } //console.log(ny); fillCanvas(nx, ny, dx, dy); if(updateQueue){ buildQueue.defer(2); activateQueue.defer(); } }); document.observe('lebron:arrayInitialized', function(event){ //console.log('Caught Array Updated'); fillCanvas(0, 0, 0, 0); buildQueue(3); activateQueue(); //var directoryHREF = document.location.href.sub('/#',''); //document.fire('lebron:updateURL', { ajaxURL: directoryHREF + '?output=JSON' }); }); } function startWalking(event) { //console.log(Event.element(event)); if(!event.isLeftClick()){ return false; } else if(Event.element(event).hasClassName('carousel')){ return false; } if(typeof(animationExecuter) != "undefined"){ animationExecuter.stop(); } //S2.UI.disableTextSelection($('main')); var forcedFPS = 50; animationExecuter = new PeriodicalExecuter(function(pe){ document.fire('lebron:animateBackground', { stopping: false, hitX: mouseX, hitY: mouseY, forcedFPS: forcedFPS }); }, 1/forcedFPS); } function stopWalking(event) { if(!event.isLeftClick()){ return false; } if(typeof(animationExecuter) != "undefined"){ animationExecuter.stop(); } //S2.UI.enableTextSelection($('main')); var forcedFPS = 50; animationExecuter = new PeriodicalExecuter(function(pe){ document.fire('lebron:animateBackground', { stopping: true, hitX: mouseX, hitY: mouseY, forcedFPS: forcedFPS }); }, 1/forcedFPS); } //Carousel Helper function carouselHelper() { var articleContainer = $('article'); var carouselNavs = $$('ul.navCarousel'); carouselNavs.each(function(carouselNav){ var navPosition = carouselNav.viewportOffset(); var carouselHandle = carouselNav.down('li'); var handleWidth = carouselHandle.getWidth(); var handleHeight = carouselHandle.getHeight() + 82; var handlePosition = carouselHandle.positionedOffset(); handlePosition.top = 41; var navWidth = carouselNav.getWidth(); var navHeight = carouselNav.getHeight(); var carouselPercent = handlePosition.left / carouselNav.getWidth(); var carouselContainer = carouselNav.previous('ul'); carouselContainer.totalWidth = 0; if(carouselContainer.hasClassName('carousel')){ carouselContainer.setStyle({ overflow: 'hidden' }); } carouselContainer.originalHeight = carouselContainer.getHeight(); carouselContainer.totalHeight = carouselContainer.getHeight(); var carouselItems = carouselContainer.select('> li'); var lastItemWidth = 0; if(carouselContainer.hasClassName('carousel')){ carouselItems.each(function(carouselItem){ if(carouselItem.hasClassName('image')){ var maxHeight = 480; var carouselImage = carouselItem.down('img'); //console.log(carouselContainer.getHeight()); var imageScale = carouselContainer.totalHeight / maxHeight; if(carouselItem.down('a')){ if(carouselItem.down('a').readAttribute('class')){ imageScale = 1; carouselNav.hide(); } } carouselImage.width = (carouselImage.width * imageScale); //console.log(carouselImage.height); carouselImage.height = (carouselImage.height * imageScale); carouselItem.setStyle({ width: carouselImage.width + 'px' }); var itemCaption = carouselItem.down('div.section'); if(itemCaption){ itemCaption.setStyle({ bottom: '-800px' }); carouselItem.observe('mouseenter', function(event){ itemCaption.morph('bottom:' + (carouselImage.height * .14) + 'px',{ duration: .5, transition: 'sinusoidal', after: function(){ }, delay: 0 }); }); carouselItem.observe('mouseleave', function(event){ itemCaption.morph('bottom: -800px',{ duration: .5, transition: 'sinusoidal', after: function(){ }, delay: 0 }); }); } } else if(carouselItem.hasClassName('video')){ var maxHeight = 480; var carouselVideo = carouselItem.down('video'); //console.log(carouselContainer.getHeight()); var imageScale = carouselContainer.totalHeight / maxHeight; carouselVideo.width = (carouselVideo.width * imageScale).floor(); //console.log(carouselImage.height); carouselVideo.height = (carouselVideo.height * imageScale).floor(); var carouselFlash = carouselVideo.next('object'); if(carouselFlash){ carouselFlash.width = (carouselFlash.width * imageScale).floor(); carouselFlash.height = (carouselFlash.height * imageScale).floor(); } carouselItem.setStyle({ width: carouselVideo.width + 'px' }); var itemCaption = carouselItem.down('div.section'); if(itemCaption){ itemCaption.setStyle({ top: '-800px' }); carouselItem.observe('mouseenter', function(event){ itemCaption.morph('top:' + (carouselVideo.height * .14) + 'px',{ duration: .5, transition: 'sinusoidal', after: function(){ }, delay: 0 }); }); carouselItem.observe('mouseleave', function(event){ itemCaption.morph('top: -800px',{ duration: .5, transition: 'sinusoidal', after: function(){ }, delay: 0 }); }); } } var itemWidth = carouselItem.getWidth() + 24; carouselContainer.totalWidth = carouselContainer.totalWidth + itemWidth; carouselItem.setStyle({ position: 'absolute', left: (carouselContainer.totalWidth - itemWidth) + 12 + 'px' }); lastItemWidth = itemWidth; }); carouselContainer.setStyle({ width: carouselContainer.totalWidth + 'px' }); carouselContainer.totalWidth = carouselContainer.totalWidth - lastItemWidth; if(carouselContainer.totalWidth < articleContainer.getWidth() - lastItemWidth){ carouselNav.hide(); } carouselHandle.observe('mousedown', function(event){ stateLock = true; var originalMouseX = mouseX; carouselNavExecuter = new PeriodicalExecuter(function(pe){ var mouseDelta = mouseX - originalMouseX; var updatedPosition = mouseX - navPosition.left; if(updatedPosition > 0 + (handleWidth / 2) && updatedPosition < navWidth - (handleWidth / 2)){ carouselHandle.setStyle({ left: (updatedPosition - handleWidth / 2) + 'px' }); handlePosition.left = updatedPosition; carouselPercent = (handlePosition.left - (handleWidth / 2)) / (navWidth - (handleWidth)); document.fire('lebron:carouselPosition', { percent: carouselPercent, carousel: carouselContainer }); } if(stateLock == false) { pe.stop(); } }, 1/30); }); carouselHandle.observe('touchstart', function(event){ stateLock = true; var originalMouseX = mouseX; carouselNavExecuter = new PeriodicalExecuter(function(pe){ var targetEvent = event.touches.item(0); var mouseDelta = mouseX - originalMouseX; var mouseX = targetEvent.clientX; var updatedPosition = mouseX - navPosition.left; if(updatedPosition > 0 + (handleWidth / 2) && updatedPosition < navWidth - (handleWidth / 2)){ //alert(mouseX); carouselHandle.setStyle({ left: (updatedPosition - handleWidth / 2) + 'px' }); handlePosition.left = updatedPosition; carouselPercent = (handlePosition.left - (handleWidth / 2)) / (navWidth - (handleWidth)); document.fire('lebron:carouselPosition', { percent: carouselPercent, carousel: carouselContainer }); } if(stateLock == false) { pe.stop(); } }, .1); }); carouselNav.observe('touchend', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } var targetEvent = event.touches.item(0); //alert('targetEvent.clientX'); //alert(targetEvent); //alert(targetEvent.clientX); }); carouselHandle.observe('mouseup', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } }); carouselNav.observe('mouseleave', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } }); } else if(carouselContainer.hasClassName('blog') || carouselContainer.hasClassName('landing')){ shareThis(); var carouselEngine = carouselContainer.down('li'); var carouselItems = carouselContainer.select('> li'); carouselEngine.setStyle({ position: 'relative' }); /*carouselContainer.totalHeight = 0; carouselItems.each(function(carouselItem, itemIndex){ if(itemIndex < carouselItems.size() - 1){ carouselContainer.totalHeight = carouselContainer.totalHeight + carouselItem.getHeight(); } });*/ carouselContainer.originalHeight = carouselContainer.getHeight(); carouselContainer.setStyle({ height: 'auto', overflow: 'visible' }); carouselContainer.tempHeight = carouselContainer.getHeight(); carouselContainer.totalHeight = carouselContainer.getHeight() - carouselContainer.originalHeight; carouselContainer.setStyle({ height: '80%', overflow: 'hidden' }); carouselContainer.setStyle({ overflow: 'hidden' }); if(carouselContainer.tempHeight < carouselContainer.originalHeight){ return false; } carouselHandle.observe('mousedown', function(event){ stateLock = true; var originalMouseY = mouseY; carouselNavExecuter = new PeriodicalExecuter(function(pe){ var mouseDelta = mouseY - originalMouseY; var updatedPosition = mouseY - navPosition.top; if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight){ carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); if(carouselContainer.hasClassName('blog')){ document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } else { document.fire('lebron:landingPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselItems }); } } if(stateLock == false) { pe.stop(); } }, 1/30); }); carouselHandle.observe('touchstart', function(event){ stateLock = true; var originalMouseY = mouseY; carouselNavExecuter = new PeriodicalExecuter(function(pe){ var targetEvent = event.touches.item(0); var mouseDelta = mouseY - originalMouseY; var mouseY = targetEvent.clientY; var updatedPosition = mouseY - navPosition.top; if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight - (handleHeight / 2)){ //alert(mouseX); carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); if(carouselContainer.hasClassName('blog')){ document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } else { document.fire('lebron:landingPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselItems }); } } if(stateLock == false) { pe.stop(); } }, .1); }); document.observe('DOMMouseScroll', function(event){ var direction = Event.wheel(event); var updatedPosition = handlePosition.top - (direction * 10); //console.log(updatedPosition); if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight){ carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); if(carouselContainer.hasClassName('blog')){ document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } else { document.fire('lebron:landingPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselItems }); } } //self.scrollBy(0, dir * 20); }); document.observe('mousewheel', function(event){ var direction = Event.wheel(event); var updatedPosition = handlePosition.top - (direction * 10); if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight){ carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); if(carouselContainer.hasClassName('blog')){ document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } else { document.fire('lebron:landingPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselItems }); } } }); carouselNav.observe('touchend', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } var targetEvent = event.touches.item(0); //alert('targetEvent.clientX'); //alert(targetEvent); //alert(targetEvent.clientX); }); carouselHandle.observe('mouseup', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } }); carouselNav.observe('mouseleave', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } }); } var navHeight = carouselNav.getHeight(); }); document.observe('lebron:carouselPosition', function(event){ var percentMove = event.memo.percent; var carousel = event.memo.carousel; percentMove = (percentMove * 100).round(); if(percentMove == 1){ percentMove = 0; } else if(percentMove == 99){ percentMove = 100; } percentMove = percentMove / 100; carousel.setStyle({ marginLeft: -(percentMove * carousel.totalWidth) + 120 + 'px' }); }); document.observe('lebron:blogPosition', function(event){ var percentMove = event.memo.percent; var carousel = event.memo.carousel; var engine = event.memo.engine; percentMove = (percentMove * 100).round(); if(percentMove == 1){ percentMove = 0; } else if(percentMove == 99){ percentMove = 100; } percentMove = percentMove / 100; engine.setStyle({ marginTop: -(percentMove * carousel.totalHeight) + 'px' }); }); document.observe('lebron:landingPosition', function(event){ var percentMove = event.memo.percent; var carousel = event.memo.carousel; var engine = event.memo.engine; percentMove = (percentMove * 100).round(); if(percentMove == 1){ percentMove = 0; } else if(percentMove == 99){ percentMove = 100; } percentMove = percentMove / 100; engine.each(function(element){ element.setStyle({ top: -(percentMove * carousel.totalHeight) + 'px' }); }); }); function createNavCarousel() { var pseudoNav = new Element('ul'); pseudoNav.addClassName('navCarousel'); var navElements = []; navElements[0] = new Element('li'); navElements[0].innerHTML = 'First Element'; navElements[1] = new Element('li'); navElements[1].innerHTML = 'Second Element'; navElements.each(function(navElement){ pseudoNav.insert({ bottom: navElement }); }); articleContainer.insert({ bottom: pseudoNav }); var carouselNav = pseudoNav; var navPosition = carouselNav.viewportOffset(); var carouselHandle = carouselNav.down('li'); var handleWidth = carouselHandle.getWidth(); var handleHeight = carouselHandle.getHeight() + 82; var handlePosition = carouselHandle.positionedOffset(); handlePosition.top = 41; var navWidth = carouselNav.getWidth(); var navHeight = carouselNav.getHeight(); var carouselPercent = handlePosition.left / carouselNav.getWidth(); var carouselContainer = carouselNav.previous('div'); carouselContainer.totalWidth = 0; carouselContainer.originalHeight = carouselContainer.getHeight(); carouselContainer.setStyle({ height: 'auto', overflow: 'visible' }); carouselContainer.totalHeight = carouselContainer.getHeight() - carouselContainer.originalHeight; carouselContainer.setStyle({ height: '80%', overflow: 'hidden' }); if(carouselContainer.totalHeight + 400 < carouselContainer.originalHeight){ carouselHandle.hide(); return false; } var carouselEngine = carouselContainer.down(); carouselHandle.observe('mousedown', function(event){ stateLock = true; var originalMouseY = mouseY; carouselNavExecuter = new PeriodicalExecuter(function(pe){ var mouseDelta = mouseY - originalMouseY; var updatedPosition = mouseY - navPosition.top; if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight){ carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } if(stateLock == false) { pe.stop(); } }, 1/30); }); carouselHandle.observe('touchstart', function(event){ stateLock = true; var originalMouseY = mouseY; carouselNavExecuter = new PeriodicalExecuter(function(pe){ var targetEvent = event.touches.item(0); var mouseDelta = mouseY - originalMouseY; var mouseY = targetEvent.clientY; var updatedPosition = mouseY - navPosition.top; if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight - (handleHeight / 2)){ //alert(mouseX); carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } if(stateLock == false) { pe.stop(); } }, .1); }); document.observe('DOMMouseScroll', function(event){ var direction = Event.wheel(event); var updatedPosition = handlePosition.top - (direction * 10); //console.log(updatedPosition); if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight){ carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } //self.scrollBy(0, dir * 20); }); document.observe('mousewheel', function(event){ var direction = Event.wheel(event); var updatedPosition = handlePosition.top - (direction * 10); if(updatedPosition > 0 + (handleHeight / 2) && updatedPosition < navHeight){ carouselHandle.setStyle({ top: (updatedPosition - handleHeight / 2) + 'px' }); handlePosition.top = updatedPosition; carouselPercent = (handlePosition.top - (handleHeight / 2)) / (navHeight - (handleHeight)); document.fire('lebron:blogPosition', { percent: carouselPercent, carousel: carouselContainer, engine: carouselEngine }); } }); carouselNav.observe('touchend', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } var targetEvent = event.touches.item(0); //alert('targetEvent.clientX'); //alert(targetEvent); //alert(targetEvent.clientX); }); carouselHandle.observe('mouseup', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } }); carouselNav.observe('mouseleave', function(event){ stateLock = false; if(typeof(carouselNavExecuter) != "undefined"){ carouselNavExecuter.stop(); } }); } if(articleContainer.hasClassName('video')){ createNavCarousel(); rateComments(); commentForm(); shareThis(); } else if(articleContainer.hasClassName('statement')){ createNavCarousel(); rateComments(); commentForm(); } else if(articleContainer.hasClassName('quote')){ createNavCarousel(); rateComments(); commentForm(); } else if(articleContainer.hasClassName('audio')){ createNavCarousel(); rateComments(); commentForm(); } else if(articleContainer.hasClassName('image')){ createNavCarousel(); rateComments(); commentForm(); } else if(articleContainer.hasClassName('article')){ createNavCarousel(); rateComments(); commentForm(); shareThis(); } } //Page Initialization function pageInitialize() { Object.extend(Event, { wheel:function (event){ var delta = 0; if (!event) event = window.event; if (event.wheelDelta) { delta = event.wheelDelta/120; if (window.opera) delta = -delta; } else if (event.detail) { delta = -event.detail/3; } return Math.round(delta); //Safari Round } }); var directoryHREF = document.location.href; var contentID = 'main'; var contentContainer = $(contentID); if(!$('hasIE')){ contentContainer.setOpacity(0); } currentX = 0; currentY = 0; var pageViewport = $('viewport'); if($('hasIE')){ carouselHelper(); extendImages($$('img.lightbox')); promotionEntryForm(); } else if(directoryHREF.include('#')){ directoryHREF = document.location.href.sub('/#',''); var ajaxURL = directoryHREF; if(directoryHREF.include('?')){ ajaxURL = directoryHREF + '&output=JSON'; } else { ajaxURL = directoryHREF + '?output=JSON'; } new Ajax.Request(ajaxURL, { method: 'get', requestHeaders: ["Content-Type", "application/json; charset=utf-8"], onSuccess: function(transport) { var updatedContent = transport.responseText.evalJSON(); contentContainer.replace(updatedContent.html); contentContainer = $(contentID); contentContainer.setOpacity(0); var pageClasses = $w(contentContainer.className); pageClasses.each(function(pageClass){ if(pageClass.startsWith('xPos')){ currentX = parseInt(pageClass.sub('xPos', '')); } else if(pageClass.startsWith('yPos')){ currentY = parseInt(pageClass.sub('yPos', '')); } }); contentContainer.morph('opacity: 1',{ duration: 2, transition: 'sinusoidal', after: function(){ //extendLinks(); stateLock = false; }, delay: 0 }); var fontMod = (viewportDimensions.height / 768); if(fontMod > 1){ fontMod = 1; } contentContainer.setStyle({ fontSize: fontMod + 'em' }); document.fire('lebron:extendLinks', { pageLinks: $$('#main a') }); extendImages($$('img.lightbox')); carouselHelper(); promotionEntryForm(); audioFix(); facebookFeed(); twitterFeed(); if(!$('hasIE')){ canvasInitialize(); } return true; }, onFailure: function() { return false; } }); } else { var pageClasses = $w(contentContainer.className); pageClasses.each(function(pageClass){ if(pageClass.startsWith('xPos')){ currentX = parseInt(pageClass.sub('xPos', '')); } else if(pageClass.startsWith('yPos')){ currentY = parseInt(pageClass.sub('yPos', '')); } }); contentContainer.morph('opacity: 1',{ duration: 2, transition: 'sinusoidal', after: function(){ //extendLinks(); stateLock = false; }, delay: 0 }); var fontMod = (viewportDimensions.height / 768); if(fontMod > 1){ fontMod = 1; } contentContainer.setStyle({ fontSize: fontMod + 'em' }); extendImages($$('img.lightbox')); carouselHelper(); promotionEntryForm(); if(!$('hasIE')){ canvasInitialize(); } } } //Line Math //Pass in two points, get things back! function lineEquation(xA, yA, xB, yB){ var m = (yB - yA) / (xB - xA); return m; } //Class: Carousel //Assists in the rotation of Carousel Items //IN DEVELOPMENT - NEED DEBUG ON BALANCE var carousel = Class.create({ initialize: function(container, direction){ //console.log('Initialize Carousel'); //Set DOM Containers //console.log('Set DOM Containers'); this.carouselContainer = container; this.carouselItems = this.carouselContainer.select('> li'); this.carouselContainer.setStyle({ position: 'relative' }); //Set Size Constraints //console.log('Set Size Constraints'); this.size = this.carouselItems.size(); this.currentItem = 0; this.previousItem = this.size; //Set Dimensions & Positioning //console.log('Set Dimensions & Positioning'); this.dimensions = $H(this.carouselContainer.getDimensions()); if(direction == 'vertical'){ this.measure = 'height'; } else { this.measure = 'width'; } //console.log('Carousel Items', this.carouselItems); this.itemDimensions = $H(this.carouselItems[0].getDimensions()); this.lastPosition = 0; var carouselPointer = this; /* this.carouselItems.each(function(carouselItem, index){ console.log('Measurement', carouselPointer.dimensions.get(carouselPointer.measure)); carouselItem.setStyle({ position: 'absolute', top: carouselPointer.lastPosition + 'px' }); carouselPointer.lastPosition = carouselPointer.lastPosition + carouselPointer.itemDimensions.get(carouselPointer.measure); });*/ }, get: function(itemIndex) { return this.carouselItems[itemIndex] }, getChildren: function(){ return this.carouselItems; }, getIndex: function(){ return { currentIndex: this.currentItem, previousIndex: this.previousItem}; }, move: function(itemMove){ this.previousItem = this.currentItem; this.currentItem = (this.size + ((this.currentItem + itemMove) % this.size)) % this.size; //incrementally step up the index return { current: this.get(this.currentItem), previous: this.carouselItems[this.previousItem], currentIndex: this.currentItem, previousIndex: this.previousItem }; }, getCurrentItem: function(){ return { current: this.carouselItems[currentItem], currentIndex: currentItem }; } }); //Extend Images //Creates Image 'Zooming' Feature and Carousel function extendImages(images){ var viewport = $('viewport'); var imageReferences = images; viewportDimensions = document.viewport.getDimensions(); var maxHeight = viewportDimensions.height - 200; var maxWidth = viewportDimensions.width - 200; var overlay = new Element('div'); overlay.addClassName('overlay'); overlay.setStyle({ width: viewportDimensions.width + 'px', height: viewportDimensions.height + 'px' }); viewport.insert({ top: overlay }); overlay.hide(); imageReferences.each(function(imageReference, imageIndex){ imageReference.setStyle({ cursor: 'pointer' }); var imageSource = imageReference.getAttribute('src'); var sourceParts = imageSource.split('?'); //console.log(sourceParts); if(imageReference.up('a')){ return false; } imageReference.observe('click', function(event){ overlay.show(); //console.log(overlay); var previousImage = overlay.down('img'); if(previousImage){ previousImage.remove(); } var previousNav = overlay.down('ul'); if(previousNav){ previousNav.remove(); } var largerImage = new Element('img'); largerImage.src = sourceParts[0] + '?' + 'mw=' + maxWidth + '&' + 'mh=' + maxHeight; overlay.insert({ top: largerImage }); largerImage.setStyle({ position: 'relative', top: '36px' }); if(imageReferences.size() > 0){ //console.log('Producing Image Carousel'); var currentItem = imageIndex; var previousItem = imageReferences.size() - 1; var carouselNavContainer = new Element('ul'); var carouselNavElements = []; carouselNavElements[0] = 'Previous'; carouselNavElements[1] = 'Next'; carouselNavElements[2] = 'Dimmer'; overlay.insert({ top: carouselNavContainer }); //Create the dimming overlay var dimOverlay = new Element('div').addClassName('dimOverlay'); overlay.insert({ top: dimOverlay }); var lightsOn = true; carouselNavElements.each(function(carouselNavElement, navIndex){ var el = new Element('li'); el.innerHTML = carouselNavElement; var navMove = (navIndex * 2) - 1; carouselNavContainer.insert({ bottom: el }); var navButtons = carouselNavContainer.childElements(); if(navIndex == 2){ el.observe('click', function(event){ //Set the dimming overlay's height and width to match the viewport dimOverlay.setStyle({ width: viewportDimensions.width + 'px', height: viewportDimensions.height + 'px', opacity: 0 }); var showDimOverlay = new S2.FX.Morph(dimOverlay, { style: 'opacity: .85', duration: 0.3, before: function(){ lightsOn = false; }, after: function(){ navButtons[2].addClassName('on'); } }); var hideDimOverlay = new S2.FX.Morph(dimOverlay, { style: 'opacity: 0', duration: 0.1, after: function() { navButtons[2].removeClassName('on'); lightsOn = true; } }); //Check to see lights on... //If on, insert the overlay, morph opacity into view if(lightsOn){ showDimOverlay.play(); } else { hideDimOverlay.play(); } event.stop(); }); } else { el.observe('click', function(event){ previousItem = currentItem; currentItem = (imageReferences.size() + ((currentItem + navMove) % imageReferences.size())) % imageReferences.size(); //incrementally step up the index //console.log('Previous Item:', previousItem, 'Current Item:', currentItem); var imageSource = imageReferences[currentItem].getAttribute('src'); var sourceParts = imageSource.split('?'); var currentImage = overlay.down('img'); var nextImage = new Element('img'); nextImage.src = sourceParts[0] + '?' + 'mw=' + maxWidth + '&' + 'mh=' + maxHeight; overlay.insert({ bottom: nextImage }); nextImage.setStyle({ position: 'relative', top: '36px' }); currentImage.remove(); event.stop(); }); } }); overlay.observe('click', function(event){ var dimOverlay = overlay.down('div'); if(!dimOverlay){ overlay.hide(); } else { dimOverlay.remove(); overlay.hide(); } }); } }); }); } //First and Last LI Selector //Note: Prototype Driven function liFirstLast() { var firstLIs = $$('ul > li:first-child'); var lastLIs = $$('ul > li:last-child'); firstLIs.each(function(liFirst) { liFirst.addClassName('first'); }); lastLIs.each(function(liLast) { liLast.addClassName('last'); }); } //External Link Helper //Updates Links with External Relation to //use target="_blank" function externalLinks(){ var links = $$('a[rel=external]'); links.each(function(externalLink){ externalLink.writeAttribute('target', '_blank'); }); } //Input Clear //Clears text inputs on a page on focus //Note: Prototype driven function inputClear() { var textInputs = $$('input[type="text"]'); textInputs.each(function(textInput){ textInput.initialValue = textInput.value; textInput.observe('focus', function(event) { if(textInput.value == textInput.initialValue){ textInput.clear(); } }); textInput.observe('blur', function(event){ if(textInput.value.blank() == true) { textInput.value = textInput.initialValue; } }); }); } function fullScreen(){ var pageViewport = $('viewport'); var pageBackground = $('canvas'); viewportDimensions = document.viewport.getDimensions(); pageViewport.setStyle({ width: viewportDimensions.width + 'px', height: viewportDimensions.height + 'px' }); } // Cookie Functions // Set the cookie function setCookie(name, value, expires, path, domain, secure) { // set time, it's in milliseconds var today = new Date(); today.setTime( today.getTime() ); /* if the expires variable is set, make the correct expires time, the current script below will set it for x number of days, to make it for hours, delete * 24, for minutes, delete * 60 * 24 */ if ( expires ) { expires = expires * 1000 * 60 * 60 * 24; } var expires_date = new Date( today.getTime() + (expires) ); document.cookie = name + "=" +escape( value ) + ( ( expires ) ? ";expires=" + expires_date.toGMTString() : "" ) + ( ( path ) ? ";path=" + path : "" ) + ( ( domain ) ? ";domain=" + domain : "" ) + ( ( secure ) ? ";secure" : "" ); } // Read the cookie function readCookie(name) { var needle = name + "="; var cookieArray = document.cookie.split(';'); for(var i=0;i < cookieArray.length;i++) { var pair = cookieArray[i]; while (pair.charAt(0)==' ') { pair = pair.substring(1, pair.length); } if (pair.indexOf(needle) == 0) { return pair.substring(needle.length, pair.length); } } return null; } function pageReloader() { window.location.reload(true); return true; } function chromeOverlay() { var chromeBox = $('chromeOverlay'); if(!chromeBox){ return false; } //alert(readCookie('chromeAbstain')); if(readCookie('chromeAbstain') == 'true'){ return false; } else { var viewportDim = document.viewport.getDimensions(); chromeBox.setStyle({ display: 'block', left: (viewportDim.width/2 - 250) + 'px' }); var chromeTrigger = chromeBox.down('p.more'); var chromeClose = chromeBox.down('p.footnote').down('a'); var divOverlay = new Element('div'); divOverlay.setStyle({ position: 'absolute', left: '0', width: '100%', height: '100%', backgroundColor: '#444', opacity: .5, zIndex: '30000' }); $('viewport').insert({ top: divOverlay }); chromeTrigger.observe('click', function(event){ chromeBox.hide(); divOverlay.hide(); CFInstall.check({ mode: "overlay", destination: "http://www.lebronjames.com/" }); event.stop(); }); chromeClose.observe('click', function(event){ chromeBox.hide(); divOverlay.hide(); setCookie('chromeAbstain', true); event.stop(); }); } } //Replacement for Window Onload - Loads before images, cross-browser document.observe("dom:loaded", function() { //pageRedirect(); //dynamicShadow('/images/global/shadow.png', 'page-container', 16, 0); liFirstLast(); // Adds classes 'first' and 'last' to respective LIs fullScreen(); //multitouchTest(); //createCanvas(); //drawTattoo(); //navigationAssist(); pointerAssist(); navigationHelper(); pageInitialize(); //inputClear(); signUpForm(); externalLinks(); facebookFeed(); twitterFeed(); //rateCommentThumbsUp(); //rateCommentThumbsDown(); //commentForm(); //promotionEntryForm(); searchForm(); Event.observe(document.onresize ? document : window, "resize", function() { pageReloader(); }); });