var ProductGallery = Class.create(ID, {
	// Initialized with callback data from dk.ide.webservice.ProductService.GetBigProductImages (?!)
	initialize: function(pictures) {
		this.pictures = pictures;

		this.info = $("productgallery_info").innerHTML;
		var tt = pictures.length;
		//console.log('Initial total: '+ this.total);
		// remove videos from lineup
		this.pictures.each(function(item) {
			//console.log('Testing for video: '+(item.indexOf('-video.flv') > -1) + ' total: ' + tt);
			if(item.indexOf('-video.flv') > -1) {
			 tt = tt-1;
			}
		});
		this.total = tt;
		this.showing = 1;
		//this.clicked;

		if (this.total == 2 || this.total == 3) {
			$("productgallery_thumbnails").show();
		} else if (this.total > 3) {
			$("productgallery_thumbnails").show();
			$("productgallery_left").show();
			$("productgallery_right").show();
			$("productgallery_left").observe('click', this.previousThree.bind(this));
			$("productgallery_right").observe('click', this.nextThree.bind(this));
		}
		this.setupGallery();

		try {
			this.pictures.each(function(picture){
				this._log('Adding picture: '+Object.toJSON(picture));
			}, this);
		} catch(ex) {
			this._error('ProductGallery.initialize failed: '+ex);
		}
	},

	setupGallery: function() {
		var counter = 0;

		this.pictures.each(function(item) {
			if((item.indexOf('-video.flv') == -1)) {
					var div = new Element('div', {
					style: 'left:' + (counter * 78) + 'px;width:72px;height:40px',
					'class': 'img'
					});
					var imgWidth = '72';
					if (item.indexOf('/384x384/') > -1) {
						imgWidth = '40';
					}
					var img = new Element('img', {
						src: item,
						width: imgWidth,
						height: 40,
						alt: '',
						'class': 'image_' + counter
					});
					div.update(img);
					$("productgallery_thumbnails_container").insert(div);
					counter++;
			}
		});
		//selected image indicator
		$("productgallery_thumbnails_container").insert('<div id="productgallery_thumbnail_selected"></div>');
		//listener
		$$("#productgallery_thumbnails_container img").invoke('observe', 'click', this.imageClick.bind(this));
	},

	imageClick: function(e, count) {
		var elm = e.element();
		var img = this.imageNumber(elm.readAttribute("class"));
		this.clicked = img;
		var newPictureSrc = this.pictures[img];
		switch(newPictureSrc.indexOf('-video.flv') > -1) {
			case true:
				var vidArr = newPictureSrc.split('.', 1);
				var newVideoSrc = vidArr;
				this.loadVideo(newVideoSrc);
				$('productgallery_image').hide();
				$('productgallery_video').show();
			break;
			default:
				var newPictureSrc = this.pictures[img];
				$("productgallery_image").src = newPictureSrc;
				if (newPictureSrc.indexOf('/768x384/') > -1) {
					$("productgallery_image").setStyle({
						'width': '768px',
						'height': '384px'
					});
				} else {
					$("productgallery_image").setStyle({
						'width': '384px',
						'height': '384px'
					});
				}
				$('productgallery_image').show();
				$('productgallery_video').hide();
			break;
		}
		this.updateInfo();
		var newX = elm.up().getStyle('left');
		new Effect.Morph($("productgallery_thumbnail_selected"), {
			style: 'left:' + newX,
			duration: 0.5
		})
	},
	imageNumber: function(id) {
		return id.split("image_").join("");
	},
	updateInfo: function(id) {
		$("productgallery_info").show();
		var templ = new Template(this.info);
		$("productgallery_info").update(templ.evaluate({
			num: (Number(this.clicked) + 1),
			total: this.total
		}));
	},
	nextThree: function() {
		if (this.showing < (this.total / 3)) {
			new Effect.Move($('productgallery_thumbnails_container'), {
				x: -(3 * 78),
				y: 0,
				"mode": "relative"
			});
			this.showing++;
			$("productgallery_left").removeClassName("disabled");
			if (this.showing > (this.total / 3)) {
				$("productgallery_right").addClassName("disabled");
			}
		} else {
			$("productgallery_right").addClassName("disabled");
		}
	},
	previousThree: function() {
		if (this.showing > 1) {
			new Effect.Move($('productgallery_thumbnails_container'), {
				x: (3 * 78),
				y: 0,
				"mode": "relative"
			});
			this.showing--;
			$("productgallery_right").removeClassName("disabled");
			if (this.showing < 2) {
				$("productgallery_left").addClassName("disabled");
			}
		} else {
			$("productgallery_left").addClassName("disabled");
		}
	},
	loadVideo: function(videoSrc) {
		if (site.hasFlash()) {
			var flashvars = {
				'file': videoSrc+".flv",
				'fullscreen': "false",
				'autostart': "false",
				'controlbar': "true",
				'screencolor': "#FFFFFF",
				'stretching': "uniform",
				'volume': "80",
				'image': videoSrc+".jpg",
				'plugins': "gapro-1",
				'gapro.accountid': "UA-12685907-1",
				'gapro.trackstarts': "true",
				'gapro.trackpercentage': "true",
				'gapro.tracktime': "true",
				'link': videoSrc+".flv"
			};
			var params = {
				'quality': "autohigh",
				'wmode': "transparent",
				'allowfullscreen': "true",
				'allowscriptaccess': "always"
			};
			var attributes = {};
			attributes.id = "mpl_video";
			swfobject.embedSWF(
				"/files/system/js/flvplayer/flvplayer.swf",
				"mpl_video",
				"576",
				"288",
				"9.0.0", false,
				flashvars, params, attributes);
	    }
	}
});