/*
 * Ext JS Library 1.1 RC 1
 * Copyright(c) 2006-2007, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://www.extjs.com/license
 */

//var singleViewUrl = 'index.php?id=507';
var singleViewUrl = 'index.php?id=498';

// create the LayoutExample application (single instance)
var LayoutExample = function(){
	// everything in this space is private and only accessible in the HelloWorld block
	
	// define some private variables
	var dialog, showBtn;
	
	var toggleTheme = function(){
		Ext.get(document.body, true).toggleClass('xtheme-gray');
	};
	
	
	
	
	
	// return a public interface
	return {
		init : function(){
			//showBtn = Ext.get('show-dialog-btn');
			showBtn = Ext.select('span.singleUid');
			
			// attach to click event
			showBtn.on('click', this.showDialog, this);				
		},

		

		
		showDialog : function(e){
			// über dir id des geklickten "Links" wird die Uid des Datensatzes übermittelt z.B. "txwsreferenzenpi1-teaser-1"
			var singleViewLink = Ext.get(e.target);
			var singleUidArray = singleViewLink.dom.id.split('-');	// JS-Äquivalent zu explode();
			var showUid = singleUidArray[2];
			// title-Tag zum Recycling auslesen:			
			var ReferenceTitle = '<h2 style="text-align:center;">'+singleViewLink.dom.title+'</h2>';
			
				
			// das Popup (Dialogbox) wird erzeugt:
			dialog = new Ext.LayoutDialog("hello-dlg", { 
				modal:true,
				width:600,
				height:555,
				shadow:false,
				minWidth:600,
				minHeight:555,
				draggable:false,
				proxyDrag:false,
				resizable:false,
				collapsible: false,
        north: {
          //split:true,
          initialSize: 40,
          minSize: 40,
          maxSize: 00,
          titlebar: false,
          collapsible: false,
          animate: false
     		 },				
				center: {
					autoScroll:false,
					tabPosition: 'top',
					closeOnTab: true,
					alwaysShowTabs: true
				}
			});
			dialog.addKeyListener(27, dialog.hide, dialog);
			dialog.addButton('Schließen', dialog.hide, dialog);

			dialog.setTitle('www.smedja.com&nbsp;&nbsp;-&nbsp;&nbsp;Referenzen');
		
			var layout = dialog.getLayout();
			layout.beginUpdate();
						
			// die Überschrift erzeugen:
			layout.add('north', northfenster = new Ext.ContentPanel('north', {autoCreate:true, background:true, title: 'Link'}, ReferenceTitle));
			// die 3 Tabs (Beschreibung,Screenshot,Link) werden erzeugt:   						
			layout.add('center', text = new Ext.ContentPanel('center', {autoCreate:true, title: 'Beschreibung'}, 'Inhalt'));
			layout.add('center', screenshot = new Ext.ContentPanel('screenshot', {autoCreate:true, background:true, title: 'Screenshot'}, 'Inhalt'));
			//layout.add('center', screenshot = new Ext.ContentPanel(Ext.id(), {autoCreate:true, background:true, title: 'Screenshot'}, 'Inhalt'));
			layout.add('center', reflink = new Ext.ContentPanel('reflink', {autoCreate:true, background:true, title: 'Link'}, 'Inhalt'));
			        
			layout.endUpdate();
			
			// die 3 Tabs werden befüllt:

			screenshot.setUrl(singleViewUrl+'&tx_wsreferenzen_pi1[showWhat]=screenshot&tx_wsreferenzen_pi1[showUid]='+showUid);
			screenshot.refresh();
			text.setUrl(singleViewUrl+'&tx_wsreferenzen_pi1[showWhat]=description&tx_wsreferenzen_pi1[showUid]='+showUid);
			text.refresh();			
			reflink.setUrl(singleViewUrl+'&tx_wsreferenzen_pi1[showWhat]=reflink&tx_wsreferenzen_pi1[showUid]='+showUid);
			reflink.refresh();	
	
				

			dialog.show(showBtn.dom);
		}
	};
}();



// using onDocumentReady instead of window.onload initializes the application
// when the DOM is ready, without waiting for images and other resources to load
Ext.onReady(
	LayoutExample.init, 		
	LayoutExample, 
	true
);