Ext.ns('Ext.ux.clv2')

Ext.ux.clv2.NewContentWindow = function(config) {
	// call parent constructor
	Ext.ux.clv2.NewContentWindow.superclass.constructor.call(this, config);
	
	this.on('beforeclose', this.hideSpotlight, this);
	this.on('beforehide', this.hideSpotlight, this);
	this.on('beforeshow', this.showSpotlight, this);
	this.on('collapse', this.showSpotlight, this);
	this.on('move', this.showSpotlight, this);
	this.on('resize', this.showSpotlight, this);
}; // end of Ext.ux.clv2.NewContentWindow constructor
Ext.extend(Ext.ux.clv2.NewContentWindow, Ext.Window, {
	bodyBorder:false,
	bodyStyle:'background:#f0f7f2;',
	border:false,
	closeAction:'close',
	closable:false,
	collapsible:false,
	draggable:true,
	resizable:true,
	minHeight:621,
	minWidth:681,
	height:621,
	width:681,
	
	elems:[],
	objs:null,
	setElements: function(){
		for(var i = 0, size = arguments.length; i < size; i++){
			this.elems.push(arguments[i]);
		}
	},
	setObjects: function(objs){
		this.objs = objs;
	},
	
	hideSpotlight: hideSpotlight,
	showSpotlight: showSpotlight,
	addTitleBarItems: addExtTitleBarItems,
	setElementAction: setExtElementAction,
	
	addBottomBar: function(){
		var bbar = new Ext.Panel({
			cls:'bbar-panel',
			border: false,
			header: false,
			height: 15,
			html: '<div class="bbar-resize-img"></div>'
		});
		if(this.elems) this.elems.push(bbar);
		if(this.objs) this.objs.bbar = bbar;
		this.add(bbar);
	},
	
	beforeShowWindow: function(){
		this.addBottomBar();
	},
	
	afterShowWindow: function(){
		//this.addTitleBarItems({title:'New Content',close:'close window'});
		this.on("resize", this.afterResizeWindow, this);
		this.setSize(681,621);
	},
	
	afterResizeWindow: function(win, width, height){
		if(this.elems && this.objs){
			//var newWidth = !Ext.isIE6 ? width-2 : width-2;
			var newWidth = !Ext.isIE6 ? win.getSize().width-2 : win.getSize().width-2;
			var tHeight = 0, contentHeight = 0, contentWidth = 0;
			for(var i = 0, size = this.elems.length; i < size; i++){
				this.elems[i].setWidth(newWidth);
				//tHeight += this.elems[i].getInnerHeight();
				tHeight += this.elems[i].getSize().height;
			}
			contentWidth = newWidth-15;
			this.objs.content.setWidth(contentWidth);
			//contentHeight = (height-16)-(tHeight-this.objs.content.getInnerHeight())-28;
			contentHeight = (win.getSize().height-16)-(tHeight-this.objs.content.getSize().height)-28;
			contentHeight = !Ext.isIE6 ? contentHeight : contentHeight-2;
			this.objs.content.setHeight(contentHeight);
		}
		return true;
	}
});
Ext.reg('NewContentWindow', Ext.ux.clv2.NewContentWindow);

var LearningObjectJSON = Ext.data.Record.create([
        {name: "title"},
		{name: "author"},
		{name: "type"},
		{name: "revised", type: "date", dateFormat: "n/j/Y"},
		{name: "rating"},
        {name: "format"},
        {name: 'id'}        
    ]);

var LearningObjectReader = new Ext.data.JsonReader({
            root:"rows",
            id: "id"                     // The property within each row object that provides an ID for the record (optional)
}, LearningObjectJSON);

