/* This js has the functions to display a compare "pop up" using layers and arrays to maintain the items selected One layer to put the page disable, another layer to display the compare table creating a pop up efect. The items properties come from a HTML tag called "item" wich is in the NS item cell template */ var items = new Array(); var phantom = new Array(); var stock = 0; var HTML; function compare() { // preload images imgClose=new Image; imgClose.src=(document.all)? 'http://shopping.netsuite.com/core/media/media.nl?id=3928&c=494083&h=c24ebb1f93abec74ab05': 'http://www.contractorsdirect.com/site/templates/close.gif'; imgRemove=new Image; imgRemove.src=(document.all)? 'http://shopping.netsuite.com/core/media/media.nl?id=3927&c=494083&h=8eb085bbf6b504c67553': 'http://www.contractorsdirect.com/site/templates/remove.gif'; makeTable(); displayTable(); Page(0); } //This function is the basic structure of the DIV and table to show the compare items (is the FRAMEWORK!!!) //Can be modified putting new NORMAL HTML with the new design //Need to include the call for function "page(1)" to close the framework (in some link, or object event) //in this part **ProductConditionPage YieldColor** //is where the especs of the product to show is defined --- width:728px; function makeTable() { HTML='
exit compare
Price
Amps
Voltage
RPM
Arbor Size
Compaction Force
Frequency
Motor/Engine
Motor
Engine
Horsepower
Length of Cut
Diagonally Cuts
Centrifugal Force
Exciter Speed
Batch Output
Pre-mix Bags (88 lb)
Impact Energy
Amps/Flow Rate
BPM
Speed
Bit Type
Tilt
Discharge Height
Bit Capacity
Weight
Plunge Feature
Blade Capacity
Depth of Cut
Shipping
Towable
Working Width
Drum Width
Travel Speed
Water Tank Capacity
Base Type


'; } //function to remove an item from the compare framework //CAN'T BE MODIFIED// function popItem(event) { if (stock>1) { event = event || window.event; var a = event.target || event.srcElement; var _id = a.getAttribute("rel"); var trs = document.getElementById("div-C").getElementsByTagName("tr"); for (var i=0; i1) { // are there more than one item to compare var div = document.createElement("div"); // create the framework div object div.id="div-C"; div.innerHTML = HTML; // put the framework code in the page var trs = div.getElementsByTagName("table")[0].getElementsByTagName("tr"); // get an array of the framework TRs stock = items.length; // how many items to show? for (var i=0;i'; displayTD(trs,html,i,td_count++); // Create de html to display link to product page html=''; displayTD(trs,html,i,td_count++); html=''+tip.getAttribute("itm_name")+''; displayTD(trs,html,i,td_count++); // Display list for matrix items displayProperty(tip,trs,'itm_listvals', i,td_count++); var listLabel = tip.getAttribute('itm_listlbl'); // Display price list if there is one, else display regular price if (tip.getAttribute('itm_pricelist')!="") displayProperty(tip,trs,'itm_pricelist', i,td_count++); else displayProperty(tip,trs,'itm_price', i,td_count++); // Diplay each one of the specs for the item in a column displayProperty(tip,trs,'itm_amps', i,td_count++); displayProperty(tip,trs,'itm_volt', i,td_count++); displayProperty(tip,trs,'itm_rpm', i,td_count++); displayProperty(tip,trs,'itm_asize', i,td_count++); displayProperty(tip,trs,'itm_comf', i,td_count++); displayProperty(tip,trs,'itm_freq', i,td_count++); displayProperty(tip,trs,'itm_mtreng', i,td_count++); displayProperty(tip,trs,'itm_motor', i,td_count++); displayProperty(tip,trs,'itm_eng', i,td_count++); displayProperty(tip,trs,'itm_hpwr', i,td_count++); displayProperty(tip,trs,'itm_lcut', i,td_count++); displayProperty(tip,trs,'itm_diacut', i,td_count++); displayProperty(tip,trs,'itm_cenf', i,td_count++); displayProperty(tip,trs,'itm_exspd', i,td_count++); displayProperty(tip,trs,'itm_bout', i,td_count++); displayProperty(tip,trs,'itm_prembgs', i,td_count++); displayProperty(tip,trs,'itm_ienerg', i,td_count++); displayProperty(tip,trs,'itm_afr', i,td_count++); displayProperty(tip,trs,'itm_bpm', i,td_count++); displayProperty(tip,trs,'itm_speed', i,td_count++); displayProperty(tip,trs,'itm_bittype', i,td_count++); displayProperty(tip,trs,'itm_tilt', i,td_count++); displayProperty(tip,trs,'itm_dish', i,td_count++); displayProperty(tip,trs,'itm_bcap', i,td_count++); displayProperty(tip,trs,'itm_wt', i,td_count++); displayProperty(tip,trs,'itm_plfeat', i,td_count++); displayProperty(tip,trs,'itm_blcap', i,td_count++); displayProperty(tip,trs,'itm_depcut', i,td_count++); displayProperty(tip,trs,'itm_shipp', i,td_count++); displayProperty(tip,trs,'itm_towabl', i,td_count++); displayProperty(tip,trs,'itm_workw', i,td_count++); displayProperty(tip,trs,'itm_drumw', i,td_count++); displayProperty(tip,trs,'itm_travsp', i,td_count++); displayProperty(tip,trs,'itm_wtcp', i,td_count++); displayProperty(tip,trs,'itm_basetype', i,td_count++); } hideEmptyTRs(trs); // hide TRs with no data document.getElementsByTagName("body")[0].appendChild(div); // Put framework in the page document.getElementById('list_label').innerHTML = listLabel; // display correct list label //Select the framework position depending on the screen size var posleft = (screen.width > 960)?((screen.width-960)/2+120):120; document.getElementById("divCompare").style.left = posleft+'px'; document.getElementById("divCompare").style.top = '165px'; //Look here to set the width *NC* //you can sync the two divs here only make a reference to div-C*NC* // document.getElementById("divCompare").style.width = (202 + 132*stock) + "px"; // resize divisions document.getElementById("divCompare").style.width = (71 + 132*stock) + "px"; document.getElementById("div-C").style.width = (71 + 132*stock) + "px"; } } /*----------------------------------------------------------- function to display an item property in a selected TD parameters: tip = object with the item properties trs = array with the framework TDs. prop = the name of the property to be display i= index of the array with the items ids j= number of the TD to use -----------------------------------------------------------*/ function displayProperty(tip,trs,prop,i,j) { //here we create a new TD and put in the TDs Array var td = document.createElement("td"); // create a new TD td.id="tr"+j.toString()+"_td_"+i.toString(); // assign ID, allows to remove it later td.className = "tdDataCompare"; // assign a class for CSS styles td.innerHTML = tip.getAttribute(prop); // write the value inside the TD trs[j].appendChild(td); // put the new td in the TDS array } /*----------------------------------------------------------- function to display html code in a selected TD of the framework parameters: trs = array with the framework TDs. html = html code to write inside the TD. i= index of the array with the items ids j= number of the TD to use -----------------------------------------------------------*/ function displayTD(trs,html,i,j) { var td = document.createElement("td"); // create a new TD td.id="tr"+j.toString()+"_td_"+i.toString(); // assign ID, allows to remove it later td.className = "tdDataCompare"; // assign a class for CSS styles td.innerHTML = html; // write the HTML inside the TD trs[j].appendChild(td); // put the new td in the TDS array } //--------------------------------------------------------------------- // function to go trought all the TRs in the table and hide those empty // parameters: // trs = array with the framework TDs. // // rows - "r" start at row 3 (id 2), where spec values begin to display // cells - "c" start at column 2 (id 1), to ignore spec titles function hideEmptyTRs(trs){ var count = 0; var tds, empty, content; for (var r=2; r