﻿/* Commun */

var lng = function(sf, se) {
	return (Site.lngId == 'f') ? sf : se;
}

var log = function(s) {
	if(!Site.dev) return null;
	if(!$dev) $dev = new Dev();
	$dev.log(s);
}

var logError = function(s) {
	log('<strong class="error">' + s + '</strong>');
}

var objInspect = function(o) {
	o = o || {};
	return '{ ' + Object.keys(o).map(function(k) { return k + ':' + o[k] }).join(', ') + ' }';
}

var Dev = Class.create({
	initialize: function() {
		this.elements = {
			dev: $E('div', 'dev'),
			log: $E('ul', 'log'),
		};

		this.init = false;
	},
	
	initInterface: function() {
		document.body.insert({ top: this.elements.dev });
		this.elements.dev.insert(this.elements.log);
		document.body.addClassName('dev');
		this.init = true;
	},
	
	log: function(s) {
		if(!this.init) this.initInterface();
	
		this.elements.log.insert({
			top: $E('li').update(this.elements.log.childElements().size() + ': ' + s)
		});
	},
});

var $E = function(tag, idName, attr) {
	attr = attr || {};
	if(idName) attr['id'] = idName;
	return new Element(tag, attr);
}

var $e = function(tag, attr) {
	return new Element(tag, attr);
}

var $LINK = function(href, idName, attr) {
	attr = attr || {};
	attr.href = href || '#';
	if(idName) attr['id'] = idName;
	return new Element('a', attr);
}

var $link = function(href, attr) {
	attr = attr || {};
	attr.href = href || '#';
	return new Element('a', attr);
}

var $IMG = function(src, idName, attr) {
	attr = attr || {};
	attr.src = src;
	if(idName) attr['id'] = idName;
	return new Element('img', attr);
}

var $img = function(src, attr) {
	attr = attr || {};
	attr.src = src;
	return new Element('img', attr);
}

var clearDiv = function() {
	return $e('div', { 'class': 'clear' });
}

var track = function(href) {
	if(!Site.interne && (typeof(pageTracker) !== 'undefined')) {
		//log('tracking ' + href);
		pageTracker._trackPageview(href);
	}
}

var Options = {
	filter: function(options, defaults) {
		options = options || {};
		defaults = defaults || {};
		
		for(k in defaults) {
			if(typeof(options[k]) === 'undefined') {
				options[k] = defaults[k];
			}
		}
		
		return options;
	},
};

var makeSelectFunc = function(container) {
	return container ? $(container).select.bind($(container)) : $$;
}

var zero2 = function(n) {
	var s = n.toString();
	if(s.length == 0) return '00'
	else if(s.length == 1) return '0' + s
	else return s;
}

var fixAjaxUrl = function(url) {
	return url + ((url.match(/\?/)) ? '&' : '?') + 'ajax=1';
}

/* Specifique */

var Store = Class.create({
	initialize: function(options) {
		this.options = Options.filter(options, {
			cookieExpires: 3600*24*7,
			cookiePath: '/',
			cookieDomain: '',
			cookieSecure: false,
		});
	
		this.useLocalStorage = Store.supportsHtml5Storage();
		this.useCookieJar = Store.supportsCookieJar();
	
		if(this.useCookieJar) {
			this.jar = new CookieJar({
				expires: this.options.cookieExpires, // seconds
				path: this.options.cookiePath,
				domain: this.options.cookieDomain,
				secure: this.options.cookieSecure ? 'true' : 'false',
			});
		}
	},

	put: function(name, value) {
		if(this.useLocalStorage) {
			localStorage.setItem(name, Object.toJSON(value));
		} else if(this.useCookieJar) {
			this.jar.put(name, value);
		}
	},
	
	get: function(name) {
		var ret;
		
		if(this.useLocalStorage) {
			ret = localStorage.getItem(name);
			
			if(ret && ret.isJSON && ret.isJSON()) {
				ret = ret.evalJSON(true);
			}
		}
		
		if((!this.useLocalStorage || !ret) && this.useCookieJar) {
			ret = this.jar.get(name);
		}
		
		return ret;
	},
});

Store.supportsHtml5Storage = function() {
  try {
    return 'localStorage' in window && window['localStorage'] !== null;
  } catch (e) {
    return false;
  }
}

Store.supportsCookieJar = function() {
	return typeof(CookieJar) !== 'undefined';
}

var Panier = Class.create({
	initialize: function() {
		if($('btn-maj')) $('btn-maj').hide();
	
		$$('#panier-achats input[type="text"]').each(function(e) {
			new Form.Element.Observer(e, 0.2, function(input) {
				$('btn-maj').show();
			});
		});
	
		if($('paypal-form') && !Site.interne) $('paypal-form').submit();
	},
});

var Titre = Class.create({
	initialize: function(element, options) {
		this.titre = element;
		
		this.options = Options.filter(options, {
			longLength: 20,
			veryLongLength: 50,
		});
		
		this.setup();
	},
	
	setup: function() {
		var s = this.titre.innerHTML.strip().stripTags();
		
		if(s.length > this.options.longLength) {
			this.titre.addClassName('long');
		}

		if(s.length > this.options.veryLongLength) {
			this.titre.addClassName('very-long');
		}
	},
});

var PairImpair = Class.create({
	initialize: function(container, options) {
		this.container = container;
		this.containerSelector = this.container.tagName;

		if(this.container.className) {
			this.containerSelector += '.' + this.container.className;
		}

		this.options = Options.filter(options, {
			childSelector: '>li',
			startIndex: 0,
		});
		
		this.index = this.options.startIndex || 0;

		this.build();
	},
	
	build: function() {
		if(this.container.hasClassName('pair-impair')) {
			return this;
		}
		
		this.items = this.container.select(this.options.childSelector).findAll(function(item) {
			return item.visible();
		});
		
		this.items.each(function(item) {
			if(((this.index+1) % 2) > 0) {
				item.addClassName('impair')
				item.removeClassName('pair')
			} else {
				item.addClassName('pair');
				item.removeClassName('impair');
			}
			
			this.index++;
			
			item.select(this.containerSelector).each(function(container) {
				this.index = new PairImpair(container, {
					childSelector: this.childSelector,
					startIndex: this.index,
				}).index;
			}.bind(this));
		}.bind(this));
		
		this.container.addClassName('pair-impair');
		return this;
	},
});

