luos/workflow/engine/templates/cases/casesStartPage.js

//Ext.BLANK_IMAGE_URL = 'resources/s.gif';

var startCaseFilter;

Ext.chart.Chart.CHART_URL = '/images/charts.swf';
Ext.FlashComponent.EXPRESS_INSTALL_URL = '/images/expressinstall.swf';

var conn = new Ext.data.Connection();

var caseStatusByProcess = new Ext.data.JsonStore({
	fields : [ 'process', 'inbox', 'draft', 'unassigned' ],
	root : 'caseStatusByProcess'
});

var caseDelayed = new Ext.data.JsonStore({
	fields : [ 'delayed', 'total' ],
	root : 'caseDelayed'
});

function getDashboardData() {

	var parameters = {
		action : 'getSimpleDashboardData'
	};
	conn.request({
		url : 'casesStartPage_Ajax.php',
		method : 'POST',
		params : {
			"action" : 'getSimpleDashboardData'
		},
		success : function(responseObject) {
			var responseData = Ext.decode(responseObject.responseText);

			// Load store from here
			caseStatusByProcess.loadData(responseData);
			caseDelayed.loadData(responseData);
		},
		failure : function() {
			Ext.Msg.alert('Status', 'Unable to get list of Process');
		}
	});
}

function getOtherDashboards(dashboardTabPanels) {
	conn.request({
		url : 'casesStartPage_Ajax.php',
		method : 'POST',
		params : {
			"action" : 'getRegisteredDashboards'
		},
		success : function(responseObject) {

			var response = Ext.util.JSON.decode(responseObject.responseText);
			for ( var i = 0; i < response.length; i++) {
				tabInfo = response[i];
				if (tabInfo.sName) {
					dashboardTabPanels.add({
						title : tabInfo.sName,
						id : tabInfo.sNamespace + "-" + tabInfo.sName,
						iconCls : tabInfo.sIcon,// 'ICON_CASES_START_PAGE',
						autoLoad : {
							url : tabInfo.sPage,
							scripts : true
						}
					// disabled:true,
					});
				}
			}
			getDefaultDashboard(dashboardTabPanels);
		},
		failure : function() {
			// grid.getGridEl().unmask(true);
			getDefaultDashboard(dashboardTabPanels);
			Ext.Msg.alert('Status', 'Unable to get Dashboards');
		}
	});
}

function getDashboardItems() {
	dashboardItems = [ {
		store : caseDelayed,
		xtype : 'piechart',
		dataField : 'total',
		categoryField : 'delayed',
		width : 250,
		height : 250,
		draggable : true,
		disableCaching : true,
		expressInstall : true,
		// extra styles get applied to the chart defaults
		extraStyle : {
			legend : {
				display : 'bottom',
				padding : 5,
				font : {
					family : 'Tahoma',
					size : 13
				}
			}
		}

	}, {
		title : 'Status by Process',
		xtype : 'columnchart',
		store : caseStatusByProcess,
		width : 450,
		height : 400,
		series : [ {
			yField : 'inbox',
			displayName : 'Inbox'
		}, {
			yField : 'draft',
			displayName : 'Draft'
		}, {
			yField : 'unassigned',
			displayName : 'Unassigned'
		} ],
		xField : 'process',
		draggable : true,
		xAxis : new Ext.chart.CategoryAxis({
			// title : 'Case Status',
			labelRenderer : this.customFormat
		}),
		customFormat : function(value) {
			return 'Year: ';
		},
		yAxis : new Ext.chart.NumericAxis({
			title : 'Total'
		}),
		extraStyle : {
			xAxis : {
				labelRotation : -45
			},
			legend : {
				display : 'right'
			}
		}
	} ];
	getDashboardData();
	return dashboardItems;
}

