Event.observe(window, 'load', function() {
	$$('a.external').each(function(el) {
		el.observe('click', function(ev) {
			window.open(el, $(el).readAttribute('href'));
			ev.stop()
		});
	});
	
	$$('a.pop').each(function(el) {
		el.observe('click', function(ev) {
			//window.open(el, $(el).readAttribute('href'));
			Lightview.show({ href: $(el).readAttribute('href'), rel: 'ajax', options: { topclose: true, ajax: { method: 'get' } } });
			ev.stop()
		});
	});
	
});


function updateSkuImg() {
  if($('zoom1')) { MagicZoom.stop($('zoom1'));}
  
  var sku_id = $F('product_skus');
  new Ajax.Request('/display_sku_data/'+sku_id, {asynchronous:true, evalScripts:true});  
}

function updateSkuData() {
  var sku_id = $F('product_skus');
  new Ajax.Request('/display_sku_data_confirm/'+sku_id, {asynchronous:true, evalScripts:true});  
}


function setSkuImg(sku_image_id) {
  //$('large_product_img').innerHTML = "<img src='"+$F('sku_image_'+sku_image_id)+"'>"
  
  $$('div#large_product_img a').each(function(elmt) {
    //alert(elmt.href)
      elmt.hide()
    }
  )
  $('large_sku_img_'+sku_image_id).show()
}

function newImage(arg) {
	if (document.images) {
		rslt = new Image();
		rslt.src = arg;
		return rslt;
	}
}

var Slide = Class.create({
  
  initialize: function(slide) {
    this.slide = slide;
    this.details = slide.select('[class="featured_film_details"]')[0].id;
    
    // "hide" the details 
    startOpacity = ($(this.details).getStyle('display') == 'none' ? 0.0 : $(this.details).getOpacity() || 0.0)
    this.detailsEffect = new Effect.Opacity(this.details, { duration: 0, from: startOpacity, to: 0 });
    
    // setup the mouse over/out event listeners
    this.moverbfx = this.mover.bindAsEventListener(this);
    this.moutbfx = this.mout.bindAsEventListener(this);
    
    this.slide.observe('mouseover', this.moverbfx);
    this.slide.observe('mouseout', this.moutbfx);
    
  },
  
  mover: function(event) {        
    // stop any current effect
    try { this.detailsEffect.cancel(); } catch(err) { }
    
    startOpacity = ($(this.details).getStyle('display') == 'none' ? 0.0 : $(this.details).getOpacity() || 0.0)
    this.detailsEffect = new Effect.Opacity(this.details, { duration: 0.5, from: startOpacity, to: 1.0 });
            
    // stops the slideshow rotation
    ff_rotate = 0;
  },
  
  mout: function(event) {
    // stop any current effect
    try { this.detailsEffect.cancel(); } catch(err) { }
    
    startOpacity = ($(this.details).getStyle('display') == 'none' ? 0.0 : $(this.details).getOpacity() || 0.0)
    this.detailsEffect = new Effect.Opacity(this.details, { duration: 0.5, from: startOpacity, to: 0 });
    
    // re-enables slideshow rotation
    ff_rotate = 1;
  }
  
})


var SlideShow = Class.create ({
  
  initialize: function(options) {
    
    // DEFAULTS
    var DELAY = 4;
    var OFFSET = 0
    
    this.options = Object.extend({delay: DELAY},options || {});
    this.ssid = this.options.ssid
    this.delay = this.options.delay || DELAY;
    this.offset = this.options.offset || OFFSET;
    this.start_frame = 0;
    this.end_frame = 0;
    this.current_frame = 0;
    this.play = true;
    this.slides = new Array;
    this.slide_divs = $$('#slideshow_'+this.ssid+' div[class="slideshow_img"]')
    for( i=0; i < this.slide_divs.length; i++){
  		if (i>0) {this.slide_divs[i].style.display = 'none';}
      //s = new Slide(lis[i]);
      // this.slides.push(s)
  	}
  	
  	this.end_frame = this.slide_divs.length -1;
    
    setTimeout(this.cycle.bind(this), this.offset*1000);
    
    return this;
  },
  
  cycle: function() {
    if (this.end_frame <= 0) {return}
    if (this.play == true) {this.fadeInOut(1)}
    setTimeout(this.cycle.bind(this), this.delay*1000);
  },
  
  fadeInOut: function(direction) {
    Effect.Fade(this.slide_divs[this.current_frame]);

    if (this.current_frame == this.end_frame) { this.current_frame = this.start_frame; } else { this.current_frame++; }

  	lisAppear = this.slide_divs[this.current_frame];
  	Effect.Appear(lisAppear);
  }
  
  
  
})



