var Click4Call = new Class({

	options: {
		overlay: false,
		container: 'click2call',

		popupOpen: 'call-me',	
		popupBox: 'c2c-popup-box',
		popupThankYou: 'c2c-popup-thank-you',

		slideOpenBox: 'c2c-slide-open',
		slideClosedBox: 'c2c-slide-closed',
		slideWaitPages: 4,
		slideWaitTime: 180,
		slideExcludePages: false,

		close: 'close',
		submit: 'call-me',

		cookieName: 'Click2Call',
		cookieValue: 1,
		cookieOptions: {
			duration: 7
		},

		slideTimer: true,
		showSlide: true,
		businessHour: true,

		error: false,
		errorMessage: false,
		url: '/scripts/click4call/click4call.php',
		
		google_conversion_label: false
	},

	initialize: function( options ){
		this.setOptions( options );
		this.getConfig();
		this.isBoxOpen = false;
		this.cookieExist = false;
		this.getCookie();

		// define overlay
		if ( false == this.options.overlay ){
			this.overlay = new Element( 'div', {
				'styles': {
					'z-index': 9996,
					'background-color': 'black',
					opacity: 0.7,
					position: 'fixed',
					top: 0,
					left: 0,
					width: '100%',
					height: '100%',
					display: 'none'
				}
			}).inject( document.body );
		} else {
			this.overlay = new Element( 'div', {
				'class': this.options.overlay,
				'styles': {
					'display': 'none'
				}
			}).inject( document.body );
		}

		// define container, popupBox, popupThankYou, slideOpenBox and slideClosedBox
		new Request({
			url: this.options.url,
			method: 'get',
			onSuccess: function( response ){
				this.container = new Element( 'div', {
					'id': this.options.container
				}).setHTML( response ).inject( document.body ).setStyle( 'display', 'none' );
				this.containerStylePosition = this.container.getStyle( 'position' ); // current style prevents clicking anywhere else.
				this.popupBox = $( this.options.popupBox ).setStyle( 'display', 'none' );
				this.popupThankYou = $( this.options.popupThankYou ).setStyle( 'display', 'none' );
				this.slideOpenBox = $( this.options.slideOpenBox ).setStyle( 'display', 'none' );
				this.slideClosedBox = $( this.options.slideClosedBox ).setStyle( 'display', 'none' );
				this.errorMessage = this.popupBox.getElement( '.' + this.options.errorMessage );
				this.formOk = true;
				this.setEvents();
				this.getPageCounter();
				if ( this.pageCount )
					this.showSlide();
			}.bind( this )
		}).get();
	},

	clearSlideTimer: function(){
		clearInterval( this.slideTimer );
		this.options.slideTimer = false;
	},

	close: function(){
		this.overlay.setStyle( 'display', 'none' );
		this.container.setStyle( 'display', 'none' );
		this.dialog.setStyle( 'display', 'none' );
		this.isBoxOpen = false;
		this.setCookie();
		this.clearSlideTimer();
		this.options.showSlide = false;
	},

	getConfig: function(){
		// get config data from PHP, if any.
		new Request.JSON({
			url: this.options.url,
			onSuccess: function( response ){
				this.setOptions( response );
			}.bind( this )
		}).post({
			'config': 'true'
		});
	},

	getInputValues: function(){
		this.firstName = this.dialog.getElement( 'input[name=first_name]' );
		this.lastName = this.dialog.getElement( 'input[name=last_name]' );
		this.homePhone = this.dialog.getElement( 'input[name=home_phone]' );
		this.email = this.dialog.getElement( 'input[name=email]' );
		this.comment = this.dialog.getElement( 'input[name=comments]' );
	},

	getPageCounter: function(){
		if ( window.location.href.indexOf( '/blog/' ) > -1 )
			return;
		this.pageCount = false;
		pageCounter = Cookie.read( 'c2cPgCntr' );
		if ( pageCounter == null || pageCounter == undefined || isNaN( pageCounter ) )
			pageCounter = 1;
		if ( pageCounter >= this.options.slideWaitPages ) {
			pageCounter = 0;
			this.pageCount = true;
		}
		pageCounter++;
		options = this.options.cookieOptions;
		options.duration = false;
		Cookie.write( 'c2cPgCntr', pageCounter, options );
	},

	resetError: function(){
		this.formOk = true;
		if ( this.dialog == this.popupBox ){
			this.errorMessage.setStyle( 'visibility', 'hidden' );
		} else {
			this.errorMessage.setStyle( 'display', 'none' );
			this.dialog.getElement( '.title' ).setStyle( 'display', 'block' );
		}
		if ( false != this.options.error ) {
			this.firstName.removeClass( this.options.error );
			this.lastName.removeClass( this.options.error );
			this.homePhone.removeClass( this.options.error );
		}
	},

	getCookie: function(){
		cookie = Cookie.read( this.options.cookieName );
		if ( cookie == this.options.cookieValue )
			this.cookieExist = true;
	},

	setCookie: function(){
		Cookie.write( this.options.cookieName, this.options.cookieValue, this.options.cookieOptions );
	},

	setError: function( input ){
		if ( false != this.options.error )
			$( input ).addClass( this.options.error );
		if ( this.dialog == this.popupBox ){
			this.errorMessage.setStyle( 'visibility', 'visible' );
		} else {
			this.dialog.getElement( '.title' ).setStyle( 'display', 'none' );
			this.errorMessage.setStyle( 'display', 'block' );
		}
		this.formOk = false;
	},

	setEvents: function(){
		// define click event to open popupBox
		$$( '.' + this.options.popupOpen ).each( function( item ){
			$( item ).setStyles({
				'cursor': 'pointer'
			}).addEvent( 'click', function( e ){
				e = new Event( e ).stop();
				this.showPopup();
			}.bind( this ));
		}.bind( this ));

		// define click event to open slide
		this.setSlideTimer();

		// define click event to close window
		this.container.getElements( '.' + this.options.close ).setStyle( 'cursor', 'pointer' ).addEvent( 'click', function( e ){
			e = new Event(e).stop();
			this.close();
		}.bind( this ) );

		// define click event to submit
		this.setSubmitButton( this.popupBox );
		this.setSubmitButton( this.slideOpenBox );
		this.setSubmitButton( this.slideClosedBox );
	},

	setSlideTimer: function(){
		if ( ! this.options.slideTimer ) return;
		clearInterval( this.slideTimer );
		this.slideTimer = this.showSlide.periodical( this.options.slideWaitTime * 1000, this );
	},

	setSubmitButton: function( dialog){
		dialog.getElement( '.' + this.options.submit ).setStyles({
			'cursor': 'pointer'
		}).addEvent( 'click', function(e){
			e = new Event(e).stop();
			this.getInputValues();
			this.submit( dialog );
			this.isBoxOpen = false;
		}.bind( this ) );
	},

	showPopup: function(){
		if ( this.isBoxOpen )
			this.close();
		this.dialog = this.popupBox;
		this.errorMessage = this.popupBox.getElement( '.' + this.options.errorMessage );
		this.overlay.setStyle( 'display', 'block' );
		this.container.setStyle( 'display', 'block' );
		this.container.setStyle( 'position', this.containerStylePosition ); // restore style
		this.popupBox.setStyle( 'display', 'block' );
		this.isBoxOpen = true;
	},

	showSlide: function(){
		if ( this.isBoxOpen || this.cookieExist || ! this.options.showSlide )
			return;
		this.dialog = ( this.options.businessHour ) ? this.slideOpenBox : this.slideClosedBox;
		this.getInputValues( this.dialog );
		this.errorMessage = this.dialog.getElement( '.' + this.options.errorMessage );
		this.container.setStyles({
			'display': 'block',
			'position': 'relative'
		});
		this.dialog.setStyle( 'display', 'block' );
		this.dialog.setStyles({
			'top': this.container.getHeight(),
			'left': this.container.getWidth() - this.dialog.getWidth()
		});
		var fx = new Fx.Slide( this.dialog ).show().toggle();
		this.container.setStyle( 'height', '1px' );
		this.isBoxOpen = true;
	},

	submit: function(){
		this.resetError();
		if ( this.firstName.value == "" ) this.setError( this.firstName );
		if ( this.lastName.value == "" ) this.setError( this.lastName );
		if ( this.homePhone.value == "" ) this.setError( this.homePhone );
		this.homePhone.value = this.homePhone.value.replace( /[\(\)\.\s-]/gi, "" );
		if ( isNaN( this.homePhone.value ) ) this.setError( this.homePhone );
		if ( this.homePhone.value.length < 10 ) this.setError( this.homePhone );
		if ( this.formOk ){
			d = new Date();
			timeZone = d.toLocaleString().match( '[\(].*[\)]' );
			querystring = '?action=click2call' +
										'&first_name=' + this.firstName.value +
										'&last_name=' + this.lastName.value +
										'&home_phone=' + this.homePhone.value +
										'&email=' + this.email.value +
										'&comment=' + this.comment.value +
										'&time_zone=' + timeZone;
			new Ajax( '/' + querystring, {
				method: 'post',
				data: {
					action: 'click2call',
					first_name: this.firstName.value,
					last_name: this.lastName.value,
					home_phone: this.homePhone.value,
					email: this.email.value,
					comment: this.comment.value,
					time_zone: timeZone
				},
				onComplete: function( response ){
					if ( this.options.google_conversion_label != false ){
						window.google_conversion_label = this.options.google_conversion_label;
						Asset.javascript( 'http://www.googleadservices.com/pagead/conversion.js' );
						Asset.javascript( 'https://0.r.msn.com/scripts/microsoft_adcenterconversion.js' );
					}
					this.dialog.setStyle( 'display', 'none' );
					this.resetError();
					this.firstName.value = "";
					this.lastName.value = "";
					this.homePhone.value = "";
					this.email.value = "";
					this.comment.value = "";
					this.setCookie();
					this.clearSlideTimer();
					this.options.showSlide = false;
					if ( this.dialog == this.popupBox ){
						this.dialog = this.popupThankYou;
						this.popupThankYou.setStyle( 'display', 'block' );
					}
				}.bind( this )
			}).request();
		}
	}

});

Click4Call.implement( new Options, new Events );