function getDefaultDashboard(dashboardTabPanels) {
	defaultDashboard = "mainDashboard";
	dashboardTabPanels.setActiveTab(defaultDashboard);
	Ext.getCmp("dashboardTabPanels").getEl()
			.mask("Please wait, retrieving data...",
					"ext-el-mask-msg x-mask-loading");

	var parameters = {
		action : 'getDefaultDashboard'
	};
	conn.request({
		url : 'casesStartPage_Ajax.php',
		method : 'POST',
		params : {
			"action" : 'getDefaultDashboard'
		},
		success : function(responseObject) {
			// showHistoryDialog(responseObject.responseText);
			// grid.getGridEl().unmask(true);
			// Ext.Msg.alert('Status', responseObject.responseText);
			var responseData = Ext.decode(responseObject.responseText);
			// console.log(responseData);
			// console.log(responseData.defaultTab);
			if (responseData.defaultTab) {
				defaultDashboard = responseData.defaultTab;
			}
			if (dashboardTabPanels.getItem(defaultDashboard)) {
				dashboardTabPanels.setActiveTab(defaultDashboard);
			}
			Ext.getCmp("dashboardTabPanels").getEl().unmask();

		},
		failure : function() {
			Ext.getCmp("dashboardTabPanels").getEl().unmask();
			// grid.getGridEl().unmask(true);
			// Ext.Msg.alert('Status', 'Unable to get list of Process');
		}
	});

	// Get User Dashbaord Default if allowed
	return defaultDashboard;
}

Docs = {};
// console.info("Doc Panel - Start");

DocPanel = Ext.extend(Ext.Panel, {
  closable : true,
  autoScroll : true,

  initComponent : function() {
    // var ps = this.cclass.split('.');
    // this.title = ps[ps.length-1];
    Ext.apply(this, {
      tbar : [
          '->',
          {
            text : 'Config Options',
            handler : this.scrollToMember.createDelegate(
                this, [ 'configs' ]),
            iconCls : 'icon-config'
          },
          '-',
          {
            text : 'Properties',
            handler : this.scrollToMember.createDelegate(
                this, [ 'props' ]),
            iconCls : 'icon-prop'
          },
          '-',
          {
            text : 'Methods',
            handler : this.scrollToMember.createDelegate(
                this, [ 'methods' ]),
            iconCls : 'icon-method'
          },
          '-',
          {
            text : 'Events',
            handler : this.scrollToMember.createDelegate(
                this, [ 'events' ]),
            iconCls : 'icon-event'
          },
          '-',
          {
            text : 'Direct Link',
            handler : this.directLink,
            scope : this,
            iconCls : 'icon-fav'
          },
          '-',
          {
            tooltip : 'Hide Inherited Members',
            iconCls : 'icon-hide-inherited',
            enableToggle : true,
            scope : this,
            toggleHandler : function(b, pressed) {
              this.body[pressed ? 'addClass'
                  : 'removeClass']('hide-inherited');
            }
          },
          '-',
          {
            tooltip : 'Expand All Members',
            iconCls : 'icon-expand-members',
            enableToggle : true,
            scope : this,
            toggleHandler : function(b, pressed) {
              this.body[pressed ? 'addClass'
                  : 'removeClass']('full-details');
            }
          } ]
    });
    DocPanel.superclass.initComponent.call(this);
  },

  directLink : function() {
    var link = String.format(
        "<a href=\"{0}\" target=\"_blank\">{0}</a>",
        document.location.href + '?class=' + this.cclass);
    Ext.Msg.alert('Direct Link to ' + this.cclass, link);
  },

  scrollToMember : function(member) {
    var el = Ext.fly(this.cclass + '-' + member);
    if (el) {
      var top = (el.getOffsetsTo(this.body)[1])
          + this.body.dom.scrollTop;
      this.body.scrollTo('top', top - 25, {
        duration : 0.75,
        callback : this.hlMember.createDelegate(this,
            [ member ])
      });
    }
  },

  scrollToSection : function(id) {
    var el = Ext.getDom(id);
    if (el) {
      var top = (Ext.fly(el).getOffsetsTo(this.body)[1])
          + this.body.dom.scrollTop;
      this.body.scrollTo('top', top - 25, {
        duration : 0.5,
        callback : function() {
          Ext.fly(el).next('h2').pause(0.2).highlight(
              '#8DB2E3', {
                attr : 'color'
              });
        }
      });
    }
  },

  hlMember : function(member) {
    var el = Ext.fly(this.cclass + '-' + member);
    if (el) {
      if (tr = el.up('tr')) {
        tr.highlight('#cadaf9');
      }
    }
  }
});


