if ( Object.isUndefined(CodeCompany) ) { var CodeCompany = { }; }

CodeCompany.AsyncColorSamples = Class.create({
	initialize: function(options)
	{
		this.itemids = [];

		this.options = Object.extend({
			successCallback: Prototype.emptyFunction,
			overviewType: 'normal',
			async: true
		}, options || { } );
		
		this.templates = 
		{
			normal: 
			{
				colors: new Template('<h2>Populære farver</h2> #{colorpairs}'),
				colorsample: new Template('<div class="colorsample"><img src=#{thumbnail} alt=""/><!--${fullsize} --></div>')
			}
		};
	},
	
	setSuccessCallback: function(fn)
	{
		this.options.successCallback = fn;
	},
	
	addItemId: function(itemid)
	{
		this.itemids.push(itemid);
	},
	
	render: function()
	{
		dk.ide.webservice.ProductService.GetColorSamples(servicetoken, site.viaProperties._object.ElementId, this.onSuccess.bind(this));
	//Get them colors and do stuff onSuccess
	},
	
	onSuccess: function(result)
	{
		var colors='';
		var d = (!Object.isUndefined(result.d))?result.d:result;
		data = d.colors;
		//markup = this.templates[this.options.overviewType].colors.evaluate(d);
       
			switch ( this.options.overviewType )
			{
				
				case 'normal':
					if(d.hasColors){
					//show'em
					 data.each(function (ColorPair) {
                colors += '<div class="colorsample"><img src="'+ColorPair.thumbnail+'" alt="" style="width:36px;cursor:pointer;" onclick="popImg(\''+ColorPair.fullsize+'\','+1340+');"/><!--'+ColorPair.fullsize+' --></div>';
        });
					$('colors').update(colors);
					$('new_farver').setStyle('display:block');
					}
				break;
				
				default:
					document.fire('custom:fontreplace');
				break;
			}
		
		this.options.successCallback.delay();
	}
});
