/**
* File: http://www.garagemahals.com/assets/templates/main/js/scripts.js
*/
var Nav = new Class({
current: null,
showing: null,
mousehovertimer: null,
mouseouttimer: null,
initialize: function(el) {
this.addHandlers();
},
showHover: function(el){
// if we are hovering on menu open
// clear mouseouttimer so we don't hide
if (el.hasClass('open'))
{
$clear(this.mouseouttimer);
return;
}
if (this.showing)
{
this.showing.addClass('closed');
this.showing.removeClass('open');
}
if (this.current)
{
this.current.addClass('closed');
this.current.removeClass('open');
}
el.removeClass('closed');
el.addClass('open');
this.showing = el;
el.addEvent('mouseout', this.addMouseOut.bind(this, el));
},
addMouseOut: function(el) {
// if we entered on another delay, clear the delay and set a new one
// this allows us to compensate for child elements throwing mouseover
// and mouseout events of the parent element
if (this.mouseouttimer)
{
$clear(this.mouseouttimer)
this.mouseouttimer = this.hideHover.delay(1000, this, el);
return;
}else{
this.mouseouttimer = this.hideHover.delay(1000, this, el);
return;
}
},
hideHover: function(el){
// hide menu that is curertly showing
this.showing.addClass('closed');
this.showing.removeClass('open');
// show the menu that was open on page load
if (this.current)
{
this.current.addClass('open');
this.current.removeClass('closed');
}
},
addHandlers: function() {
$$('ul.nav li.hassub').each(this.addHoverHandler, this);
},
addHoverHandler: function(el) {
if (el.hasClass('open'))
{
this.showing = el;
this.current = el;
}
el.addEvent('mouseover', this.showHover.bind(this, el));
}
});
Subscribe = new Class({
initialize: function(el, lnk, big){
this.shown = false;
this.target = $(el);
this.lnk = $(lnk);
this.lnk.addEvent('click', this.toggle.bind(this));
// add the subscribe form to the wrapper
this.target.inject(this.lnk.getParent());
$('subscribe_cancel').addEvent('click', this.hide.bind(this));
$('subscribe_submit').addEvent('click', this.send.bind(this));
if (big)
var w = 450;
else
var w = 360;
this.target.setStyle('width', w + 'px');
$('subscribe_top').setStyle('width', w + 'px');
$('subscribe_top').set('src', '/rounded/sh_s/si_t/h_20/w_'+ w + '/r_15/fg_333133/bg_000000/');
$('subscribe_bottom').setStyle('width', w + 'px');
$('subscribe_bottom').set('src', '/rounded/sh_s/si_b/h_20/w_' + w + '/r_15/fg_333133/bg_000000/');
},
show: function(){
this.shown = true;
var height = this.target.getStyle('height');
var fx = new Fx.Morph(this.target, {duration: 'normal', transition: Fx.Transitions.Sine.easeOut});
// hide link button
this.lnk.setStyles({
'display': 'none',
'visibility': 'hidden'
});
// focus to input when completed open
fx.addEvent('complete', function(){
$('subscribe_name').focus();
});
// start to show - slide down
fx.start({
'height': [30, 220],
'display': ['none', 'block'],
'visibility': ['hidden', 'visible']
});
},
hide: function(){
this.shown = false;
var height = this.target.getStyle('height');
var fx = new Fx.Morph(this.target, {duration: 'normal', transition: Fx.Transitions.Sine.easeOut});
fx.addEvent('complete', this.hideComplete.bind(this));
fx.start({
'height': [220, 30]
});
},
hideComplete: function(){
this.target.setStyle('display', 'none');
this.lnk.setStyles({
'display': 'block',
'visibility': 'visible'
});
$('subscribe_status').setStyles({'display': 'none'});
$('subscribe_status').removeClass('err');
$('subscribe_fail').setStyles({'display': 'none'});
$('subscribe_controls').removeClass('err');
$('subscribe_form').reset();
$('subscribe_form').getElement('input[name=subscribe_name]').removeClass('err');
$('subscribe_form').getElement('input[name=subscribe_email]').removeClass('err');
},
toggle: function(evt){
evt.stop();
if (this.shown)
this.hide();
else
this.show();
},
send: function(){
if (!this.required())
{
this.sendFail();
return;
}
$('subscribe_status').setStyles({'display': 'block', 'opacity': '0.9'});
var req = new Request({
url: '/assets/ajax/subscribe.php',
method: 'post',
data: Hash.toQueryString({
name: $('subscribe_form').getElement('input[name=subscribe_name]').get('value'),
email: $('subscribe_form').getElement('input[name=subscribe_email]').get('value')
}),
onSuccess: this.sendSuccess.bind(this)
});
req.send();
},
sendSuccess: function() {
$('subscribe_status').set('html', 'Thank You!
You have subscribed to our news and updates.');
this.hide.delay(3000, this);
},
sendFail: function() {
$('subscribe_controls').addClass('err');
$('subscribe_fail').setStyles({'display': 'block'});
$('subscribe_fail').set('html', 'Please enter your name and email address.');
},
addClickHandler: function(lnk){
lnk.addEvent('click', this.show.bind(this));
},
required: function(){
var n = $('subscribe_form').getElement('input[name=subscribe_name]');
var e = $('subscribe_form').getElement('input[name=subscribe_email]');
var err = 0;
if (n.get('value').length <= 0)
{
n.addClass('err');
err++;
}
if (e.get('value').length <= 0)
{
e.addClass('err');
err++;
}
return !err;
}
});
Questions = new Class({
initialize: function(el) {
this.state = false;
this.target = $(el);
this.target.setStyle('opacity', 0);
this.target.addEvent('click', this.stopBubble.bind(this));
$(document.body).addEvent('click', this.hide.bind(this));
$('questions_shade').setStyle('opacity', 0.5);
$('selectfix').setStyle('opacity', 0);
$('selectfix').setStyle('visibility', 'visible');
this.fx = new Fx.Morph(this.target, {
transition: 'sine:out',
link: 'cancel',
onComplete: function(evt) {
if (this.subject.getStyle('opacity') == 0) {
$('questions_form').reset();
$('questions_shade').setStyle('display', 'none');
$('questions_status').setStyle('display', 'none');
}
}
});
this.iframeFx = new Fx.Morph($('selectfix'), {
transition: 'sine:out',
link: 'cancel'
});
},
show: function() {
this.state = true;
$('selectfix').setStyle('display', 'block');
this.fx.start({
'height': 350,
'width': 400,
'opacity': 1
});
this.iframeFx.start({
'height': 366,
'width': 416
});
},
hide: function() {
this.state = false;
this.fx.start({
'height': 0,
'width': 0,
'opacity': 0
});
this.iframeFx.start({
'height': 0,
'width': 0
});
},
toggle: function() {
if (this.state)
this.hide();
else
this.show();
},
send: function() {
$('questions_shade').setStyle('display', 'block');
$('questions_status').setStyle('display', 'block');
var req = new Request({
url: '/assets/ajax/questions.php',
method: 'post',
data: Hash.toQueryString({
name: $('questions_form').getElement('input[name=name]').get('value'),
phone: $('questions_form').getElement('input[name=phone]').get('value'),
email: $('questions_form').getElement('input[name=email]').get('value'),
question: $('questions_form').getElement('textarea').get('value')
}),
onSuccess: this.sendSuccess.bind(this)
});
req.send();
},
sendSuccess: function() {
$('questions_status').set('html', 'Thank You!
Your message has been sent.');
this.hide.delay(3000, this);
},
stopBubble: function(evt) {
evt.stop();
}
});
var qst;
var sub;
window.addEvent('domready', function(){
if ($('subscribe'))
{
$$('a.subscribe').each(function(el){
var sub = new Subscribe($('subscribe'), el);
});
}
var n = new Nav(document.getElement('ul.nav'));
qst = new Questions($('questions').getElement('div.window'));
});