iReport.App = Ext.extend(Ext.Panel, {
  fullscreen: true,
  layout: "card",
  
  initComponent: function() {
    
    this.list = new Ext.List({
      itemTpl: '<h2>{title}</h2><p>{thesis}</p>',
      ui: 'round',
      cls: "index-panel-list",
      //scroll: false,
      store: new Ext.data.Store({
        fields: ['reportId', 'title', "thesis"],
        data: [
          {
            reportId : 2501,
            title: 'Effect of knockdown of DJ-1 (PARK7) on Human Neuroblastoma Cells',
            thesis: 'Diabetic embryopathy can affect any developing organ system, although malformations in cardiovascular tissue, neural tube defects and caudal dysgenesis syndrome are the most prominent congenital malformations. We hypothesize that the metabolic imbalance occurring in diabetic pregnancy de-regulates tissue specific gene expression programs in the developing embryo.'
          },
          {
            reportId : 2500,
            title: 'Maternal Hypercholesterolemia Effect on Offspring: Carotid Artery',
            thesis: 'Maternal hypercholesterolemia is associated with a higher incidence and faster progression of atherosclerosis in neonatal offspring. We aimed to determine whether exposing the developing embryo to maternal hypercholesterolemia and associated risk factors can prime the murine vessel wall to accelerated development of cardiovascular disease in adult life.'
          },
          {
            reportId : 2731,
            title: 'Comparative Studies of Embryonic Response to Maternal Diabetes',
            thesis: 'Diabetic embryopathy can affect any developing organ system, although malformations in cardiovascular tissue, neural tube defects and caudal dysgenesis syndrome are the most prominent congenital malformations. We hypothesize that the metabolic imbalance occurring in diabetic pregnancy de-regulates tissue specific gene expression programs in the developing embryo.'
          }
        ]
      }),
      listeners: {
        selectionchange: {fn: this.onSelect, scope: this}
      }
    });
    
    this.listpanel = new Ext.Panel({
        items: [
          {
            html: '<div class="bar"><img class="avatar" src="ireport-logo.png" width="160px"></img><h2>Welcome to Ingenuity iReport</h2><h4>Please select an example report from the list below...</h4></div>' 
          },
          this.list
        ],
        dockedItems: [{
          xtype: 'toolbar',
          title: 'iReport'
        }],
        listeners: {
          activate: { fn: function(){
            this.list.getSelectionModel().deselectAll();
            Ext.repaint();
          }, scope: this }
        }
    });
    
    this.items = this.listpanel
    
    iReport.App.superclass.initComponent.call(this);
  },
    
  onSelect: function(sel, records){
      var that = this
      
      if (records[0] !== undefined) {
  
        // assign global
        reportId = records[0]["data"]["reportId"]
        
        // Lets Init here..
        locationGroups = new AttributeGroups("location");
        functionGroups = new AttributeGroups("proFamily");    // genes organized by function
        interactionTypeGroups = new AttributeGroups("interactionTypes"); // genese organized by interaction type

        adHoc = {};
        adHoc.createGeneSet = function(){
          adHoc.gl = adHoc.geneIndices.split(",");
          adHoc.geneSet =  new AdHocGeneSet(adHoc.groupName, adHoc.gl, adHoc.geneObj, adHoc.groupId);
          selectionMgr.set(adHoc.geneSet, adHoc.gl);
        };
        
        genes = new GeneList();
        diseases = new DiseaseList();
        interactions = new InteractionList();    
        bioProcesses = new BioProcessesList();  
        pathways = new PathwaysList();

        // Loads the Summary Data.
        //getSummaryData(summary);

        //...
        // sencha bullshit
        var reportCard = new iReport.views.ReportCard({
          prevCard: that.listpanel,
          record: records[0]
        });
        that.setActiveItem(reportCard, 'slide');
      }

  } //onSelect
  
})