top.Ext.example = function(){
			    var msgCt;
			
			    function createBox(t, s){
			        return [
			        		'<div class="msg">',
			        		'<table class="popup" id="dpop">',
							'    <tr>',
							'        <td class="corner" id="topleft"></td>',
							'        <td class="top"></td>',
							'        <td class="corner" id="topright"></td>',
							'    </tr>',
							'    <tr>',
							'        <td class="left"></td>',
							'        <td>',
							'			<table class="popup-contents">',
							'			    <tr>',
							'			        <td><b>', t ,'</b></td>',
							'			    </tr>',
							'			    <tr>',
							'			        <td>' , s , '</td>',
							'			    </tr>',
							'			</table>',
							'        </td>',
							'        <td class="right"></td>',
							'    </tr>',
							'    <tr>',
							'       <td id="bottomleft" class="corner"></td>',
							'        <td class="bottom"></td>',
							'        <td class="corner" id="bottomright"></td>',
							'    </tr>',
							'</table>',
							'</div>'].join('');
			    }
			    return {
			        msg : function(title, format)
			        {
			            if(!msgCt){
			                msgCt = top.Ext.DomHelper.insertFirst(document.body, {id:'msg-div'}, true);
			            }
			            msgCt.alignTo(document, 't-t');
			            var s = String.format.apply(String, Array.prototype.slice.call(arguments, 1));
			            var m = top.Ext.DomHelper.append(msgCt, {html:createBox(title, s)}, true);
			            m.fadeIn('t').pause(3).ghost("t", {remove:true});
			        }
			
			    };
			}();
			