function toggle_folder(event) {
  var element = event.element().ancestors().first();
  if(element.hasClassName('closed')) {
    element.removeClassName('closed');
    // fire an update into the session
    new Ajax.Request('/imgs/toggle_folder?mode=open&element_id='+element.id, { method:'get' });
  } else {
    element.addClassName('closed');
    new Ajax.Request('/imgs/toggle_folder?mode=closed&element_id='+element.id, { method:'get' });
  }
}

var PortfolioImage = Class.create({
  
  initialize: function(portfolio_image) {
    this.portfolio_image = portfolio_image;
    try { this.details = portfolio_image.select('[class="portfolio_image_details"]')[0].id; } catch(err) { return }
    
    // "hide" the details 
    startOpacity = ($(this.details).getStyle('display') == 'none' ? 0.0 : $(this.details).getOpacity() || 0.0)
    this.detailsEffect = new Effect.Opacity(this.details, { duration: 0, from: startOpacity, to: 0 });
    
    // setup the mouse over/out event listeners
    this.moverbfx = this.mover.bindAsEventListener(this);
    this.moutbfx = this.mout.bindAsEventListener(this);
    
    this.portfolio_image.observe('mouseover', this.moverbfx);
    this.portfolio_image.observe('mouseout', this.moutbfx);
    
  },
  
  mover: function(event) {        
    // stop any current effect
    try { this.detailsEffect.cancel(); } catch(err) { }
    
    startOpacity = ($(this.details).getStyle('display') == 'none' ? 0.0 : $(this.details).getOpacity() || 0.0)
    this.detailsEffect = new Effect.Opacity(this.details, { duration: 0.5, from: startOpacity, to: 1.0 });
            
    // stops the portfolio rotation
    ff_rotate = 0;
  },
  
  mout: function(event) {
    // stop any current effect
    try { this.detailsEffect.cancel(); } catch(err) { }
    
    startOpacity = ($(this.details).getStyle('display') == 'none' ? 0.0 : $(this.details).getOpacity() || 0.0)
    this.detailsEffect = new Effect.Opacity(this.details, { duration: 0.5, from: startOpacity, to: 0 });
    
    // re-enables portfolio rotation
    ff_rotate = 1;
  }
  
})


var Portfolio = Class.create ({
  
  initialize: function(options) {
    
    // DEFAULTS
    var DELAY = 4;
    var OFFSET = 0
    
    this.options = Object.extend({delay: DELAY},options || {});
    this.ssid = this.options.ssid
    this.delay = this.options.delay || DELAY;
    this.offset = this.options.offset || OFFSET;
    this.start_frame = 0;
    this.end_frame = 0;
    this.current_frame = 0;
    this.play = true;
    this.portfolio_images = new Array;
    this.portfolio_image_divs = $$('#portfolio_'+this.ssid+' div[class="portfolio_img"]')
    for( i=0; i < this.portfolio_image_divs.length; i++){
  		if (i>0) {this.portfolio_image_divs[i].style.display = 'none';}
  		img = new PortfolioImage(this.portfolio_image_divs[i]);
      this.portfolio_images.push(img)
  	}
  	
  	this.end_frame = this.portfolio_image_divs.length -1;
    
    //setTimeout(this.cycle.bind(this), this.offset*1000);
    
    return this;
  },
  
  cycle: function() {
    if (this.end_frame <= 0) {return}
    if (this.play == true) {this.fadeInOut(1)}
    setTimeout(this.cycle.bind(this), this.delay*1000);
  },
  
  fadeInOut: function(direction) {
    
    if (direction > 0) {
      if (this.current_frame == this.end_frame) { num = this.start_frame; } else { num = this.current_frame+1; }
    } else {
      if (this.current_frame == this.start_frame) { num = this.end_frame; } else { num = this.current_frame-1; }
    }
    this.goto(num)
  },
  
  next: function() {
    this.fadeInOut(1)
  },
  
  previous: function() {
    this.fadeInOut(-1)
  },
  
  goto: function(num) {
    if (num == this.current_frame) { return false }
    
    try { this.outEffect.cancel(); } catch(err) { }
    try { this.inEffect.cancel(); } catch(err) { }
    
    id = this.portfolio_image_divs[this.current_frame]
    startOpacity = (id.getStyle('display') == 'none' ? 0.0 : id.getOpacity() || 0.0)
    this.outEffect = new Effect.Fade(id, { duration: 0.5 });
    
    // next frame to show (not necessary adjacent)
    if (num <= this.end_frame) { this.current_frame = num; }
    
    id = this.portfolio_image_divs[this.current_frame]
    startOpacity = (id.getStyle('display') == 'none' ? 0.0 : id.getOpacity() || 0.0)
    this.inEffect = new Effect.Appear(id, { duration: 0.5 });
    
  }
  

})






