var oCurrTab = null; var aSectionURLs = new Array("content/content_productoverview.html", "content/content_productcolors.html", "content/content_productassortment.html", "content/content_productgreen.html", "content/content_warranty.html","content/content_innovation.html"); var arr_sections = ["Product_Overview", "Product_Colors", "Product_Assortment", "Green", "Warranty", "Innovation"]; var aSectionTabs = new Array("btnTabOverview","btnTabColors","btnTabAssortment","btnTabGreen","btnTabWarranty","btnTabInnovation"); var iPopupInterval; var oShowColor; var iTopPos; var iLeftPos; var iBrowserWidth; var iBrowserHeight; var aAtmosphereColors = new Array(); aAtmosphereColors.push(new ColorObject("Distant Star","#F1EEEA","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA004")); aAtmosphereColors.push(new ColorObject("True North","#E4E0D9","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA016")); aAtmosphereColors.push(new ColorObject("Tomorrow's Daybreak","#ECE4DC","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA002")); aAtmosphereColors.push(new ColorObject("Poetic Light","#EEEAE5","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA003")); aAtmosphereColors.push(new ColorObject("Radiant Sun","#EFE4C4","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA007")); aAtmosphereColors.push(new ColorObject("Ray of Hope","#F3EDCD","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA008")); aAtmosphereColors.push(new ColorObject("Spring Season","#EEEFEA","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA010")); aAtmosphereColors.push(new ColorObject("Captured Moment","#E7E6D3","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA009")); aAtmosphereColors.push(new ColorObject("Still Moment","#E0E5E7","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA018")); aAtmosphereColors.push(new ColorObject("Dew Point","#EAEEEF","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA017")); aAtmosphereColors.push(new ColorObject("Eternal Light","#ECEBEF","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA020")); aAtmosphereColors.push(new ColorObject("Heaven's Wind","#E1E1EA","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA019")); aAtmosphereColors.push(new ColorObject("New Day","#EEE1E5","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","FA001")); aAtmosphereColors.push(new ColorObject("Bright White","#FFFFFF","Sky colors, inspired by billowing clouds and clean breezes. Give your space breathing room with these airy shades.","#333333","images/picAtmosphereCollection.gif","Ready-Mix")); // var aBotanicalColors = new Array(); aBotanicalColors.push(new ColorObject("Ancient Rosewood","#8B5C61","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#FFFFFF","images/picBotanicalCollection.gif","FA015")); aBotanicalColors.push(new ColorObject("Rhythm of Red","#AC6C62","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#FFFFFF","images/picBotanicalCollection.gif","FA005")); aBotanicalColors.push(new ColorObject("Evening Peruvian Lily","#B96D42","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#FFFFFF","images/picBotanicalCollection.gif","FA006")); aBotanicalColors.push(new ColorObject("Earthenware","#9F795B","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#FFFFFF","images/picBotanicalCollection.gif","FA014")); aBotanicalColors.push(new ColorObject("Ginger Palm","#CEA63E","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA021")); aBotanicalColors.push(new ColorObject("Natural Ginger Root","#D4B87B","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA013")); aBotanicalColors.push(new ColorObject("Perennial Gold","#DEC463","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA022")); aBotanicalColors.push(new ColorObject("Butterfly Wing","#E1CD7C","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA012")); aBotanicalColors.push(new ColorObject("Delightful Daffodil","#F2E09A","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA011")); aBotanicalColors.push(new ColorObject("Northern Pear Tree","#D4D5B3","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA024")); aBotanicalColors.push(new ColorObject("Afternoon Shade","#D9E0D0","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA023")); aBotanicalColors.push(new ColorObject("Roof Top Garden","#A6AC8B","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA025")); aBotanicalColors.push(new ColorObject("Healing Waters","#C8D6DC","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA028")); aBotanicalColors.push(new ColorObject("Mountain Forget-Me-Not","#DADCEB","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA026")); aBotanicalColors.push(new ColorObject("Endless Rain","#CAD0DD","Inspired by nature's lush beauty, from subtle woodland shadows to a splash of brilliant blooms. These colors invite and calm the senses.","#333333","images/picBotanicalCollection.gif","FA027")); // var aEarthColors = new Array(); aEarthColors.push(new ColorObject("Solemn Stone","#EFF0F1","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#333333","images/picEarthCollection.gif","FA035")); aEarthColors.push(new ColorObject("Naturalist Gray","#E8E8E8","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#333333","images/picEarthCollection.gif","FA034")); aEarthColors.push(new ColorObject("Nightfall","#D5D9E0","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#333333","images/picEarthCollection.gif","FA061")); aEarthColors.push(new ColorObject("Slate Rock","#5C626C","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA062")); aEarthColors.push(new ColorObject("Organic Garden","#99A29E","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA064")); aEarthColors.push(new ColorObject("Joshua Tree","#5E6861","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA063")); aEarthColors.push(new ColorObject("Pinecone Hill","#93845B","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA052")); aEarthColors.push(new ColorObject("Of the Earth","#BAB291","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA053")); aEarthColors.push(new ColorObject("Natural Wilderness","#897F66","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA065")); aEarthColors.push(new ColorObject("Shaded Path","#D8D1AB","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#333333","images/picEarthCollection.gif","FA051")); aEarthColors.push(new ColorObject("Wave of Grain","#E7E0C0","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#333333","images/picEarthCollection.gif","FA041")); aEarthColors.push(new ColorObject("Sacred Soil","#79684E","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA055")); aEarthColors.push(new ColorObject("Aviary Nest","#BEA06D","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA042")); aEarthColors.push(new ColorObject("Canyon Pebble","#B9A88B","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA054")); aEarthColors.push(new ColorObject("Serene Journey","#DBCEC9","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#333333","images/picEarthCollection.gif","FA043")); aEarthColors.push(new ColorObject("Discovered Ground","#A08A7D","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA044")); aEarthColors.push(new ColorObject("Wildwood Trail","#635048","For beautiful, grounded interiors. Deep, earthy colors lend a room quiet comfort and stylish sophistication.","#FFFFFF","images/picEarthCollection.gif","FA045")); // var aWaterscapesColors = new Array(); aWaterscapesColors.push(new ColorObject("Midsummer Gold","#AC9359","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#FFFFFF","images/picWaterscapeCollection.gif","FA039")); aWaterscapesColors.push(new ColorObject("Terrarium","#C1BC97","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA040")); aWaterscapesColors.push(new ColorObject("Distant Shore","#DCD6B9","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA033")); aWaterscapesColors.push(new ColorObject("Arbor Vine","#C8CDB3","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA046")); aWaterscapesColors.push(new ColorObject("Hidden Sea Glass","#E6E7D0","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA047")); aWaterscapesColors.push(new ColorObject("Tranquil Pond","#E2E6E3","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA056")); aWaterscapesColors.push(new ColorObject("Treasured Jade","#8F9C95","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#FFFFFF","images/picWaterscapeCollection.gif","FA057")); aWaterscapesColors.push(new ColorObject("Summer Dragonfly","#B2CBCB","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#FFFFFF","images/picWaterscapeCollection.gif","FA049")); aWaterscapesColors.push(new ColorObject("Midwest Spring","#D3E4E4","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA048")); aWaterscapesColors.push(new ColorObject("Charted Voyage","#7598A7","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#FFFFFF","images/picWaterscapeCollection.gif","FA050")); aWaterscapesColors.push(new ColorObject("Rushing Stream","#E0E5F0","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA058")); aWaterscapesColors.push(new ColorObject("Winding River","#C2CDE7","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA059")); aWaterscapesColors.push(new ColorObject("Beckoning Sea","#363A67","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#FFFFFF","images/picWaterscapeCollection.gif","FA060")); aWaterscapesColors.push(new ColorObject("Beach Pearl","#EFEDE9","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA036")); aWaterscapesColors.push(new ColorObject("Slender Reed","#DACA98","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA038")); aWaterscapesColors.push(new ColorObject("Smooth Driftwood","#F2E7C8","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA032")); aWaterscapesColors.push(new ColorObject("Honey Sand","#EFDFB0","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA037")); aWaterscapesColors.push(new ColorObject("Dewberry Peach","#F0D8B0","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA031")); aWaterscapesColors.push(new ColorObject("Apricot Seashell","#E3B280","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA030")); aWaterscapesColors.push(new ColorObject("Pink Reef","#E8CCDB","Luminous shades of water, weathered glass and a sail capturing the sun's last rays. Clean, clear and soothing to the spirit.","#333333","images/picWaterscapeCollection.gif","FA029")); var aCollections = new Array(aAtmosphereColors,aBotanicalColors,aEarthColors,aWaterscapesColors); function ColorObject(title, color, content, txtcolor, collectionimg, colnumber) { this.title = title; this.color = color; this.content = content; this.txtcolor = txtcolor; this.collectionimg = collectionimg; this.colnumber = colnumber; } function selectTab(o) { unselectTab(); oCurrTab = o; highlightTab(o,"#D9C6B9"); } function unselectTab() { try { if (oCurrTab != null) { highlightTab(oCurrTab,"#FDFCFB"); oCurrTab = null; } } catch(e) { // do nothing } } function rollTab(o) { if (o != oCurrTab) { highlightTab(o,"#D9C6B9"); } } function rollOutTab(o) { if (o != oCurrTab) { highlightTab(o,"#FDFCFB"); } } function highlightTab(o,sColor) { var aElements = getElementsByClassName("sb-inner", "*", o); for (var i = 0; i < aElements.length; i++) { aElements[i].style.backgroundColor = sColor; } } function getElementsByClassName(className, tag, elm){ var testClass = new RegExp("(^|\\\\s)" + className + "(\\\\s|$)"); var tag = tag || "*"; var elm = elm || document; var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag); var returnElements = []; var current; var length = elements.length; for(var i=0; i=0 && iIndex < aSectionURLs.length) { hideSection(); selectTab($(aSectionTabs[iIndex])); var url = aSectionURLs[iIndex]; var fn; if (iIndex == 1) { fn = changeColorSectionSC; } else if (iIndex == 3) { fn = changeGreenSectionSC; } else { fn = changeSectionSC; } var myAjax = new Ajax.Request(url,{asynchronous:true, method:'get',onSuccess:fn, onFailure:errFunc}); } } function hideSection() { $("ajaxLoading").style.display = "block"; $("cntContentProduct").style.display = "none"; hideFeatures(); hideColorPopup(); } function showSection() { $("ajaxLoading").style.display = "none"; $("cntContentProduct").style.display = "block"; } function changeSectionSC(t) { $("cntContentProduct").innerHTML = t.responseText; showSection(); } function changeGreenSectionSC(t) { changeSectionSC(t); showFeatures(); } function changeColorSectionSC(t) { $("cntContentProduct").innerHTML = t.responseText; populateColors(); showSection(); } function populateColorsFS() { for (var i = 0; i < aAtmosphereColors.length; i++) { addColorElementFS("cntColorsAtmosphere",0,i,aAtmosphereColors[i].color); } for (var j = 0; j < aBotanicalColors.length; j++) { addColorElementFS("cntColorsBotanical",1,j,aBotanicalColors[j].color); } for (var k = 0; k < aEarthColors.length; k++) { addColorElementFS("cntColorsEarth",2,k,aEarthColors[k].color); } for (var l = 0; l < aWaterscapesColors.length; l++) { addColorElementFS("cntColorsWaterscape",3,l,aWaterscapesColors[l].color); } } function addColorElementFS(sGroup,iGroup,iSwatch,sColor) { var cnt = $(sGroup); var o = document.createElement('div'); o.setAttribute('id',"c_"+iGroup.toString()+"_"+iSwatch.toString()); if (o.addEventListener) { //o.addEventListener ("click",showPopupColorIE,false); } else if (o.attachEvent) { //o.attachEvent ("onclick",showPopupColorIE); } else { //o.onclick = function() { showColorPopup(getColorObject(iGroup,iSwatch)) }; } o.style.backgroundColor = sColor; cnt.appendChild(o); } function populateColors() { for (var i = 0; i < aAtmosphereColors.length; i++) { addColorElement("cntColorsAtmosphere",0,i,aAtmosphereColors[i].color); } for (var j = 0; j < aBotanicalColors.length; j++) { addColorElement("cntColorsBotanical",1,j,aBotanicalColors[j].color); } for (var k = 0; k < aEarthColors.length; k++) { addColorElement("cntColorsEarth",2,k,aEarthColors[k].color); } for (var l = 0; l < aWaterscapesColors.length; l++) { addColorElement("cntColorsWaterscape",3,l,aWaterscapesColors[l].color); } } function addColorElement(sGroup,iGroup,iSwatch,sColor) { var cnt = $(sGroup); var o = document.createElement('div'); o.setAttribute('id',"c_"+iGroup.toString()+"_"+iSwatch.toString()); if (o.addEventListener) { o.addEventListener ("mouseover",showPopupColorIE,false); o.addEventListener ("mouseout",startHideTimer,false); o.addEventListener ("click",showPopupColorIE,false); } else if (o.attachEvent) { o.attachEvent ("onmouseover",showPopupColorIE); o.attachEvent ("onmouseout",startHideTimer); o.attachEvent ("onclick",showPopupColorIE); } else { o.onmouseover = function() { startShowTimer(iGroup,iSwatch) }; o.onmouseout = startHideTimer; o.onclick = function() { showColorPopup(getColorObject(iGroup,iSwatch)) }; } o.style.backgroundColor = sColor; cnt.appendChild(o); } function updateBrowserWidthHeight() { if( typeof( window.innerWidth ) == 'number' ) { //Non-IE iBrowserWidth = window.innerWidth; iBrowserHeight = window.innerHeight; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { //IE 6+ in 'standards compliant mode' iBrowserWidth = document.documentElement.clientWidth; iBrowserHeight = document.documentElement.clientHeight; } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) { //IE 4 compatible iBrowserWidth = document.body.clientWidth; iBrowserHeight = document.body.clientHeight; } } function showPopupColorIE(evt) { clearShowInterval(); updateBrowserWidthHeight(); var iPopupWidth = 400; var e_out = (typeof window.event!="undefined") ? event.srcElement.id : evt.target.id; var a = e_out.split("_"); var pos = getRelativeCoordinates(evt, $("cntProductPage")); if (!window.opera && typeof evt.offsetX != 'undefined') { iTopPos = pos.y-150; iLeftPos = pos.x-100; } else { iTopPos = pos.y-160; iLeftPos = pos.x-160; } if (iLeftPos < 10) { iLeftPos = 10; } else if ((iLeftPos + iPopupWidth) > (iBrowserWidth - 10)) { iLeftPos = iBrowserWidth - iPopupWidth - 10; } startShowTimer(getColorObject(a[1],a[2])); } function getColorObject(iGroup,iSwatch) { try { var o = aCollections[iGroup][iSwatch]; return o; } catch(e) { alert(e); return null; } } function startShowTimer(oColor,iLeft,iTop) { clearShowInterval(); if (oColor != null) { oShowColor = oColor; iPopupInterval = setInterval(showColorPopup,600,oColor); } } function startHideTimer() { clearShowInterval(); iPopupInterval = setInterval(hideColorPopup,600); } function showColorPopup(oColor) { var o; if (oColor) { o = oColor; } else { o = oShowColor; } clearShowInterval(); hideColorPopup(); $("cntColorDetail").style.left = iLeftPos +'px'; $("cntColorDetail").style.top = iTopPos +'px'; $("cntColorDetail").style.display = "block"; $("txtColorName").style.color = o.txtcolor; $("txtColorName").innerHTML = o.title; $("txtColorNumber").style.color = o.txtcolor; $("txtColorNumber").innerHTML = o.colnumber; $("cntColor").style.backgroundColor = o.color; $("picCollection").src = o.collectionimg; $("txtCollection").innerHTML = o.content; } function hideColorPopup() { clearShowInterval(); $("cntColorDetail").style.display = "none"; oShowColor = null; } function showPopup(iIndex) { clearShowInterval(); var sContent,oImage; switch (iIndex) { case 1: sContent = "Label is made from 75% recycled fiber content and printed with soy ink."; oImage = $("Feature2"); break; case 2: sContent = "Chips and brochures are made from recycled materials and can also be recycled."; oImage = $("Feature3"); break default: sContent = "Can is made from 100% recycled material and can be recycled."; oImage = $("Feature1"); break; } $("cntPopupDetails").innerHTML = sContent; var o = getAbsolutePosition(oImage); $("cntPopup").style.left = (o.x+40)+"px"; $("cntPopup").style.top = o.y+"px"; $("cntPopup").style.display = "block"; } function startHidePopupTimer() { clearShowInterval(); iPopupInterval = setInterval(hidePopup,600); } function hidePopup() { clearShowInterval(); $("cntPopup").style.display = "none"; } function clearShowInterval() { clearInterval(iPopupInterval); } /** * Retrieve the coordinates of the given event relative to the center of the widget. * * @param event * A mouse-related DOM event. * @param reference * A DOM element whose position we want to transform the mouse coordinates to. * @return * A hash containing keys 'x' and 'y'. */ function getRelativeCoordinates(event, reference) { var x, y; event = event || window.event; var el = event.target || event.srcElement; if (!window.opera && typeof event.offsetX != 'undefined') { // Use offset coordinates and find common offsetParent var pos = { x: event.offsetX, y: event.offsetY }; // Send the coordinates upwards through the offsetParent chain. var e = el; while (e) { e.mouseX = pos.x; e.mouseY = pos.y; pos.x += e.offsetLeft; pos.y += e.offsetTop; e = e.offsetParent; } // Look for the coordinates starting from the reference element. var e = reference; var offset = { x: 0, y: 0 } while (e) { if (typeof e.mouseX != 'undefined') { x = e.mouseX - offset.x; y = e.mouseY - offset.y; break; } offset.x += e.offsetLeft; offset.y += e.offsetTop; e = e.offsetParent; } // Reset stored coordinates e = el; while (e) { e.mouseX = undefined; e.mouseY = undefined; e = e.offsetParent; } } else { // Use absolute coordinates var pos = getAbsolutePosition(reference); x = event.pageX - pos.x; y = event.pageY - pos.y; } // Subtract distance to middle return { x: x, y: y }; } /** * Retrieve the absolute coordinates of an element. * * @param element * A DOM element. * @return * A hash containing keys 'x' and 'y'. */ function getAbsolutePosition(element) { var r = { x: element.offsetLeft, y: element.offsetTop }; if (element.offsetParent) { var tmp = getAbsolutePosition(element.offsetParent); r.x += tmp.x; r.y += tmp.y; } return r; }; function showFeatures() { $("cntFeatures").style.display = "block"; } function hideFeatures() { $("cntFeatures").style.display = "none"; } var sCurrSheen = null; function showSheen(sSheen) { if (sSheen != sCurrSheen) { try { if (sCurrSheen != null) { $("cntSheen"+sCurrSheen).style.display = "none"; $("btnSheen"+sCurrSheen).src = "images/picSheen"+sCurrSheen+".gif"; } $("cntSheen"+sSheen).style.display = "block"; sCurrSheen = sSheen; } catch(e) { // do nothing } } } function rollOutSheen(sSheen) { if (sSheen != sCurrSheen) { try { $("btnSheen"+sSheen).src = "images/picSheen"+sSheen+".gif"; } catch(e) { // do nothing } } } function rollOverSheen(sSheen) { if (sSheen != sCurrSheen) { try { $("btnSheen"+sSheen).src = "images/picSheen"+sSheen+"_x.gif"; } catch(e) { // do nothing } } } var sCurrProd = null; function showProd(sProd) { if (sProd != sCurrProd) { try { if (sCurrProd != null) { $("cntProd"+sCurrProd).style.display = "none"; $("btnProd"+sCurrProd).src = "images/picProdAssort_"+sCurrProd+".gif"; } $("cntProd"+sProd).style.display = "block"; sCurrProd = sProd; } catch(e) { // do nothing } } } function rollOutProd(sProd) { if (sProd != sCurrProd) { try { $("btnProd"+sProd).src = "images/picProdAssort_"+sProd+".gif"; } catch(e) { // do nothing } } } function rollOverProd(sProd) { if (sProd != sCurrProd) { try { $("btnProd"+sProd).src = "images/picProdAssort_"+sProd+"_x.gif"; } catch(e) { // do nothing } } } function handleChange(event) { var iIndex = 0; var title = event.path; title = title.substr(1, title.length - 2); for (var i = 0; i < arr_sections.length; i++) { if (title.toLowerCase() == arr_sections[i].toLowerCase()) { iIndex = i; break; } } changeSection(iIndex); } // SWFAddress.addEventListener(SWFAddressEvent.CHANGE, handleChange);