var currentTab = 1; var inListView = false; var scrolling= false; var currentlyScrolling= false; var showtime; var onOptionsPage = false; var xtrvael=0; var displayTab=0; var currentWidth = 600; var largestWidth = 120; var stopDelay = false; /* * The variable amountTabs used in some of the following * functions is defined in a cfhtmlhead tag in optionsForm.cfm */ ///functions to emulate mouseenter and mouseleave In IE function containsDOM (container, containee) { var isParent = false; do { if ((isParent = container == containee)) break; containee = containee.parentNode; } while (containee != null); return isParent; } function checkMouseEnter (element, evt) { if (element.contains && evt.fromElement) { return !element.contains(evt.fromElement); } else if (evt.relatedTarget) { return !containsDOM(element, evt.relatedTarget); } } function checkMouseLeave (element, evt) { if (element.contains && evt.toElement) { return !element.contains(evt.toElement); } else if (evt.relatedTarget) { return !containsDOM(element, evt.relatedTarget); } } // Called from the onLoad event; put initialization code in here function initView(listView, activeTab) { changeView(listView); //setTab(ctiveTab); updateDisplayTab(); var displayObject = {url: '../configure/includes/quickView.cfm'};start(displayObject); } function updateDisplayTab() { if(amountTabs<=5) { document.getElementById("icon_view_left").style.visibility = "hidden"; document.getElementById("icon_view_right").style.visibility = "hidden"; document.getElementById("icon_view_container").style.margin = "0"; document.getElementById("icon_view_container").style.left = "80px"; document.getElementById("icon_view").style.textAlign= "left"; } displayTab = amountTabs - (600/largestWidth); document.getElementById('icon_view_icons').style.width = amountTabs*largestWidth; } function goToSection( value ) { if ( !inListView ) { setTab( value ); } else { window.scrollTo(0,getYCoord(document.getElementById("options_section_header_"+value))); } } function updateTabImage( name,value ) { document.getElementById(name+"_icon_view_img").src = value; } function updateTabTitle( name,tabTitle,sectionTitle ) { document.getElementById(name+"_icon_view_title").innerHTML = tabTitle; document.getElementById(name+"_icon_view_img").alt = sectionTitle; } // Called when changing from list view to tabbed view, or vice versa function changeView(listView) { inListView = listView; var sectionIcons = document.getElementById("icon_view"); if ( !sectionIcons ) { alert("DEBUG: could not find icon section"); return; } if ( listView ) { document.getElementById("viewSwitchTabsText").style.color = "#000"; document.getElementById("viewSwitchTabsImage").src = "images/tab_view_icon.gif"; document.getElementById("viewSwitchTabsLink").href = "javascript: changeView(false);"; document.getElementById("viewSwitchListText").style.color = "#ccc"; document.getElementById("viewSwitchListImage").src = "images/greyed_list_view_icon.gif"; document.getElementById("viewSwitchListLink").removeAttribute('href'); //document.getElementById("viewSwitchLink").innerHTML = $('SwitchTab').innerHTML; sectionIcons.style.display = "none"; //$('switchTabs').setStyle({ // marginLeft: '0' //}); for (i=1; i<=amountTabs; i++) { document.getElementById("options_section_body_" + i).className= ""; document.getElementById("options_section_header_" + i).className= ""; } } else { document.getElementById("viewSwitchTabsText").style.color = "#ccc"; document.getElementById("viewSwitchTabsImage").src = "images/greyed_tab_view_icon.gif"; document.getElementById("viewSwitchTabsLink").removeAttribute('href'); document.getElementById("viewSwitchListText").style.color = "#000"; document.getElementById("viewSwitchListImage").src = "images/list_view_icon.gif"; document.getElementById("viewSwitchListLink").href = "javascript: changeView(true);"; ///document.getElementById("viewSwitchLink").innerHTML = $('SwitchList').innerHTML; sectionIcons.style.display = "block"; //$('switchTabs').setStyle({ // marginLeft: '80px' //}); for (i=1; i<=amountTabs; i++) { document.getElementById("options_section_body_" + i).className= "option_section_body_hide"; document.getElementById("options_section_header_" + i).className= "option_section_header_hide"; } setTab(currentTab); } } var sectionHeaderHeight=new Array(); var sectionBodyHeight=new Array(); // Called to set a tab visible, and all others invisible // (should only called when in tabbed view) function setTab(tabIndex) { if ( tabIndex < 1 || tabIndex > amountTabs ) return false; if(tabIndex==1) { if( document.getElementById("battery_runtime_container")!=null) document.getElementById("battery_runtime_container").style.display= "block"; } else { if( document.getElementById("battery_runtime_container")!=null) document.getElementById("battery_runtime_container").style.display= "none"; } // TODO: Move tab into view // Set the section visible, hide all other sections if (inListView == false) { var extraControlsPrevious = document.getElementById("options_section_extracontrols_" + currentTab); var extraControlsCurrent = document.getElementById("options_section_extracontrols_" + tabIndex); if (extraControlsPrevious) { extraControlsPrevious.style.display = "none"; } // Close previous tab if ( currentTab != tabIndex ) { document.getElementById("options_section_body_" + currentTab).className= "option_section_body_hide"; document.getElementById("options_section_header_" + currentTab).className= "option_section_header_hide"; document.getElementById("options_tabs_" + currentTab).className = "tabs"; document.getElementById("options_tabs_border_" + currentTab).className = "tab_side_border"; document.getElementById(currentTab + "_icon_view_link" ).className = ""; } // Open new tab document.getElementById("options_section_body_" + tabIndex).className= ""; document.getElementById("options_section_header_" + tabIndex).className= ""; document.getElementById("options_tabs_" + tabIndex).className = "highlighttabs"; document.getElementById("options_tabs_border_" + tabIndex).className = "tab_side_border_highlight"; document.getElementById(tabIndex + "_icon_view_link" ).className = "highlighttabTile"; // We need to realign the floater alignFloatLayers(); if (extraControlsCurrent) { extraControlsCurrent.style.display = "block"; } cancelChoosePDU(tabIndex); /* for (i = 1; i <= amountTabs; i++) { var extraControls = document.getElementById("options_section_extracontrols_" + i); if (extraControls) { extraControls.style.display = "none"; } if (i == tabIndex) { document.getElementById("options_section_body_" + i).className= ""; document.getElementById("options_section_header_" + i).className= ""; document.getElementById("options_tabs_" + i).className = "highlighttabs"; document.getElementById("options_tabs_border_" + i).className = "tab_side_border_highlight"; document.getElementById(i + "_icon_view_link" ).className = "highlighttabTile"; if (extraControls) { extraControls.style.display = "block"; } cancelChoosePDU(i); } else { document.getElementById("options_section_body_" + i).className= "option_section_body_hide"; document.getElementById("options_section_header_" + i).className= "option_section_header_hide"; document.getElementById("options_tabs_" + i).className = "tabs"; document.getElementById("options_tabs_border_" + i).className = "tab_side_border"; document.getElementById(i + "_icon_view_link" ).className = "tabTitle"; } } */ } currentTab = tabIndex; return true; } //timer to scroll the tabs function scrollTimer(moveX) { var leftArrow = document.getElementById("tab_arrow_left"); var rightArrow = document.getElementById("tab_arrow_right"); var element = document.getElementById("icon_view_icons"); if(scrolling) { new Effect.Move(element, { x: moveX, y: 0 ,duration:0}); currentWidth = currentWidth+moveX; } var leftMaxWidth = (amountTabs * largestWidth) - (displayTab * largestWidth); var rightMaxWidth = leftMaxWidth - (displayTab * largestWidth); var modCurrentWidth = currentWidth % largestWidth; if(modCurrentWidth==0) { if(moveX>0) { if(currentWidth == leftMaxWidth) { rightArrow.src = "/tools/configure/images/arrowbutton_right.gif"; leftArrow.src = "/tools/configure/images/arrowbutton_left_grey.gif"; scrolling=false; currentlyScrolling=false; stopScroll(); } else { rightArrow.src = "/tools/configure/images/arrowbutton_right.gif"; } } else { if(currentWidth == rightMaxWidth) { leftArrow.src = "/tools/configure/images/arrowbutton_left.gif"; rightArrow.src = "/tools/configure/images/arrowbutton_right_grey.gif"; scrolling=false; currentlyScrolling=false; stopScroll(); }else { leftArrow.src = "/tools/configure/images/arrowbutton_left.gif"; } } currentlyScrolling=false; } else { currentlyScrolling=true; } } //call timer to scroll the tabs function scrollTab(move,delay) { var leftArrow = document.getElementById("tab_arrow_left"); var rightArrow = document.getElementById("tab_arrow_right"); clearInterval(showtime); scrolling=true; var element = document.getElementById("icon_view_icons"); if(move=="right" && (rightArrow.src.indexOf("arrowbutton_right.gif")!= -1)) { if(delay>0) { if (execDelay(delay)) { showtime = setInterval('scrollTimer(-5)' ,1); } } else { stopDelay=true; showtime = setInterval('scrollTimer(-5)' ,1); } } else if(move=="left" && (leftArrow.src.indexOf("arrowbutton_left.gif")!= -1)) { if(delay>0) { if (execDelay(delay)) { showtime = setInterval('scrollTimer(5)' ,1); } } else { stopDelay=true; showtime = setInterval('scrollTimer(5)' ,1); } } } function execDelay( time ) { var date = new Date(); var curDate = null; var diff; do { curDate = new Date(); diff = curDate - date if(stopDelay) { stopDelay=false; break; return true; } } while( curDate - date < time ); if ( diff >= time ) { return true; } else { return false; } } //stop scrolling the tabs function stopScroll() { //stop scolling when a tabs is fully display if(currentlyScrolling) { setTimeout("stopScroll()",1); } else { clearInterval(showtime); scrolling=false; //stopDelay=false; } } // Shows/hides an options section // (should only called when in list view) function toggleOptionsSection(event, index) { if ( !event ) var event = window.event; var section_body = document.getElementById("options_section_body_" + index); var section_link = document.getElementById("options_section_hide_link_" + index); if (section_body && section_link) { var strDisplay = (section_link.innerHTML == "show") ? "" : "none"; var strHtml = (section_link.innerHTML == "show") ? "hide" : "show"; if ( event.ctrlKey || event.shiftKey ) { // If ctrl of shift were held, hide/show all sections for (i = 1; i <= amountTabs; i++) { section_body = document.getElementById("options_section_body_" + i); section_link = document.getElementById("options_section_hide_link_" + i); if ( section_body && section_link ) { section_body.style.display = strDisplay; section_link.innerHTML = strHtml; } else alert("DEBUG: could not find section " + i); } } else { section_body.style.display = strDisplay; section_link.innerHTML = strHtml; } } else alert("DEBUG: could not find section " + index); }