(function($){

	function uiclosepopup(clas){
			$(clas + ' .close').click(function(e) {
				$('.sig').html('<img src="'+window.base+'/res/new/images/signup_a.png" alt="">');
				$('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');
				e.preventDefault();
				$(clas).remove();
				$('#mask').hide();
			});

			$('#mask').click(function() {
				$('.sig').html('<img src="'+window.base+'/res/new/images/signup_a.png" alt="">');
				$('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');
				$(clas).remove();
				$(this).hide();
			});
		}

		function proceed() {
			var maskHeight = $(document).height();
			var maskWidth = $(window).width();
			var winH = $(window).height();
			var winW = $(window).width();

			$('#mask').css({'width':maskWidth,'height':maskHeight});

            $('#mask').show();
            $('#mask').show();

			centerWin('.current');

			$('.current').show();
			uiclosepopup('.current');
		}

		function getScrollXY() {
			var scrOfX = 0, scrOfY = 0;
			if( typeof( window.pageYOffset ) == 'number' ) {
				scrOfY = window.pageYOffset;
				scrOfX = window.pageXOffset;
			} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
				scrOfY = document.body.scrollTop;
				scrOfX = document.body.scrollLeft;
			} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
				scrOfY = document.documentElement.scrollTop;
				scrOfX = document.documentElement.scrollLeft;
			}
			return {X:scrOfX, Y:scrOfY};
		}

		function getWindowSize() {
			var myWidth = 0, myHeight = 0;
			if( typeof( window.innerWidth ) == 'number' ) {
				myWidth = window.innerWidth;
				myHeight = window.innerHeight;
			} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
				myWidth = document.documentElement.clientWidth;
				myHeight = document.documentElement.clientHeight;
			}
			return{X:myWidth, Y:myHeight}
		}

		function centerWin(clas){
			var windowDim = getWindowSize();
			var popupHeight = $('.dialog.current').height();
			var popupWidth = $('.dialog.current').width();
			var scroll = getScrollXY();
			$('.dialog.current').css({
				"position": "absolute",
//				"left": windowDim.X/2-popupWidth/2 + scroll.X-15
				'left': '50%',
				'margin-left': '-'+ (popupWidth/2 + 30) +'px'
			});
			$('.dialog.current').css('z-index','999999');
//			$('.dialog.current').css('top',235 - $('.dialog.current').attr('off') / 2 - 30 + 130 + 'px');
			$('.dialog.current').css('top',$(window).height() / 2 - $('.dialog.current').height() / 2 - 40 + "px");
		}
	
	function regpopup2() {
//			e.preventDefault();

			$('#mask').hide();
			$('.current').remove();
			$('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');

			$(this).html('<img src="'+window.base+'/res/new/images/signup_b.png" alt="">');

			var popup=$("#dialog-url").clone()
			.appendTo($('body'))
			.addClass('current');

			$('.dialog.current .inline-url').click(function(){
				$('.dialog.current .url-input').focus();
			});

			popup.submit(function(){
				popup.find('label').each(function(){
					$(this).removeClass('haserror');
					$(this).html($(this).attr('original'));
				});

				var tosubmit=true;

				//ILLEGAL URL
				if (!popup.find('input[name=url]').val().match(/^[a-z0-9]*$/i)) {
					popup.find('.l-url').addClass('haserror');
					popup.find('.l-url').html(popup.find('.l-url').attr('illegal'));
					tosubmit=false;
				}

				if (!tosubmit) return false;

				$.ajax({
					'url': window.base+'/signup/ajax',
					'data': popup.find('form').serialize(),
					'type': 'post',
					'dataType':'json',
					'success': function(data) {
						console.log(data);
						if (data!='OK') {
							for (a in data) {
								popup.find('.l-'+a).addClass('haserror');
								popup.find('.l-'+a).html(popup.find('.l-'+a).attr(data[a]));
							}
						} else {
							popup.find('form').html('You have successfully registered.<br />Check Your email for details.');
						}
					}
				});
				return false;
			});

			proceed();
		};

	function fbregister() {
		FB.login(function(response) {
				    if (response.authResponse) {
//				       console.log(response.session);
				    	$.ajax({
				    		'url': window.base+'/signup/fb',
				    		'data': {'id': response.authResponse.userID, 'token': response.authResponse.access_token },
				    		'type': 'post',
				    		'dataType': 'json',
				    		'success': function(data) {
//				    			console.log(data);
							    var invite=$('.dialog.current input[name=invite]').val();
				    			if (data.url) {
				    				$('.dialog.current form').html('This facebook account is already registered in plottr.me'); return false;
				    			}

							    regpopup2();

//				    			$('.dialog.current input[name=username]').val(data.first_name + data.last_name);
//				    			$('.dialog.current input[name=url]').val(data.first_name + data.last_name);
				    			$('.dialog.current input[name=email]').val(data.email);
				    			$('.dialog.current input[name=fb_id]').val(data.id);
							    $('.dialog.current input[name=invite]').val(invite);

				    		}
				    	});
				    } else {
				      // user is logged in, but did not grant any permissions
				    }
				}, {scope:'read_stream,publish_stream,offline_access,email,user_birthday,user_education_history,user_work_history,user_hometown'});
			return false;
	}

	function fblogin() {
			FB.login(function(response) {
                if (response.authResponse) {
                    console.log(response);
//				       console.log(response.session);
                    $.ajax({
                        'url': window.base+'/signup/fb',
                        'data': {'id': response.authResponse.userID, 'token': response.authResponse.access_token },
                        'type': 'post',
                        'dataType': 'json',
                        'success': function(data) {
                            if (data.url) {
                                window.location.replace(data.url); return false;
                            }
//							    $('.dialog.current form').html('Your facebook account is not registered in plottr.me');
                            window.hasfb=data;
                            $('.sig').click();
                        }
                    });
                } else {

                  // user is logged in, but did not grant any permissions
                }
				}, {scope:'read_stream,publish_stream,offline_access,email,user_birthday,user_education_history,user_work_history,user_hometown'});
			return false;
	}
	
    function uipopup() {
		$('.log').click(function(e) {
			e.preventDefault();
			
			$('#mask').hide();
			$('.current').remove();
			$('.sig').html('<img src="'+window.base+'/res/new/images/signup_a.png" alt="">');
			
			$('.log').html('<img src="'+window.base+'/res/new/images/login_b.png" alt="">');
			
			var popup=$("#dialog-login").clone()
			.appendTo($('body'))
			.addClass('current');
			
			popup.find('.fb').click(function(){ fblogin(); return false; });

			popup.find('.forgot').click(function() {recover(); return false;});

			popup.find('form').submit(function(){
				$.ajax({
					'url': window.base+'/authentication/authenticate/popup',
					'data': popup.find('form').serialize(),
					'type': 'post',
					'success': function(data) {
						if (data!='OK' && data!='ERR') window.location.replace(data); else {
							popup.find('#uname').css('color','#F00');
							popup.find('#uname').html('Wrong username or password');
						}
					}
				});
				return false;
			});

			proceed();
		});

	    $('.sig').click(function(e) {
		    e.preventDefault();
		    $('#mask').hide();
			$('.current').remove();
		    $('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');
		    $(this).html('<img src="'+window.base+'/res/new/images/signup_b.png" alt="">');

		    var popup=$("#dialog-invite").clone().appendTo($('body')).addClass('current');

		    popup.find('form').submit(function() {
			    $('.dialog.current label').removeClass('haserror');
			    $('.dialog.current label').each(function() {
				    $(this).html($(this).attr('original'));
			    });
			    $.ajax({
				    'url': window.base+'/signup/invite/'+$('.dialog.current input[name=invite]').val(),
				    'success': function(data) {
					    if (data=='OK') {

						    if (window.hasfb) {
							    var invt = $('.dialog.current input[name=invite]').val();
							    regpopup2();

//				    			$('.dialog.current input[name=username]').val(data.first_name + data.last_name);
//				    			$('.dialog.current input[name=url]').val(data.first_name + data.last_name);

				    			$('.dialog.current input[name=email]').val(window.hasfb.email);
				    			$('.dialog.current input[name=fb_id]').val(window.hasfb.id);
							    $('.dialog.current input[name=invite]').val(invt);
							    return false;
						    }

							regpopup($('.dialog.current input[name=invite]').val());
					    } else {
						    $('.dialog.current .l-invite').addClass('haserror').html($('.dialog.current .l-invite').attr('error'));
					    }
				    }
			    });
			    return false;
		    });

		    proceed();
	    });

		function regpopup(code) {
//			e.preventDefault();
			
			$('#mask').hide();
			$('.current').remove();
			$('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');
			
			$(this).html('<img src="'+window.base+'/res/new/images/signup_b.png" alt="">');
			
			var popup=$("#dialog-signup").clone()
			.appendTo($('body'))
			.addClass('current');

			$('.dialog.current .inline-url').click(function(){
				$('.dialog.current .url-input').focus();
			});
			
			$('.dialog.current input[name=invite]').val(code);

			popup.find('.fb').click(function(){ fbregister(); return false; });
			
			popup.submit(function(){
				popup.find('label').each(function(){
					$(this).removeClass('haserror');
					$(this).html($(this).attr('original'));
				});
				
				var tosubmit=true;
				
				//EMPTY
				popup.find('input[type=text], input[type=password]').each(function(){
					if ($.trim($(this).val())=='') {
						$(this).prevAll('label:first').addClass('haserror');
						$(this).prevAll('label:first').html($(this).prevAll('label:first').attr('empty'));
						tosubmit=false;
					}
				});

				//ILLEGAL EMAIL
				if (!popup.find('input[name=email]').val().match(/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/)) {
					popup.find('.l-email').addClass('haserror');
					popup.find('.l-email').html(popup.find('.l-email').attr('illegal'));
				}
				
//				//PASSWORD MATCH
//				if (popup.find('input[name=password2]').val()!=popup.find('input[name=password]').val()) {
//					popup.find('.l-password2').html(popup.find('.l-password2').attr('match'));
//					popup.find('.l-password2').addClass('haserror');
//					tosubmit=false;
//				}
				
				//ILLEGAL URL
				if (!popup.find('input[name=url]').val().match(/^[a-z0-9]*$/i)) {
					popup.find('.l-url').addClass('haserror');
					popup.find('.l-url').html(popup.find('.l-url').attr('illegal'));
					tosubmit=false;
				}
				
				if (!tosubmit) return false;
				
				$.ajax({
					'url': window.base+'/signup/ajax',
					'data': popup.find('form').serialize(),
					'type': 'post',
					'dataType':'json',
					'success': function(data) {
						console.log(data);
						if (data!='OK') {
							for (a in data) {
								popup.find('.l-'+a).addClass('haserror');
								popup.find('.l-'+a).html(popup.find('.l-'+a).attr(data[a]));
							}
						} else {
							popup.find('form').html('You have successfully registered.<br />Check Your email for details.');
						}
					}
				});
				return false;
			});
			proceed();
		}

		function recover() {
//			e.preventDefault();

			$('#mask').hide();
			$('.current').remove();
			$('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');

			$(this).html('<img src="'+window.base+'/res/new/images/signup_b.png" alt="">');

			var popup=$("#dialog-recover").clone()
			.appendTo($('body'))
			.addClass('current');

			popup.submit(function(){
				$.ajax({
					'url': window.base+'/signup/recover',
					'data': popup.find('form').serialize(),
					'type': 'post',
					'dataType':'text',
					'success': function(data) {
						console.log(data);
						if (data=='OK') {
							$('.dialog.current form').html('Check your email for instructions on how to reset your password.');
						} else {
							$('.dialog.current .l-email').addClass('haserror');
							$('.dialog.current .l-email').html($('.dialog.current .l-email').attr('error'));
						}
					}
				});
				return false;
			});

			proceed();
		};

	    if (window.recover) {
		    $('#mask').hide();
			$('.current').remove();
			$('.log').html('<img src="'+window.base+'/res/new/images/login_a.png" alt="">');

			$(this).html('<img src="'+window.base+'/res/new/images/signup_b.png" alt="">');

			var popup=$("#dialog-recover2").clone()
			.appendTo($('body'))
			.addClass('current');

			popup.submit(function(){
				if ($('.dialog.current input[name=password]').val()=='') {
					$('.dialog.current .l-password').addClass('haserror');
					$('.dialog.current .l-password').html($('.dialog.current .l-password').attr('error'));
					return false;
				}
				$.ajax({
					'url': window.base+'/signup/recover2/'+window.recover,
					'data': popup.find('form').serialize(),
					'type': 'post',
					'dataType':'text',
					'success': function(data) {
						console.log(data);
						if (data=='OK') {
							$('.dialog.current form').html('Your password is now set up. You can login.');
						}
					}
				});
				return false;
			});

			proceed();
	    }
		if (document.location.hash=='#signup') {
			$('.sig').click();
		}
    }

    $(function(){
        uipopup();
    });

})(jQuery);
