/*!
 * Ext JS Library 3.0.0
 * Copyright(c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
MainPanel = function(){
    this.preview = new Ext.Panel({
        id: 'preview',
//        region: 'west',
        cls:'preview',
        autoScroll: true,
        listeners: FeedViewer.LinkInterceptor,

        tbar: [{
            id:'tab',
            text: 'مکمل مضمون دیکھیں',
            iconCls: 'new-tab',
            disabled:true,
            handler : this.openTab,
            scope: this
        },
        '-',
        {
            id:'win',
            text: 'اصلی مضمون کھولیں',
            iconCls: 'new-win',
            disabled:true,
            scope: this,
            handler : function(){
                window.open(this.gsm.getSelected().data.link);
            }
        },
        '-',
        {
            xtype:'cycle',
            id:'size',
            showText: true,
            disabled:true,
            items:[{
                size:12,
                text:'بہت چھوٹا'
            },{
                size:16,
                text:'قدرے چھوٹا'
            },{
                size:20,
                text:'اوسط حجم',
                checked:true
            },{
                size:24,
                text:'قدرے بڑا'
            },{
                size:28,
                text:'بہت بڑا'
            }],
            changeHandler:function (slider, b) {
                this.entryFontSize = b.size;
                this.makeEntryFontSize('preview');
            },
            scope:this
        },
        '-',
        {
            xtype:'cycle',
            id:'dir',
            showText: true,
            disabled:true,
            items:[{
                dir:'rtl',
                text:'دائیں سے بائیں',
                checked:true
            },{
                dir:'ltr',
                text:'بائیں سے دائیں'
            }],
            changeHandler:function (slider, d) {
                this.entryDir = d.dir;
                this.makeEntryDir('preview');
            },
            scope:this
        }],

        clear: function(){
            this.body.update('');
            var items = this.topToolbar.items;
            items.get('tab').disable();
            items.get('win').disable();
            items.get('size').disable();
            items.get('dir').disable();
        }
    });

    this.grid = new FeedGrid(this, {
        tbar:[{
            text:'تازہ کریں',
            tooltip: {title:'تازہ کریں',text:'نئی تبدیلیوں کی نمائش کے لئے موجودہ فہرست کو تازہ کریں'},
            iconCls: 'refresh-icon',
            handler: function(){
                this.grid.ctxRow = null;
                this.grid.store.reload();
            },
            scope:this
        },
        '-',
        {
            text:'سبھی کو کھولیں',
            tooltip: {title:'سبھی کو کھولیں',text:'سبھی فیڈس ٹیبس میں کھل جائیں گی'},
            iconCls: 'tabs',
            handler: this.openAll,
            scope:this
        },
        '-',
        {
            split:true,
            text:'خانۂ مطالعہ',
            tooltip: {title:'خانہء مطالعہ',text:'خانہء مطالعہ کو ظاہر کریں، منتقل کریں یا چھپائیں'},
            iconCls: 'preview-bottom',
            handler: this.movePreview.createDelegate(this, []),
            menu:{
                id:'reading-menu',
                cls:'reading-menu',
                width:100,
                items: [{
                    text:'بائیں',
                    checked:true,
                    group:'rp-group',
                    checkHandler:this.movePreview,
                    scope:this,
                    iconCls:'preview-right'
                },{
                    text:'نیچے',
                    checked:false,
                    group:'rp-group',
                    checkHandler:this.movePreview,
                    scope:this,
                    iconCls:'preview-bottom'
                },{
                    text:'چھپائیں',
                    checked:false,
                    group:'rp-group',
                    checkHandler:this.movePreview,
                    scope:this,
                    iconCls:'preview-hide'
                }]
            }
        },
        '-',
        {
            pressed: false,
            enableToggle:true,
            text:'خلاصہ',
            tooltip: {title:'مراسلے کا خلاصہ',text:'فہرست میں موجود تمام فیڈز کا مختصر خلاصہ دیکھیں'},
            iconCls: 'summary',
            scope:this,
            toggleHandler: function(btn, pressed){
                this.grid.togglePreview(pressed);
            }
        }]
    });

    MainPanel.superclass.constructor.call(this, {
        id:'main-tabs',
        activeTab:1,
        region:'center',
        margins:'0 0 5 5',
        resizeTabs:true,
        tabWidth:100,
        minTabWidth: 80,
//        enableTabScroll: true,
        plugins: new Ext.ux.TabCloseMenu(),
        items: [{
            id:'home-view',
            title:'صفحہ اول',
            layout:'accordion',
            border:true,
            items:[
                {
                    title:'تعارف',
                    contentEl:'intro-panel'
                },{
                    title:'طریقہ استعمال',
                    contentEl:'howto-panel'
                },{
                    title:'شمولیت',
                    contentEl:'join-panel'
                },{
                    title:'رابطہ',
                    html:'<p>feed@urdulog.com</p>'
                }
            ]
        },{
            id:'main-view',
            layout:'border',
            title:'لوڈ ہو رہا ہے۔۔۔',
            hideMode:'offsets',
            items:[
                this.grid, {
                id:'bottom-preview',
                layout:'fit',
                height: 250,
                split: true,
                border:false,
                hidden:true,
                region:'south'
            }, {
                id:'right-preview',
                layout:'fit',
                border:false,
                items:this.preview,
                region:'west',
                width:'70%',
                split: true
            }]
        }]
    });

    this.gsm = this.grid.getSelectionModel();

    this.gsm.on('rowselect', function(sm, index, record){
        FeedViewer.getTemplate().overwrite(this.preview.body, record.data);
        var items = this.preview.topToolbar.items;
        items.get('tab').enable();
        items.get('win').enable();
        items.get('size').enable();
        items.get('dir').enable();
        this.makeEntryDir('preview');
        this.preview.body.scrollTo('top', 0);
    }, this, {buffer:250});

    this.grid.store.on('beforeload', this.preview.clear, this.preview);
    this.grid.store.on('load', this.gsm.selectFirstRow, this.gsm);

    this.grid.on('rowdblclick', this.openTab, this);
};

Ext.extend(MainPanel, Ext.TabPanel, {

    loadFeed : function(feed){
        this.setActiveTab('main-view');
        this.grid.loadFeed(feed.url);
        Ext.getCmp('main-view').setTitle(feed.text);
    },

    movePreview : function(m, pressed){
        if(!m){ // cycle if not a menu item click
            var items = Ext.menu.MenuMgr.get('reading-menu').items.items;
            var b = items[0], r = items[1], h = items[2];
            if(b.checked){
                r.setChecked(true);
            }else if(r.checked){
                h.setChecked(true);
            }else if(h.checked){
                b.setChecked(true);
            }
            return;
        }
        if(pressed){
            var preview = this.preview;
            var right = Ext.getCmp('right-preview');
            var bot = Ext.getCmp('bottom-preview');
            var btn = this.grid.getTopToolbar().items.get(2);
            switch(m.text){
                case 'نیچے':
                    right.hide();
                    bot.add(preview);
                    bot.show();
                    bot.ownerCt.doLayout();
                    btn.setIconClass('preview-bottom');
                    break;
                case 'بائیں':
                    bot.hide();
                    right.add(preview);
                    right.show();
                    right.ownerCt.doLayout();
                    btn.setIconClass('preview-right');
                    break;
                case 'چھپائیں':
                    preview.ownerCt.hide();
                    preview.ownerCt.ownerCt.doLayout();
                    btn.setIconClass('preview-hide');
                    break;
            }
        }
    },

    openTab : function(record){
        record = (record && record.data) ? record : this.gsm.getSelected();
        var d = record.data;
        var id = !d.link ? Ext.id() : d.link.replace(/[^A-Z0-9-_]/gi, '');
        var tab;
        if(!(tab = this.getItem(id))){
            tab = new Ext.Panel({
                id: id,
                cls:'preview single-preview',
                title: d.title,
                tabTip: d.title,
                autoLoad: {
                    url: '/feeds/post_proxy',
                    params: {feed: d.link},
                    text: 'صفحہ لوڈ ہو رہا ہے۔۔۔'
                },
                closable:true,
                listeners: FeedViewer.LinkInterceptor,
                autoScroll:true,
                border:true,

                tbar: [{
                    text: 'اصلی مضمون کھولیں',
                    iconCls: 'new-win',
                    handler : function(){
                        window.open(d.link);
                    }
                },
                '-',
                {
                    xtype:'cycle',
                    showText: true,
                    items:[{
                        size:12,
                        text:'بہت چھوٹا'
                    },{
                        size:16,
                        text:'قدرے چھوٹا'
                    },{
                        size:20,
                        text:'اوسط حجم',
                        checked:true
                    },{
                        size:24,
                        text:'قدرے بڑا'
                    },{
                        size:28,
                        text:'بہت بڑا'
                    }],
                    changeHandler:function (slider, b) {
                        this.entryFontSize = b.size;
                        this.makeEntryFontSize(id);
                    },
                    scope:this
                },
                '-',
                {
                    xtype:'cycle',
                    showText: true,
                    items:[{
                        dir:'rtl',
                        text:'دائیں سے بائیں',
                        checked:true
                    },{
                        dir:'ltr',
                        text:'بائیں سے دائیں'
                    }],
                    changeHandler:function (slider, d) {
                        this.entryDir = d.dir;
                        this.makeEntryDir(id);
                    },
                    scope:this
                }]
            });
            this.add(tab);
        }
        this.setActiveTab(tab);
    },

    openPrevTab : function(record){
        record = (record && record.data) ? record : this.gsm.getSelected();
        var d = record.data;
        var id = !d.link ? Ext.id() : d.link.replace(/[^A-Z0-9-_]/gi, '');
        var tab;
        if(!(tab = this.getItem(id))){
            tab = new Ext.Panel({
                id: id,
                cls:'preview single-preview',
                title: d.title,
                tabTip: d.title,
                html: FeedViewer.getTemplate().apply(d),
                closable:true,
                listeners: FeedViewer.LinkInterceptor,
                autoScroll:true,
                border:true,

                tbar: [{
                    text: 'اصلی مضمون کھولیں',
                    iconCls: 'new-win',
                    handler : function(){
                        window.open(d.link);
                    }
                },
                '-',
                {
                    xtype:'cycle',
                    showText: true,
                    items:[{
                        size:12,
                        text:'بہت چھوٹا'
                    },{
                        size:16,
                        text:'قدرے چھوٹا'
                    },{
                        size:20,
                        text:'اوسط حجم',
                        checked:true
                    },{
                        size:24,
                        text:'قدرے بڑا'
                    },{
                        size:28,
                        text:'بہت بڑا'
                    }],
                    changeHandler:function (slider, b) {
                        this.entryFontSize = b.size;
                        this.makeEntryFontSize(id);
                    },
                    scope:this
                },
                '-',
                {
                    xtype:'cycle',
                    showText: true,
                    items:[{
                        dir:'rtl',
                        text:'دائیں سے بائیں',
                        checked:true
                    },{
                        dir:'ltr',
                        text:'بائیں سے دائیں'
                    }],
                    changeHandler:function (slider, d) {
                        this.entryDir = d.dir;
                        this.makeEntryDir(id);
                    },
                    scope:this
                }]
            });
            this.add(tab);
        }
    },

    openAll : function(){
        this.beginUpdate();
        this.grid.store.data.each(this.openPrevTab, this);
        this.endUpdate();
    },

    makeEntryFontSize: function(id) {
        var b = this.entryFontSize;
        Ext.get(id).select('.x-panel-body').applyStyles({
            'font-size' :b +'px'
        });
        Ext.get(id).select('.x-panel-body p').applyStyles({
            'line-height' :b+(b/2) + 'px'
        });
    },

    makeEntryDir: function(id) {
        var d = (this.entryDir) ? this.entryDir : 'rtl';
        Ext.get(id).select('.x-panel-body').applyStyles({
            'direction' :d
        });
        Ext.get(id).select('.x-panel-body span.post-date').applyStyles({
            'float' :(d == 'ltr') ? 'right' : 'left'
        });
    }
});

Ext.reg('appmainpanel', MainPanel);