var newCaseTree = {
  xtype : 'treepanel',
  id : 'processTree',
  style : {
    height : '100%',
    overflow : 'auto'
  },
  useArrows : true,
  border : false,
  split : true,
  itemId : 'startCaseTreePanel',
  id : 'startCaseTreePanel',
  rootVisible : false,
  treePanel : this,
  clearOnReLoad : false,
  loader : new Ext.tree.TreeLoader({
	  preloadChildren : true,
    dataUrl : 'casesStartPage_Ajax.php',
    baseParams : {
      action : 'getProcessList'
    }
  }),
  listeners : {
    dblclick : function(n) {
      if (n.attributes.optionType == "startProcess") {
        Ext.Msg.show({
          title : 'Start Case',
          msg : 'Starting new case<br><br><b>'
              + n.attributes.text
              + '</b>',
          icon : Ext.MessageBox.INFO
        });
        Ext.Ajax.request({
          url : 'casesStartPage_Ajax.php',
          params : {
            action : 'startCase',
            processId : n.attributes.pro_uid,
            taskId : n.attributes.tas_uid
          },
          success : function(response) {
            var res = Ext.util.JSON.decode(response.responseText);
            if (res.openCase) {
              window.location = res.openCase.PAGE;
            } else {
              Ext.Msg.show({
                title : 'Error creating a new Case',
                msg : '<textarea cols="50" rows="10">'
                    + res.message
                    + '</textarea>',
                icon : Ext.MessageBox.ERROR,
                buttons : Ext.Msg.OK
              });
            }
          },
          failure : function() {
            // grid.getGridEl().unmask(true);
            Ext.Msg.alert('Error', 'Unable to start a case');
          }
        });
      }
    },
    click : function(n) {
      mainPanel.showDetails(n);
    }
  },
  root : {
    nodeType : 'async',
    draggable : false,
    id : 'root',
    expanded : true
  }
};

var startCaseTab = {
  id : 'startCase',
  title : 'Start Case',
  iconCls : 'ICON_CASES_START_CASE',
  layout : 'border',
  items : [
      {
        id : 'img-chooser-view',
        region : 'center',
        style : {
            width : '50%'
          	
          },
        // autoScroll: true,
        items : [ newCaseTree ]
      }, {
    	  xtype:'form',
        id : 'process-detail-panel',
        region : 'east',
        //autoHeight : true,
        split : true,
        style : {
            width : '50%'
          	
          },
        
//        minWidth : 150,
        frame: true,
        labelAlign: 'right',
        labelWidth: 85,
  //      width:340,
        waitMsgTarget: true,
        title:'Process Information',
        layout:'form',
        defaults: {width: 350},
        defaultType: 'textfield',


        items: [{
            fieldLabel: 'Process',
            name: 'processName',
            allowBlank:false,
            value: '',
            disabled: true,
            //readonly:true,
            id:"processName"
        },{
            fieldLabel: 'Task',
            name: 'taskName',
            allowBlank:false,
            value: '',
            disabled: true,
            id:"taskName"
        },{
        	xtype:'textarea',
            fieldLabel: 'Description',
            name: 'processDescription',
            value: '',
            disabled: true,
            id:"processDescription"
        },{
            fieldLabel: 'Category',
            name: 'processCategory',
            value: '',
            disabled: true,
            id:"processCategory"
        }, {
            fieldLabel: 'Calendar',
            name: 'calendarName',            
            disabled: true,
            id:"calendarName"
      },{
      	xtype:'textarea',
        fieldLabel: 'Calendar Description',
        name: 'calendarDescription',
        value: '',
        disabled: true,
        id:"calendarDescription"
    },{
    	xtype:'checkboxgroup',
          fieldLabel: 'Working days',
          name: 'calendarWorkDays',
          disabled: true,
          id:"calendarWorkDays",
        	  columns: 7,
        	    items: [
        	        {boxLabel: 'Sun', name: '0'},
        	        {boxLabel: 'Mon', name: '1'},
        	        {boxLabel: 'Tue', name: '2'},
        	        {boxLabel: 'Wen', name: '3'},
        	        {boxLabel: 'Thu', name: '4'},
        	        {boxLabel: 'Fri', name: '5'},
        	        {boxLabel: 'Sat', name: '6'}
        	    ]

     }, {
    	xtype:'checkbox',
        fieldLabel: 'Debug Mode',
        name: 'debugMode',        
        disabled: true,
        id:"debugMode"
  }]
      }
  ],

  tbar : [
      {
        xtype : 'textfield',
        name : 'processesFilter',
        id: 'processesFilter',
        emptyText : 'Find a Process',
        enableKeyEvents : true,
        listeners : {
          render : function(f) {
            /*Ext.getCmp("startCaseTreePanel").filter = new Ext.tree.TreeFilter(
              this,
              {
                clearBlank : true,
                autoClear : true
              }
            );*/

            startCaseFilter = new Ext.ux.tree.TreeFilterX(Ext.getCmp('startCaseTreePanel'));
          }, /*
          keydown : function(t, e) {
            treeFiltered = Ext.getCmp("startCaseTreePanel");
            //console.log(treeFiltered);

            var text = t.getValue();

            //console.log(text);
            if (!text) {
              treeFiltered.filter.clear();
              return;
            }
            treeFiltered.expandAll();

            var re = new RegExp('^'+ Ext.escapeRe(text), 'i');
            console.log(re);
            treeFiltered.filter.filterBy(function(n) {
              return !n.attributes.isClass || re.test(n.text);
            });
          },*/
          specialkey: function(f,e){
            if (e.getKey() == e.ENTER) {
              txt = Ext.getCmp('processesFilter').getValue();
              startCaseFilter.clear();
              var re = new RegExp('.*' + txt + '.*', 'i');
              startCaseFilter.filter(re, 'text');
            }
          },
          scope : this
        }
      },
      {
        text:'X',
        ctCls:'pm_search_x_button',
        handler: function(){
          Ext.getCmp('processesFilter').setValue('');
          startCaseFilter.clear();
        }
      },
      ' ',
      ' ',
      {
        iconCls : 'icon-expand-all',
        tooltip : 'Expand All',
        handler : function() {
          Ext.getCmp("startCaseTreePanel").root.expand(true);
        },
        scope : this
      },
      '-',
      {
        iconCls : 'icon-collapse-all',
        tooltip : 'Collapse All',
        handler : function() {
          Ext.getCmp("startCaseTreePanel").root.collapse(true);
        },
        scope : this
      },
      ' ',
      ' ',
      {
        xtype : 'tbbutton',
        cls : 'x-btn-icon',
        icon : '/images/refresh.gif',

        handler : function() {
          tree = Ext
              .getCmp('startCaseTreePanel');
          tree.getLoader().load(
              tree.root);
        }
      }
   ]
};

