/* home.js for DenMat.com */

$(document).ready(function () {
	if (typeof console === 'undefined') {
		// permits short-hand console ? console.log() : 0; construction
		console = null;
	}
	
	function installBubbleManagement () {
		var	nBubbles,
			nLeftMost = 1,			/* should this be derived? */
			nBubbleWidth = 100,		/* could be derived */
			nMaxBubblesUp = 7;		/* could be derived */

		function inflateBubbleNav (event) {
			// expected source element: the blue ball img within the li.ocmsCarouselItem
			var $this = $(this),
				$li = $(this).parents("li.ocmsCarouselItem");
				
			if ($li.offset().left - $bubbles.offset().left > $bubbles.width() * 0.55) {
				$li.addClass("right");
			} else {
				$li.removeClass("right");
			}
			
			$li.data("popStart", event.timeStamp);
			$this.animate({"margin-top": 145, "width": "85px", "height": "85px"}, 400);
			$li.find(".speechBubble").fadIn("fast");
		}	// inflateBubbleNav
		
		function burstBubbleNav (event) {
			// expected source element: the li.ocmsCarouselItem that holds the blue ball img
			var $this = $(this);
			var resetDuration = 400;
			var popElapsed = event.timeStamp - $this.data("popStart");
			
			// don't do full pop animation if bursting before complete inflation
			if (popElapsed < 250) {
				//resetDuration = popElapsed > 80 ? popElapsed : 80;
				$this.find("img").stop(true, true);
				$this.find(".speechBubble").fadOut(50);
			} else {
				$this.find(".speechBubble").fadOut(70);	// must not be too great, else false bouncing!
			}
			$this.find("img").animate({"margin-top": 190, "width": "60px", "height": "60px"}, resetDuration);
		}	// burstBubbleNav
	
		function prepareBubble (nBubble) {
			var $this= $(this);
			// OCMS leaves each li.ocmsCarouselItem containing:
			//	span > 
			//		a > img
			//		p (optional, but shouldn't be for us)
			// we want to replace the p with
			//	<div class="speechBubble">
			//		<h4>...</h4>
			//		<p>...</p>
			//	</div>
			// where the h4 contents comes from the first bit of text enclosed by {} in the original p
			var sb = "<div class='speechBubble'><div><h4>{1}</h4><p>{2}</p></div><div></div></div>";
			var $sbText = $this.find("p"),
				bubbleText,
				sbHeight;
				
			if ($sbText.length) {
				var bubbleText = /\{(.+)\}\s*(.+)/.exec($sbText.text());
				if (bubbleText) {
					sb = sb.supplant(bubbleText);
					$sbText.replaceWith(sb);
				}
			}
			
			sbHeight = $this.find(".speechBubble").height();
			$this.find(".speechBubble").css("bottom",  sbHeight + 75 + "px");
			
	//		$this.hover(inflateBubbleNav, burstBubbleNav);
			$this.find("img").mouseenter(inflateBubbleNav);
			$this.mouseleave(burstBubbleNav);
		}	// prepareBubble
				
		function updateScrollButtons () {
			if (nLeftMost > 1) {
				$("#bubblesLeft").removeClass("disabled");
			} else {
				$("#bubblesLeft").addClass("disabled");
			}
	
			// is the right edge of the last li > the right edge of the container?
			if (nLeftMost + nMaxBubblesUp - 1 < nBubbles) {
				$("#bubblesRight").removeClass("disabled");
			} else {
				$("#bubblesRight").addClass("disabled");				
			}
		}	// updateScrollButtons
		
		function scrollBubbles (evt) {
			evt = evt || window.event;
	
			var scrollDelta,
				leftNow = null,
				$but = $(evt.currentTarget);
			
			if (!$but.hasClass("disabled")) {
				leftNow = $bubbles.scrollLeft();
	
				if (evt.currentTarget.getAttribute("id") === "bubblesLeft") {
					scrollDelta = -(Math.min(nMaxBubblesUp, nLeftMost - 1));
				} else {
					// note: nBubbles and nMaxBubblesUp aren't going to change during page lifetime
					scrollDelta = Math.min(nMaxBubblesUp, nBubbles - nMaxBubblesUp + nLeftMost - 1);
				}
				$bubbles.animate({scrollLeft: leftNow + (scrollDelta * nBubbleWidth)}, 400, "swing", updateScrollButtons);
				nLeftMost = nLeftMost + scrollDelta;
			}		
		}	// scrollBubbles


		function _init () {
			// more to do here wrt # of bubbles
			var $allBubbles = $bubbles.find(".ocmsCarouselItem");
			nBubbles = $allBubbles.length;

			// move carousel 'description' into speech bubble markup
			$allBubbles.each(prepareBubble);

			$bnArrows.data('show', false);
			if (nBubbles > nMaxBubblesUp) {
				$bnArrows.show().data('show', true).click(scrollBubbles);
				$('.ocmsCarousel', $bubbles).css("width", nBubbles * nBubbleWidth + "px");

				// establish initial scroll button enablement settings
				updateScrollButtons();
			} else {
				if (!OCMS.inPageEditor) {							
					// manually centre div#bubbles on page to adjust for its different widths
					$bubbles.css("margin-left", ($("#bubbleNav").width() - (nBubbles * nBubbleWidth)) / 2);
					console ? console.info('$bubbles.css("margin-left") <= %d | (%d - (%d * %d)) / 2)',
							$bubbles.css("margin-left"),
							$("#bubbleNav").width(), nBubbles, nBubbleWidth) : 0;

					$bubbles.css("width", nBubbles * nBubbleWidth);
				}
			}
		}	// _init
	
	
		/* --- begin installBubbleManagement() --- */
		_init();

		return;
	}	// installBubbleManagement
		
	/* --- begin $().ready() --- */
	
	var bIsLocal = (location.href.indexOf("local") >= 0 || location.href.indexOf("file:") === 0);

	// these convenience variables will be used by a couple of functions within this closure
	var $bubbles = $("#bubbles"),
		$bnArrows = $('.bnArrow'),
	    $mainNav = $("#main-nav");
	
	OCMS.addAuthorClasses();
	OCMS.addBrowserClasses();	/* we just need to flag IE7 and that's done by default */
		
	installBubbleManagement();

	var splash = OCMS.slideShow({
		selector: '#splashCarousel .ocmsCarouselItem'
		,slideDuration: 8000
//		,autoStart: !bIsLocal
	});

	// create multiple lists (for side-by-side placement) from 
	//	- the main nav's sub-menu, for our large menu sheets
	//	- the products, procedures, and manage account menus in the bottom nav area
	OCMS.listSplitter("#main-nav .level-1-list, #bnTable ul");

	// now that these are safely wrapped in a new, hidden container, show the large menu sheets
	// (each of which was initially hidden so they wouldn't show while the page was loading)
	$mainNav.find(".level-1-list").show();
	
	$("#bubbles li.ocmsCarouselItem").click(function (evt) {
		if (evt.target.tagName.toLowerCase() === 'li') {
			var $bannerImg = $('#splashCarousel li.ocmsCarouselItem img:visible');
			var link = $bannerImg.parent().attr('href');
			if (link.length > 0) {
				window.location.href = link;
			}
		}
	});

/*	if (bIsLocal) {
		splash.next();
		$("#hdr-worldMap").click(splash.pause);
		$("#hdr-callUs").click(splash.resume);
		$("#hdr-dmlogo img").click(splash.next);
	}
*/
});