// JavaScript Document var flashLayer; var homeLayer; var locLayer; var locNavLayer; var curtainLayer; var breedsLayer; var biosLayer; var bioLayer; var makeLayer; var mediaLayer; var contactLayer; var catLayer; var prodLayer; var permaLayer; var blogLayer; var customLayer; var relatedLayer; var popupLayer; var popupControlLayer; var lettersLayer; var homeDiv; var locDiv; var locNavDiv; var locTitle; var catDiv; var catTitle; var catScroll; var catScrollThumb; var prodDiv; var biosDiv; var bioDiv; var makeDiv; var mediaDiv; var contactDiv; var debugDiv; var catFrame; var prodFrame; var catScroll; var prodScroll; var blogDiv; var blogTitle; var customDiv; var customTitle; var relatedDiv; var lettersDiv; var lettersTitle; var scrollSubject; var scrollThumb; var scrollContentWidth; var scrollViewWidth; var scrollChannelPos; var AREA_HOME = "home"; var AREA_LOC = "loc"; var AREA_BREEDS = "breeds"; var AREA_BREED = "breed"; var AREA_CAT = "cat"; var AREA_PROD = "prod"; var AREA_BIOS = "bios"; var AREA_BIO = "bio"; var AREA_MAKE = "make"; var AREA_MEDIA = "media"; var AREA_CONTACT = "contact"; var AREA_BLOG = "blog"; var AREA_CUSTOM = "custom"; var AREA_RELATED = "related"; var AREA_POPUP = "popup"; var AREA_TYPE = "type"; var AREA_LETTERS = "letters"; var navStack = new Array(); var posStack = new Array(); var _baseLayers = []; var prodLine = "umbrella"; function indexOf( haystack, needle, startIdx ) { for ( var i = ( startIdx || 0 ); i < haystack.length; ++i ) { if ( haystack[ i ] == needle ) { return i; } } return -1; } function ge( id ) { return document.getElementById( id ); } function initPage() { flashLayer = ge( "flashLayer" ); homeLayer = ge( "homeLayer" ); locLayer = ge( "locLayer" ); locNavLayer = ge( "locNavLayer" ); breedsLayer = ge( "breedsLayer" ); bioLayer = ge( "bioLayer" ); biosLayer = ge( "biosLayer" ); makeLayer = ge( "makeLayer" ); mediaLayer = ge( "mediaLayer" ); contactLayer = ge( "contactLayer" ); blogLayer = ge( "blogLayer" ); customLayer = ge( "customLayer" ); popupLayer = ge( "popupLayer" ); popupControlLayer = ge( "popupControlLayer" ); lettersLayer = ge( "lettersLayer" ); curtainLayer = ge( "curtainLayer" ); catLayer = ge( "catLayer" ); prodLayer = ge( "prodLayer" ); permaLayer = ge( "permaLayer" ); relatedLayer = ge( "relatedLayer" ); homeDiv = ge( "homeDiv" ); locDiv = ge( "locDiv" ); locNavDiv = ge( "locDiv" ); locTitle = ge( "locTitle" ); catDiv = ge( "catDiv" ); catTitle = ge( "catTitle" ); catScroll = ge( "catScroll" ); catScrollThumb = ge( "catScrollThumb" ); prodDiv = ge( "prodDiv" ); biosDiv = ge( "biosDiv" ); bioDiv = ge( "bioDiv" ); makeDiv = ge( "makeDiv" ); mediaDiv = ge( "mediaDiv" ); contactDiv = ge( "contactDiv" ); blogDiv = ge( "blogDiv" ); customDiv = ge( "customDiv" ); debugDiv = ge( "debugDiv" ); relatedDiv = ge( "relatedDiv" ); // popupDiv = ge( "popupDiv" ); lettersDiv = ge( "lettersDiv" ); lettersTitle = ge( "lettersTitle" ); catFrame = ge( "catFrame" ); prodFrame = ge( "prodFrame" ); scrollSubject = catFrame; _baseLayers = [ flashLayer, homeLayer, locNavLayer, locLayer, popupControlLayer, popupLayer, curtainLayer, biosLayer, bioLayer, lettersLayer, makeLayer, mediaLayer, blogLayer, customLayer, breedsLayer, catLayer, prodLayer, relatedLayer, permaLayer, contactLayer ]; clearNav(); } function toggleCurtain() { if ( curtainLayer.style.visibility == 'visible' ) { curtainLayer.style.visibility = 'hidden'; } else { curtainLayer.style.visibility = 'visible'; } } function displayLayers() { _layers = _baseLayers.slice( 0 ); var argv = displayLayers.arguments; for ( var i = 0; i < argv.length; ++i ) { var idx = indexOf( _layers, argv[ i ], 0 ); _layers.splice( idx, 1 ); argv[ i ].style.visibility = "visible"; } for ( i = 0; i < _layers.length; ++i ) { _layers[ i ].style.visibility = "hidden"; } } function showLayer() { var argv = showLayer.arguments; var argc = argv.length; for ( var i = 0; i < argc; ++i ) { argv[ i ].style.visibility = "visible"; } } function hideLayer() { var argv = hideLayer.arguments; var argc = argv.length; for ( var i = 0; i < argc; ++i ) { argv[ i ].style.visibility = "hidden"; } } function goHome() { displayLayers( flashLayer, homeLayer, locNavLayer, popupControlLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; } function goLoc( loc ) { displayLayers( flashLayer, homeLayer, locNavLayer, locLayer, curtainLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) + 1; locDiv.innerHTML = ""; locTitle.innerHTML = "
" + "
" + "" + "
" + "
"; _httpRequest( "./section/locations/" + loc + ".php", goLocCallback ); } function goLocCallback( text ) { locDiv.innerHTML = text; initCatPan( "LcatDiv", "LcatMask", "LcatZoomThumb", "LcatZoomChannel" ); } function goBreeds() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, breedsLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; } function goBreed( breed, fidx, isBack ) { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, catLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; catTitle.innerHTML = "
" + "
" + "" + "
" + "" + "
each item below is available in this breed
" + "
"; if ( !isBack ) { thumb = ge( "catZoomThumb" ) thumb.style.left = "0px"; panSubject = ge( "catDiv" ); panSubject.style.left = "0px"; } _httpRequest( "./section/category/categoryDiv.php?p=" + prodLine + "&b=" + escape( breed ), goBreedCallback ); } function goBreedCallback( text ) { catDiv.innerHTML = text; initCatPan( "catDiv", "catMask", "catZoomThumb", "catZoomChannel" ); } function goBios() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, biosLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; _httpRequest( "./section/bios/designersDiv.php", goBiosCallback ); } function goBiosCallback( text ) { biosDiv.innerHTML = text; } function goBio( idx ) { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, bioLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; bioDiv.innerHTML = ""; _httpRequest( "./section/bios/designerDiv.php?n=" + idx, goBioCallback ); } function goBioCallback( text ) { bioDiv.innerHTML = text; } function goMedia() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, mediaLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; mediaDiv.innerHTML = ""; _httpRequest( "./section/media/mediaDiv.php", goMediaCallback ); } function goMediaCallback( text ) { mediaDiv.innerHTML = text; } function goBlog() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, blogLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; blogDiv.innerHTML = ""; _httpRequest( "./section/blog/blogDiv.php", goBlogCallback ); } function goBlogCallback( text ) { blogDiv.innerHTML = text; } /* function goLetters() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, lettersLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; lettersDiv.innerHTML = ""; _httpRequest( "./section/letters/lettersDiv.php", goLettersCallback ); } function goLettersCallback( text ) { lettersDiv.innerHTML = text; } */ function goCustom() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, customLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; customDiv.innerHTML = ""; _httpRequest( "./section/custom/customDiv.php", goCustomCallback ); } function goCustomCallback( text ) { customDiv.innerHTML = text; } function goContact() { displayLayers( contactLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; _httpRequest( "./section/contact/contactDiv.php", goContactCallback ); } function goContactCallback( text ) { contactDiv.innerHTML = text; } function goMake() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, makeLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; _httpRequest( "./section/bios/make.php", goMakeCallback ); } function goMakeCallback( text ) { makeDiv.innerHTML = text; } function goPopup() { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, popupLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; } function goLetters2( isBack) { displayLayers( flashLayer, homeLayer, lettersNavLayer, lettersLayer, curtainLayer, permaLayer ); lettersLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) + 1; lettersDiv.innerHTML = ""; lettersTitle.innerHTML = "
" + "
" + "" + "
" + "
"; _httpRequest( "./section/letters/lettersDiv.php", goLetters2Callback ); } function goLetters2Callback( text ) { lettersDiv.innerHTML = text; initCatPan( "LFFcatDiv", "LFFcatMask", "LFFcatZoomThumb", "LFFcatZoomChannel" ); } function goLetters( isBack ) { displayLayers( flashLayer, homeLayer, /*locNavLayer, */curtainLayer, lettersLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; // catImg = type.replace( / /g, "_" ); // catImg = catImg.replace( /,/g, "_" ); catTitle.innerHTML = ""; /* "
" + "
" + "" + "each item below is available with YOUR pet's photo
" + "
"; */ /* if ( !isBack ) { thumb = ge( "catZoomThumb" ) thumb.style.left = "0px"; panSubject = ge( "catDiv" ); panSubject.style.left = "0px"; } */ _httpRequest( "./section/letters/lettersDiv.php", goLettersCallback ); } function goLettersCallback( text ) { lettersDiv.innerHTML = text; initCatPan( "LcatDiv", "LcatMask", "LcatZoomThumb", "LcatZoomChannel" ); } function goType( type, isBack ) { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, catLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; catImg = type.replace( / /g, "_" ); catImg = catImg.replace( /,/g, "_" ); catTitle.innerHTML = "
" + "
" + "" + "each item below is available with YOUR pet's photo
" + "
"; if ( !isBack ) { thumb = ge( "catZoomThumb" ) thumb.style.left = "0px"; panSubject = ge( "catDiv" ); panSubject.style.left = "0px"; } _httpRequest( "./section/category/categoryDiv.php?t=" + type, goCatCallback ); } function goCat( prodLine, cat, isBack ) { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, catLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; catImg = cat.replace( / /g, "_" ); catImg = catImg.replace( /,/g, "_" ); catTitle.innerHTML = ""; if ( !isBack ) { thumb = ge( "catZoomThumb" ) thumb.style.left = "0px"; panSubject = ge( "catDiv" ); panSubject.style.left = "0px"; } _httpRequest( "./section/category/categoryDiv.php?p=" + prodLine + "&cat=" + cat, goCatCallback ); } function goCatCallback( text ) { catDiv.innerHTML = text; initCatPan( "catDiv", "catMask", "catZoomThumb", "catZoomChannel" ); } function initCatPan( _ps, _pm, _zt, _zc ) { panSubject = ge( _ps ); panMask = ge( _pm ); panSubjectWidth = panSubject.scrollWidth; panSubjectHeight = panSubject.scrollHeight; panMaskWidth = panMask.offsetWidth; panMaskHeight = panMask.offsetHeight; // thumb = ge( "catZoomThumb" ) // thumbChannel = ge( "catZoomChannel" ); thumb = ge( _zt ) thumbChannel = ge( _zc ); thumbChannelWidth = thumbChannel.offsetWidth; thumbChannelHeight = thumbChannel.offsetHeight; var fracX = panMaskWidth / panSubjectWidth; var fracY = panMaskHeight / panSubjectHeight; } function goProduct( sku, relatedSku ) { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, prodLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; ge( "prodDiv" ).innerHTML = ""; if ( relatedSku == null ) { relatedSku = ""; } _httpRequest( "./section/product/productDiv.php?s=" + sku + "&rs=" + relatedSku, goProductCallback ); } function goProductCallback( text ) { prodDiv.innerHTML = text; initProdPan( "prodZoomBox", "prodZoomMask" ); } function initProdPan( _ps, _pm ) { panSubject = ge( _ps ); panMask = ge( _pm ); panSubjectWidth = panSubject.scrollWidth; panSubjectHeight = panSubject.scrollHeight; panMaskWidth = panMask.offsetWidth; panMaskHeight = panMask.offsetHeight; thumb = ge( "prodZoomThumb" ) thumbChannel = ge( "prodZoomChannel" ); thumbChannelWidth = thumbChannel.offsetWidth; thumbChannelHeight = thumbChannel.offsetHeight; var fracX = panMaskWidth / panSubjectWidth; var fracY = panMaskHeight / panSubjectHeight; thumb.style.width = Math.floor( thumbChannelWidth * fracX ) + "px"; thumb.style.height = Math.floor( thumbChannelHeight * fracY ) + "px"; } function beginPan() { // initProdPan( "prodZoomBox", "prodZoomMask" ); ge( "prodZoomThumb" ).style.display = "block"; ge( "prodZoomMask" ).style.visibility = "visible"; } function endPan() { if ( ge( "prodZoomThumb" ) ) { ge( "prodZoomThumb" ).style.display = "none"; ge( "prodZoomMask" ).style.visibility = "hidden"; } } function goRelated( sku ) { displayLayers( flashLayer, homeLayer, locNavLayer, curtainLayer, prodLayer, relatedLayer, permaLayer ); locLayer.style.zIndex = parseInt( curtainLayer.style.zIndex ) - 1; ge( "relatedDiv" ).innerHTML = ""; _httpRequest( "./section/product/relatedDiv.php?s=" + sku, goRelatedCallback ); } function goRelatedCallback( text ) { relatedDiv.innerHTML = text; } function addToCart( sku ) { } function clearNav() { navStack = new Array(); pushHome(); } function pushHome() { pushNav( AREA_HOME, null ); } function pushLoc( loc ) { pushNav( AREA_LOC, loc ); } function pushBreeds() { pushNav( AREA_BREEDS, null ); } function pushBreed( breed, fidx ) { pushNav( AREA_BREED, breed, fidx ); } function pushBios() { pushNav( AREA_BIOS, null ); } function pushBio( idx ) { pushNav( AREA_BIO, idx ); } function pushMake( idx ) { pushNav( AREA_MAKE, idx ); } function pushMedia() { pushNav( AREA_MEDIA, null ); } function pushBlog() { pushNav( AREA_BLOG, null ); } function pushCustom() { pushNav( AREA_CAT, "fn2009", "image bags,custom" ); } function pushContact() { pushNav( AREA_CONTACT, null ); } function pushCat( prodLine, cat ) { pushNav( AREA_CAT, prodLine, cat ); } function pushProd( sku ) { pushNav( AREA_PROD, sku ); } function pushRelated( sku ) { pushNav( AREA_RELATED, sku ); } function pushPopup() { pushNav( AREA_POPUP, null ); } function pushType( type ) { pushNav( AREA_TYPE, type ); } function pushLetters() { pushNav( AREA_LETTERS, null ); } function pushNav( area, id, id2 ) { navObj = { "area" : area, "id" : id, "id2" : id2 }; if ( navStack.length > 0 ) { var curNavObj = navStack[ navStack.length - 1 ]; // Don't allow countries to stack up in the nav path if ( curNavObj[ "area" ] == AREA_LOC ) { navStack.pop(); } } navStack.push( navObj ); goNav( navObj, false ); } function popNav() { if ( navStack.length > 1 ) { navStack.pop(); // FIXME doesn't handle depth menusLocked = false; menuCold( lockedMenu ); endPan(); goNav( navStack[ navStack.length - 1 ], true ); } } function popNavToolId2( id2 ) { if ( navStack.length > 1 ) { navObj = navStack[ navStack.length - 2 ]; navObj.id2 = id2; } popNav(); } function goNav( navObj, isBack ) { result = navObj.area == AREA_HOME ? goHome( isBack ) : navObj.area == AREA_BREEDS ? goBreeds( navObj.id, isBack ) : navObj.area == AREA_BREED ? goBreed( navObj.id, navObj.id2, isBack ) : navObj.area == AREA_CAT ? goCat( navObj.id, navObj.id2, isBack ) : navObj.area == AREA_PROD ? goProduct( navObj.id, navObj.id2, isBack ) : navObj.area == AREA_LOC ? goLoc( navObj.id, isBack ) : navObj.area == AREA_BIOS ? goBios( isBack ) : navObj.area == AREA_BIO ? goBio( navObj.id, isBack ) : navObj.area == AREA_MAKE ? goMake( isBack ) : navObj.area == AREA_MEDIA ? goMedia( isBack ) : navObj.area == AREA_CONTACT ? goContact( isBack ) : navObj.area == AREA_BLOG ? goBlog( isBack ) : navObj.area == AREA_CUSTOM ? goCustom( isBack ) : navObj.area == AREA_RELATED ? goRelated( navObj.id, isBack ) : navObj.area == AREA_POPUP ? goPopup( navObj.id ) : navObj.area == AREA_TYPE ? goType( navObj.id, isBack ) : navObj.area == AREA_LETTERS ? goLetters( isBack ) : goHome( isBack ); return result; } var httpReq; var httpReadyCallback; // Data loading functions // GetAsyncData sends a request to read the fifo. function httpRequest( url, frame ) { frame.src = url; } function _httpRequest( url, _callback ) { httpReadyCallback = _callback; // branch for native XMLHttpRequest object if ( window.XMLHttpRequest ) { httpReq = new XMLHttpRequest(); } else if ( window.ActiveXObject ) { httpReq = new ActiveXObject( "Microsoft.XMLHTTP" ); } if ( httpReq == null ) { alert( "XMLHttpRequest not supported :(" ); } else { httpReq.onreadystatechange = httpRequestStateChanged; // httpReq.onprogress = httpRequestOnProgress; httpReq.open( "GET", url, true ); httpReq.send( null ); } } function httpRequestOnProgress( obj ) { hs += obj.position + " => " + obj.totalSize + "\n";//Math.ceil( ( obj.position / obj.totalSize ) * 100 ) + "%\n";; } function httpRequestStateChanged() { // info = httpReq.responseText.length; // alert(httpReq.readyState + " : " + httpReq.status + " => " + info); // debugDiv.innerHTML = debugDiv.innerHTML + "
" + info; if ( httpReq.readyState == 4 && httpReq.status == 200 ) { httpReadyCallback( httpReq.responseText ); } } var menusLocked = false; var lockedMenu = null; function menuHot( divObj ) { if ( menusLocked ) { return; } var children = ge( divObj.id + "_children" ); if ( children == null ) { return; } children.style.visibility = 'visible'; } function menuCold( divObj ) { if ( menusLocked || divObj == null ) { return; } var children = ge( divObj.id + "_children" ); if ( children == null ) { return; } children.style.visibility = 'hidden'; } function menuHit( divObj ) { menusLocked = true; lockedMenu = divObj; } function unlockMenus() { menusLocked = false; }