var documentsTab = {
  id : 'documents',
  title : 'Documents',
  iconCls : 'ICON_FOLDERS',
  layout : 'border',
  items : [ {
    id : 'documentsView',
    region : 'center',
    // autoScroll: true,
    items : [ {
      xtype : 'treepanel',
      id : 'documentsTree',
      style : {
        // width: '50%',
        height : '100%',
        overflow : 'auto'
      },
      useArrows : true,
      border : false,
      split : true,
      itemId : 'documentsTreePanel',
      id : 'documentsTreePanel',
      rootVisible : true,
      treePanel : this,
      clearOnReLoad : false,
      loader : new Ext.tree.TreeLoader(
          {
            dataUrl : '../appFolder/appFolderAjax.php',
            baseParams : {
              action : 'expandNode'
            }
          }
      ),
      listeners : {
        dblclick : function(n) {
          if (n.attributes.optionType == "startProcess") {
            Ext.Msg.show({
              title : 'Start Case',
              msg : 'Starting new case<br><br><b>'
                  + n.attributes.text
                  + '</b>',
              icon : Ext.MessageBox.INFO
            });
            Ext.Ajax.request({
                  url : 'casesStartPage_Ajax.php',
                  params : {
                    action : 'startCase',
                    processId : n.attributes.pro_uid,
                    taskId : n.attributes.tas_uid
                  },
                  success : function(
                      response) {
                    var res = Ext.util.JSON
                        .decode(response.responseText);
                    if (res.openCase) {
                      window.location = res.openCase.PAGE;
                    } else {
                      Ext.Msg.show({
                        title : 'Error creating a new Case',
                        msg : '<textarea cols="50" rows="10">'
                            + res.message
                            + '</textarea>',
                        icon : Ext.MessageBox.ERROR,
                        buttons : Ext.Msg.OK
                      });
                    }
                  },
                  failure : function() {
                    // grid.getGridEl().unmask(true);
                    Ext.Msg.alert('Error', 'Unable to start a case');
                  }
                });
          }
        },
        click : function(n) {
          mainPanel.showDetails(n);
        }
      },
      root : {
        nodeType : 'async',
        draggable : false,
        id : 'root',
        expanded : true
      }
    } ]
  // items
  } ],

  tbar : [
      {
        xtype : 'textfield',
        name : 'field1',
        emptyText : 'Filter',
        enableKeyEvents : true,
        listeners : {
          render : function(f) {
            Ext.getCmp("documentsTreePanel").filter = new Ext.tree.TreeFilter(
              this,
              {
                clearBlank : true,
                autoClear : true
              }
            );
          },
          keydown : function(t, e) {
            treeFiltered = Ext.getCmp("documentsTreePanel");
            var text = t.getValue();
            if (!text) {
              treeFiltered.filter
                  .clear();
              return;
            }
            treeFiltered
                .expandAll();

            var re = new RegExp(
                '^'
                    + Ext
                        .escapeRe(text),
                'i');
            treeFiltered.filter
                .filterBy(function(
                    n) {
                  // return
                  // !n.attributes.isClass
                  // ||
                  // re.test(n.text);
                });
            /*
             * // hide empty
             * packages that weren't
             * filtered
             * this.hiddenPkgs = [];
             * var me = this;
             * this.root.cascade(function(n){
             * if(!n.attributes.isClass &&
             * n.ui.ctNode.offsetHeight <
             * 3){ n.ui.hide();
             * me.hiddenPkgs.push(n); }
             * });
             */
          },
          scope : this
        }
      },
      ' ',
      ' ',
      {
        iconCls : 'icon-expand-all',
        tooltip : 'Expand All',
        handler : function() {
          Ext
              .getCmp("documentsTreePanel").root
              .expand(true);
        },
        scope : this
      },
      '-',
      {
        iconCls : 'icon-collapse-all',
        tooltip : 'Collapse All',
        handler : function() {
          Ext
              .getCmp("documentsTreePanel").root
              .collapse(true);
        },
        scope : this
      },
      ' ',
      ' ',
      {
        xtype : 'tbbutton',
        cls : 'x-btn-icon',
        icon : '/images/refresh.gif',

        handler : function() {
          tree = Ext
              .getCmp('documentsTreePanel');
          tree.getLoader().load(
              tree.root);
        }
      }
   ]
};
/*
var dashboardTab = {
  title : 'Dashboard',
  id : 'mainDashboard',
  iconCls : 'ICON_CASES_START_PAGE',
  xtype : 'container',
  autoHeight : true,
  enableDD : false,
  items : getDashboardItems()
};
*/
var MainPanel = function() {
	MainPanel.superclass.constructor.call(this, {
    id : 'doc-body',
    region : 'center',
    resizeTabs : true,
    minTabWidth : 135,
    tabWidth : 135,
    plugins : new Ext.ux.TabCloseMenu(),
    enableTabScroll : true,
    activeTab : 0,
    items : [startCaseTab/*, documentsTab, dashboardTab*/]
  });
};

