var items =

    [

      {'id':1, 'artist':'<h2>Pink Floyd</h2>', 'image':'<img src="images/darkside.jpg" align= right onmouseover="zoomOut(this)">','desc':'The greatest band of all time!', 'title':'Dark Side of the Moon','price':20.00, 'qty':0},

      {'id':2, 'artist':'<h2>Jimi Hendrix</h2>', 'image':'<img src="images/jimi.jpg" align= right>','desc':'Left-Handed Guitar Genius', 'title':'Electric LadyLand',  'price':15.98, 'qty':0},

      {'id':3, 'artist':'<h2>Beastie Boys</h2>', 'image':'<img src="images/pauls.jpg" align= right>','desc':'Universally cool', 'title':'Pauls Boutique', 'price':14.00, 'image_src': '', 'qty':0}

    ];

var butnOrder = document.getElementById("butnOrder");

var M = '$';

var stuff = '';

var order = [];

var total = 0;

var TAX = 0;

var taxTotal = 0;

​

for(j=0;j<items.length;j++) {

    stuff+=''+albumList(j)+'';

}

document.getElementById('products').innerHTML=stuff;

​

function albumList(j) {

    var getStuff='';

//put items[] into the form, iterate,return

   getStuff+='<form name="cartForm'+j+'">';

    getStuff+='<fieldset><legend>'+items[j].artist+'</legend>';

    getStuff+='<p>'+items[j].image+'</p>';

    getStuff+='<p>Album: '+''+items[j].title+'</p>';

    getStuff+='<p>Description: '+items[j].desc+'</p>';

    getStuff+='<p>Price: '+M+''+items[j].price+'</p>';

    getStuff+='<b>Qty</b>';

    getStuff+='<select id="qty '+j+'">';

    for(i=0;i<6;i++) {

    getStuff+='<option value="'+i+'">'+i+'</option>';

    }

    getStuff+='</select>';

    getStuff+='</fieldset>';

    getStuff+='</form>';

    return getStuff;

}

​

function cart() {

    var select = document.getElementsByTagName('select');

    k=0;

  //loop

    for (i=0; i < select.length; i++) {

        if (select[i].id.substring(0, 4) == 'qty ' && select[i].value > 0) {

            console.log(i, select[i].value);

          order[k]=''+items[i].artist+': '+select[i].value+' * '+M+ items[i].price+'';

          //calculate the total

            total += select[i].value*items[i].price;

            k++;

            taxTotal += total+(total*0.07);

        }

    }

​

  document.getElementById('inCart').innerHTML=order.join('<br>')+'<br>'+'<b>SubTotal:   </b>'+ M +total+'<br>'+ 'Tax: $0.07 '+'<h3>Total:  '+M+taxTotal+'</h3>';

}

 function removeCart(){

 }

 function process() {

    'use strict';

​

    // Get form references:

    var firstName = document.getElementById('firstName').value;

    var lastName = document.getElementById('lastName').value;

   var address = document.getElementById('address').value;

   var city = document.getElementById('city').value;

    var state = document.getElementById('state').value;

   var zip = document.getElementById('zip').value;

​

    // Reference to where the output goes:

    var outputC = document.getElementById('outputC');

​

    // Create a new object:

    var orderInfo = {

        firstName: firstName,

        lastName: lastName,

        address: address,

        city: city,

        state: state,

        zip: zip,

        getName: function() {

            return this.lastName + ', ' + this.firstName;

        },

        purchaseDate: new Date()

    }; 

   butnOrder.addEventListener("click", process, false);

    // Create the ouptut as HTML:

    var message = '<h2>Order Comfirmation</h2>Name: ' + orderInfo.getName() + '<br>';

    message += '<b>Mailing Info : </b>'+'<br>'+ orderInfo.address +'<br>'+ orderInfo.city +'<br>'+ orderInfo.state +'<br>'+ orderInfo.zip +'<br>'+'<br>';

    message += '<b>Purchase Date: </b>' + orderInfo.purchaseDate.toDateString();

    // Display the orderInfo object:

    outputC.innerHTML = message;

    // Return false:

    return false;

​

} 

// Initial setup:

function init() {

    'use strict';

    document.getElementById('cartForm').onsubmit = process;

 } // End of init() function.

window.onload = init;

​

​

​

window.onload = function() {

   'use strict';

    U.$('cartForm').onsubmit = albumList;

};

 window.onload = cart;