SpeedMedia.BaseWidget = SpeedMedia.Event.extend({
	_construct : function(el) {
        this._super();
		this._el = $(el);
		this._data = $.extend(
			{}, 
			$.parseJSON(this._el.find(SpeedMedia.BaseWidget.WIDGET_DATA_SEL).html())
		); 

		this.__initialized = false;
		this.__initMethod = this.__init.bind(this); // store for unbind later
		this._el.bind('mouseenter', this.__initMethod);
	},
	__init : function() {
		if (this.__initialized) return;	
		this.init();
		this.__initialized = true;
		this._el.unbind('mouseenter', this.__initMethod);
	},
	init : function() { /* override */ },
	initialized : function() { return this.__initialized; }
});
SpeedMedia.BaseWidget.WIDGET_DATA_SEL = '> script[type="application/json"]';

SpeedMedia.GalleryWidget = SpeedMedia.BaseWidget.extend({
	_construct : function(el){
		this._super(el);
		this._el = $(el);
		var t = this;
		
		this._curImgIndex = null;
		this._totalImg = this._data.total_img;
		this._img = this._el.find('img');
		this._imgUrl = this._data.img_url;
		if(this._totalImg > 0) {
			for (var i in this._imgUrl)
			{	
				this._curImgIndex = i ; 
				this._img.attr('src',this._imgUrl[i]); 
				break;
			}
		}
		 
		this._pagingBullets = this._el.find('.pagingbullets');
		
		
		if (this._totalImg > 0) {
			this._pagingBullets = new SpeedMedia.PagingBulletsComponent(this._pagingBullets);
			this._pagingBullets.addEventHandler(
					SpeedMedia.PagingBulletsComponent.CLICK,
					function(event, url) {
						t.swapImage(url);
					}
				);
		} else 
			this._pagingBullets = false;
		
		
		if(this._pagingBullets)
			this._pagingBullets.setTotal(this._imgUrl);
		else
			this._el.find('li.bullet-template').remove();
			
	},
	swapImage : function(url) {
		var t = this;
		this._img.fadeOut(500,function(){
			t._img.attr('src',url); 
			t._img.fadeIn(500);
		});
	},	
});