var MemberService = Class.create( {
    initialize: function() {       
    	this._checkForSignIn();
    },
    
    _checkForSignIn : function() {
    	new Ajax.Request( '/signin.html', {
            method: 'get',
            parameters: {
                memberEmail: "",
                password: ""
            },
            onSuccess: this._showInitialInfo.bind(this)
        });
    },
    
    _showInitialInfo : function(response) {
    	if ( response && response.responseText.isJSON() ) {
    		var json = response.responseText.evalJSON();
    		if (json[0].status == "pass") {
    			$('chzit-signin').innerHTML = signedInLine.evaluate({uname:json.first().memberName});
	    		$('signout').observe('click', this._signOut.bind(this)); 	    			
    		} else {
    			$('chzit-signin').innerHTML = signInForm.evaluate({});
    			$('signinform').observe('click', this._signInForm.bind(this)); 
    		}
    	}
    },
    
    _signInForm : function(event) {
    	var div = $('chzit-signin');
    	
    	var checkDiv = $('signinlightbox');
    	if (checkDiv == null) {
    		div.innerHTML= signInLightBox.evaluate({html:signInTemplate.evaluate({})});  
			this._stopAndStartObserving($('signinclose'), 'click', this._signInFormClose.bind(this)); 
		} else {
			this._signin($('memberEmailValue'),$('memberPasswordValue'));
		}
		this._stopAndStartObserving($('signinform'), 'click', this._signInForm.bind(this));	
    },
    
    _signInFormClose : function (event) {
		this._checkForSignIn();    	
    },
    
    _signin : function(memberEmail, memberPassword) {
    	if (memberEmail != null && memberPassword != null) {
    		var email = memberEmail.value;
    		var password = memberPassword.value;
    	
    		new Ajax.Request( '/signin.html', {
                method: 'get',
                parameters: {
                    memberEmail: email,
                    password: password
                },
                onSuccess: this._showMemberInfo.bind(this)
            });
        }
    },
    
    _showMemberInfo : function(response) {
    	if ( response && response.responseText.isJSON() ) {
    		var json = response.responseText.evalJSON();
    		if (json[0].status == "pass") {
    			$('chzit-signin').innerHTML = signedInLine.evaluate({uname:json.first().memberName});
    			
				this._stopAndStartObserving($('signout'), 'click', this._signOut.bind(this));	
    		} else {
    			$('chzit-signin').innerHTML = signInLightBox.evaluate({html:showMemberInfoTemplate.evaluate({})});
	    		
				this._stopAndStartObserving($('signinform'), 'click', this._signInForm.bind(this));
				this._stopAndStartObserving($('forgotpassword'), 'click', this._forgotPassword.bind(this));
				this._stopAndStartObserving($('signupform'), 'click', this._signUpForm.bind(this)); 
				this._stopAndStartObserving($('signinclose'), 'click', this._signInFormClose.bind(this)); 
    			 
    		}
		} else {
			alert("no json");
		}
    },
    
    _signOut : function(event) {
		new Ajax.Request( '/signout.html', {
            method: 'get',
            parameters: {
                memberEmail: "",
                password: ""
            },
            onSuccess: this._finalSignOut.bind(this)
        });
    },
    
    _finalSignOut : function(event) {    	
    	$('chzit-signin').innerHTML = signInForm.evaluate({});
		this._stopAndStartObserving($('signinform'), 'click', this._signInForm.bind(this));
    },
    
    _forgotPassword : function(event) {
    	if ($('memberForgotEmailValue') != null) {
    	
    		new Ajax.Request( '/forgotPassword.html', {
                method: 'get',
                parameters: {
                    memberEmail: $('memberForgotEmailValue').value,
                    password: ""
                },
                onSuccess: this._confirmEmail.bind(this)
            });
        }
    },
    
    _confirmEmail : function(response) {
    
    	$('chzit-signin').innerHTML = signInForm.evaluate({});
		this._stopAndStartObserving($('signinform'), 'click', this._signInForm.bind(this));
		
		alert(response.responseText);
    
    },    
    
    _signUpForm : function(event) {
    	var div = $('chzit-signin');
    	
		div.innerHTML = signInLightBox.evaluate({html:signUpTemplate.evaluate({})});
		
		this._stopAndStartObserving($('signup'), 'click', this._signUp.bind(this)); 
		this._stopAndStartObserving($('signinclose'), 'click', this._signInFormClose.bind(this));  
    },  
    
    _signUp : function(event) {
    	var div = $('chzit-signin');
    	
		if ($('memberEmailValue') != null && $('memberPasswordValue') != null && $('verifyPasswordValue') != null) {
			var password = $('memberPasswordValue').value;
			var verifyPassword = $('verifyPasswordValue').value;
			
			if (password == verifyPassword) {
    	
	    		new Ajax.Request( '/signup.html', {
	                method: 'get',
	                parameters: {
	                    memberName: $('memberNameValue').value,
	                    memberEmail: $('memberEmailValue').value,
	                    password: $('memberPasswordValue').value,
	                    address1: $('address1Value').value,
	                    address2: $('address2Value').value,
	                    city: $('cityValue').value,
	                    state: $('stateValue').value,
	                    country: 'US',
	                    zipCode: $('zipCodeValue').value
	                },
	                onSuccess: this._showMemberInfo.bind(this)
	            });
            }
        } 
    }, 
    
	_stopAndStartObserving : function(observeElement, observeEvent, observeBinding) { 
    	// observeElement.stopObserving(observeEvent, observeBinding);  
    	observeElement.observe(observeEvent, observeBinding);  
    }

});


