function SignupView()
{ 
    this.prototype = BookessBase.call(this);
    this.requirement = ['jquery', 'bookess.services'];

    var self = this;
    
    this.urlToken = null;
    
    var $serviceButtons = $('#service-buttons');
    
    
    this.urlCalls =
    {

    };
    
    this.messages =
    {
        status:
        {
			connected: 'Conectado',
			disconnected: 'Desconectado'
        }

    };
    
    this.init = function()
    {
    	Services = new BookessService();
    	Services.SERVICE_GET_URL_TOKEN = this.urlToken;
    	Services.onWindowClose = this.serviceWindowClose;
    	Services.onComplete = this.serviceConnected;

    	var profileUrlPreview = function()
    	{
    		var value = $(this).val().replace(/[^a-z0-9_.]/gi, '').toLowerCase();
    		
    		$(this).val(value);
    		
    		if(value.length == 0)
    		{
    			  value = 'login';
    		}	
    		
    		$('#profile-url strong').text(value.truncate(15));  
    	};
    	
    	$('#account-type').change(function()
		{
    		var val = $(this).val();
    		
    		switch(val)
    		{    	
    			/*
    			 * Editora
    			 */
    			case '1':
    			{
    				$('#cnpj').each(function()
					{
						$(this).parent().removeClass('hide')
    						   .prev().removeClass('hide');		
						
						$('#profile-url').html('http://bookess.com/publisher/<strong></strong>/');
					});
    				
    				break;
    			}
    			
    			/*
    			 * Editora
    			 */
    			case '2':
    			{
    				$('#cnpj').each(function()
					{
						$(this).parent().addClass('hide')
    						   .prev().addClass('hide');	
						
						$('#profile-url').html('http://bookess.com/profile/<strong></strong>/');						
					});
    				
    				break;
    			}
    		}
    		
    		profileUrlPreview();
		}).trigger('change');
    	
    	$('#login').bind('change keyup', profileUrlPreview).trigger('keyup');

		$('.service-opts').hide();
		
		$('.service').bind('mousedown mouseenter', function(evt)
		{
			$('.service-opts').hide();
			
			var $self = $(this);
			var offset = $self.offset();
			var className = $(this).attr('className');
			var name = self.getServiceName(className);
			
			var $dropdown = $('#opts-' + name);

			var offsetLeft = $self[0].offsetLeft;
			var offsetTop = $.browser.msie ? $self[0].parentNode.offsetTop : $self[0].offsetTop;

			if($.browser.opera)
			{
				offsetLeft -= 1;
				offsetTop -= 1;
			}
			
			var onHide = function()
			{
				$dropdown.unbind().hide();
				$(document).unbind('mousedown', onHide);
			};
			
			$dropdown
			.css({left: offsetLeft, top: offsetTop})			
			.mouseleave(onHide)
			.mousedown(function(evt)
			{
				evt.stopPropagation();
			})
			.show();	
						
			$(document).mousedown(onHide);						
	        
			evt.stopPropagation();
		})
		.click(this.serviceEnable);
    };
    
    this.serviceEnable = function()
    {
    	var $button = $(this);
    	var $loading = $('<div />').attr('className', 'icon-loading-small').addClass('loading');
    	
    	var className = $(this).attr('className');
		var service = self.getServiceName(className);
    			
    	$loading.insertBefore($button);
    	
    	// trigger('mouseenter') => FIX: dropdown alinhamento
    	$button.trigger('mouseenter').fadeTo(0, 0.5).unbind('click');
    	
    	Services.openWindow(service);    	
    };
    
    this.serviceWindowClose = function(service)
    {
    	var $button = $('.button-' + service, $serviceButtons);
    	
    	$button.prevAll('.loading').remove();    	
    	$button.trigger('mouseenter').fadeTo(0, 1).click(self.serviceEnable);   	
    };
    
    this.serviceConnected = function(service)
    {
    	Services.removeWindow(service);
    	
    	var $button = $('.button-' + service, $serviceButtons);
    	var $dropdown = $('#opts-' + service);
    	var $status = $('.status span', $dropdown);
    	
    	$('#service-' + service).attr('checked', true);
    	
    	$button.prevAll('.loading').remove();    
    	
    	$button.unbind('click').fadeTo(0, 0.5).click(function()
		{
    		$status.fadeOut().fadeIn();
		})
		.trigger('mouseenter');
    	
    	$status.text(self.messages.status.connected);
    	$('.status .icon', $dropdown).removeClass('icon-bullet-inactive')
    								 .addClass('icon-bullet-on');
    };
       
    this.getServiceName = function(className)
    {
    	return className.match(/.+button-(.+)/i)[1];
    };

}