function synTabHandler(container) { var handler = this, chosenClass = "chosen", hiddenTabClass = "hiddenTab"; this.container = $(container); this.contents = this.container.find(".synTabContents").children().filter("*").addClass("synTabContent"); this.tabs = this.container.find(".synTabs").children().filter("*").addClass("synTab").click(function() { var tabIndex = handler.tabs.index(this); $(handler.tabs.removeClass(chosenClass)[tabIndex]).addClass(chosenClass); $(handler.contents.addClass(hiddenTabClass).hide()[tabIndex]).show().removeClass(hiddenTabClass) }); this.tabs.find("a").click(function(event) { event.preventDefault() }); if (this.tabs.length > 0) $(this.tabs[0]).click() } $(document).ready(function() { window.synTabs = $(".synTabbed").map(function() { return new synTabHandler(this) }).get() }); $(document).ready(function() { if (!window.hs) return; hs.outlineType = 'bagIt'; function showValues(container, item, keys) { var empty = [], isNotEmpty = /[\w\d]/, isHTML = /</; for (var i = 0, key; key = keys[i]; i++) { var target = container.find("." + key), value = item[key], valueTarget = target.find(".value"); if (!value || !isNotEmpty.test(value)) { target.hide(); empty.push(key); continue } if (value instanceof Array && (key === "price" || key === "salePrice")) { var str = "$" + value[0].toFixed(2); for (var j = 0, quantity, price; (quantity = value[++j]) && (price = value[++j]); ) str += ", " + quantity + " for $" + price.toFixed(2); value = str } if (valueTarget.length > 0) { if (isHTML.test(value)) { valueTarget.html(value) } else { valueTarget.text(value) } } else { if (isHTML.test(value)) { target.html(value) } else { target.text(value) } } target.not(".hiddenTab").show() } return empty } var hoverTarget, popup = $(".bagItPopup"), clones = [], button = $("#bagItButton"), buttonWidth = button.width(), buttonHeight = button.height(); if (button.is("img")) { var image = $(document.createElement("div")).css({ width: buttonWidth, height: buttonHeight, position: "relative" }), replacement = $(document.createElement("span")).attr({ id: button.attr("id"), className: button.attr("class") }).css({ display: "inline-block", width: buttonWidth, height: buttonHeight = buttonHeight / 2, overflow: "hidden" }); if ($.browser.msie && parseInt($.browser.version) <= 6 && /png$/i.test(button.attr("src"))) { image.css("filter", "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + button.attr("src") + "', sizingMethod='crop')") } else { image.css("background", "url(" + button.attr("src") + ")") } button.filter("#bagItButton[src$='png']").replaceWith(replacement.append(image)); button = $("#bagItButton").mouseover(function(event) { image.css("top", -buttonHeight) }).mouseout(function(event) { image.css("top", 0) }) } button.click(function() { button.hide(); var clickTarget = $(hoverTarget), itemId = clickTarget.attr("item"); if (!itemId) { var href = clickTarget.parents("a").attr("href"); if (href) { itemId = href.match(/([^\/\.]*)(\.html?)?$/); if (itemId) { itemId = itemId[1] } else { return } } } var item = window.paging && paging.items ? paging.items[itemId] : {} || {}, popupId = "bagItPopup-" + clones.length, clone = popup.clone().attr("id", popupId), values = ["name", "price", "salePrice", "description", "ingredients", "availability"], emptyValues = null, isXhrLoaded = false, isImageLoaded = false, showHighslideTimeout = null; clones.push(clone[0]); document.body.appendChild(clone[0]); clone.find("a.highslide-close, .highslide-close a").click(function(event) { event.preventDefault(); hs.close(this) }); if (window.synTabHandler) { var tabs = clone.find(".synTabbed").map(function() { return new synTabHandler(this) }).get(); if (tabs.length > 0) window.synTabs = window.synTabs.concat(tabs) } clone.find("a.viewMore").attr("href", "#").click(function() { location.href = itemId + ".html"; return false }); var form = clone.find("form[action*='//order.store.yahoo.net/cgi-bin/wg-order']").append($(document.createElement("input")).attr({ type: "hidden", name: "vwitem", value: itemId })); if (window.synFloatingCart && synFloatingCart.formHandler) { synFloatingCart.formHandler(form); form.submit(function() { $(window).one("synFloatingCart", function() { var expander = hs.getExpander(form[0]); if (expander) { var duration = hs.restoreDuration, steps = hs.restoreSteps, cartDisplay = $(".synFloatingCart"), position = cartDisplay.position(), size = { width: cartDisplay.width(), height: cartDisplay.height() }; if (position) { if (expander.thumbLeft) { expander.thumbLeft = position.left; expander.thumbTop = position.top; expander.thumbWidth = size.width; expander.thumbHeight = size.height; hs.restoreSteps = 20 } else if (expander.x) { expander.x.tpos = position.left; expander.y.tpos = position.top; expander.x.t = size.width; expander.y.t = size.height } hs.restoreDuration = 500 } expander.close(); hs.restoreDuration = duration; if (steps) { hs.restoreSteps = steps } } }) }) } function showHighslide(force) { if ((isXhrLoaded && isImageLoaded) || force) { clearTimeout(showHighslideTimeout); $(".highslide-loading").css("top", -9999); hs.htmlExpand(hoverTarget, { contentId: popupId }) } else { showHighslideTimeout = setTimeout(function() { showHighslide(true) }, 30000) } } emptyValues = showValues(clone, item, values); $.get(location.protocol + "//" + location.hostname + location.pathname.replace(/(\/[^\/]*)?$/, "/") + itemId + ".html", null, function(data) { var html = data, jsonMarker = "<!--bagIt-json-start-->", jsonStart = data.indexOf(jsonMarker), jsonEnd = data.indexOf("<!--bagIt-json-end-->"), json = (!(jsonStart < 0 || jsonEnd < 0)) ? data.substring(jsonStart + jsonMarker.length, jsonEnd) : null; try { if (json && (json = (window.JSON ? JSON.parse(json[1]) : eval("(" + json[1] + ")")))) { for (i in json) { if (item[i]) emptyValues.push(i); item[i] = json[i] } } } catch (err) { if (window.console) console.log(err) } emptyValues.unshift("json"); var valueKeys = data.match(/<!--bagIt-[^-]*(?=-start-->)/g); if (valueKeys) { for (var i = 0, valueKey; valueKey = valueKeys[i]; i++) { valueKey = valueKey.substring("<!--bagIt-".length); if ($.inArray(valueKey, emptyValues) < 0) emptyValues.push(valueKey) } } emptyValues.shift(); $.each(emptyValues, function(key, value) { if (!item[value]) { var data = html, marker = "<!--bagIt-" + value + "-start-->", start = html.indexOf(marker), end = html.indexOf("<!--bagIt-" + value + "-end-->"); if (!(start < 0 || end < 0)) { item[value] = html.substring(start + marker.length, end) } } }); if (item.abstract) { var input = $(document.createElement("input")).attr({ name: "package", value: item.abstract, type: "hidden" }).get(0); input.value = item.abstract; clone.find("form").append(input) } showValues(clone, item, emptyValues); clone.css({ position: "absolute", left: "-3333em", display: "block" }).find(".synTabbed").each(function() { var tabContainer = $(this), maxHeight = 0; tabContainer.find(".synTabContent").each(function() { var contents = $(this), height = Math.max(contents.toggle().outerHeight(), contents.toggle().outerHeight()); maxHeight = Math.max(maxHeight, height) }); tabContainer.find(".synTabContents").css("height", maxHeight) }).end().css({ left: 0 }); isXhrLoaded = true; showHighslide() }); var loadingAnimation = $(".highslide-loading"), clickTargetPosition = clickTarget.offset(); loadingAnimation.css({ left: clickTargetPosition.left + ((clickTarget.width() - loadingAnimation.outerWidth()) / 2), top: clickTargetPosition.top + ((clickTarget.height() - loadingAnimation.outerHeight()) / 2) }); var enlargedImage = $(document.createElement("img")); enlargedImage.load(function() { var existingImage = clone.find(".image img"); if (existingImage.length === 0) { clone.find(".image").empty().append(enlargedImage) } else { existingImage.attr({ src: enlargedImage.attr("src"), width: enlargedImage.attr("width"), height: enlargedImage.attr("height"), alt: enlargedImage.attr("alt") }) } isImageLoaded = true; showHighslide() }).attr({ src: clickTarget.attr("lrgsrc") || clickTarget.attr("src"), alt: item.name }) }); $(".bagIt img").mouseover(function() { var image = $(this), position = image.offset(); button.css({ left: position.left + ((image.width() - buttonWidth) / 2), top: position.top + ((image.height() - buttonHeight) / 2) }).show(); hoverTarget = this }).mouseout(function(e) { try { if (e.relatedTarget && !(e.relatedTarget === button[0] || e.relatedTarget.parentNode === button[0])) { button.hide() } } catch (err) { if (window.console) console.log(err) } }) });