// console.info("Main Panel - End");
Ext.extend(
  MainPanel,
  Ext.TabPanel,
  {
    initEvents : function() {
      MainPanel.superclass.initEvents.call(this);
      // this.body.on('click', this.onClick, this);
      
    },

    onClick : function(e, target, elementselected) {
      return;
      if (target = e.getTarget('a:not(.exi)', 3)) {
        var cls = Ext.fly(target).getAttributeNS('ext',
            'cls');
        e.stopEvent();
        if (cls) {
          var member = Ext.fly(target).getAttributeNS(
              'ext', 'member');
          this.loadClass(target.href, cls, member);
        } else if (target.className == 'inner-link') {
          this.getActiveTab().scrollToSection(
              target.href.split('#')[1]);
        } else {
          window.open(target.href);
        }
      } else if (target = e.getTarget('.micon', 2)) {
        e.stopEvent();
        var tr = Ext.fly(target.parentNode);
        if (tr.hasClass('expandable')) {
          tr.toggleClass('expanded');
        }
      }
    },

    loadClass : function(href, cls, member) {
      var id = 'docs-' + cls;
      var tab = this.getComponent(id);
      if (tab) {
        this.setActiveTab(tab);
        if (member) {
          tab.scrollToMember(member);
        }
      } else {
        var autoLoad = {
          url : href
        };
        if (member) {
          autoLoad.callback = function() {
            Ext.getCmp(id).scrollToMember(member);
          };
        }
        var p = this.add(new DocPanel({
          id : id,
          cclass : cls,
          autoLoad : autoLoad
        }));
        this.setActiveTab(p);
      }
    },

    initTemplates : function() {

      this.detailsTemplate = new Ext.XTemplate(
          '<div  class="details" style="background-color:Gainsboro">',
          '<tpl for=".">',
          '<!--<img src="{url}">-->',
          '<div class="details-info" style="background-color:#ffffff;/* for IE */ filter:alpha(opacity=90); /* CSS3 standard */ opacity:0.9;">',

          '<!-- <div style="width:90%;height:30%;padding:0px;overflow:auto;border:5px dashed black;margin:10px" id="pm_target" ></div>-->',
          '<h1><center><u>{taskName}</u></center></h1><br>',
          '<b>Process Name:</b>',
          '<span>{processName}</span>',
          '<b>Description: </b>',
          '<span>{processDescription}</span>',
          '<table>',
          '<tr>',
          '<td>',
          '<b>Category: </b>',

          '<span>{processCategory}</span>',

          '</td>',
          '<td>',
          '<b>Calendar: </b>',
          '<span>{calendarName} ({calendarDescription})</span>',
          '</td>',
          '<td>',
          '<b>Working Days: </b>',
          '<span>{calendarWorkDays}</span>',
          '</td>',
          '<td>',
          '<b>Debug mode: </b>',
          '<span>{processDebug}</span>',
          '</tr>',
          '</table>',
          '<b>Statistics: </b>',
          '<span><b>Active Cases (Mine/Total):</b>{myInbox} / {totalInbox}</span>',

          '<hr><span><i>Double click to start any Process/Case</i></span>',
          '<!-- <input type="button" value="Start Case" onclick="alert(\'JHL was here: This should start the following Process/Task{name}. \');alert(mainPanel);alert(mainPanel.startNewCase);"> -->',

          '</tpl>', '</div>');
      this.detailsTemplate.compile();
    },

    showDetails : function(selectedNode) {

      // console.log(selectedNode);
      var detailEl = Ext.getCmp('process-detail-panel').body;
      if (selectedNode) {
    	
        //this.initTemplates();
         //detailEl.hide();
        // detailEl.sequenceFx();
        // detailEl.slideOut('l',
        // {stopFx:true,duration:.9});
    	  
    	    

        otherAttributes = selectedNode.attributes.otherAttributes;
        
        calendarDays=(otherAttributes.CALENDAR_WORK_DAYS).split("|");
        calendarObj={};        
        for(i=0;i<calendarDays.length;i++){
        	calendarObj[calendarDays[i]]=true;
        }
        Ext.getCmp('process-detail-panel').getForm().setValues({
        	processName : otherAttributes.PRO_TITLE,
        	taskName : selectedNode.attributes.text,
        	calendarName : otherAttributes.CALENDAR_NAME,
        	calendarDescription : otherAttributes.CALENDAR_DESCRIPTION,
        	processCalendar:otherAttributes.CALENDAR_NAME+" "+otherAttributes.CALENDAR_DESCRIPTION,
        	calendarWorkDays : calendarObj,/*(otherAttributes.CALENDAR_WORK_DAYS).split("|"),*/
        	processCategory : otherAttributes.PRO_CATEGORY_LABEL,
        	processDebug : otherAttributes.PRO_DEBUG,
        	processDescription : otherAttributes.PRO_DESCRIPTION,
        	myInbox : otherAttributes.myInbox,
            totalInbox : otherAttributes.totalInbox

        });

        
        
        
        
        //this.detailsTemplate.overwrite(detailEl, data);
        //detailEl.slideIn('t', {stopFx:true,duration:.0});
        //detailEl.highlight('#000', {
        //  block : true
        //});
      } else {
        detailEl.update('');
      }

      return;
      // var selNode = this.getSelectedNodes();

    },
    /*
     * startNewCase:function(){ alert("asdasdasd"); },
     */
    loadOtherDashboards : function() {
      // console.info("Getting other Dashboards");
      dashboardTabPanels = this;
      // console.log(dashboardTabPanels);
      conn.request({
        url : 'casesStartPage_Ajax.php',
        method : 'POST',
        params : {
          "action" : 'getRegisteredDashboards'
        },
        success : function(responseObject) {

          var response = Ext.util.JSON
              .decode(responseObject.responseText);
          for ( var i = 0; i < response.length; i++) {
            tabInfo = response[i];
            if (tabInfo.sName) {
              dashboardTabPanels.add({
                title : tabInfo.sName,
                id : tabInfo.sNamespace + "-"
                    + tabInfo.sName,
                iconCls : tabInfo.sIcon,// 'ICON_CASES_START_PAGE',
                autoLoad : {
                  url : tabInfo.sPage,
                  scripts : true
                }
              // disabled:true,
              });
            }
          }
          // getDefaultDashboard(dashboardTabPanels);
          dashboardTabPanels.activateDefaultTab();
        },
        failure : function() {
          // grid.getGridEl().unmask(true);
          // getDefaultDashboard(dashboardTabPanels);
          dashboardTabPanels.activateDefaultTab();
          Ext.Msg.alert('Status',
              'Unable to get Dashboards');
        }
      });
    },
    activateDefaultTab : function() {
      // api.expandPath('/root/apidocs');
      // allow for link in
      var page = window.location.href.split('?')[1];
      // console.info("page : "+page);
      if (page) {
        var ps = Ext.urlDecode(page);
        // console.log(ps.action);
        if (ps.action) {
          defaultDashboard = ps.action;
          if (this.getItem(defaultDashboard)) {
            // console.info("Setting the new default
            // dashboard:
            // "+defaultDashboard);
            this.setActiveTab(defaultDashboard);
          }

        }
        // var cls = ps['class'];
        // mainPanel.loadClass('output/' + cls + '.html',
        // cls, ps.member);
      }
    }

  });