function app()
{
	// List of  split view layout object
	var split_view = [];
	
	// Main layout object
	var main_layout = '';
	
	// Variable od default config navigation panel to load
	var default_panel_config ='';
	
	// The list of defaults onclick controls
	var onclick_controls_type = '';
	
	// The server side extention to use;
	var server_side_extention  = '';
	
	var param_obj = '';
	
	return {
		
		debug: function( data )
		{
			var i = 0;
			var x = new Array();
			for(i in data) 
			{
				Ext.log(i);
		  		x[x.length] = i;
			}
			
			
			//alert( x.toString() );
		},
		
		init:function()
		{
			this.server_side_extention = '.php';
			this.split_view = [];
			this.param_obj = new Object();
			this.modules = new Object();
			 
			// Init list of defaults controls
			this.onclick_controls_type = 
			{
				tree:{
					page:'/onclick/onclick_control/control_tree' + this.server_side_extention
				},
				
				grid:{
					page:'/onclick/onclick_control/control_grid' + this.server_side_extention
					
				},
				
				splitview:{
					page:'/onclick/onclick_control/view_split' + this.server_side_extention
					
				},
				
				empty:{
					page:'/onclick/onclick_control/control_empty' + this.server_side_extention
				}
			};
			
			this.buttons_type = 
			{
        /*
         * Function who return dataRecord for combobox in ajax
         * 
         * @param String type
         * 
         * 
         */
        popupjs: function( type )
        {
             var dataStoreAjax = '';
             
             if (typeof type == 'undefined')
             {
               type = 'jsExtention';
             }
             
             switch ( type )
             {
              case 'jsExtention' : 
                 dataStoreAjax = '/onclick/onclick_ajax/jsExtention.ajax.php';
                 break;
              case 'lngTranslate' : 
                 dataStoreAjax = '/onclick/onclick_ajax/lngTranslate.ajax.php';
                 break;
              default :
                 dataStoreAjax = '/onclick/onclick_ajax/jsExtention.ajax.php';
                 break;
             }
					
			    	
			        var _ds = new Ext.data.JsonStore({
			            root: 'items',
			            url: dataStoreAjax,
			            totalProperty: 'totalCount',
			        	fields:[
			            			{name: 'name', mapping: 'name'},
			            			{name: 'id', mapping: 'id'}
			        			]
			        	}
			        );
			   		
    
					var p = new Ext.form.ComboBox( 
						{
							store: _ds,
							selectOnFocus:true,
						 	allowBlank:false,
					        displayField:'name',
					        valueField:'id',
					        typeAhead: true,
					        triggerAction: 'all',
					        selectOnFocus:true,
					        editable:false,
					        resizable:true
						}
					);
					
					return p;	
				},
				
				
				popupright: function( )
				{
					Ext.namespace('Ext.popupright');
					Ext.popupright.values = [
						['0',LOCALIZATION['none']],
						['1',LOCALIZATION['read']],
						['2',LOCALIZATION['readandwirite']]
					];
					
					var _ds = new Ext.data.SimpleStore(
					{
			        	fields: ['id', 'display'],
			        	data : Ext.popupright.values
			    	});
			    	
					var p = new Ext.form.ComboBox( 
						{
							store: _ds,
							selectOnFocus:true,
						 	allowBlank:false,
					        displayField:'display',
					        valueField:'id',
					        typeAhead: true,
					        mode: 'local',
					        triggerAction: 'all',
					        selectOnFocus:true,
					        editable:false,
					        resizable:true
						}
					);
					
					return p;	
				},
				
				add:function( name , handler , scope )
				{
					var r = new Ext.Toolbar.Button(
					{
						text:name,
						icon:'/onclick/onclick_media/icons/add.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					return r;
					
				},
				
				del:function( name , handler , scope )
				{
					var r = new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/delete.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					return r;
					
				},
				
				approve:function( name , handler , scope )
				{
					var r = new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/accept.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					return r;
					
				},
				
				edit:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/page_white_edit.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					return r;
					
				},
				
				read:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/email_open.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					return r;
					
				},
				
				reply:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/email_go.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					return r;
					
				},
				
				duplicate:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/page_copy.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					
					return r;
				},
				
				exporte:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/database_go.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					
					return r;
				},
				
				datemenu:function( name , handler , scope )
				{
					
					var r =new Ext.Toolbar.MenuButton( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/calendar_view_day.png',
						cls: 'x-btn-text-icon',
						menu : new Ext.menu.DateMenu(
								{
			        				handler : handler,
			        				scope : scope
								})
					});
					
					return r;
				},
				
				cleanup:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/wand.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					
					return r;
				},
				
				search:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/find.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					
					return r;
					
				},
				
				clear:function( name , handler , scope )
				{
					var r =new Ext.Toolbar.Button( 
					{
						text:name,
						icon:'/onclick/onclick_media/icons/cancel.png',
						cls: 'x-btn-text-icon',
						handler:handler,
						scope:( typeof( scope ) != 'undefined' ? scope : '' )
					});
					
					return r;
					
				}
				
				
			}
		},
		
		
		
		add_split_view:function( layout , id  )
		{
			var split_view = {
				id:id,
				layout:layout
			};
			 this.split_view[this.split_view.length] = split_view;
		},
		
		get_split_view_layout:function(  id  )
		{
			var i = 0;
			for( i=0;i<this.split_view.length;i++)
			{
				if( this.split_view.length[i].id == id )
				{
					
					return this.split_view.length[i].layout
				}
					
			}
		},
		
		format_url:function( config , url )
		{
			var use_query_string = false;
			var url_format = '';
			var query_string = '';
			
			if( url.indexOf('?') != -1 )
				use_query_string = true;
			
			query_string = 'controlid=' + config.id;
			
			if( use_query_string )
				url_format =  url + "&" + query_string;
			else
				url_format =  url + "?" + query_string;
			
			return url_format;
		},
		
		select_panel:function( params , layout )
		{
				
		},
		
		init_main_layout:function( config  )
		{
			   this.main_layout = new Ext.BorderLayout('main_layout_onclick', {
				  
					north: {
						split:false,
						initialSize: 28,
						titlebar: false
					},
					west: {
						split:true,
						initialSize: 300,
						minSize: 300,
						maxSize: 300,
						titlebar: false,
						autoScroll:true,
						collapsible:true,
						closeOnTab: true,
						tabPosition: 'top',
						alwaysShowTabs:true
					},
					center: {
						titlebar: false,
						autoScroll:true,
						closeOnTab: true,
						resizeTabs: false,
						tabPosition: 'top',
						alwaysShowTabs:true
					}
				});
					
			this.northRegion = this.main_layout.getRegion( 'north' );
			this.westRegion = this.main_layout.getRegion( 'west' );
			this.centerRegion = this.main_layout.getRegion( 'center' );
			
			if( typeof( config ) != 'undefined' )
				this.add_panel_to_layout( config , this.main_layout );
			
			return true;
		},
		
		showQuickTips:function( toitem )
		{
			Ext.QuickTips.init();
			Ext.QuickTips.register( 
				{
					target: toitem.id,
					interceptTitles:true,
					text: toitem.alt,
					Delay:0
				}
			)
		},
		
		add_panel_to_layout:function( params , layout , loadcp )
		{
			
			
				if( typeof( loadcp ) == 'undefined' )
					loadcp = true;
					
				var x = 0;
				
				for( x=0;x<params.length;x++)
				{
					
					var param = params[x];
					var find_panel = layout.findPanel( param.id ) ;
					
					
					if( find_panel == null )
					{
						
						if( param.tag == 'iframe' )
						{
							param.iframe = Ext.DomHelper.append(document.body, {id:param.id, tag:param.tag , frameborder:'0' , src:''} );
							param.panel = new Ext.ContentPanel(param.iframe, {title:param.title, fitToFrame:true, closable:param.closable,fitContainer:true,autoScroll:true});
							
							param.panel.loadcp = loadcp;
							param.panel.src = param.url
							param.panel.iframe = param.iframe;
							
							param.panel.on('activate', function()
								{
									if( !this.loaded && this.loadcp )
									{
										this.loaded = true;
										this.iframe.src = this.src
									}
									
									this.loadcp = true;						
								}
							);
							
						}
						else
						{
							param.iframe = Ext.DomHelper.append(document.body, {id:param.id, tag:param.tag} );
							param.panel = new Ext.ContentPanel(param.iframe, {title: param.title, fitToFrame:true, closable:param.closable,fitContainer:true});
							var updater = param.panel.getUpdateManager();
							updater.loadScripts = true;
							
							
							if( typeof(param.type ) != 'undefined' )
							{
								updater.setDefaultUrl( this.format_url( param , param.type.page ) );
							}
							else
								updater.setDefaultUrl( this.format_url( param , param.url ) );
							
							
							param.panel.loadcp = loadcp;
						
							param.panel.on('activate', function()
								{
									var updater = this.getUpdateManager();
									if( !this.loaded && this.loadcp )
									{
										this.loaded = true;
										updater.refresh();	
									}
									
									this.loadcp = true;						
								}
							);
							
						
						}

						param.region = layout.getRegion( param.zone ) ;
						
						this.param_obj[param.id] = param;
						layout.add( param.zone , param.panel );
						return param.panel;
					}
					else
					{
						
						var find_region = layout.getRegion( param.zone ) ;
						find_region.showPanel(find_panel);
						return find_panel;
					}
				}
				
		},
		
		register_module:function( name , module )
		{
			this.modules[name] = module;
		},
		
		get_module:function( name )
		{
			return this.modules[name];	
		},
		
		delete_module:function( name )
		{
			delete this.modules[name];	
		},
		
		load_site_module:function( module , param , param_obj , init )
		{
			
			var ajax = Ext.Ajax.request
			(
				{
				   url: '/onclick/site_modules/' + module + '/' + init + '.php' + ( typeof( param ) != 'undefined' ? param: '' ) ,
				   success:
							function( response , options )
							{
								
								try
								{
									eval( response.responseText );
								}
								catch(e)
								{
									this.load_site_module( options.module , options.param , options.param_obj , options.init  )
								}
								
							},
					failure :
							function( response , options )
							{
								
							}
				   
				}
			);
			
		},
		
		load_module:function( module , param , param_obj , init )
		{
			if( typeof( init) == 'undefined' )
				init = 'init';
			
			var ajax = Ext.Ajax.request
			(
				{
				   url: '/onclick/onclick_modules/' + module + '/' + init + '.php' + ( typeof( param ) != 'undefined' ? param: '' ) ,
				   param : param,
				   module: module,
				   param_obj : param_obj,
				   init: init,
				   success:
							function( response , options )
							{
								try
								{
									eval( response.responseText );
								}
								catch(e)
								{
									this.load_site_module( options.module , options.param , options.param_obj , options.init  )
								}
								
									
							},
					failure :
							function( response , options )
							{
								this.load_site_module( options.module , options.param , options.param_obj , options.init  )
							},
					scope: this
				   
				}
			);
			
		},
		
		add_tab:function( params , tabpanel )
		{
				var x = 0;
				for( x=0;x<params.length;x++)
				{
					var param = params[x];
					var iframe = Ext.DomHelper.append(document.body, {tag: param.tag} );
					var tab = tabpanel.addTab( iframe , param.title );
					var updater = tab.getUpdateManager();
					updater.loadScripts = true;
					if( typeof(param.type ) != 'undefined' )
					{
						updater.setDefaultUrl( this.format_url( param , param.type.page) );
					}
					else
						updater.setDefaultUrl( this.format_url( param , param.url ) );
						
					tab.on('activate', updater.refresh, updater, true);
					
					if( x == 0 )
						tab.activate(iframe);
				}
				
		},
		
		
		
		
		
		show_window:function( param )
		{
				var iframe = Ext.DomHelper.append(document.body, {tag:'div'} );
				var dlg = new Ext.BasicDialog(iframe, {
			    height: param.height,
			    width: param.width,
			    minHeight: param.height,
			    minWidth: param.width,
			    modal: true,
			    proxyDrag: false,
			    shadow: true
			});
			
			panel = dlg.getTabs();
			this.add_tab( param.config , panel )
			dlg.addKeyListener(27, dlg.hide, dlg); // ESC can also close the dialog
			dlg.addButton(LOCALIZATION['close'], dlg.hide, dlg);
			dlg.show();	
		},
		
		init_split_layout:function( param )
		{	
			   var split_view = new Ext.BorderLayout(param.into, {
				  
					north: {
	                        split:true,
	                        initialSize: 200,
	                        minSize: 100,
	                        maxSize: 400,
	                        titlebar: true,
	                        collapsible:true

	                    },
	                    center: {
	                        autoScroll:true,
	                        collapsible:true,
	                        titlebar: true
	                    }
	       });
	       
	       split_view.on( 'regionresized' , function( lr , ns )
		       {

		       }
	       );
	       
	       this.add_panel_to_layout( split_view , param.id );
	       return split_view;
		}
	}
}

// Init main applicaion for javascript 
Ext.BLANK_IMAGE_URL = "/onclick/onclick_media/images/s.gif";
var main_app = new app();
main_app.init();