/*
 * Ext JS Library 2.0
 * Copyright(c) 2006-2007, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://www.extjs.com/license
 */

Ext.ns('Ext.ux.layout'); 
Ext.ux.layout.wii = Ext.extend(Ext.layout.FitLayout, {
	// private
    setItemSize : function(item, size){
        var viewSize = Ext.getBody().getViewSize();
        this.container.addClass('ux-layout-wii');
        item.addClass('ux-layout-wii-item');
        size.height = (viewSize.height-60);
        size.width = (viewSize.width-60);
        item.setSize(size);
    }
});
Ext.Container.LAYOUTS['wii'] = Ext.ux.layout.wii;

Ext.onReady(function(){

    Ext.isWii = navigator.userAgent.toLowerCase().indexOf("wii") > -1;
    var layout = 'fit';
    var title = 'Normal';
    if (Ext.isWii) {
        layout = 'wii';
        title = 'Wii';
    }

	var ds = new Ext.data.Store({
        proxy: new Ext.data.ScriptTagProxy({
            url: 'http://extjs.com/forum/topics-remote.php'
        }),
        reader: new Ext.data.JsonReader({
            root: 'topics',
            totalProperty: 'totalCount',
            id: 'post_id'
        }, [
            {name: 'title', mapping: 'topic_title'},
			{name: 'topicId', mapping: 'topic_id'}, 
			{name: 'forumtitle', mapping: 'forum_title'}, 
			'forumid',
            {name: 'lastposter', mapping: 'author'},
            {name: 'lastpost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'},
            {name: 'excerpt', mapping: 'post_text'}
        ]),
		baseParams: {}
    });
	
    var cm = new Ext.grid.ColumnModel([{
       id: 'topic', 
       header: "Topic",
       dataIndex: 'title',
       width: 420,
       renderer: renderTopic
    },{
       id: 'last',
       header: "Last Post",
       dataIndex: 'lastpost',
       width: 150,
       renderer: renderLast
    }]);

    cm.defaultSortable = true;

    var grid = new Ext.grid.GridPanel({
        //el:'topic-grid',
        title:'Ext JS Forums',
        store: ds,
        cm: cm,
        trackMouseOver:false,
        sm: new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
        loadMask: true,
        viewConfig: {
            forceFit:true,
            enableRowBody:true,
            showPreview:true,
            getRowClass : this.applyRowClass
        }
    });

    ds.baseParams = {start:0, limit:10};

    function renderTopic(value, p, record){
        return String.format(
                '<span class="wii-topic"><b><a href="http://extjs.com/forum/showthread.php?t={2}&p={3}" target="_blank">{0}</a></b> - <a href="http://extjs.com/forum/forumdisplay.php?f={4}" target="_blank">{1}</a><br>{5}</span>',
                value, record.data.forumtitle, record.data.topicId, record.id, record.data.forumid, record.data.excerpt);
    }
	
    function renderLast(value, p, r){
        return String.format('<span class="wii-topic">{0}<br/>by {1}</span>', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
    }
	
	function refresh(){
		ds.reload();
	} 
    
    new Ext.Viewport({
        layout: layout,
        items: [grid]
    });

    Ext.TaskMgr.start({run: refresh, interval: (1000*60*5)});

});