var mainPanel = new MainPanel();

Ext.onReady(function() {
	var Cookies = {};
	Cookies.set = function(name, value) {
		var argv = arguments;
		var argc = arguments.length;
		var expires = (argc > 2) ? argv[2] : null;
		var path = (argc > 3) ? argv[3] : '/';
		var domain = (argc > 4) ? argv[4] : null;
		var secure = (argc > 5) ? argv[5] : false;
		document.cookie = name
				+ "="
				+ escape(value)
				+ ((expires == null) ? "" : ("; expires=" + expires
						.toGMTString()))
				+ ((path == null) ? "" : ("; path=" + path))
				+ ((domain == null) ? "" : ("; domain=" + domain))
				+ ((secure == true) ? "; secure" : "");
	};

	Cookies.get = function(name) {
		var arg = name + "=";
		var alen = arg.length;
		var clen = document.cookie.length;
		var i = 0;
		var j = 0;
		while (i < clen) {
			j = i + alen;
			if (document.cookie.substring(i, j) == arg)
				return Cookies.getCookieVal(j);
			i = document.cookie.indexOf(" ", i) + 1;
			if (i == 0)
				break;
		}
		return null;
	};

	Cookies.clear = function(name) {
		if (Cookies.get(name)) {
			document.cookie = name + "="
					+ "; expires=Thu, 01-Jan-70 00:00:01 GMT";
		}
	};

	Cookies.getCookieVal = function(offset) {
		var endstr = document.cookie.indexOf(";", offset);
		if (endstr == -1) {
			endstr = document.cookie.length;
		}
		return unescape(document.cookie.substring(offset, endstr));
	};

	// function that loads store when it is called
	function getDashboardData() {
		var parameters = {
			action : 'getSimpleDashboardData'
		};
		conn.request({
			url : 'casesStartPage_Ajax.php',
			method : 'POST',
			params : {
				"action" : 'getSimpleDashboardData'
			},
			success : function(responseObject) {
				var responseData = Ext.decode(responseObject.responseText);

				// Load store from here
				caseStatusByProcess.loadData(responseData);
				caseDelayed.loadData(responseData);
			},
			failure : function() {
				Ext.Msg.alert('Status', 'Unable to get list of Process');
			}
		});
	}

	Ext.QuickTips.init();

	mainPanel.on('tabchange', function(tp, tab) {
		if (tab.getUpdater) {
			var thisObj = tab.getUpdater();
			if (thisObj) {
				thisObj.refresh();
			}
		}
	});

	var viewport = new Ext.Viewport({
		layout : 'border',
		items : [
		/*
		 * { // cls: 'docs-header', // height: 36, region:'north', xtype:'box',
		 * el:'header', border:false// , // margins: '0 0 5 0' },
		 */
		mainPanel ]
	});

	mainPanel.loadOtherDashboards();

	// console.info("viewport -end");

	viewport.doLayout();


  //routine to hide the debug panel if it is open
  if( parent.PANEL_EAST_OPEN ){
    parent.PANEL_EAST_OPEN = false;
    var debugPanel = parent.Ext.getCmp('debugPanel');
    debugPanel.hide();
    debugPanel.ownerCt.doLayout();
  }
  
});