ShareBtn = Class.create({
	initialize: function(btn, options) {
		this.btn = btn;
		
		this.attr = (function() {
			var attr = {};

			this.btn.select('input').each(function(input) {
				attr[input.name] = input.value;
			}.bind(this));
			
			return attr;
		}.bind(this))();
		
		this.status = {
			init: false,
			open: false,
		};
		
		this.elements = {};
		this.observe();
	},
	
	observe: function() {
		this.btn.observe('click', this.btnClick.bind(this));
		document.body.observe('click', this.bodyClick.bind(this));
	},
	
	btnClick: function(event) {
		this.btn.blur();
	
		if(!this.status.open) {
			this.init();
			this.make();
			this.open();
			track(this.btn.href.sub(/#/, '::'));

		} else {
			this.close();
		}
		
		event.stop();
	},
	
	bodyClick: function(event) {
		this.close();
	},
	
	init: function() {
		if(this.status.init) return;
		
		if($('share')) {
			this.elements.share = $('share');

		} else {
			this.elements.share = $E('div', 'share');
			this.elements.btn = {};
			var ul = $e('ul');
			
			['plusone', 'facebook', 'twitter'].each(function(evil) {
				this.elements.btn[evil] = $e('li', {
					className: evil,
				});
				
				ul.insert(this.elements.btn[evil]);
			}.bind(this));
			
			document.body.insert(this.elements.share.update(ul));
		}
		
		this.status.init = true;
	},
	
	plusone: function() {
		return $e('g:plusone', {
			'size': 'medium',
			'href': this.attr['share_link'],
		});
	},
	
	facebook: function() {
		var src = 'http://www.facebook.com/plugins/like.php' +
			'?locale=' + lng('fr_CA', 'en_US') +
			'&amp;href=' + encodeURIComponent(this.attr['share_link']) +
			'&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false' +
			'&amp;action=like&amp;colorscheme=light&amp;font&amp;height=20'
			
		return '<iframe src="' + src + '" scrolling="no" frameborder="0" allowtransparency="no"></iframe>';
	},
	
	twitter: function() {
		var src = 'http://platform.twitter.com/widgets/tweet_button.html' +
			'?url=' + encodeURIComponent(this.attr['share_link']) +
			'&amp;text=' + encodeURIComponent(this.attr['share_text']) +
			'&amp;count=none&amp;lang=' + lng('fr', 'en');
			
		return '<iframe src="' + src + '" scrolling="no" frameborder="0" allowtransparency="no"></iframe>';
	},
	
	make: function() {
		this.elements.btn.plusone.update(this.plusone());
		this.elements.btn.facebook.update(this.facebook());
		this.elements.btn.twitter.update(this.twitter());
		
		ShareBtn.refreshAll(this.elements.share);
	},
	
	open: function() {
		var offsetX = this.btn.cumulativeOffset().left;
		var offsetY = this.btn.cumulativeOffset().top;
		var width = this.btn.measure('border-box-width');
		var height = this.btn.measure('border-box-height');
		
		var x = offsetX;
		var y = offsetY + height;
		
		this.elements.share.setStyle({
			top: y + 'px',
			left: x + 'px',
		});
		
		this.btn.addClassName('actif');
		this.elements.share.addClassName('open');
		this.status.open = true;
	},
	
	close: function() {
		if(!this.status.open) return;
		this.btn.removeClassName('actif');
		this.elements.share.removeClassName('open');
		this.status.open = false;
	},
});

ShareBtn.refreshAll = function(container) {
	if((typeof(gapi) !== 'undefined') && gapi.plusone) gapi.plusone.go(container);
}

DownloadBtn = Class.create({
	initialize: function(btn, options) {
		this.btn = btn;
		
		this.status = {
			init: false,
		};
		
		this.elements = {};
		this.observe();
	},
	
	observe: function() {
		this.btn.observe('click', this.btnClick.bind(this));
	},
	
	btnClick: function(event) {
		this.btn.blur();
		this.init();
		track(this.btn.href);
	},

	init: function() {
		this.status.init = true;
	},
});

Swipe = Class.create({
	// adapted from http://www.padilicious.com/code/touchevents/
	
	initialize: function(container, options) {
		this.container = container || document.body;

		this.options = Options.filter(options, {
			minLength: 72, // the shortest distance the user may swipe
		});
		
		this.dev = false;

		this.resetStatus();
		this.observing = false;
	},
	
	log: function(s) {
		if(this.dev) log(s);
	},
	
	startObserving: function(processingFunc) {
		this.processingFunc = processingFunc || Prototype.K;
		
		if(!this.observing) {
			this.container.observe('touchstart', this.touchStart.bind(this));
			this.container.observe('touchmove', this.touchMove.bind(this));
			this.container.observe('touchend', this.touchEnd.bind(this));
			this.container.observe('touchcancel', this.touchCancel.bind(this));
			this.observing = true;
		}
	},
	
	stopObserving: function() {
		if(this.observing) {
			this.container.stopObserving('touchstart', this.touchStart.bind(this));
			this.container.stopObserving('touchmove', this.touchMove.bind(this));
			this.container.stopObserving('touchend', this.touchEnd.bind(this));
			this.container.stopObserving('touchcancel', this.touchCancel.bind(this));
			this.observing = false;
		}
	},
	
	resetStatus: function() {
		this.status = {
			fingerCount: 0,
			startX: 0,
			startY: 0,
			curX: 0,
			curY: 0,
			deltaX: 0,
			deltaY: 0,
			horzDiff: 0,
			vertDiff: 0,
			length: 0,
			angle: null,
			direction: null,
			swipedElement: null,
		};
	},

	touchStart: function(event) {
		this.log('touchStart()');
		//event.preventDefault();
		this.status.fingerCount = event.touches.length;

		if(this.status.fingerCount == 1) {
			this.status.startX = event.touches[0].pageX;
			this.status.startY = event.touches[0].pageY;
			this.status.swipedElement = event.element();

		} else {
			this.touchCancel(event);
		}
	},

	touchMove: function(event) {
		this.log('touchMove()');
		//event.preventDefault();

		if(event.touches.length == 1) {
			this.status.curX = event.touches[0].pageX;
			this.status.curY = event.touches[0].pageY;

		} else {
			this.touchCancel(event);
		}
	},
	
	touchEnd: function(event) {
		this.log('touchEnd()');
		//event.preventDefault();

		if((this.status.fingerCount == 1) && (this.status.curX != 0)) {
			this.status.length = Math.round(Math.sqrt(Math.pow(this.status.curX - this.status.startX, 2) + Math.pow(this.status.curY - this.status.startY, 2)));
			
			if(this.status.length >= this.options.minLength) {
				this.caluculateAngle();
				this.determineSwipeDirection();
				this.processingFunc(this);
				this.touchCancel(event); // reset the variables

			} else {
				this.touchCancel(event);
			}	

		} else {
			this.touchCancel(event);
		}
	},

	touchCancel: function(event) {
		this.log('touchCancel()');
		this.resetStatus();
	},
	
	caluculateAngle: function() {
		var x = this.status.startX - this.status.curX;
		var y = this.status.curY - this.status.startY;
		var z = Math.round(Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2))); // the distance - rounded - in pixels
		var r = Math.atan2(y, x); // angle in radians (Cartesian system)
		this.status.angle = Math.round(r * 180 / Math.PI); // angle in degrees

		if(this.status.angle < 0) {
			this.status.angle = 360 - Math.abs(this.status.angle);
		}
	},
	
	determineSwipeDirection: function() {
		if((this.status.angle <= 45) && (this.status.angle >= 0)) {
			this.status.direction = 'left';
		} else if((this.status.angle <= 360) && (this.status.angle >= 315)) {
			this.status.direction = 'left';
		} else if((this.status.angle >= 135) && (this.status.angle <= 225)) {
			this.status.direction = 'right';
		} else if ((this.status.angle > 45) && (this.status.angle < 135)) {
			this.status.direction = 'down';
		} else {
			this.status.direction = 'up';
		}
	},
});