Ext.ux.clv2.NewContentStore = function(config) {
	// call parent constructor
	Ext.ux.clv2.NewContentStore.superclass.constructor.call(this, config);
}; // end of Ext.ux.clv2.NewContentStore constructor
Ext.extend(Ext.ux.clv2.NewContentStore, Ext.data.Store, {
	url:'folderContent.spr',
    reader: LearningObjectReader
});
Ext.ux.clv2.NewContentGrid = function(config) {

    this.getRating = function(val){
        if(val != ""){
            var tagging = "";
            var imageSource = '<span style="vertical-align:middle"><img src="/clv2/themes/default/images/icons/Rating_SelectedYellow.gif" alt="Rating of ' + val+ '"/></span>';
            var counter = 0;
            for(counter; counter < val; counter++)
                tagging+= imageSource;
            return tagging;
        }
        else{
          return '';
        }
    }
    this.cm = config.cm ||
		new Ext.grid.ColumnModel([
			{id:"title", header: "Title", width: 235, sortable: false, resizable: false, dataIndex: "title", /*renderer: this['linkCell'],*/ style:'width:35%;'},
			{id:"author", header: "Author", width: 160, sortable: false, resizable: false, dataIndex: "author", locked:false, style:'width:23%;'},
			{id:"type", header: "Type", width: 112, sortable: false, resizable: false, dataIndex: "type", locked:false},
			{id:"revised", header: "Revised", width: 81, sortable: false, resizable: false, dataIndex: "revised", renderer: Ext.util.Format.dateRenderer('n/j/Y')},
			{id:"rating", header: "Rating", width: 72, sortable: false, resizable: false, dataIndex: "rating", renderer: this['getRating'], locked:false}
		])
	;
    // call parent constructor
	Ext.ux.clv2.NewContentGrid.superclass.constructor.call(this, config);
}; 
Ext.extend(Ext.ux.clv2.NewContentGrid, Ext.grid.GridPanel, {
	autoExpandColumn:'title',
	bodyStyle:'border-bottom: 1px solid #bbbdbb;',
	cls:'snapshot-grid',
	border: false,
	hideHeaders: false,
	stripeRows: true,
	height: 150,
	width:679
});

var newContentWin = null;