// vim: ts=4:sw=4:nu:fdc=4:nospell
/*global Ext */
/**
 * @class   Ext.ux.tree.TreeFilterX
 * @extends Ext.tree.TreeFilter
 *
 * <p>
 * Shows also parents of matching nodes as opposed to default TreeFilter. In other words
 * this filter works "deep way".
 * </p>
 *
 * @author   Ing. Jozef Sakáloš
 * @version  1.0
 * @date     17. December 2008
 * @revision $Id: Ext.ux.tree.TreeFilterX.js 589 2009-02-21 23:30:18Z jozo $
 * @see      <a href="http://extjs.com/forum/showthread.php?p=252709">http://extjs.com/forum/showthread.php?p=252709</a>
 *
 * @license Ext.ux.tree.CheckTreePanel is licensed under the terms of
 * the Open Source LGPL 3.0 license.  Commercial use is permitted to the extent
 * that the code/component(s) do NOT become part of another Open Source or Commercially
 * licensed development library or toolkit without explicit permission.
 *
 * <p>License details: <a href="http://www.gnu.org/licenses/lgpl.html"
 * target="_blank">http://www.gnu.org/licenses/lgpl.html</a></p>
 *
 * @forum     55489
 * @demo      http://remotetree.extjs.eu
 *
 * @donate
 * <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
 * <input type="hidden" name="cmd" value="_s-xclick">
 * <input type="hidden" name="hosted_button_id" value="3430419">
 * <input type="image" src="https://www.paypal.com/en_US/i/btn/x-click-butcc-donate.gif"
 * border="0" name="submit" alt="PayPal - The safer, easier way to pay online.">
 * <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
 * </form>
 */

