var projectsOpened = false;
var codeOpened = false;
function findUlSubWidth(liClass) {
var ulSubWidth = null;
switch (liClass) {
case "projects" :
// window.alert($('li.projects div.subNavWrap ul.subNav li')[0].getStyle('width').split('px')[0]);
ulSubWidth = (notIe == true) ? 6560 : 6350; // IE value is 210px less than nonIE value.
// ulSubWidth = parseInt($$('div.puSubNavWrap ul.puSubNav')[0].getStyle('width').split('px')[0]);
/* ALERT: Edit the above width values whenever a
project example is added or removed.
Ssutract 50 from the "div.puSubNavWrap
ul.puSubNav" styles (both non IE and IE stylesheets). */
break;
case "code" :
ulSubWidth = 300;
break;
}
return ulSubWidth;
}
function findoWidth(liClass) {
var oWidth = null;
switch (liClass) {
case "projects" :
oWidth = 785;
break;
case "code" :
oWidth = 300;
break;
}
return oWidth;
}
function addSlider(liClass, oWidth, ulWidth) {
$$("#topNav li." + liClass)[0].insert("");
$("scrollbar_" + liClass).setStyle({
width: oWidth + "px"
});
var scrollbar = $("scrollbar_" + liClass);
var subMenu = $$("#topNav li." + liClass + " div.subNavWrap ul.subNav")[0];
var negRange = ulWidth - oWidth;
if (notIpad) {
new Control.Slider(scrollbar.down(), scrollbar, {
range: $R(0, negRange),
sliderValue: 0,
onSlide: function(value) {
subMenu.setStyle({
left: "-" + value +"px"
});
},
onChange: function(value) {
subMenu.setStyle({
left: "-" + value +"px"
});
}
});
} else { // iPad touchscreen JavaScript
$("scrollbar_" + liClass).up().down('ul.subNav').writeAttribute('id', 'list_' + liClass);
var scrLeftMarg = parseInt($("scrollbar_" + liClass).getStyle('left').split('px')[0]);
var scrRightMarg = (parseInt($("scrollbar_" + liClass).getStyle('width').split('px')[0]) + scrLeftMarg) - 22; // 22 = grip position adjustment
var scrListDiff = (parseInt($('list_' + liClass).getStyle('width').split('px')[0]) + 275) / scrRightMarg;
/* ALERT: Edit the above '+' value whenever a
project example is added or removed. */
scrollbar.down().ontouchmove = function(event) {
event.preventDefault();
if (event.touches.length == 1) { // Only deal with one finger
var touch = event.touches[0]; // Get the information for finger #1
var node = touch.target; // Find the node the drag started from
var scrollList = document.getElementById('list_' + liClass);
if ((touch.pageX > scrLeftMarg) && (touch.pageX < scrRightMarg)) {
var gripPos = (touch.pageX - scrLeftMarg) - 1; // 1 = grip position adjustment
node.style.left = gripPos + 'px';
scrollList.style.left = (0 - (gripPos * scrListDiff)) + 'px';
}
}
}
}
}
function openSubNav(subNav, oWidth, ulWidth) {
subNav.down().setStyle("left: 0;");
new Effect.Scale(subNav, 100, {
scaleX: true,
scaleY: false,
scaleContent: false,
scaleMode: {
originalWidth: oWidth
},
scaleFrom: 0.0,
duration: 0.35
});
if (ulWidth > oWidth)
setTimeout("addSlider('" + subNav.up().readAttribute('class') + "', " + oWidth + ", " + ulWidth + ");", 350);
}
function closeSubNav(subNav) {
new Effect.Scale(subNav, 0, {
scaleX: true,
scaleY: false,
scaleContent: false,
scaleFrom: 100.0,
duration: 0.35
});
if ($$("#topNav li." + subNav.up().readAttribute('class') + " div.scrollbar")[0])
$$("#topNav li." + subNav.up().readAttribute('class') + " div.scrollbar")[0].remove();
}
function setSubNavs() {
$A($$("#topNav li.intro, #topNav li.skills, #topNav li.projects, #topNav li.code, #topNav li.bio")).each(function(li) {
li.setStyle("height: 73px;");
});
$$("#topNav li ul.subNav").each(function(ul) {
var ulWidth = findUlSubWidth(ul.up().readAttribute("class"));
ul.setStyle({
width: ulWidth + "px",
height: "25px",
backgroundColor: "#330",
// overflow: "visible",
position: "absolute",
left: "0",
top: "0"
}).insert({
/* before: "![Open this sub-navigation for this section button](" + rootPath + "images/button_subNav_open_off.gif)
![Open this sub-navigation for this section button](" + rootPath + "images/button_subNav_closed_off.gif)
" */
before: "
"
}).wrap("div", {
"class": "subNavWrap"
});
});
$$("#topNav li ul.subNav li").each(function(li) {
li.setStyle({
paddingTop: "5px",
float: "left"
});
});
$$("#topNav li a.ocSubClosed").each(function(oc) {
oc.observe("mouseover", function() {
// this.down().writeAttribute("src", rootPath + "images/button_subNav_closed_on.gif");
this.down().writeAttribute("src", "/images/button_subNav_closed_on.gif");
}).observe("mouseout", function() {
// this.down().writeAttribute("src", rootPath + "images/button_subNav_closed_off.gif");
this.down().writeAttribute("src", "/images/button_subNav_closed_off.gif");
}).observe("click", function(oc) {
var oWidth = findoWidth(this.up().readAttribute("class"));
var ulWidth = findUlSubWidth(this.up().readAttribute("class"));
openSubNav(this.next(), oWidth, ulWidth);
if (this.up().readAttribute("class") == 'projects')
projectsOpened = true;
else if (this.up().readAttribute("class") == 'code')
codeOpened = true;
this.hide();
oc.stop();
});
});
$$("#topNav li a.ocSubOpen").each(function(oc) {
oc.observe("mouseover", function() {
// this.down().writeAttribute("src", rootPath + "images/button_subNav_open_on.gif");
this.down().writeAttribute("src", "/images/button_subNav_open_on.gif");
}).observe("mouseout", function() {
// this.down().writeAttribute("src", rootPath + "images/button_subNav_open_off.gif");
this.down().writeAttribute("src", "/images/button_subNav_open_off.gif");
}).observe("click", function(oc) {
closeSubNav(this.next(1));
this.next().show();
oc.stop();
});
});
}