Event.observe(window, 'load', function() {
	var protoTypeExists = 0;
	while (protoTypeExists == 0) {
		if (typeof Prototype != "undefined") {
			protoTypeExists = 1;
			new MemberService();
		}
	}	
});



/*Template Section - We should keep this section separate from the other JavaScript classes to prevent clutter and help promote dynamic usage*/

var signInForm = new Template('<a id="signinform" href="#"><img src="/resources/images/signin-b.png" /></a><a id="signupform" href="#"></a>&nbsp;<a id="forgotpassword" href="#"></a>');

var signedInLine = new Template('Welcome #{uname}<br/><a id="signout" href="#">Sign out</a>');

var signInLightBox = new Template('<div id="signinlightbox">'+
	'<div id="signinclose" class="close"></div>'+
	'<div class="top"></div>'+
	'<div class="mid">#{html}</div>'+
	'<div class="btm"></div>'+
'</div>')

var signInTemplate = new Template(''+
'<table>' +
	'<tr><td>Email:</td><td><input id="memberEmailValue" type="text"/></td></tr>' +
	'<tr><td>Password:</td><td><input id="memberPasswordValue" type="password"/></td></tr>' +
	'<tr><td colspan="2"><a id="signinform" href="#"><img class="signin-img" src="/resources/images/signin-b.png" /></a></td></tr>'+
'</table>');

var signUpTemplate = new Template(''+
'<table>' +
	'<tr><th colspan="2">New Member Sign-up</th></tr>' +
	'<tr><td>*Screen Name:</td><td><input id="memberNameValue" type="text"/></td></tr>' +
	'<tr><td>*Email:</td><td><input id="memberEmailValue" type="text"/></td></tr>' +
	'<tr><td>*Password:</td><td><input id="memberPasswordValue" type="password"/></td></tr>' +
	'<tr><td>*Re-enter Password:</td><td><input id="verifyPasswordValue" type="password"/></td></tr>' +
	'<tr><td>*Address 1:</td><td><input id="address1Value" type="text"/></td></tr>' +
	'<tr><td>*Address 2:</td><td><input id="address2Value" type="text"/></td></tr>' +
	'<tr><td>*City:</td><td><input id="cityValue" type="text"/></td></tr>' +
	'<tr><td>*State:</td><td><input id="stateValue" type="text" maxlength="2"/></td></tr>' +
	'<tr><td>*Zip Code:</td><td><input id="zipCodeValue" type="text" maxlength="9"/></td></tr>' +
	'<tr><td colspan="2"><a id="signup" href="#">Sign Up</a></td></tr>'+
'</table>');

var showMemberInfoTemplate = new Template(''+
'<table>' +
	'<tr><th colspan="2">Login Failed - Try Again</th></tr>' +
	'<tr><td>Email:</td><td><input id="memberEmailValue" type="text"/></td></tr>' +
	'<tr><td>Password:</td><td><input id="memberPasswordValue" type="password"/></td></tr>' +
	'<tr><td colspan="2"><a id="signinform" href="#">Sign in</a></td></tr>' +
	'<tr><th colspan="2">OR - Forgot Password</th></tr>' +
	'<tr><td>Email:</td><td><input id="memberForgotEmailValue" type="text"/></td></tr>' +
	'<tr><td colspan="2"><a id="forgotpassword" href="#">Email Password</a></td></tr>' + 
	'<tr><th colspan=2>OR - New Member Sign Up</th></tr>' +
	'<tr><td colspan="2"><a id="signupform" href="#">Sign Up</a></td></tr>' +     			
'</table>');