Ext.ns('Ext.ux.tree');

/**
 * Creates new TreeFilterX
 * @constructor
 * @param {Ext.tree.TreePanel} tree The tree panel to attach this filter to
 * @param {Object} config A config object of this filter
 */
Ext.ux.tree.TreeFilterX = Ext.extend(Ext.tree.TreeFilter, {
	/**
	 * @cfg {Boolean} expandOnFilter Deeply expands startNode before filtering (defaults to true)
	 */
	 expandOnFilter:true

	// {{{
    /**
     * Filter the data by a specific attribute.
	 *
     * @param {String/RegExp} value Either string that the attribute value
     * should start with or a RegExp to test against the attribute
     * @param {String} attr (optional) The attribute passed in your node's attributes collection. Defaults to "text".
     * @param {TreeNode} startNode (optional) The node to start the filter at.
     */
	,filter:function(value, attr, startNode) {

		// expand start node
		if(false !== this.expandOnFilter) {
			startNode = startNode || this.tree.root;
			var animate = this.tree.animate;
			this.tree.animate = false;
			startNode.expand(true, false, function() {

				// call parent after expand
				Ext.ux.tree.TreeFilterX.superclass.filter.call(this, value, attr, startNode);

			}.createDelegate(this));
			this.tree.animate = animate;
		}
		else {
			// call parent
			Ext.ux.tree.TreeFilterX.superclass.filter.apply(this, arguments);
		}

	} // eo function filter
	// }}}
	// {{{
    /**
     * Filter by a function. The passed function will be called with each
     * node in the tree (or from the startNode). If the function returns true, the node is kept
     * otherwise it is filtered. If a node is filtered, its children are also filtered.
	 * Shows parents of matching nodes.
	 *
     * @param {Function} fn The filter function
     * @param {Object} scope (optional) The scope of the function (defaults to the current node)
     */
	,filterBy:function(fn, scope, startNode) {
		startNode = startNode || this.tree.root;
		if(this.autoClear) {
			this.clear();
		}
		var af = this.filtered, rv = this.reverse;

		var f = function(n) {
			if(n === startNode) {
				return true;
			}
			if(af[n.id]) {
				return false;
			}
			var m = fn.call(scope || n, n);
			if(!m || rv) {
				af[n.id] = n;
				n.ui.hide();
				return true;
			}
			else {
				n.ui.show();
				var p = n.parentNode;
				while(p && p !== this.root) {
					p.ui.show();
					p = p.parentNode;
				}
				return true;
			}
			return true;
		};
		startNode.cascade(f);

        if(this.remove){
           for(var id in af) {
               if(typeof id != "function") {
                   var n = af[id];
                   if(n && n.parentNode) {
                       n.parentNode.removeChild(n);
                   }
               }
           }
        }
	} // eo function filterBy
	// }}}

}); // eo extend

// eof