Ext.onReady(function(){

    var dctSrchComboWidth = 904;
    
    function dictIconPath(categoryId){
        return String.format('images/book_{0}.gif', categoryId);
    }
    
    function createDictMenuItem(categoryId){
        return {
            categoryId: categoryId,
            icon: dictIconPath(categoryId),
            text: Legenda.categories[categoryId].name,
            handler: onDictSelect
        };
    }
    
    function createDictButton(selectedCategoryId){
        return new Ext.MenuButton({
            text: '<img src="' + dictIconPath(selectedCategoryId) + '" class="text_preceeding_icon" />',
            menu: {
                id: 'dictionaryCategoryMenu',
                items: [createDictMenuItem(0), createDictMenuItem(1), createDictMenuItem(2), createDictMenuItem(4), createDictMenuItem(5)]
            }
        });
    }
	
    var dctBtn = createDictButton(0);
    dctBtn.render('dctBtn');

    
    function onDictSelect(item){
        //render
        dctBtn.destroy();
        dctBtn = createDictButton(item.categoryId);
        dctBtn.render('dctBtn');
        
        //modify datastore
        ds.baseParams.selected_category = item.categoryId;
		
		//remove records from datastore and clear cache
		ds.removeAll();

		// TODO : http://hitachi-d1384e3/projects/LEGENDA/ticket/154
//		dctSrchCombo.reset();
		dctSrchCombo.clearValue();

		//focus on search box
		dctSrchCombo.focus();
    }
    
    // Global Main Panel
    g_mainPanel = new Ext.Panel({
    	renderTo: 'main_panel',
		height: Legenda.getBodySize().height,
    	tbar: [
    	       Ext.get('main_panel_title').getValue(),
    	       '->'
  	   	]
    });
    g_mainPanel.getTopToolbar().addClass('legenda_main_panel_text');
    
// ヘルプをmodal dialogで表示しようとした。
//    var dialog;
//    function showDialog() {
//    	if (!dialog) {
//    		dialog = new Ext.Window({
//    			applyTo: 'help_dialog',
//    			title: 'Help',
//    			modal: true,
//    			autoWidth: true,
//    			autoHeight: true,
////    			width: 500,
////    			height: 800,
//    			layout: 'fit',
//    			html: '<iframe id="help_iframe" scrolling="no" src="' + getHelpUrl() + '"></iframe>',
//				closeAction: 'hide'
//    		});
//    	}
//    	dialog.show();
////    	dialog.center();
//    }
    
    
    var ds = new Ext.data.Store({
		proxy: Legenda.createScriptTagProxy(Legenda.contextroot.jsonServer + 'dictionary-search-json.htm'),
        baseParams: {
            selected_category: '0'
        },
        reader: new Ext.data.JsonReader({
            root: 'rows',
            totalProperty: 'totalCount',
            id: 'id'
        }, [{
            name: 'category'
        }, {
            name: 'cui'
        }, {
            name: 'source'
        }, {
            name: 'rep_str'
        }, {
            name: 'all_syn_strs'
        }, {
            name: 'matched_syn_strs'
        } ])
    });
    
    
    // Custom rendering Template
    var resultTpl = new Ext.XTemplate(
		'<tpl for=".">',
			'<div class="search-item">', 
				'<div class="left-float">',
					'<img src="images/folder_{category}.gif" class="text_preceeding_icon" /><span class="rep_str">{rep_str}</span>',
				'</div>',
				'<div class="right-float matched_syn_area">',
					'<tpl for="matched_syn_strs">',
						'<span class="matched_syn_str"><img src="images/file_{parent.category}.gif" class="text_preceeding_icon" />{.}</span>',
					'</tpl>',
				'</div>',
				'<div class="both-clear"></div>',
				'<form>',
					'<input type="hidden" value="',
						'<tpl for="all_syn_strs">',
							'	<img src=\'images/file_{parent.category}.gif\' class=\'text_preceeding_icon\' />{.}', // create tab delimited data
						'</tpl>',
					'" />',
				'</form>',
			'</div>',
		'</tpl>'
	);
    
    var dctSrchCombo = new Ext.ux.LegendaCombo({
        store: ds,
        displayField: 'name',
        typeAhead: false,
        loadingText: 'Searching...',
        width: dctSrchComboWidth,
        pageSize: 10,
        hideTrigger: true,
        tpl: resultTpl,
        minChars: 3,
        applyTo: 'dictionary_search_combobox',
        itemSelector: 'div.search-item',
        onSelect: function(record){ // override default onSelect to do redirect
            window.location = String.format('relations-view.htm?queryCui={0}&queryCategory={1}', record.data.cui, record.data.category);
        },
        lazyInit: false
    });
    
    // synonym layer
    var synonymLayer = new Ext.Layer({
        shadow: 'sides'
    }, 'synonym_layer');
	
	// コンボボックス外をクリックしたらcollapseするという判定で、synonymLayerの範囲も加えるため、
	// コンボボックスオブジェクトからsynonymLayerを参照できるようにする。
	dctSrchCombo.synonymLayer = synonymLayer;
    
    // Panel inside Information div
    var synonymPanel = new Ext.Panel({
        title: 'all names for selected concept',
        autoScroll: true,
        renderTo: 'synonym_panel',
        contentEl: 'synonym_panel_content'
    });
    synonymPanel.setSize(dctSrchComboWidth, 200);
    
    // hook combobox selection change
    dctSrchCombo.view.on('selectionchange', function(e, target, options){
		var hiddenInput = Ext.query('input', target)[0];
		
        if (hiddenInput) {
			var syns = hiddenInput.value.split('	'); //split tab delimited data
			var synPanelContentStr = '';
			synPanelContentStr += '<ul>';
			for (var i = 0; i < syns.length; i++) {
				synPanelContentStr += '<li>' + syns[i] + '</li>';
			}
			synPanelContentStr += '</ul>';
			
            var spcontent = Ext.get('synonym_panel_content');
            spcontent.update(synPanelContentStr);
			synonymLayer.alignTo(target[0].parentNode.parentNode.id, 'tl-bl', [0, 5]);
            synonymLayer.setVisible(true);
        }
    });
    
    // hook combobox selection change
    dctSrchCombo.on('collapse', function(){
		synonymLayer.setVisible(false);
    });
	
	
	// focus on search box when page is loaded
	dctSrchCombo.focus();
});

// Global Main Panel
var g_mainPanel;


function buildHelpUrl(urlBase) {
	var lang = Legenda.browserLanguage();
	var urlSuffix;
	if (lang == 'en' || lang == 'ja') {
		urlSuffix = '-' + lang + '.html';
	} else {
		urlSuffix = '-en.html';
	}
	return urlBase + urlSuffix;
}