/* admin */
function show_hide_text_area(select, target_id) {
  if (select.value == "show") {
    $(target_id).style.display = "inline"
  } else {
    $(target_id).style.display = "none"
  }
}


















// position and display context menu
function showContextMenu(evt) {
    // hide any existing menu just in case
    hideContextMenus();
    evt = (evt) ? evt : ((event) ? event : null);
    if (evt) {
        var elem = (evt.target) ? evt.target : evt.srcElement;
         if (elem.nodeType == 3) {
            elem = elem.parentNode;
        }
        if (elem.className == "contextEntry") {
            var menu = document.getElementById(cMenu[elem.id].menuID);
            // turn on IE mouse capture
            if (menu.setCapture) {
                menu.setCapture();
            }
            // position menu at mouse event location
            var left, top;
            if (evt.pageX) {
                left = evt.pageX;
                top = evt.pageY;
            } else if (evt.offsetX || evt.offsetY) {
                left = evt.offsetX;
                top = evt.offsetY;
            } else if (evt.clientX) {
                left = evt.clientX;
                top = evt.clientY;
            }
            menu.style.left = left + "px";
            menu.style.top = top + "px";
            menu.style.visibility = "visible";
            if (evt.preventDefault) {
                evt.preventDefault();
            }
            evt.returnValue = false;
        }
    }
}

// retrieve URL from cMenu object related to chosen item
function getHref(tdElem) {
    var div = tdElem.parentNode.parentNode.parentNode.parentNode;
    var index = tdElem.parentNode.rowIndex;
    for (var i in cMenu) {
        if (cMenu[i].menuID == div.id) {
            return cMenu[i].hrefs[index];    
        }
    }
    return "";
}

// navigate to chosen menu item
function execMenu(evt) {
    evt = (evt) ? evt : ((event) ? event : null);
    if (evt) {
        var elem = (evt.target) ? evt.target : evt.srcElement;
        if (elem.nodeType == 3) {
            elem = elem.parentNode;
        }
        if (elem.className == "menuItemOn") {
            location.href = getHref(elem);
        }
        hideContextMenus();
    }
}

// hide all context menus
function hideContextMenus() {
    if (document.releaseCapture) {
        // turn off IE mouse event capture
        document.releaseCapture();
    }
    for (var i in cMenu) {
        var div = document.getElementById(cMenu[i].menuID)
        div.style.visibility = "hidden";
    }
}

// rollover highlights of context menu items
function toggleHighlight(evt) {
    evt = (evt) ? evt : ((event) ? event : null);
    if (evt) {
        var elem = (evt.target) ? evt.target : evt.srcElement;
        if (elem.nodeType == 3) {
            elem = elem.parentNode;
        }
        if (elem.className.indexOf("menuItem") != -1) {
            elem.className = (evt.type == "mouseover") ? "menuItemOn" : "menuItem";
        }
    }
}

// set tooltips for menu-capable and lesser browsers
function setContextTitles() {
    var cMenuReady = (document.body.addEventListener || typeof document.oncontextmenu != "undefined")
    var spans = document.body.getElementsByTagName("span");
    for (var i = 0; i < spans.length; i++) {
        if (spans[i].className == "contextEntry") {
            if (cMenuReady) {
                var menuAction = (navigator.userAgent.indexOf("Mac") != -1) ? "Click and hold " : "Right click ";
                spans[i].title = menuAction + "to view relevant links"
            } else {
                spans[i].title = "Relevant links available with other browsers (IE5+/Windows, Netscape 6+)."
                spans[i].style.cursor = "default";
            }
        }
    }
}

