if (!window.Galerie)
	window.Galerie = {};

Galerie.Page = function(controlId, galerieData, speed) 
{
	this.controlId = controlId;
	this.galerieData = galerieData;
	this.gridIPP = 9;
	this.gridIPC = 3;
	this.speed = speed;
}


Galerie.Page.prototype =
{
	modeIsPlaying: false,
	currentBildIndex: -1,
	loadedBildIndex: -2,
	isWaitingForPicture: false,
	isGalerieVisible: false,
	galleryPageIndex: -1,
		
	// Elemente aus Xaml	
	GalerieItems: [],
	GalerieBorderItems: [],
	
	// Seite wird geladen
	handleLoad: function(control, userContext, rootElement) 
	{
		this.control = control;
		this.control.content.onFullScreenChange = this.handleFullScreenChange;
		
		this.Bild1 = this.control.content.findName("Bild1");
		this.Bild2 = this.control.content.findName("Bild2");
		this.FotoCanvas = this.control.content.findName("FotoCanvas");
		this.GalerieCanvas = this.control.content.findName("GalleryCanvas");
		this.ProgressBack = this.control.content.findName("rectProgressBack");
		this.Progress = this.control.content.findName("rectProgress");
		
		this.Bild2.addEventListener("DownloadProgressChanged", Silverlight.createDelegate(this, this.handleBildDownloadProgressChanged));
		
		this.control.content.findName("buttonNext").addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleNextClick));
		this.control.content.findName("buttonPrior").addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handlePriorClick));		
		this.control.content.findName("buttonPlay").addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handlePlayClick));
		//this.control.content.findName("buttonFullscreen").addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleFullScreenClick));
		this.control.content.findName("buttonGallery").addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleGalerieClick));
		
		this.createGalerie();
		this.nextBild(false);
	},
	
	
	// Fullscreen
	handleFullScreenChange: function(sender, args) {
		var silverlightPlugin = sender.getHost();
	},

	
	
	// BILDER IN GROßANSICHT
	// ----------------------------------



	// Bild wurde geladen
	handleBildDownloadProgressChanged: function(sender, args) {		
		if (sender.DownloadProgress < 1) {
			this.Progress.Visibility = "Visible";
			this.ProgressBack.Visibility = "Visible";
			this.Progress.Width = sender.DownloadProgress * 100;
		} else {
			this.Progress.Visibility = "Collapsed";
			this.ProgressBack.Visibility = "Collapsed";
			this.control.content.findName("Bild_Show").Begin();
		}
		
		if ((this.isGalerieVisible) || (!this.modeIsPlaying) || (this.isWaitingForPicture) || (sender.DownloadProgress < 1)) return;
		this.isWaitingForPicture = true;
		window.setTimeout(this.controlId + ".nextBild(true)", this.speed);
	},
	
	
	// Voriges Bild
	priorBild: function() {
		this.currentBildIndex--;
		if (this.currentBildIndex < 0) this.currentBildIndex = this.galerieData.length - 1;
		this.showBild();
	},
	
	
	// Nächstes Bild
	nextBild: function(automatic) {
		if ((automatic) && (!this.modeIsPlaying)) return;
		this.currentBildIndex++;
		if (this.currentBildIndex >= this.galerieData.length) this.currentBildIndex = 0;
		this.showBild();		
	},
	
	
	// Bild zeigen
	showBild: function() {
	    if (this.galerieData.length == 0) return;
		if (this.loadedBildIndex == this.currentBildIndex) {
			this.Bild2.Opacity = 1;
			return;
		}
		
		this.Bild1.Source = this.Bild2.Source;
		this.Bild1.Opacity = 1;
		
		this.Bild2.Opacity = 0;
		this.control.content.findName("Bild_Hide").Begin();
		this.Bild2.Source = this.galerieData[this.currentBildIndex].Url;
		this.loadedBildIndex = this.currentBildIndex;		
		this.isWaitingForPicture = false;
	},
	
	
	
	
	// Galerie
	// ----------------------------------------	
	
	
	
	
	
	// Es wurde auf ein Galeriebild geklickt
	handleGalerieItemClick: function(sender, args) {
		this.currentBildIndex = parseInt(sender.tag);
		this.hideGalerie();
		this.showBild();
	},
	
	
	// Bilder für Galerie anlegen
	createGalerie: function() {
		var BildXaml1 = '<Image xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="150" Height="100" Canvas.Left="100" Canvas.Top="100" Stretch="UniformToFill" Cursor="Hand" x:Name="GalerieBild';
		var BildXaml2 = '" />';
		var RahmenXaml = '<Rectangle Width="154" Height="104" Fill="#FF000000" Stroke="#FFFFFFFF" StrokeThickness="2"/>';
		var row = 0;
		var col = 0;
		
		for (i = 0; i < this.gridIPP; i++) {
			var rahmen = this.control.content.createFromXaml(RahmenXaml);
			rahmen["Canvas.Top"] = 23 + 130 * row;
			rahmen["Canvas.Left"] = 43 + 180 * col;
			this.GalerieCanvas.children.add(rahmen);
			this.GalerieBorderItems[i] = rahmen;
			
			var objekt = this.control.content.createFromXaml(BildXaml1 + i + BildXaml2);
			objekt["Canvas.Top"] = rahmen["Canvas.Top"] + 2;
			objekt["Canvas.Left"] = rahmen["Canvas.Left"] + 2;

			this.GalerieCanvas.children.add(objekt);
			this.GalerieItems[i] = objekt;
			objekt.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleGalerieItemClick));
			
			col++;
			if (col >= this.gridIPC) {
				row++;
				col = 0;
			}
		}
	},
	
	
	// Galeriebilder anzeigen
	displayGalerieBilder: function() {

		if (this.galleryPageIndex < 0) {
			this.galleryPageIndex = Math.floor(this.currentBildIndex / this.gridIPP);			
		}
		
		var bildIndex = this.galleryPageIndex * this.gridIPP;
		
		for (i = 0; i < this.gridIPP; i++) {
			if ((bildIndex + i) >= this.galerieData.length) {
				this.GalerieItems[i].Source = null;
				this.GalerieItems[i].tag = null;
			} else {
				this.GalerieItems[i].Source = this.galerieData[bildIndex + i].Url;
				this.GalerieItems[i].tag = String(bildIndex + i);
			}
		}
	},
	
	
	// Galerie einblenden
	showGalerie: function() {
		this.isGalerieVisible = true;
		this.FotoCanvas.Visibility = "Collapsed";
		this.GalerieCanvas.Visibility = "Visible";
		this.galleryPageIndex = -1;
		this.displayGalerieBilder();
	},
	
	
	// Galerie ausblenden
	hideGalerie: function() {
		this.isGalerieVisible = false;		
		this.FotoCanvas.Visibility = "Visible";
		this.GalerieCanvas.Visibility = "Collapsed";
	},
	
	
	
	
	// FUNKTIONS-BUTTONS	
	// --------------------------------------

	
	// Button Next
	handleNextClick: function(sender, args) {
		if (this.isGalerieVisible) {
			if (this.galleryPageIndex < Math.floor(this.galerieData.length / this.gridIPP)) this.galleryPageIndex++;
			this.displayGalerieBilder();
		} else {
			this.nextBild(false);
		}
	},
	
	// Button Prior
	handlePriorClick: function(sender, args) {
		if (this.isGalerieVisible) {
			if (this.galleryPageIndex > 0) this.galleryPageIndex--;
			this.displayGalerieBilder();
		} else {
			this.priorBild();
		}
	},
	
	// Button Play
	handlePlayClick: function(sender, args) {
		this.modeIsPlaying = !this.modeIsPlaying;
		if (this.modeIsPlaying) {
			sender.Opacity = 1;
		} else {
			sender.Opacity = 0.5;
			return;
		}
		this.nextBild(true);
	},
		
	// Button Fullscreen
	handleFullScreenClick: function(sender, args) {
	    var silverlightPlugin = sender.getHost();
    	silverlightPlugin.content.fullScreen = !silverlightPlugin.content.fullScreen;
	},
		
	// Button Galerie
	handleGalerieClick: function(sender, args) {
		if (this.isGalerieVisible) {
			this.hideGalerie();
			this.showBild();
		} else {
			this.showGalerie();
		}
	}
}