/*
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)?
'https://system.netsuite.com/core/media/media.nl?id=332&c=641356&h=34eb3ba192a7d653b892':
'http://shopping.netsuite.com/c.641356/site/ss-templates/ss-close.gif';
imgRemove=new Image;
imgRemove.src=(document.all)?
'https://system.netsuite.com/core/media/media.nl?id=331&c=641356&h=a504c63ad5d6c270887c':
'http://shopping.netsuite.com/c.641356/site/ss-templates/ss-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 **
| Product |
| Condition |
| Page Yield |
| Color |
**
//is where the especs of the product to show is defined --- width:728px;
function makeTable() {
HTML='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; i
1) { // 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
}
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 0){
for (var i=0;i1)
{
if (!document.getElementById("Blur2")) // check if the black background exist
{
var n = navigator.userAgent;
if (/MSIE/.test(n))
{
phantom = document.getElementsByTagName("select"); // deprecate don't erase
for (var i=0;ih_a)?h:h_a; // evaluate the height to use
// determine the style of the blur (the color, opacity,etc).
//the only thing to maintain is the "z-index:9999" prop. to put the blur behind the compare framework
//This portion of code CAN BE MODIFIED//
div.innerHTML= "
";
//more settings to put the blur in the right position
if (document.all){
div.style.width=(document.body.offsetWidth-20)+"px";
}
var tt=document.createTextNode(" ");
div.appendChild(tt);
document.getElementsByTagName("body")[0].appendChild(div)
window.scroll(0,0)
}
}
}
}
//function the remove an object from the page
function popOBJ(pObj){
if (pObj){
pObj.parentNode.removeChild(pObj);
}
}