/**
 * The Syn.Weather2 Component Class 
 */

/**
 * Create a Syn.Weather2 component instance 
 * @constructor
 */

Syn.Weather2 = Syn.Component.extend(
{
 	/**
	 * Initialize the component class. This is called automatically by the default constructor.
	 * @member Syn.Weather2
	 * @param {Object} config The configuration data structure 
	 */
	init: function(config,weather_config)
	{
		this._super(config);
		this.weather_config = weather_config;
		this.needs_pngfix = ($.browser.msie && $.browser.version+0 < 7.0); 
		
		if (this.needs_pngfix)
		{
			this.container().find('img').fixPngImage();
		}

		if (!__LOGGED_IN__)
		{
			this.initLoggedOut();
		}

		for (var i=0; this.uniqueElmt('weather'+i).length; i++)
		{
			this.uniqueElmt('weather'+i).connect('click',this,'toggleForecast',[i]);
			this.uniqueElmt('unit_change_link'+i).connect('click',this,'toggleUnit');
			this.uniqueElmt('delete'+i).connect('click',this,'deleteWeather',[i]);
		}
		
		this.container().find('a.navigate').click(   function(){ window.location.href = this.href; return false; } );
		this.container().find('a.new_window').click( function(){ window.open(this.href);           return false; } );

		this.uniqueElmt('location_input').connect('focus',this.uniqueElmt('location_input'),'val',['']);
		this.uniqueElmt('new_location_form').connect('submit',this,'addLocation');
		this.uniqueElmt('suggestions_hide').connect('click',this.uniqueElmt('suggestions'),'animate', [ { height: "hide", opacity: "hide" }, 'fast'] );		

		for (var i=0; this.uniqueElmt('suggestion'+i).length; i++)
		{
			this.uniqueElmt('suggestion'+i).connect('click',this,'selectSuggestion',[i]);
		}

		if (!this.uniqueElmt('error').hasClass('hidden'))
		{
			this.uniqueElmt('error').animate({opacity:0.0},5000);
		}
	},

 	/**
	 * Initialize the logged out state. This basically sets the prefs cookie.
	 * @member Syn.Weather2
	 */
	initLoggedOut: function()
	{
		var today = new Date();
		var expire = new Date();
		expire.setTime(today.getTime() + (1000 * 60 * 60 * 24 * 90) );
		document.cookie = this.uniqueKey('logged_out_token')+'='+escape(this.weather_config['logged_out_token'])+';expires='+expire.toGMTString();
	},

 	/**
	 * Show or hide the 3 day forecast for this location index 
	 * @member Syn.Weather2
	 * @param {Integer} index The 0-n index of the weather location you want to toggle 
	 */
	toggleForecast: function(index)
	{
		var sh = this.uniqueElmt('show_hide'+index);

		sh.hasClass('weather_close') ? 
			this.uniqueElmt('forecast'+index).animate({ height: "hide", opacity: "hide"}, 'fast' ):
			this.uniqueElmt('forecast'+index).animate({ height: "show", opacity: "show"}, 'fast' );
		
		this.uniqueElmt('show_hide'+index).toggleClass('weather_close');
		this.submit({'toggle_open_close':index}, __LOGGED_IN__ && !this.needs_pngfix ? {'norender':true} : false );
	},

 	/**
	 * Change the component unit from F to C or C to F and reload the component. 
	 * @member Syn.Weather2
	 */
	toggleUnit: function()
	{
		this.submit({'toggle_unit':'true'});
	},

 	/**
	 * Remove a weather location 
	 * @member Syn.Weather2
	 * @param {Integer} index The 0-n index of the location to remove
	 */
	deleteWeather: function(index)
	{
		this.uniqueElmt('weather'+index).animate({ height: "hide", opacity: "hide"}, 'fast' );
		this.submit({'remove_index':index});
	},

 	/**
	 * Called when user submits a weather location. Submits the form value via ajax and reloads component. 
	 * @member Syn.Weather2
	 */
	addLocation: function()
	{
		var val = this.uniqueElmt('location_input').val();

		if (!val)
		{
			return;
		}

		this.submit({'location':val});
		this.uniqueElmt('location_input').val('Loading...').attr('disabled','disabled');
	},

 	/**
	 * Select a City/State suggestion from the disambiguation menu. 
	 * @member Syn.Weather2
	 */
	selectSuggestion: function(index)
	{
		this.submit({'location':this.uniqueElmt('suggestion'+index).html()});
		this.uniqueElmt('location_input').val('Loading...').attr('disabled','disabled');
	}

});