// bind events and initialize tooltips
function initContextMenus() {
    if (document.body.addEventListener) {
        // W3C DOM event model
        document.body.addEventListener("contextmenu", showContextMenu, true);
        document.body.addEventListener("click", hideContextMenus, true);
    } else {
        // IE event model
        document.body.oncontextmenu = showContextMenu;
    }
    // set intelligent tooltips
    setContextTitles();
}

function jump(select_element, target_frame){ 
  eval(target_frame+".location='"+select_element.options[select_element.selectedIndex].value+"'"); 
}


// ----- pinboards ------

var dragging = false; 
var toppx; 
var left; 
var dragStartTop; 
var dragStartLeft; 

// config
var moveByStepPx = 450;
var outerDivHeightPx = 0;
var outerDivWidthPx = 0;


function initPinboard(outerDivWidth, outerDivHeight, innerDivWidth, innerDivHeight) { 
	// make inner div big enough to display the map 
	var innerDiv = $("pinboardinnerDiv"); 
	
  outerDivHeightPx = outerDivHeight;
  outerDivWidthPx = outerDivWidth;
  
	innerDiv.style.width = innerDivWidth+"px"; 
	innerDiv.style.height = innerDivHeight+"px";
	innerDiv.style.left = 0+"px";
	innerDiv.style.top = 0+"px";
	
	// wire up the mouse listeners to do dragging 
	var outerDiv = document.getElementById("pinboardouterDiv"); 
	outerDiv.onmousedown = startMove; 
	outerDiv.onmousemove = processMove; 
	outerDiv.onmouseup = stopMove; 
	
	// necessary to enable dragging on IE 
	outerDiv.ondragstart = function() { return false; } 
	
} 

function startMove(event) { 
	// necessary for IE 
	if (!event) event = window.event; 
	dragStartLeft = event.clientX; 
	dragStartTop = event.clientY; 
	var innerDiv = $("pinboardinnerDiv"); 
	innerDiv.style.cursor = "move"; 
	toppx = stripPx(innerDiv.style.top); 
	left = stripPx(innerDiv.style.left); 
	dragging = true; 
	return false; 
} 

function processMove(event) { 
	if (!event) event = window.event; // for IE 
	var innerDiv = $("pinboardinnerDiv"); 
	if (dragging) { 
	  
	  moveY = event.clientY - dragStartTop;
	  maxHeightMove = parseFloat(innerDiv.style.height) - outerDivHeightPx;
	  
	  if (parseFloat(toppx) + moveY <= 0 && -(parseFloat(toppx) + moveY) <= maxHeightMove ) {
			innerDiv.style.top = (parseFloat(toppx) + (event.clientY - dragStartTop))+"px"; 
		} else if (parseFloat(toppx) + (event.clientY - dragStartTop) >= 0) {
			innerDiv.style.top = 0+"px";
		} else {
			innerDiv.style.top = (-parseFloat(innerDiv.style.height)+outerDivHeightPx)+"px";
		}
		
		moveX = event.clientX - dragStartLeft;
	  maxWidthMove = parseFloat(innerDiv.style.width) - outerDivWidthPx;
		
		if (parseFloat(left) + moveX <= 0 && -(parseFloat(left) + moveX) <= maxWidthMove ) {
			innerDiv.style.left = (parseFloat(left) + (event.clientX - dragStartLeft))+"px"; 
		} else if (parseFloat(left) + (event.clientX - dragStartLeft) >= 0) {
			innerDiv.style.left = 0+"px";
		} else {
			innerDiv.style.left = (-parseFloat(innerDiv.style.width)+outerDivWidthPx)+"px";
		}
	} 
}

function stopMove(event) { 
	var innerDiv = $("pinboardinnerDiv"); 
	innerDiv.style.cursor = ""; 
	dragging = false; 
	if (event.clientY - dragStartTop == 0 && event.clientX - dragStartLeft == 0) {
		//turn outer div to inner div position
		var clickX = event.clientX;
		var clickY = event.clientY;
		clickX = clickX - 152;
		clickY = clickY - 142;
	}
} 


