|
var cstore =[ //cstore node: ["imgLink","itemName","Blurp","price","id"] |
|
["http://41.media.tumblr.com/f6dacdb30119d9bf4a1d0971c72f43cb/tumblr_nllm5iecvn1snx82yo1_500.jpg","Home Page","The homepage is the foundation of any and all websites. This will make or break your ability to capture an audience. ","200","home"], |
|
["http://40.media.tumblr.com/c00aec63deb1ebaf33c4a2aa0d7b4336/tumblr_nllkwppQQf1snx82yo1_500.jpg","About Page","This page will contain information about directions, hours, phone numbers, and legal information. Very important. ","300","about"], |
|
["http://40.media.tumblr.com/5ce63084a15eefcc0a02e3146b0a1f77/tumblr_nlllznsd8j1snx82yo1_500.jpg","Contact Form Page","Customers these days would rather then a text based communication rather than calling. Your customers and write you an email right from the webpage for the ultimate convience. This features requires web hosting.","100","contact"], |
|
["http://40.media.tumblr.com/a843afc2fa287464116d26bc4a8d3a85/tumblr_nllmdd4NKr1snx82yo1_500.jpg","Blog","Share what's happening at your end with a blog. Blogs will keep your customers current with either news or specials. This requires a Content Management System.","100","blog"], |
|
["http://40.media.tumblr.com/ed98445d94534fb17aeaff6d409861b1/tumblr_nlllk7hjDz1snx82yo1_500.jpg","Image Gallery","Do you want to have you're own instagram feed on your site? Better Yet, your own custom gallery? You can update this from any device connected to the internet. This requires a Content Management System.","100","gallery"], |
|
["http://36.media.tumblr.com/85019b0c41204761384b0df3f654fc07/tumblr_nlll4ptbn81snx82yo1_500.jpg","Web Store","Don't sell your stuff on another site; sell your stuff directly to your customers!! This feature requires a PayPal account.","300","webstore"], |
|
["http://40.media.tumblr.com/aa64f94872296a7adb3350c0716506b2/tumblr_nllk30KYeJ1snx82yo1_500.jpg","Web Presence","Find you FIRST on the Front Page on any web search engine to put yourself out there and give you the edge over the competition. This product requires a Google Account & Google Places Account.","200","webp"], |
|
["http://40.media.tumblr.com/d632eee41e266b0fd127a932d727dca3/tumblr_nllklufyPf1snx82yo1_500.jpg","WebApp","Make your site easier to use on any mobile devices. Light weight and fast loading.","300","webapp"], |
|
["http://40.media.tumblr.com/c0466369c9288f1a47744dd5575cd0c4/tumblr_nlllqwBtcM1snx82yo1_400.jpg","Logo & Artwork","A stellar logo will put you over the competition. And custom graphics gives any site a well rounded feel.","150","arts"], |
|
["http://41.media.tumblr.com/d03f600d8b3adee4cbdd4e3a51fa87ea/tumblr_nllok9ISgj1snx82yo1_500.jpg","Stop Being Grumpy Shirt","Only avaiable in medium. I'm sorry that I'm not sorry.","40","grumps"], |
|
["http://41.media.tumblr.com/fe57f426e75c0131999b9f706e1f2b77/tumblr_nllp6fFiCI1snx82yo1_500.jpg","Music","I write, perform, and edit music.","200","music"], |
|
["http://36.media.tumblr.com/fd6d349c1f6b9c9da41a6376302f5ea6/tumblr_nllo174Esa1snx82yo1_500.jpg","Buy A Cup of Coffee","If you appreciate my work, buy this poor fella a cup of coffee.","5","coffee"] |
|
]; |
|
//CREATE VARIABLES: START -----------------------------------------------------------------> |
|
var total=0; |
|
for (var i=0;i<cstore.length;i+=1){//Create Variables from array with a LOOP |
|
window[cstore[i][4]] = cstore[i][3]; //alert(cstore[i][4] + cstore[i][3]);//Test |
|
}//CREATE VARIABLES: END -----------------------------X |
|
createStore();//CREATE STORE: START -------------------------------------------------------> |
|
function createStore(){ |
|
var main_c = document.getElementById("main_store"); |
|
var ulstore = document.createElement("ul");//create UL |
|
ulstore.id="web_store_list"; |
|
var divstore = document.createElement("div");//create DIV |
|
divstore.id="web_store"; |
|
divstore.appendChild(ulstore);//Append UL to DIV |
|
main_c.appendChild(divstore);//Append DIV to MAIN |
|
for (var i = 0; i < cstore.length; i++) { |
|
var li = document.createElement("li"); //Create LI |
|
var img = document.createElement("img"); //create IMG |
|
img.src= cstore[i][0]; |
|
var figure = document.createElement("figure"); //Create FIGURE and Append IMG to it |
|
figure.appendChild(img); |
|
li.appendChild(figure);//Append FIGURE to LI |
|
var figcaption = document.createElement("figcaption");//create FIGCAPTION |
|
var h3 = document.createElement("h3");//Create h3 |
|
var h3Text = document.createTextNode(cstore[i][1]); |
|
h3.appendChild(h3Text); |
|
figcaption.appendChild(h3); |
|
var p = document.createElement("p");//Create P |
|
var pText = document.createTextNode(cstore[i][2]); |
|
p.appendChild(pText); |
|
figcaption.appendChild(p); |
|
var a = document.createElement("a");//Create A |
|
var aText = document.createTextNode("$"+cstore[i][3]+".00"); |
|
a.id= cstore[i][4] + "_store"; |
|
a.className = "product_price_Btn"; |
|
a.appendChild(aText); |
|
figcaption.appendChild(a); |
|
li.appendChild(figcaption);//Append FIGCAPTION to LI |
|
ulstore.appendChild(li);//Append LI to UL |
|
} |
|
};//CREATE STORE: END---------------------------------------------X |
|
createCart();//CREATE CART: START ---------------------------------------------------------> |
|
function createCart(){ |
|
var main_c = document.getElementById("main_store"); |
|
var shoppingCart = document.createElement("div"); |
|
shoppingCart.id="shoppingCart"; |
|
main_c.appendChild(shoppingCart);//Append DIV to MAIN |
|
var h2 = document.createElement("h2"); |
|
var h2Text = document.createTextNode("Shopping Cart"); |
|
h2.appendChild(h2Text); |
|
shoppingCart.appendChild(h2); |
|
var img = document.createElement("img"); |
|
img.src="http://41.media.tumblr.com/872f1ad5d1cf21f2fb9c60796f628d50/tumblr_nllqq2S2jQ1snx82yo1_75sq.png"; |
|
shoppingCart.appendChild(img); |
|
var listoutput = document.createElement("ul");//create DIV |
|
listoutput.id="shoppingCartlist"; |
|
for (var i = 0; i < cstore.length; i++) { |
|
var li = document.createElement("li");//Create <li> tag |
|
li.className = "hideItem"; |
|
li.id= cstore[i][4] + "_cart"; |
|
var liText = document.createTextNode( cstore[i][1] + ": $" + cstore[i][3]); |
|
li.appendChild(liText); |
|
listoutput.appendChild(li); |
|
} |
|
shoppingCart.appendChild(listoutput);//Append DIV to MAIN |
|
var hr = document.createElement("hr"); |
|
shoppingCart.appendChild(hr); |
|
var p = document.createElement("p"); |
|
p.id="shoppingCart_total"; |
|
var pText = document.createTextNode("Total: $"); |
|
p.appendChild(pText); |
|
shoppingCart.appendChild(p); |
|
var span = document.createElement("span"); |
|
span.id="total"; |
|
var spText = document.createTextNode("0"); |
|
span.appendChild(spText); |
|
p.appendChild(span); |
|
};//CREATE CART: END ----------------------------------------------X |
|
//BUTTON CLICK: START ---------------------------------------------------------------------> |
|
for (var i=0;i<cstore.length;i+=1) { |
|
(function(i) { |
|
document.getElementById(cstore[i][4]+"_store").onclick=function() { |
|
this.innerHTML= "In Cart"; |
|
document.getElementById(cstore[i][4]+"_store").className="disableATag" |
|
document.getElementById(cstore[i][4]+"_cart").className=""; |
|
total = total + parseInt(cstore[i][3]); |
|
document.getElementById("total").innerHTML = total; |
|
|
|
document.getElementById(cstore[i][4]+"_cart").onclick = function() { |
|
this.className="hideItem"; |
|
var store = document.getElementById(cstore[i][4]+"_store"); |
|
store.innerHTML="$"+cstore[i][3]; |
|
store.className=""; |
|
total = total - parseInt(cstore[i][3]); |
|
document.getElementById("total").innerHTML = total; |
|
} |
|
}; |
|
})(i); |
|
}//BUTTON CLICK: END --------------------------------X |
