﻿/// <reference path="http://extjs.cachefly.net/ext-3.3.1/adapter/ext/ext-base.js" />
/// <reference path="http://extjs.cachefly.net/ext-3.3.1/ext-all.js" />
/// <reference path="locale.js" />
Ext.ns('BolResults');

var config = {
	  DefaultSortField: 'Description'
	, DefaultGroupField: 'ParentGroup'
	, RenderTagId: 'PublishedGroups'
	, GridTitle: locale.getLocaleString('pubGroupsGridTitle') 
	, DataProxyURL: 'GetPublishedGroupData'
	, BaseUrl: basepath
	, LocalServerName: localserverName
//    , DefaultGroupName: ' BRAHMS Software'
  };

  // custom renderer with tooltip - cell entry is first 20 chars, tooltip is the whole string
  function GroupHeadRenderer(value, metadata, record) {
	  return value === record.get('ParentGroup') ? '<span title="' + record.get('ParentGroupDescription') + '">' + value + '</span>' : value
  }

function GroupLinkRenderer(value, metadata, record, rowIndex, colIndex, store) {
	var addr = record.get('WebAddress') || config.BaseUrl, target = (addr === config.BaseUrl ? '_self' : '_blank');
	if(addr.charAt(addr.length -1) !== '/') {
		addr = addr + '/';
	}
	return '<a style="color: Green; text-decoration: none;" href="' + addr + record.get('GroupId') + '" target="' + target + '">' + value + '</a>';
}

// custom renderer with tooltip - cell entry is first 20 chars, tooltip is the whole string
function NotesRenderer(value, metadata, record) {
	return '<div style="white-space: normal !important;" title="' + value + '">' + value + '</div>';
}
// custom renderer with tooltip - cell entry is first 20 chars, tooltip is the whole string
function ServerRenderer(value, metadata, record) {
	if ( value ) {
		if ( value === 'local' ) {
		    return '<div style="white-space: normal !important;" title="' + (config.LocalServerName || location.hostname) + '">' + (config.LocalServerName || location.hostname) + '</div>';
		} else {
			return '<div style="white-space: normal !important;" title="' + value + '">' + value + '</div>';
		}
	}
	return 'Unknown';
}
// custom renderer with tooltip - cell entry is first 20 chars, tooltip is the whole string
function ContactRenderer(value, metadata, record) {
	if ( value ) {
		var name = record.get( 'ContactName' );
		if ( name ) {
			return '<div style="white-space: normal !important;" title="Email to: ' + name + '"><a href="mailto:' + name + '&lt;' + value + '&gt;">' + name + '</a></div>';
		} else {
			return '<div style="white-space: normal !important;" title="Email to: ' + value + '"><a href="mailto:' + value + '">' + value + '</a></div>';
		}
	} 
	return 'n/a';
}


Ext.onReady(function() {
	Ext.QuickTips.init();

	// DATA STUFF
	//  GroupList,  ParentGroupId, ParentGroupName, ParentGroupDescription;
	var RecordDef = Ext.data.Record.create([
		{ name: 'GroupId', mapping: 'GroupId' }
		, { name: 'ParentGroup', mapping: 'ParentGroupName' }
		, { name: 'ParentGroupDescription', mapping: 'ParentGroupDescription' }
		, { name: 'Description', mapping: 'Description' }
	   , { name: 'Notes', mapping: 'Notes' }
	   , { name: 'Server', mapping: 'BolServerName' }
	   , { name: 'WebAddress', mapping: 'BaseBolWebAddress' }
	   , { name: 'ContactEmail', mapping: 'ContactEmail' }
	   , { name: 'ContactName', mapping: 'ContactName' }
	]);

	var DataReader = new Ext.data.JsonReader({
		totalProperty: "results"    // The property which contains the total dataset size (optional)
		, root: "rows"                // The property which contains an Array of row objects
		// , id: "GroupId"             // The property within each row object that provides an ID for the record (optional) - NOTE group can appear more than once so GroupId not necessarily unique!
	}, RecordDef);

	var DataStore = new Ext.data.GroupingStore({
		proxy: new Ext.data.HttpProxy({ url: config.DataProxyURL }),
		reader: DataReader,
		groupField: config.DefaultGroupField,
		sortInfo: { field: config.DefaultSortField, direction: 'ASC' },
		remoteSort: false
	});
	DataStore.load();

	// GRID STUFF
	var ColumnModel = new Ext.grid.ColumnModel([
		{ id: "parentGroup", header: locale.getLocaleString('cmPubParentGroupHeader'), dataIndex: "ParentGroup", width: 100, sortable: true, renderer: GroupHeadRenderer },
		{ id: "group", header: locale.getLocaleString('cmPubGroupHeader'), dataIndex: "Description", width: 150, sortable: false, renderer: GroupLinkRenderer },
		{ id: "server", header: locale.getLocaleString('cmPubServerHeader'), dataIndex: "Server", width: 70, sortable: false, renderer: ServerRenderer },
		{ id: "contact", header: locale.getLocaleString('cmPubContactHeader'), dataIndex: "ContactEmail", width: 120, sortable: false, renderer: ContactRenderer },
		{ id: "notes", header: locale.getLocaleString('cmPubGroupNotesHeader'), dataIndex: "Notes", width: 200, sortable: false, renderer: NotesRenderer }
	 ]);

	var vw = new Ext.grid.GroupingView({
		forceFit: true
		, emptyText: locale.getLocaleString('noData')
		, groupTextTpl: '{text} ({[values.rs.length]})'
		, showGroupName: false
		, hideGroupedColumn: true
		, enableNoGroups: true
		, autoExpandColumn: "notes"
		, startCollapsed: false
	});

	var grid = new Ext.grid.GridPanel({
		id: "PublishedGroupsGrid"
		, layout: 'fit'
		, store: DataStore
		, colModel: ColumnModel
		// Set the grouping configuration
		, view: vw
		, title: config.GridTitle
		, autoScroll: true
		, frame: true
		, stripeRows: true
		, loadMask: true
		, iconCls: 'icon-grid'
		, renderTo: config.RenderTagId
	});

//        var gid = vw.getGroupId(config.DefaultGroupName);
//        if (gid)
//            vw.toggleGroup(gid, true);

	loadViewPort(grid);

});              // eo function onReady



function loadViewPort(myGrid) {

	var viewport = new Ext.Viewport({
		id: 'viewport'
		, layout: 'border'
		, border: false
		, renderTo: 'results'
		, items: [{
			id: 'northRegion'
			, region: 'north'
			, border: false
			, collapsible: false
			, contentEl: 'northdiv'
		}, {
			region: 'south'
			, border: false
			, collapsible: false
			, contentEl: 'footerdiv'
		}, {
			region: 'center'
			, border: false
			, layout: 'border'
			, contentEl: 'contentdiv'
			, id: 'contentView'
			, items: [{
				region: 'north'
				, contentEl: 'IntroDiv'
			}, {
				region: 'center'
				, border: false
				, items: myGrid
				, layout: 'fit'
			}]
		}]
	 });
 }
