Ext.namespace("Repository");


/**
 * @class SearchPanel
 * @param {Repository.DocumentGridPanel} gridPanel document grid panel
 */
Repository.SearchPanel = function(gridPanel) {
    var searchField = new Ext.form.TextField({
        name:'q',
        emptyText:'Search......',
        border : false,
        margins: '10 0 0 0',
        hideLabel: true
    });

    Repository.SearchPanel.superclass.constructor.call(this, {
        layout: "form",
        border : false,
        margins: '5 0 0 0',
        width: 160,
        items: [searchField]
    });
    //fire event deal
    searchField.on("specialkey", function(field, event) {
        var keyword = field.getValue();
        gridPanel.reloadByWord(keyword);
    });
};
Ext.extend(Repository.SearchPanel, Ext.Panel);

/**
 * header panel
 * @class HeaderPanel
 * @param {Repository.DocumentGridPanel} gridPanel document grid panel
 */
Repository.HeaderPanel = function(gridPanel) {
    var htmlCode = '<img src="/statics/images/logo.png" alt="Web SQL Plus" align="left"/>' +
                   '<a title="Book Shelf" href="http://book.mvnsearch.org" target="_blank"><img src="http://snippet.mvnsearch.org/statics/images/book.png" alt="Book Shelf" title="Book Shelf"/></a>' +
                   '&nbsp;<a href="http://snippet.mvnsearch.org" target="_blank"><img src="http://book.mvnsearch.org/statics/images/snippet.png" alt="Snippet Repository" title="Snippet Repository"/></a>' +
                   '&nbsp;<a href="http://www.mvnsearch.org" target="_blank"><img src="/statics/images/home.png" alt="MvnSearch" title="MvnSearch"/></a>' +
                   '<br/><br/><br/><h1>Document Collector</h1>';

    var searchPanel = new Repository.SearchPanel(gridPanel);
    searchPanel.region = 'east';
    Repository.HeaderPanel.superclass.constructor.call(this, {
        id: 'header',
        region:'north',
        layout: "border",
        border: false,
        height:72,
        items:[
            {
                region: 'west',
                border: false,
                html: htmlCode,
                width:320
            },
            {
                region: 'center',
                border: false,
                html: '<h1 align="center"><br/>Mini Shelf</h1>'
            },
            searchPanel
        ]
    });
};
Ext.extend(Repository.HeaderPanel, Ext.Panel);

/**
 * navigation tree panel
 * @param {Repository.DocumentGridPanel} gridPanel
 */
Repository.NavigationPanel = function (gridPanel) {
    Repository.NavigationPanel.superclass.constructor.call(this, {
        title: 'Category',
        autoScroll:true,
        animate:true,
        enableDD:false,
        containerScroll: false,
        loader: new Ext.tree.TreeLoader({
            dataUrl:'/document/category.jsn'
        }),
        root: new Ext.tree.AsyncTreeNode({
            text:'Documents',
            icon: '/statics/images/package.png',
            expanded:true
        }),
        rootVisible: true,
        width:180
    });
    this.addEvents({directorySelect:true});
    this.getSelectionModel().on({
        'selectionchange' : function(node) {
            this.fireEvent('directorySelect', node);
        },
        scope:this
    });
    this.on('directorySelect', function(node) {
        if (node && node.selNode.isLeaf()) {
            var tag = node.selNode.attributes['tag'];
            gridPanel.reloadByTag(tag);
        }
    });
};
Ext.extend(Repository.NavigationPanel, Ext.tree.TreePanel);

/**
 * document grid panel
 * @class DocumentGridPanel
 * @param {Repository.DocumentDetailPanel} detailPanel detail panel
 */
Repository.DocumentGridPanel = function(detailPanel) {
    var sm = new Ext.grid.RowSelectionModel({singleSelect:true});
    this.store = new Ext.data.JsonStore({
        url: '/document/query.jsn',
        id: 'id',
        fields: [
            {
                name: 'id'
            },
            {
                name: 'title',
                type: 'string'
            },
            {
                name: 'author',
                type: 'string'
            },
            {
                name:'releasedDate',
                type:'string'
            },
            {
                name:'contentType',
                type:'string'
            }
        ],
        autoLoad: true
    });
    this.columns = [
        new Ext.grid.RowNumberer(),
        {
            header:'Title',
            width: 480,
            dataIndex:'title',
            sortable:true
        },
        {
            header:'Author',
            width: 180,
            dataIndex:'author',
            sortable:true
        },
        {
            header:'Released Date',
            width: 120,
            dataIndex:'releasedDate',
            sortable:true
        },
        {
            header:'File',
            width: 48,
            dataIndex:'contentType', 
            sortable:false,
            renderer: function(value) {
                return '<img src="/statics/images/' + value + '.png"/>';
            }
        }
    ];
    Repository.DocumentGridPanel.superclass.constructor.call(this, {
        title:'Document List',
        iconCls:'artifactList',
        sm: sm,
        store: this.store,
        viewConfig: new Ext.grid.GridView({emptyText:'Document Not Found!'})
    });

    //event to fire detail
    this.getSelectionModel().on("selectionchange", function(sm) {
        if (sm.getSelected())
        {
            var article = sm.getSelected().data;
            detailPanel.reloadById(article.id);
        }
    });

    /**
     * reload by tag
     * @param {String} tag tag name
     */
    this.reloadByTag = function(tag) {
        this.store.load({
            params :{tag:tag},
            add:false
        });
    };
    /**
     *  reload by word
     * @param {String} word key word
     */
    this.reloadByWord = function(word) {
        this.store.load({
            params :{q:word},
            add:false
        });
    };

};
Ext.extend(Repository.DocumentGridPanel, Ext.grid.GridPanel);

/**
 * @class DocumentDetailPanel artifact detail panel
 */
Repository.DocumentDetailPanel = function() {
    Repository.DocumentDetailPanel.superclass.constructor.call(this, {
        title:'Detail',
        iconCls:'artifactDetail',
        height:320,
        html:'<div id="document_detail"><br/><h1 align="center">Document Detail</h1></div>'
    });

    /**
     * ¼ÓÔØÏêÇé
     * @param {String} documentId artifact id
     */
    this.reloadById = function(documentId) {
        var updater = Ext.get("document_detail").getUpdater();
        updater.update({
            url: "/document/show.action",
            method: 'GET',
            disableCaching: true,
            params: {id: documentId }
        });
    };
};
Ext.extend(Repository.DocumentDetailPanel, Ext.Panel);