/**
 * @class Ext.grid.TableGrid
 * @extends Ext.grid.Grid
 * A Grid which creates itself from an existing HTML table element.
 * @constructor
 * @param {String/HTMLElement/Ext.Element} table The table element from which this grid will be created - 
 * The table MUST have some type of size defined for the grid to fill. The container will be 
 * automatically set to position relative if it isn't already.
 * @param {Object} config A config object that sets properties on this grid and has two additional (optional)
 * properties: fields and columns which allow for customizing data fields and columns for this grid.
 * @history
 * 2007-03-01 Original version by Nige "Animal" White
 * 2007-03-10 jvs Slightly refactored to reuse existing classes
 */

Ext.grid.CustomGroupingGrid = function(table, config)
{
	//применить конфиг
	config = config || {};

	Ext.apply(this, config);

	table = Ext.get(table);
	var cf = config.fields || [], ch = config.columns || [];
	var ct = table.insertSibling();

	var fields = [], cols = [];
	
	//скрытое поле для группировки
	fields.push(Ext.applyIf(cf[i] || {}, {
		name: 'group'
		}));
	cols.push(Ext.applyIf(ch[i] || {}, {
		'header': 'group',
		'dataIndex': 'group',
		'hidden': true,
		'sortable': true
		}));
	
	//остальные поля по шапке таблицы
	var headers = table.query("thead th");
	for (var i = 0, h; h = headers[i]; i++)
	{


	    var text = h.innerHTML;
	    var name = 'tcol-'+i;

		var align;
		if(hasClass(h, 'grid_left')) align = 'left';
		if(hasClass(h, 'grid_right')) align = 'right';
		if(hasClass(h, 'grid_center')) align = 'center';
	
		/* Общие свойства: */
	    var field = 
		{
			name: name,
			type: 'string'
			//css: 'color: red',
			//css: 'color: red !important',//не прокатило :(((
			//mapping: 'td:nth('+(i+1)+')/@innerHTML'
	    }
		var col = 
		{
			'header': text,
			'menuDisabled': hasClass(h, 'grid_sort')?false:true,
			'style':'background-color:red !important',
			'dataIndex': name,
			'width': h.offsetWidth,
			'tooltip': h.title,//данные для тултипа, надо добавить инициализацию Quicktips
			'sortable': hasClass(h, 'grid_sort')?true:false,
			'resizable': false,
			'cls': h.className,
			//'stripeRows': true,//полосатит строчки
			'align': align
	    }
		
		/* Частные свойства */
		//if(hasClass(h, 'grid_sort'))
		//{ //сортируемая колонка
			if(hasClass(h, 'grid_string'))
			{ //в ячейках строковые данные
				field.type = 'string';//тип данных для сортировки
			}
			else if(hasClass(h, 'grid_date'))
			{ //в ячейках даты
				field.type = 'date';//тип данных для сортировки
				field.dateFormat = 'd.m.Y';//формат приёма дат из ячеек
				col.renderer = formatDateEnUs;//форматтер для дат
			}
			else
			{ //по умолчанию - в ячейках числа, т.к. таких колонок больше
				field.type = 'float';

				if (hasClass(h, 'grid_dec_3'))
				{ //числа c 3 десятичными знаками
					col.renderer = formatFloatDec3;
				}
				else if (hasClass(h, 'grid_dec_2'))
				{ //числа c 2 десятичными знаками
					col.renderer = formatFloatDec2;
				}
				else if (hasClass(h, 'grid_dec_1'))
				{ //числа c 1 десятичным знаком
					col.renderer = formatFloatDec1;
				}
				else
				{ //целые числа
					col.renderer = formatInt;
				}
			}
		//}
		//else
		//{ //несортируемая колонка, считаем что в ней строки, чтоб не глючило
		//}
	    
	    fields.push(Ext.applyIf(cf[i] || {}, field));
		cols.push(Ext.applyIf(ch[i] || {},col));	

	}

	
	//сформировать значения и группы
	var curGroup = {};
	var _groups = {};

	var dataArray = [];
	
	var rows = table.query("tbody tr");
	for(var i=0, r; r=rows[i]; i++)
	{
		if(hasClass(r, 'group'))
		{
			_groups[curGroup.name] = curGroup;

			var name = r.textContent;
			curGroup = _groups[name];
			
			if(!curGroup)
			{
				curGroup = new Object;
				curGroup.name = r.textContent;
			}
		}
		else if(hasClass(r, 'header'))
		{
			if(!curGroup.headers) curGroup.headers = [];
			curGroup.headers.push(r.textContent);
			//alert(r.textContent);
		}
		else if(hasClass(r, 'summary'))
		{
			r = Ext.get(r);
			var rowArray = [curGroup.name];
			var cells = r.query("td");
			for(var j=0; cells[j]; j++)
			{
				rowArray.push(cells[j].innerHTML);
			}

			if(!curGroup.summaries) curGroup.summaries = [];
			curGroup.summaries.push(rowArray);
		}
		else //if(hasClass(r, 'data'))
		{
			r = Ext.get(r);
			
			var rowArray = [curGroup.name];
			var cells = r.query("td");
			for(var j=0; cells[j]; j++)
			{
				rowArray.push(cells[j].innerHTML);
			}
			
			dataArray.push(rowArray);
		}
	}
	_groups[curGroup.name] = curGroup;
	
	
	
	
	
	
	
	//alert(dataArrays[0]);
	
    var reader = new Ext.data.ArrayReader({}, fields);

	MyCustomStore = function(cfg){
		this.applySort=function(){
	        //Ext.data.GroupingStore.superclass.applySort.call(this);
	        if(!this.groupOnSort && !this.remoteGroup){
	            var gs = this.getGroupState();
	            if(gs && gs != this.sortInfo.field){
	                this.sortData(this.groupField);
	            }
	        }
	    },
		MyCustomStore.superclass.constructor.call(this, cfg);
	};
	Ext.extend(MyCustomStore, Ext.data.GroupingStore);

	this.store  = new MyCustomStore({
		reader: reader,
		data: dataArray,
		groupField: 'group',
		sortInfo:{field: fields[0].name, direction: "ASC"}
	});
	

	
	
	this.columns = cols;
	


    this.view = new Ext.grid.CustomGroupingView({
            forceFit:true,
			showGroupName: false,
			customValues: _groups,
            groupTextTpl: '{text}'
        });


	//this.frame = true;
	//this.width = 700;
	this.height = table.offsetHeight;
	//this.collapsible = true;
	//this.animCollapse = false;
	//this.title = 'Grouping Example';
	//this.iconCls = 'icon-grid';

	//this.cm = new Ext.grid.ColumnModel(cols);
	
	//alert(dataArrays);
	if (config.remove !== false) {
		table.remove();
	}
	
	Ext.grid.CustomGroupingGrid.superclass.constructor.call(this, ct, {});
};

Ext.onReady(function() {
	Ext.extend(Ext.grid.CustomGroupingGrid, Ext.grid.GridPanel);
	Ext.BLANK_IMAGE_URL = '/fileadmin/templates/main/js/grids/imgs/s.gif';
	Ext.QuickTips.init();
    // create the grid
	var tables = Ext.DomQuery.select('.groupedgrid');
	if(tables){
		var table;
		for(var i = 0; i <  tables.length; i++) {
			table = new Ext.grid.CustomGroupingGrid(tables[i], {
			    stripeRows: true, // stripe alternate rows
			    autoHeight: true,
				enableColumnMove:true,
				enableColumnHide:false,
				enableHdMenu:false,
				cls: tables[i].className //проставляет классы исходной таблицы в div грида
		    });
		    table.render();
		}
	}
});