var Multi = Class.create({
	initialize: function(multi, container, options) {
		this.multi = multi;
		this.container = container || this.multi.up();
		this.options = Options.filter(options, {});
		this.pages = this.multi.select('li.page');
		this.setup();
		this.page(0);
	},

	setup: function() {
		this.index = null;
		this.maxIndex = this.pages.size() - 1;
		this.pages.invoke('hide');
		
		this.multi.select('a[href], area[href]').each(function(link) {
			linkHref = link.href;
		
			if(linkHref.match(/#multi\:.+$/)) {
				var target = linkHref.match(/#multi\:(.+)$/)[1];

				if(target.match(/^\d+$/)) {
					var newIndex = target * 1;
					
					link.observe('click', function(event) {
						link.blur();
						this.page(newIndex);
						event.stop();
					}.bind(this));

				} else if(target == 'next') {
					link.observe('click', function(event) {
						link.blur();
						this.next();
						event.stop();
					}.bind(this));

				} else if(target == 'previous') {
					link.observe('click', function(event) {
						link.blur();
						this.previous();
						event.stop();
					}.bind(this));
				}
			}
		}.bind(this));
	},

	page: function(newIndex) {
		if(this.index != null) {
			this.container.removeClassName('page-' + this.index);
			this.pages[this.index].hide();
		}
		
		this.index = newIndex;
		this.container.addClassName('page-' + this.index);
		this.pages[this.index].show();
		if(this.options.pageFunc) this.options.pageFunc(this);
	},
	
	next: function() {
		if(this.index == this.maxIndex) {
			this.page(0);
		} else {
			this.page(this.index + 1);
		}
	},
	
	previous: function() {
		if(this.index == 0) {
			this.page(this.maxIndex);
		} else {
			this.page(this.index - 1);
		}
	},
});

var Artwork = Class.create({
	initialize: function(options) {
		this.options = Options.filter(options, {
			defaultZoneWidth: 320,
			transition: Animator.tx.easeOut,
			transitionDuration: 300,
			forceClosed: false,
		});

		this.artwork = $('artwork');
		this.elements = {}
		
		this.setup();
	},

	setup: function() {
		this.showToggleBtn();
		this.setupDocumentLinks();
		this.artwork.addClassName('init');
		this.simple = this.artwork.hasClassName('simple');
		
		if(this.artwork.down('.multi')) {
			this.isMulti = true;
			
			this.multi = new Multi(this.artwork.down('.multi'), this.artwork, {
				pageFunc: function(multi) {
					this.refresh();
				}.bind(this),
			});
		}

		this.collectLinks();
		this.observe();
		this.artwork.removeClassName('init');
		this.state = false;
		
		if(!this.options.forceClosed && !this.simple) {
			this.show();
		}
	},
	
	observe: function() {
		this.resizeTimer = null;
		this.refresh();
	
		Event.observe(window, 'resize', function(event) {
			clearTimeout(this.resizeTimer);
		
			this.resizeTimer = setTimeout(function() {
				this.refresh();
			}.bind(this), 100);
		}.bind(this));
	},
	
	refresh: function() {
		if($zones && $zones.zoneFit < 2) {
			this.hideToggleBtn();
		} else {
			this.showToggleBtn();
		}

		if(!this.state) return;
		this.adjustFromViewport();
	},
	
	adjustFromViewport: function() {
		if((this.viewportWidth == document.viewport.getWidth()) && (this.viewportHeight == document.viewport.getWidth())) {
			return;
		}
	
		this.viewportWidth = document.viewport.getWidth();
		this.viewportHeight = document.viewport.getHeight();
		this.containerWidth = this.artwork.measure('width');
		this.containerHeight = this.artwork.measure('height');

		if($zones) {
			this.zoneWidth = this.zoneWidth || $zones.options.zoneWidth;
		}

		var zoneWidth = this.zoneWidth || this.options.defaultZoneWidth;
		
		if(this.viewportWidth < (this.containerWidth + zoneWidth)) {
			this.containerWidth = this.viewportWidth - zoneWidth;
			this.artwork.setStyle({ 'width': this.containerWidth + 'px' });
		}

		if(this.viewportHeight < this.containerHeight) {
			this.containerHeight = this.viewportHeight;
			this.artwork.setStyle({ 'height': this.containerHeight + 'px' });
		}
		
		if(this.simple) {
			this.elements.simple = this.elements.simple || $('simple-artwork');
			this.elements.simpleImg = this.elements.simpleImg || this.elements.simple.down('img');
			this.simpleWidth = this.simpleWidth || this.elements.simple.measure('width');
			this.simpleHeight = this.simpleHeight || this.elements.simple.measure('height');

			if(this.simpleWidth > this.containerWidth) {
				var newWidth = this.containerWidth;
	
				this.elements.simpleImg.setStyle({
					'width': newWidth + 'px',
				});
			}
			
			if(this.simpleHeight > this.containerHeight) {
				var newHeight = this.containerHeight;
	
				this.elements.simpleImg.setStyle({
					'height': newHeight + 'px',
					'width': 'auto',
				});
			}
			
			this.center(this.elements.simple);
		}

		this.artwork.select('.do-center').each(function(e) {
			this.center(e);
		}.bind(this));
		
		this.init = true;
	},
	
	center: function(element) {
		element.setStyle({
			'position': 'absolute',
		});
		
		var width = element.measure('width');
		var height = element.measure('height');
		
		if(width > 0) {
			element.setStyle({
				'top': ((this.containerHeight - height) / 2) + 'px',
				'left': ((this.containerWidth - width) / 2) + 'px',
			});

		} else {
			this.centerTimer = setTimeout(function() {
				this.center(element);
			}.bind(this), 200);
		}
	},
	
	setupToggleBtn: function() {
		this.elements.toggleBtn = $link('#artwork').update($img(Site.baseUrl + '/drones/res/element/btn-pochette-gros.png'));
		$footer.addBtn(this.elements.toggleBtn, 'btn-artwork');
	},
	
	showToggleBtn: function() {
		if(!this.elements.toggleBtn) this.setupToggleBtn();
		this.elements.toggleBtn.show();
		document.body.addClassName('with-artwork');
	},

	hideToggleBtn: function() {
		if(!this.elements.toggleBtn) this.setupToggleBtn();
		this.hide();
		this.elements.toggleBtn.hide();
		document.body.removeClassName('with-artwork');
	},

	setupDocumentLinks: function() {
		$$('a[href="#artwork"]').each(function(link) {
			link.observe('click', function(event) {
				link.blur();
				this.toggle();
				event.stop();
			}.bind(this));
		}.bind(this));

		$$('a[href="#artwork-off"]').each(function(link) {
			link.observe('click', function(event) {
				link.blur();
				this.hide();
				event.stop();
			}.bind(this));
		}.bind(this));
	},

	show: function() {
		if(this.state) return;

		this.state = true;		
		if($header) $header.enableMenuToggle();
		if($zones) $zones.resetIndex();
		
		if(false && Prototype.Browser.MobileSafari) {
			document.body.addClassName('artwork-on');
			this.artwork.addClassName('actif');
			this.refresh();

		} else {
			var zoneWidth = this.zoneWidth || this.options.defaultZoneWidth;
			var viewportWidth = document.viewport.getWidth();

			this.artwork.setStyle({
				'left': viewportWidth + 'px',
				'right': (0 - (viewportWidth - zoneWidth)) + 'px',
			});
			
			document.body.addClassName('artwork-on');
			this.artwork.addClassName('actif');
			this.refresh();
			if(this.animator) this.animator.stop();
	
			this.animator = new Animator({
				transition: this.options.transition,
				duration: this.options.transitionDuration,
				interval: 5,
				from: viewportWidth,
				to: zoneWidth,

				onComplete: function() {
					this.animator = null;
				}.bind(this),

			}).addSubject(function(value, state) {
				this.artwork.setStyle({
					'left': state + 'px',
					'right': (0 - (state - zoneWidth)) + 'px',
				});
			}.bind(this));
			
			this.animator.play();

			/*
			new Effect.Tween(this.artwork, viewportWidth, zoneWidth, {
				transition: this.options.transition,
				duration: this.options.transitionDuration,
	
			}, function(p) {
				this.artwork.setStyle({
					'left': p + 'px',
					'right': (0 - (p - zoneWidth)) + 'px',
				});
			}.bind(this));
			*/
		}
	},
	
	hide: function() {
		if(!this.state) return;
		this.state = false;
		if($header) $header.disableMenuToggle();

		if(false && Prototype.Browser.MobileSafari) {
			this.artwork.removeClassName('actif');
			document.body.removeClassName('artwork-on');

		} else {
			var zoneWidth = this.zoneWidth || this.options.defaultZoneWidth;
			var viewportWidth = document.viewport.getWidth();
			if(this.animator) this.animator.stop();
	
			this.animator = new Animator({
				transition: this.options.transition,
				duration: this.options.transitionDuration,
				from: zoneWidth,
				to: viewportWidth,

				onComplete: function() {
					this.animator = null;
					this.artwork.removeClassName('actif');
					document.body.removeClassName('artwork-on');
					if($zones) $zones.refresh();
				}.bind(this),

			}).addSubject(function(value, state) {
				this.artwork.setStyle({
					'left': state + 'px',
					'right': (0 - (state - zoneWidth)) + 'px',
				});
			}.bind(this));
			
			this.animator.play();

			/*
			new Effect.Tween(this.artwork, zoneWidth, viewportWidth, {
				transition: this.options.transition,
				duration: this.options.transitionDuration,
	
			}, function(p) {
				this.artwork.setStyle({
					'left': p + 'px',
					'right': (0 - (p - zoneWidth)) + 'px',
				});
				
				if(p == viewportWidth) {
					this.artwork.removeClassName('actif');
					document.body.removeClassName('artwork-on');
					if($zones) $zones.refresh();
				}
			}.bind(this));
			*/
		}
	},
	
	freezeBody: function() {
		document.body.addClassName('freeze');
	},
	
	unfreezeBody: function() {
		document.body.removeClassName('freeze');
	},

	toggle: function() {
		if(this.state) {
			if(this.isMulti && (this.multi.index < this.multi.maxIndex)) {
				this.multi.next();
			} else {
				this.hide();
			}

		} else {
			if(this.isMulti) this.multi.page(0);
			this.show();
		}
	},
	
	collectLinks: function() {
		this.links = [];
	
		this.artwork.select('a').each(function(element, index) {
			var link = {
				element: element,
				focus: false,
			};
		
			if(element.onmouseover) {
				link.onmouseover = element.onmouseover;
				element.onmouseover = undefined;
			}

			if(element.onmouseout) {
				link.onmouseout = element.onmouseout;
				element.onmouseout = undefined;
			}
			
			link.addFocus = function() {
				this.element.addClassName('with-focus');
				this.focus = true;
			}
			
			link.removeFocus = function() {
				this.element.removeClassName('with-focus');
				this.focus = false;
			}
			
			link.mouseover = function(event) {
				if(this.onmouseover) {
					this.onmouseover.bind(this.element)(event);
				}
			}

			link.mouseout = function(event) {
				if(!this.focus) {
					if(this.onmouseover) {
						this.onmouseover.bind(this.element)(event);
					}
					
					if(this.onmouseout) {
						this.onmouseout.bind(this.element)(event);
					}
				}
			}
			
			element.observe('mouseover', link.mouseover.bind(link));
			element.observe('mouseout', link.mouseout.bind(link));
			
			this.links[index] = link;
		}.bind(this));
	},
});

Artwork.found = function() {
	return !!$('artwork');
}

var ListNav = Class.create({
	initialize: function(element, zone, options) {
		this.element = element;
		this.zone = zone;

		this.options = Options.filter(options, {
			expand: this.element.hasClassName('expand'),
		});
		
		this.element.removeClassName('expand');
		this.className = this.element.className;

		this.items = element.select('>li').map(function(element) {
			return {
				element: element,
			};
		}.bind(this));
		
		this.here = this.items.detect(function(item) {
			return item.element.hasClassName('here');
		}.bind(this));
		
		this.hasZones = false;
		this.parse();
		new PairImpair(this.element);
		ListNav.register(this);
	},
	
	parse: function() {
		this.items.each(function(item) {
			item.link = item.element.down('>a');
			
			if(item.link) {
				item.title = item.link.innerHTML;
				item.sub = item.element.down('>ul');
				
				if(item.sub) {
					item.sub.addClassName(this.className);
					if(this.options.expand) this.expandItem(item);
				}
	
				item.link.observe('click', function(event) {
					if(this.here != item) {
						this.setHere(item);
					} else {
						this.unHere();
					}
					
					if(this.hasZones) $zones.refreshTwice({ force: true });
					item.link.blur();
					if(item.link.href.match(/#expand$/)) event.stop();
				}.bind(this));
			}
		}.bind(this));
	},

	setHere: function(item) {
		if(this.options.parent) this.options.parent.cleanUpHeres();
		this.unHere();
		this.here = item;
		if(this.here.zone) $zones.showZone(this.here.zone, { refresh: false });
		$zones.calcZoneDim();
		var newZoneIndex = $zones.getZoneIndex(this.zone) + 1;

		if(!$zones.indexVisible(newZoneIndex)) {
			$zones.jumpToIndex(newZoneIndex, { refresh: false });
		}
		
		this.here.element.addClassName('path');
	},
	
	unHere: function(options) {
		options = Options.filter(options, {
			recursive: false,
		});
	
		if(this.here) {
			if(this.here.zone) $zones.hideZone(this.here.zone, { refresh: false });
			this.here.element.removeClassName('path');
		}

		this.here = null;
		
		if(options.recursive) {
			this.items.each(function(item) {
				if(item.nav) item.nav.unHere();
			}.bind(this));
		}
	},
	
	cleanUpHeres: function() {
		this.items.each(function(item) {
			if(this.here != item) {
				if(item.nav) item.nav.unHere({ recursive: true });
			}
		}.bind(this));
	},
	
	expandItem: function(item) {
		this.hasZones = true;
		item.zone = $zones.addZone({ hidden: true });
		var part = $zones.addPart(item.zone);
		part.insert($e('div', { className: 'part-titre' }).update(item.title));
		part.insert(item.sub);
		$zones.insertZone(item.zone, { following: this.options.zone });

		item.nav = new ListNav(item.sub, item.zone, {
			parent: this,
		});
	},
});

ListNav.all = [];
ListNav.allElements = [];

ListNav.register = function(listNav) {
	ListNav.all.push(listNav);
	ListNav.allElements.push(listNav.element);
}

ListNav.includeElement = function(element) {
	return ListNav.allElements.include(element);
}

var Zones = Class.create({
	initialize: function(options) {
		this.options = Options.filter(options, {
			zoneWidth: 320,
			minGap: 10,
			scrollTransition: Animator.tx.easeOut,
			scrollTransitionDuration: 600,
			adjustTransition: Animator.tx.elastic,
			adjustTransitionDuration: 200,
			observeSwipe: false,
		});

		this.container = $('zones');
		this.wrap = this.container.hasClassName('wrap');

		this.zones = this.container.select('.zone').map(function(element) {
			return this.newZone(element);
		}.bind(this));
		
		if(this.zones.size() == 0) return;
		this.observe();
		this.index = 0;
		this.setupNav();
		this.refresh();
		this.init = true;
		document.body.addClassName('zones-init');
		this.refresh();
	},
	
	observe: function() {
		this.resizeTimer = null;
	
		Event.observe(window, 'resize', function(event) {
			clearTimeout(this.resizeTimer);
		
			this.resizeTimer = setTimeout(function() {
				this.refresh();
			}.bind(this), 100);
		}.bind(this));
	},
	
	refreshTwice: function(options) {
		options = Options.filter(options, {
			refreshTwiceDelay: 10000,
		});
	
		this.refresh(options);

		setTimeout(function() {
			this.refresh(options);
		}.bind(this), options.refreshTwiceDelay);
	},
	
	refresh: function(options) {
		options = Options.filter(options, {
			force: false,
		});
	
		if(this.refreshing) {
			setTimeout(function() {
				this.refresh(options);
			}.bind(this), 200);

			return;
		}
		
		this.refreshing = true;
		this.adjustFromViewport(options);
		this.classify();
		if(!this.init || options.force) this.adjustPoints();
		
		this.activateNav({
			next: (this.maxIndex > 0),
			previous: (((this.maxIndex > 1) && (this.index > 0)) || (this.wrap && (this.maxIndex > 0))),
			points: (this.maxIndex > 0),
		});
		
		this.observeSwipe(this.maxIndex > 0);
		this.adjustScroll();
		
		this.container.setStyle({
			'height': this.maxHeight + 'px',
			'width': document.viewport.getWidth() + 'px',
			'overflow': 'hidden',
		});
		
		if($header) $header.refresh(this.zoneFit < 2);
		
		this.init = true;
		this.refreshing = false;
	},
	
	adjustFromViewport: function(options) {
		options = Options.filter(options, {
			force: false,
		});
	
		var viewportWidth = document.viewport.getWidth();
		if(!options.force && (viewportWidth == this.viewportWidth)) return;
		this.viewportWidth = viewportWidth;
		this.calcZoneDim();

		if(options.force) {
			this.maxHeight = this.getMaxHeight();
		} else {
			this.maxHeight = this.maxHeight || this.getMaxHeight();
		}
		
		this.viewportWidth = document.viewport.getWidth();

		this.visibleZones().each(function(zone, index) {
			var newLeft = Math.round((this.options.zoneWidth + this.gap) * index);
			zone.left = zone.left || zone.element.style.left.gsub(/[^\d\.]/, '') * 1;
			
			if(this.init) {
				this.tweenZone(zone, newLeft);
			} else {
				this.positionZone(zone, newLeft);
			}
			
			zone.left = newLeft;
		}.bind(this));

		this.hiddenZones().each(function(zone, index) {
			var newLeft = 0 - this.options.zoneWidth;
			zone.left = zone.left || zone.element.style.left.gsub(/[^\d\.]/, '') * 1;
			
			if(this.init) {
				this.tweenZone(zone, newLeft);
			} else {
				this.positionZone(zone, newLeft);
			}
			
			zone.left = newLeft;
		}.bind(this));
	},
	
	classify: function() {
		if(this.zoneFit == 1) {
			document.body.addClassName('single-zone');
			document.body.removeClassName('double-zone');
		} else if(this.zoneFit == 2) {
			document.body.removeClassName('single-zone');
			document.body.addClassName('double-zone');
		} else {
			document.body.removeClassName('single-zone');
			document.body.removeClassName('double-zone');
		}
	},
	
	adjustScroll: function() {
		var newScrollLeft = (this.options.zoneWidth + this.gap) * this.index;
		
		if(this.container.scrollLeft != newScrollLeft) {
			if(this.adjustAnimator) this.adjustAnimator.stop();
			
			this.adjustAnimator = new Animator({
				transition: this.options.scrollTransition,
				duration: this.options.scrollTransitionDuration,
				interval: 20,
				from: this.container.scrollLeft,
				to: newScrollLeft,

				onComplete: function() {
					this.adjustAnimator = null;
				}.bind(this),

			}).addSubject(function(value, state) {
				this.container.scrollLeft = state;
			}.bind(this));
			
			this.adjustAnimator.play();

			/*
			new Effect.Tween(this.container, this.container.scrollLeft, newScrollLeft, {
				transition: this.options.scrollTransition,
				duration: this.options.scrollTransitionDuration,
			}, function(p) {
				log(p);
				this.container.scrollLeft = p;
			}.bind(this));
			*/
		}
	},
	
	zoneCount: function(options) {
		options = Options.filter(options, {
			all: false,
		});
	
		if(options.all) {
			return this.zones.size();

		} else {
			return this.visibleZones().size();
		}
	},
	
	visibleZones: function() {
		return this.zones.findAll(function(zone) {
			return !zone.hidden;
		}.bind(this));
	},
	
	hiddenZones: function() {
		return this.zones.findAll(function(zone) {
			return zone.hidden;
		}.bind(this));
	},
	
	fitZones: function() {
		return this.visibleZones().slice(this.index, this.index + this.zoneFit);
	},
	
	getZoneIndex: function(zone) {
		var zoneIndex = null;

		this.visibleZones().each(function(findZone, index) {
			if((zoneIndex === null) && (zone == findZone)) {
				zoneIndex = index;
			}
		}.bind(this));
		
		return zoneIndex;
	},
	
	getMaxHeight: function() {
		var maxHeight = 0;
		
		this.zones.each(function(zone) {
			var height = zone.element.measure('border-box-height');
			if(height > maxHeight) maxHeight = height;
		}.bind(this));
		
		return maxHeight;
	},
	
	getFitHeight: function() {
		var fitHeight = 0;
		
		this.fitZones().each(function(zone) {
			var height = zone.element.measure('border-box-height');
			if(height > fitHeight) fitHeight = height;
		}.bind(this));
		
		return fitHeight;
	},
	
	calcZoneDim: function() {
		this.zoneFit = (function() {
			var zoneFit = Math.floor(this.viewportWidth / this.options.zoneWidth);
			
			if((zoneFit > 1) && (this.options.minGap > 0)) {
				var testViewportWidth = this.viewportWidth - (this.options.minGap * (zoneFit - 1));
				var testZoneFit = Math.floor(testViewportWidth / this.options.zoneWidth);
				if(testZoneFit < zoneFit) zoneFit = testZoneFit;
			}

			if(Site.testMobile) zoneFit = 1; // test pour mobile
			return zoneFit;
		}.bind(this))();
		
		this.step = (function() {
			var step = Math.round(this.zoneFit / 2);
			return (step < 1) ? 1 : step;
		}.bind(this))();
		
		this.gapFit = (function() {
			var gapFit = this.zoneFit - 1;
			return (gapFit < 1) ? 1 : gapFit;
		}.bind(this))();
		
		this.gap = (this.viewportWidth - (this.options.zoneWidth * this.zoneFit)) / this.gapFit;

		this.maxIndex = (function() {
			var maxIndex = this.zoneCount() - this.zoneFit;
			return (this.maxIndex < 0) ? 0 : maxIndex;
		}.bind(this))();

		if(this.index > this.maxIndex) this.index = this.maxIndex;
	},
	
	tweenZone: function(zone, newLeft) {
		if(zone.animator) zone.animator.stop();
			
		zone.animator = new Animator({
			from: zone.left,
			to: newLeft,
			transition: this.options.adjustTransition,
			duration: this.options.adjustTransitionDuration,
			onComplete: function() { zone.animator = null; },

		}).addSubject(function(value, state) {
			zone.element.setStyle({ 'left': state + 'px' });
		}.bind(this));
		
		zone.animator.play();
	},
	
	positionZone: function(zone, newLeft) {
		zone.element.setStyle({ 'left': newLeft + 'px' });
	},

	nextIndex: function(options) {
		options = Options.filter(options, {
			refresh: true,
		});
	
		if($artwork) $artwork.hide();

		if(this.index == this.maxIndex) {
			this.index = 0;
		} else {
			this.index += this.step;
		}

		if(this.index > this.maxIndex) this.index = this.maxIndex;
		if(options.refresh) this.refresh();
	},
	
	previousIndex: function(options) {
		options = Options.filter(options, {
			refresh: true,
		});
	
		if($artwork) $artwork.hide();

		if(this.index == 0) {
			this.index = this.maxIndex;
		} else {
			this.index -= this.step;
		}

		if(this.index < 0) this.index = 0;
		if(options.refresh) this.refresh();
	},
	
	jumpToIndex: function(index, options) {
		options = Options.filter(options, {
			refresh: true,
		});
	
		this.index = index;
		if(this.index < 0) this.index = 0;
		if(this.index > this.maxIndex) this.index = this.maxIndex;
		if(options.refresh) this.refresh();
	},
	
	jumpToZone: function(zone, options) {
		this.jumpToIndex(this.getZoneIndex(zone), options);
	},
	
	indexVisible: function(index) {
		return ((index >= this.index) && (index < (this.index + this.zoneFit)));
	},
	
	resetIndex: function(options) {
		options = Options.filter(options, {
			refresh: true,
		});
	
		this.index = 0;
		if(options.refresh) this.refresh();
	},
	
	setupNav: function() {
		this.nav = {
			next: $link('#zone:next').update($img(Site.baseUrl + '/drones/res/element/btn-continue-gros.png')),
			previous: $link('#zone:previous').update($img(Site.baseUrl + '/drones/res/element/btn-retourne-gros.png')),
			points: $e('ul'),
		};
		
		$footer.addBtn(this.nav.next, 'btn-zone-next');
		
		this.nav.next.observe('click', function(event) {
			this.nav.next.blur();
			this.nextIndex();
			event.stop();
		}.bind(this));
		
		$footer.addBtn(this.nav.previous, 'btn-zone-previous');

		this.nav.previous.observe('click', function(event) {
			this.nav.previous.blur();
			this.previousIndex();
			event.stop();
		}.bind(this));
		
		this.nav.points.addClassName('actif');
		$footer.addBtn(this.nav.points, 'zone-points');
		
		if(this.options.observeSwipe) {
			this.swipe = new Swipe(document.body);
		}
	},
	
	adjustPoints: function() {
		this.nav.points.update();
		this.points = [];
		
		this.visibleZones().map(function(zone, index) {
			this.points[index] = {
				element: $e('li'),
				link: $link('#zone:' + index).update('&nbsp;'),
			};
			
			this.points[index].link.observe('click', function(event) {
				event.stop();
				this.points[index].link.blur();
				var newIndex = index - Math.floor(this.zoneFit / 2);
				this.jumpToIndex(newIndex);
			}.bind(this));

			this.points[index].element.insert(this.points[index].link);
		
			this.nav.points.insert({
				bottom: this.points[index].element,
			});
		}.bind(this));
	},
	
	activateNav: function(options) {
		['next', 'previous', 'points'].each(function(btn) {
			if(options[btn]) {
				this.nav[btn].show();
			} else {
				this.nav[btn].hide();
			}
		}.bind(this));
		
		if(options.points) {
			this.points.each(function(point, index) {
				if(index < this.index) {
					//log(index + '<' + this.index + '-> off');
					point.element.removeClassName('on');
				} else if(index < (this.index + this.zoneFit)) {
					//log(index + '<' + (this.index + this.zoneFit) + '-> on');
					point.element.addClassName('on');
				} else {
					//log(index + '>=' + (this.index + this.zoneFit) + '-> off');
					point.element.removeClassName('on');
				}
			}.bind(this));
		}
	},
	
	observeSwipe: function(status) {
		if(!this.options.observeSwipe) return;
	
		if(status) {
			this.swipe.startObserving(function(swipe) {
				if(swipe.status.direction == 'right') {
					this.previousIndex();
				} else if(swipe.status.direction == 'left') {
					this.nextIndex();
				}
			}.bind(this));

		} else {
			this.swipe.stopObserving();
		}
	},
	
	showZone: function(zone, options) {
		options = Options.filter(options, {
			refresh: true,
		});

		zone.hidden = false;

		if(options.refresh) this.refresh({
			force: true,
		});
	},
	
	hideZone: function(zone, options) {
		options = Options.filter(options, {
			refresh: true,
		});

		zone.hidden = true;
		if(options.refresh) this.refresh({ force: true });
	},
	
	newZone: function(element, options) {
		options = Options.filter(options, {
			hidden: false,
		});
		
		return {
			element: element,
			hidden: options.hidden,
		};
	},
	
	addZone: function(options) {
		options = Options.filter(options, {
			append: false,
			hidden: false,
		});
		
		var zone = this.newZone($e('li', { className: 'zone' }), options);
		this.zones.push(zone);
		if(options.append) this.insert(zone);
		return zone;
	},
	
	insertZone: function(zone, options) {
		options = Options.filter(options, {});
	
		if(options.following !== undefined) {
			options.following.element.insert({ after: zone.element });
		
		} else if(options.preceding !== undefined) {
			options.preceding.element.insert({ before: zone.element });
		
		} else if(options.position !== undefined) {
			if(options.position == 0) {
				this.container.insert({ top: zone.element });

			} else {
				var following = this.container.down('>.zone', options.position);
				
				if(following) {
					following.insert({ before: zone.element });
				} else {
					this.container.insert(zone.element);
				}
			}
		
		} else {
			this.container.insert(zone.element);
		}
		
		this.refresh({ force: true });
	},
	
	removeZone: function(zone) {
		zone.element.remove();
		this.refresh({ force: true });
	},
	
	addPart: function(zone, idName) {
		var parts = zone.element.down('ul.parts');
	
		if(!parts) {
			parts = $e('ul', { className: 'parts' });
			zone.element.insert(parts);
		}
		
		var part = $E('li', idName, { className: 'part' });
		parts.insert(part);
		return part;
	},
});

Zones.found = function() {
	return !!$('zones');
}

Header = Class.create({
	initialize: function() {
		this.header = $('header');

		this.elements = {
			logoPath: $('logo-path'),
			menu: $('nav-main'),
		},
		
		this.enabled = false;
		this.menuOpen = false;
		this.observing = false;
		this.refresh();
	},
	
	refresh: function(singleFit) {
		if(this.refreshing) {
			setTimeout(function() {
				this.refresh(singleFit);
			}.bind(this), 200);
			
			return;
		}
	
		this.refreshing = true;

		if(singleFit && !this.enabled) {
			this.enableMenuToggle();
		}
		
		this.refreshing = false;
	},
	
	createMenuToggle: function() {
		if(this.elements.menuToggle) return;
		
		this.elements.menuToggleBtn = $link('#menu-toggle').update(lng('Menu', 'Menu'));
		this.elements.menuToggle = $E('li', 'menu-toggle').update(this.elements.menuToggleBtn);
		this.elements.logoPath.down('ul').insert(this.elements.menuToggle);

		this.elements.menuToggleBtn.observe('click', this.btnClick.bind(this));
		document.body.observe('click', this.bodyClick.bind(this));
	},

	enableMenuToggle: function() {
		this.createMenuToggle();
		this.elements.menuToggle.addClassName('actif');
		this.enabled = true;
	},
	
	btnClick: function(event) {
		this.elements.menuToggleBtn.blur();
	
		if(this.enabled) {
			if(!this.menuOpen) {
				this.openMenu();
			} else {
				this.closeMenu();
			}
		}
		
		event.stop();
	},
	
	bodyClick: function(event) {
		this.closeMenu();
	},

	openMenu: function() {
		if($artwork) $artwork.hide();
		this.elements.menu.addClassName('open');
		this.menuOpen = true;
	},

	closeMenu: function() {
		this.elements.menu.removeClassName('open');
		this.menuOpen = false;
	},
	
	disableMenuToggle: function() {
		this.createMenuToggle();
		this.elements.menuToggle.removeClassName('actif');
		this.enabled = false;
	},
});

Header.found = function() {
	return !!$('header');
}

Footer = Class.create({
	initialize: function() {
		this.footer = $('footer');

		this.elements = {
			btn: $E('ul', 'nav-btn'),
		};
		
		this.footer.insert(this.elements.btn);
		this.observe();
		this.refresh();
	},
	
	observe: function() {
		if(!Site.noFixed || Site.mobile) return;
		Event.observe(document, 'scroll', this.refresh.bind(this), false);
		Event.observe(window, 'scroll', this.refresh.bind(this), false);
	},
	
	refresh: function() {
		if(!Site.noFixed || Site.mobile) return;
		this.scroll();
	},

	scroll: function(event) {
		var offsets = document.viewport.getScrollOffsets();

		this.footer.setStyle({
			bottom: (0 - offsets.top) + 'px',
		});
	},
	
	addBtn: function(btn, idName) {
		var li = $E('li', idName).update(btn);
		this.elements.btn.insert(li);
	},
});

Footer.found = function() {
	return !!$('footer');
}

var setupDocumentLinks = function(container) {
	var select = makeSelectFunc(container);
}

var setupDocument = function(container, options) {
	options = Options.filter(options, {
		initDocument: !container,
	});

	setupDocumentLinks(container);
	var select = makeSelectFunc(container);
	
	select('.titre, .vedette').each(function(titre) {
		new Titre(titre);
	});

	select('#nav-main ul, ul.cat-list, ul.piste-list, ul.bio-list').each(function(ul) {
		new PairImpair(ul);
	});

	if(options.initDocument) {
		if(Header.found()) $header = new Header();
		if(Footer.found()) $footer = new Footer();
		
		if(Zones.found()) {
			$zones = new Zones();
	
			$zones.zones.each(function(zone) {
				zone.element.select('ul.nav-list').each(function(nav) {
					if(!ListNav.includeElement(nav)) {
						new ListNav(nav, zone);
					}
				});
			});
		}
	
		if(Artwork.found()) $artwork = new Artwork();
	}
	
	select('a.share').each(function(link) {
		new ShareBtn(link);
	});
	
	select('a.download').each(function(link) {
		new DownloadBtn(link);
	});
	
	select('ul.bio-list ul.thumbs').each(function(ul) {
		ul.addClassName('actif');
	});

	// google +1, etc.
	ShareBtn.refreshAll(container);
}

var setupInterne = function() {
	if(!Site.interne) return false;
	document.body.addClassName('site-interne');
}

var initSiteDomLoaded = function(event) {
	$store = new Store();
	setupInterne();
	
	if(!!Prototype.Browser.MobileSafari) {
		Site.noFixed = true;
		document.body.addClassName('no-fixed');
	} else {
		Site.noFixed = false;
	}
	
	if(Site.mobile) {
		document.body.addClassName('mobile');
	}

	if(Site.tablet) {
		document.body.addClassName('tablet');
	}
	
	new Panier();
	setupDocument();
	if(Site.dev && !$dev) $dev = new Dev();
}

var initSiteAllLoaded = function(event) {
	Site.allLoaded = true;
	
	if(Site.mobile) {
		window.scrollTo(0, 1);
	}
}

Event.observe(document, 'dom:loaded', initSiteDomLoaded, false);
Event.observe(window, 'load', initSiteAllLoaded, false);

Site.allLoaded = false;
Site.interne = location.href.match(/^http:\/\/interne\.electrocd\.com/) || location.href.match(/^http:\/\/www\.dim\.qc\.ca/);
Site.dev = !!Site.interne;
Site.testMobile = false;
var $dev;
var $store;
var $artwork;
var $zones;
var $footer;