var showNewContent = function(){
	if(newContentWin){
		newContentWin.close();
		newContentWin.destroy();
	}

    var callback = function(records){
        var gridNC = new Ext.ux.clv2.NewContentGrid({id:'gridNC', ds:this});
        //gridNC.getSelectionModel().selectFirstRow();
        var onRowClick = function(gridLO,rowIndex, event){
            var record = gridLO.getStore().getAt(rowIndex); // Get the Record
            switch(record.data.format){
            case 'HTML_XHTML':
                var IframePanel = Ext.getCmp('snapshot-newLo-content').findById('content-preview-iframe');
                if(IframePanel != null)
                    IframePanel.setSrc('content.spr?'+Ext.urlEncode({ "learningObjectId" : record.id}), false, Ext.emptyFn());
                else{
                     var window = Ext.getCmp('new-content-window');
                     window.remove('snapshot-newLo-content');
                     window.doLayout();
                     var contentLO = new Ext.Panel({
                        id:'snapshot-newLo-content',
                        cls:'snapshot-lo-content',
                        border: false,
                        header: false,
                        height: !Ext.isIE6 ? 305 : 306,
                        width:550,
                        items: {
                                   id:'content-preview-iframe',
                                   xtype : 'iframepanel',
                                   defaultSrc : 'content.spr?'+Ext.urlEncode({ "learningObjectId" : record.id}),
                                   height: !Ext.isIE6 ? 305 : 306,
                                   width:550
                        }
                    });
                    window.add(contentLO);
                    window.doLayout();
                }
            break;
            case 'SHOWCKWAVE_FLASH': case 'FLASH_VIDEO':
               var panel = Ext.getCmp('snapshot-newLo-content');
               panel.load({url: 'getBinaryLOContent.spr', params: {id: record.id, editMode:false, type:'multimediaLOContent',
                                width:550, height:250, versionNumber:-1
                }});
            break;
            case 'JPEG': case 'GIF': case 'BMP': case 'PNG':
               var panel = Ext.getCmp('snapshot-newLo-content');
               panel.load({url: 'getBinaryLOContent.spr', params: {id: record.id, editMode:false, type:'imageLOContent',
                                  width:550, height:250, versionNumber:-1
               }});
            break;
            default:
                var panel = Ext.getCmp('snapshot-newLo-content');
                panel.load({url: 'getBinaryLOContent.spr', params: {id: record.id, editMode:false, type:'binaryLOContent',
                                width:550, height:250, versionNumber:-1
                 }});
            break;
          }
        }

        gridNC.addListener('rowClick', onRowClick);
        
        var headerNC = new Ext.Panel({
            autoLoad:{url: 'statistics.spr', params: 'linkName=newContentHeader'},
            cls:'w-header-panel',
            border: false,
            header: false,
            height: 65
        });

        var titleLO = new Ext.Panel({
            id:'snapshot-newLo-title',
            cls:'snapshot-lo-title',
            border: false,
            header: false,
            height: 35,
            html: 'Preview: ' + records[0].data.title
        });

        var contentLO;
        switch(records[0].data.format){
            case 'HTML_XHTML':
              contentLO = new Ext.Panel({
                    id:'snapshot-newLo-content',
                    cls:'snapshot-lo-content',
                    border: false,
                    header: false,
                    height: !Ext.isIE6 ? 305 : 306,
                    width:550,
                    items: {
                               id:'content-preview-iframe',
                               xtype : 'iframepanel',
                               defaultSrc : 'content.spr?'+Ext.urlEncode({ "learningObjectId" : records[0].id}),
                                height: !Ext.isIE6 ? 305 : 306,
                               width:550
                    }
              });
              break;
            case 'SHOWCKWAVE_FLASH': case 'FLASH_VIDEO':
               contentLO = new Ext.Panel({
                        id:'snapshot-newLo-content',
                        cls:'snapshot-lo-content',
                        autoScroll: true,
                        border: false,
                        height: 400,
                        width: 550,
                        autoLoad: {url: 'getBinaryLOContent.spr', params: {id: records[0].id, editMode:false, type:'multimediaLOContent',
                                  width:530, height:305, versionNumber:-1
                        }}
                    });
            break;
             case 'JPEG': case 'GIF': case 'BMP': case 'PNG':
                 contentLO = new Ext.Panel({
                        id:'snapshot-newLo-content',
                        cls:'snapshot-lo-content',
                        autoScroll: true,
                        border: false,
                        height: 350,
                        width: 550,
                        autoLoad: {url: 'getBinaryLOContent.spr', params: {id: records[0].id, editMode:false, type:'imageLOContent',
                                  width:550, height:250, versionNumber:-1
                        }}
                    });
                break;
            default:
                 contentLO = new Ext.Panel({
                        id:'snapshot-newLo-content',
                        cls:'snapshot-lo-content',
                        autoScroll: true,
                        border: false,
                        height: 400,
                        width: 550,
                        autoLoad: {url: 'getBinaryLOContent.spr', params: {id: records[0].id, editMode:false, type:'binaryLOContent',
                                    width:550, height:250, versionNumber:-1
                        }}
                 });
        }
        newContentWin = new Ext.ux.clv2.NewContentWindow({
            id:'new-content-window',
            cls:'clv2-window',
            items: [headerNC, gridNC, titleLO, {
                cls:'snapshot-content-container',
                items: [contentLO]
            }],
            //resizable:false,
            height:637,
            width: 681
        });
        var relativePos = findPos(document.getElementById('loginPanel'));
        newContentWin.setPosition(relativePos[0]+316,relativePos[1]);
        newContentWin.setElements(headerNC, gridNC, titleLO, contentLO);
        newContentWin.setObjects({'header':headerNC, 'grid':gridNC, 'title':titleLO, 'content':contentLO});
        newContentWin.on("beforeshow", newContentWin.beforeShowWindow, newContentWin);
        newContentWin.on("show", newContentWin.afterShowWindow, newContentWin);
        if(Ext.isIE) newContentWin.show();
        else newContentWin.show(this);
        newContentWin.addTitleBarItems({title:'New Content',close:'close window'});
    }

    var dsNC =  new Ext.ux.clv2.NewContentStore({});
	dsNC.load({params: {id:'1',mode:3,folderName:'general.folder.newLos',statistic:true}, callback:callback});
}