function stripPx(value) { 
	if (value == "" || value == "0px") return 0; 
	return parseFloat(value.substring(0, value.length - 2)); 
}
function movePinboardUp() {
  var innerDiv = $("pinboardinnerDiv"); 
	var moveBy = moveByStepPx
	if (-parseFloat(innerDiv.style.top) < moveBy) {
		moveBy = -parseFloat(innerDiv.style.top);
	}
	new Effect.MoveBy('pinboardinnerDiv',moveBy,0)
}

function movePinboardDown() {
	var innerDiv = $("pinboardinnerDiv"); 
	var moveBy = moveByStepPx
  
  // TODO
	if (moveBy > parseFloat(innerDiv.style.height) - outerDivHeightPx + parseFloat(innerDiv.style.top)) {
		moveBy = parseFloat(innerDiv.style.height) - outerDivHeightPx + parseFloat(innerDiv.style.top);
	} 
	new Effect.MoveBy('pinboardinnerDiv',-moveBy,0)
}

function movePinboardLeft() {
	var innerDiv = $("pinboardinnerDiv"); 
	var moveBy = moveByStepPx
  if (-parseFloat(innerDiv.style.left) < moveBy) {
		moveBy = -parseFloat(innerDiv.style.left);
	}
	new Effect.MoveBy('pinboardinnerDiv',0,moveBy)
}

function movePinboardRight() {
	var innerDiv = $("pinboardinnerDiv"); 
	var moveBy = moveByStepPx
  // TODO
  if (moveBy > parseFloat(innerDiv.style.width) - outerDivWidthPx + parseFloat(innerDiv.style.left)) {
		moveBy = parseFloat(innerDiv.style.width) - outerDivWidthPx + parseFloat(innerDiv.style.left);
	}
	new Effect.MoveBy('pinboardinnerDiv',0,-moveBy)
}


// functions for signup

function selectLevel(level) {
  if (level == 'Level1000Account') {
    if ($('level50_account_indicator')) { $('level50_account_indicator').removeClassName("selected") }
    if ($('level100_account_indicator')) { $('level100_account_indicator').removeClassName("selected") }
    if ($('level250_account_indicator')) { $('level250_account_indicator').removeClassName("selected") }
    if ($('level500_account_indicator')) { $('level500_account_indicator').removeClassName("selected") }
    if ($('level1000_account_indicator')) { $('level1000_account_indicator').addClassName("selected") }
  } else if (level == 'Level500Account') {
    if ($('level50_account_indicator')) { $('level50_account_indicator').removeClassName("selected") }
    if ($('level100_account_indicator')) { $('level100_account_indicator').removeClassName("selected") }
    if ($('level250_account_indicator')) { $('level250_account_indicator').removeClassName("selected") }
    if ($('level500_account_indicator')) { $('level500_account_indicator').addClassName("selected") }
    if ($('level1000_account_indicator')) { $('level1000_account_indicator').removeClassName("selected") }
  } else if (level == 'Level250Account') {
    if ($('level50_account_indicator')) { $('level50_account_indicator').removeClassName("selected") }
    if ($('level100_account_indicator')) { $('level100_account_indicator').removeClassName("selected") }
    if ($('level250_account_indicator')) { $('level250_account_indicator').addClassName("selected") }
    if ($('level500_account_indicator')) { $('level500_account_indicator').removeClassName("selected") }
    if ($('level1000_account_indicator')) { $('level1000_account_indicator').removeClassName("selected") }
  } else if (level == 'Level100Account') { 
    if ($('level50_account_indicator')) { $('level50_account_indicator').removeClassName("selected") }
    if ($('level100_account_indicator')) { $('level100_account_indicator').addClassName("selected") }
    if ($('level250_account_indicator')) { $('level250_account_indicator').removeClassName("selected") }
    if ($('level500_account_indicator')) { $('level500_account_indicator').removeClassName("selected") }
    if ($('level1000_account_indicator')) { $('level1000_account_indicator').removeClassName("selected") }
  } else { 
    if ($('level50_account_indicator')) { $('level50_account_indicator').addClassName("selected") }
    if ($('level100_account_indicator')) { $('level100_account_indicator').removeClassName("selected") }
    if ($('level250_account_indicator')) { $('level250_account_indicator').removeClassName("selected") }
    if ($('level500_account_indicator')) { $('level500_account_indicator').removeClassName("selected") }
    if ($('level1000_account_indicator')) { $('level1000_account_indicator').removeClassName("selected") }
  }
  
  $('chosen_level').value = level
  
}