/* 	The code on this page is dependant on:
	YUI - Utilities, DataTable, Datasource, Container, Tabview;
	common.js;
*/

var YE = YAHOO.util.Event;
var YD = YAHOO.util.Dom;
var YA = YAHOO.util.Anim;

var JWP = window.JWP || {};

JWP.resolveHeights = function(el) {
	this.el = el;
	if(!this.el){return}
	var elHeight = this.el.offsetHeight;
	var childTableHeight = this.el.getElementsByTagName('table')[0].offsetHeight;
	if(childTableHeight < elHeight){
		this.el.style.height = "auto";
	}	
}

JWP.enhancePromiseDates = function() {	
	var spans = YD.getElementsByClassName('promisedate','span','oHistoryDisplay');	
	var contextEls = [];	
	for (var i=0; i < spans.length; i++) {
			var el = spans[i];
			el.id = "date"+i;
			text = String(el.innerHTML);
			el.title = "Due in: "+text;
			YD.replaceClass(el,'promisedate','p-date')
			el.innerHTML = "&nbsp;"
			contextEls[contextEls.length] = el.id;
	};
	var tt = new YAHOO.widget.Tooltip("tt", { conlabel:contextEls,iframe:true } );
}

JWP.enhanceHistoryTable = function() {
    var container = YD.get("oHistoryDisplay");
	var table = container.getElementsByTagName('table')[0];
	if(!container || !table){return}
	JWP.enhancePromiseDates();
	
    var columnDefs = [
        {key:"item",label:"Item",sortable:true,className:"col1"},
        {key:"color",label:"Color Number",sortable:true,className:"col2"},
        {key:"size",label:"Size",sortable:true,className:"col3"},
        {key:"inseam",label:"In-Seam",sortable:true,className:"col4"},
        {key:"ordered",label:"Qty Ordered",sortable:true,type:"number",className:"col5"},
        {key:"shipped",label:"Qty Shipped",sortable:true,type:"number",className:"col6"},
        {key:"open",label:"Qty Open",sortable:true, className:"col7"}
    ];
	this.myDataSource = new YAHOO.util.DataSource(table);
	this.myDataSource.responseType = YAHOO.util.DataSource.TYPE_HTMLTABLE;
	this.myDataSource.responseSchema = {
		fields: [{key:"item"},
		        {key:"color"},
		        {key:"size"},
		        {key:"inseam"},
		        {key:"ordered"},
		        {key:"shipped"},
		        {key:"open"}
			]
		};
	this.myDataTable = new YAHOO.widget.DataTable(container, columnDefs, this.myDataSource,{scrollable:true});

	var p = document.createElement('p');
	p.id = "expPromiseDates";
	p.innerHTML = "* Mouseover <span class='p-date'>&nbsp;</span> for Due-In Date.";
	container.parentNode.insertBefore(p,container);

	JWP.resolveHeights(container);
}
YE.onAvailable("oHistoryDisplay",JWP.enhanceHistoryTable,JWP.enhanceHistoryTable,true);

JWP.enhanceHistoryTrackingTable = function() {
	
    var container = YD.get("oHistoryTracking");
	var table = container.getElementsByTagName('table')[0];
	if(!container || !table){return}
    var columnDefs = [
       {key:"invoice",label:"Invoice #",sortable:true,className:"col1"},
        {key:"date",label:"Invoice Date",sortable:true,className:"col2"},
        {key:"routing",label:"Routing",sortable:true,className:"col3"},
        {key:"tracking",label:"Tracking #",sortable:true,className:"col4"}
    ];
	this.myDataSource = new YAHOO.util.DataSource(table);
	this.myDataSource.responseType = YAHOO.util.DataSource.TYPE_HTMLTABLE;
	this.myDataSource.responseSchema = {
		fields: [{key:"invoice"},
		        {key:"date"},
		        {key:"routing"},
		        {key:"tracking"}
			]
		};
	this.myDataTable = new YAHOO.widget.DataTable(container, columnDefs, this.myDataSource,{scrollable:true});

	JWP.resolveHeights(container);
}
YE.onAvailable("oHistoryTracking",JWP.enhanceHistoryTrackingTable,JWP.enhanceHistoryTrackingTable,true);

JWP.enhanceInventory = function() {
	var grid = YD.get('invGrid');
	if(!grid){return}
	var table = grid.getElementsByTagName('table')[0];
	if(!table){return}
	var item = YD.get('itemId');
		item = item.innerHTML;
		
	function setContent(e){
		var targ = YE.getTarget(e);		
		href = "?Dsp=30601&IID="+item+"&colorcode="+targ.parentNode.firstChild.innerHTML;
		frames['nextPO'].location.replace(href);
	}
	
	// holders for setup data (col #'s are variable, so have to determine first)	
	var sizeColDef = [];	   
	var sizeSchema = [];
	
	// get size columns and their contents to make YUI grid
	var sizes = YD.getElementsByClassName('size','th',grid)
		for (var i=0; i < sizes.length; i++) {
			var col = sizes[i];
			var text = col.innerHTML
				sizeColDef[sizeColDef.length] = {
								key:text,
								label:text,
								className:"size_"+[i]
								}
				sizeSchema[sizeSchema.length] = {key:text}
		};
	var inseam = YD.get('inv_3Dgrid');
    var columnDefs = [
			{key:"colorCode",label:"Color",sortable:true,className:"clrCode"},
			{key:"colorName",label:"Color Name",sortable:true,className:"col2"}
			]
        if(inseam){
			columnDefs[columnDefs.length] = {key:"inseam",label:"Inseam",className:"col"+columnDefs[columnDefs.length]}
		};
		columnDefs[columnDefs.length] = {key:"sizes",label:"Sizes",className:"col"+columnDefs[columnDefs.length],
			children: sizeColDef
			}
	var fieldsDefs = [
			{key:"colorCode"},
			{key:"colorName"}
			]
        if(inseam){
			fieldsDefs[fieldsDefs.length] = {key:"inseam"}
		};
		for (var i=0; i < sizeSchema.length; i++) {
			fieldsDefs[fieldsDefs.length] = sizeSchema[i];
		};
	
	this.myDataSource = new YAHOO.util.DataSource(table);
	this.myDataSource.responseType = YAHOO.util.DataSource.TYPE_HTMLTABLE;
	this.myDataSource.responseSchema = {
		fields: fieldsDefs
		};
	this.myDataTable = new YAHOO.widget.DataTable(grid, columnDefs, this.myDataSource,{scrollable:false});
	
	this.myDataTable.subscribe("rowMouseoverEvent", this.myDataTable.onEventHighlightRow); 
	this.myDataTable.subscribe("rowMouseoutEvent", this.myDataTable.onEventUnhighlightRow); 
	
	// check for 'POFunctionInd' flag before enabling upcoming PO functinality
	if(document.getElementById('POFunctionInd').value == "true"){
		this.myDataTable.subscribe("cellClickEvent", setContent); 
		this.myDataTable.subscribe("rowClickEvent", this.myDataTable.onEventSelectRow); 

		// set up containers to load and receive upcoming skus
		var iframe = document.createElement('iframe');
			iframe.style.border = "0";
			iframe.style.height = ".01em";
			iframe.style.width = ".01em";
			iframe.scrolling = "no";
			iframe.style.visibility = "hidden";
			iframe.id = 'nextPO';
			iframe.name = 'nextPO';
		var nextPOdiv = document.createElement('div');
			nextPOdiv.id = "nextPOdiv";
			grid.appendChild(iframe);
			grid.appendChild(nextPOdiv);
		
		// add some explanitory text
		var p = document.createElement('p');
			p.id = "expGrid";
			p.innerHTML = "Click any SKU to see any Upcoming PO's below.";
			grid.parentNode.insertBefore(p,grid);
	}
	
}
YE.onAvailable("footer",JWP.enhanceInventory,JWP.enhanceInventory,true);