diff --git a/static/css/main.css b/static/css/main.css new file mode 100644 index 0000000..cdde0f2 --- /dev/null +++ b/static/css/main.css @@ -0,0 +1,99 @@ +body{ + background-color: hsl(0, 0%, 98%); +} + +h1,h2,h3,h4,h5,h6{ + color:hsl(0, 0%, 30%); +} + +.box-element{ + box-shadow:hsl(0, 0%, 80%) 0 0 16px; + background-color: #fff; + border-radius: 4px; + padding: 10px; +} + +.thumbnail{ + width: 100%; + height: 200px; + -webkit-box-shadow: -1px -3px 5px -2px rgba(214,214,214,1); + -moz-box-shadow: -1px -3px 5px -2px rgba(214,214,214,1); + box-shadow: -1px -3px 5px -2px rgba(214,214,214,1); +} + +.product{ + border-radius: 0 0 4px 4px; +} + +.bg-dark{ + background-color: #4f868c!important; +} + +#cart-icon{ + width:25px; + display: inline-block; + margin-left: 15px; +} + +#cart-total{ + display: block; + text-align: center; + color:#fff; + background-color: red; + width: 20px; + height: 25px; + border-radius: 50%; + font-size: 14px; +} + +.col-lg-4, .col-lg-6, .col-lg-8, .col-lg-12{ + margin-top: 10px; +} + +.btn{ + border-radius: 0; +} + +.row-image{ + width: 100px; +} + +.form-field{ + width:250px; + display: inline-block; + padding: 5px; +} + +.cart-row{ + display: flex; + align-items: flex-stretch; + padding-bottom: 10px; + margin-bottom: 10px; + border-bottom: 1px solid #ececec; + +} + +.quantity{ + display: inline-block; + font-weight: 700; + padding-right:10px; + + +} + +.chg-quantity{ + width: 12px; + cursor: pointer; + display: block; + margin-top: 5px; + transition:.1s; +} + +.chg-quantity:hover{ + opacity: .6; +} + + +.hidden{ + display: none!important; +} \ No newline at end of file diff --git a/static/images/acer.jpg b/static/images/acer.jpg new file mode 100644 index 0000000..bd0dd4c Binary files /dev/null and b/static/images/acer.jpg differ diff --git a/static/images/aronium2.JPG b/static/images/aronium2.JPG new file mode 100644 index 0000000..609bf70 Binary files /dev/null and b/static/images/aronium2.JPG differ diff --git a/static/images/arrowDown.png b/static/images/arrowDown.png new file mode 100644 index 0000000..c3001d4 Binary files /dev/null and b/static/images/arrowDown.png differ diff --git a/static/images/arrowUp.png b/static/images/arrowUp.png new file mode 100644 index 0000000..058e679 Binary files /dev/null and b/static/images/arrowUp.png differ diff --git a/static/images/cart.png b/static/images/cart.png new file mode 100644 index 0000000..3f8be4d Binary files /dev/null and b/static/images/cart.png differ diff --git a/static/images/cmbk1.jpg b/static/images/cmbk1.jpg new file mode 100644 index 0000000..068ba8e Binary files /dev/null and b/static/images/cmbk1.jpg differ diff --git a/static/images/cmbk1_mOrKcma.jpg b/static/images/cmbk1_mOrKcma.jpg new file mode 100644 index 0000000..068ba8e Binary files /dev/null and b/static/images/cmbk1_mOrKcma.jpg differ diff --git a/static/images/el1.jpg b/static/images/el1.jpg new file mode 100644 index 0000000..b5f7bc7 Binary files /dev/null and b/static/images/el1.jpg differ diff --git a/static/images/el1_VYXBhB2.jpg b/static/images/el1_VYXBhB2.jpg new file mode 100644 index 0000000..b5f7bc7 Binary files /dev/null and b/static/images/el1_VYXBhB2.jpg differ diff --git a/static/images/elitebook1.jpg b/static/images/elitebook1.jpg new file mode 100644 index 0000000..bf10fd5 Binary files /dev/null and b/static/images/elitebook1.jpg differ diff --git a/static/images/elitebook2.jpg b/static/images/elitebook2.jpg new file mode 100644 index 0000000..97b2b5b Binary files /dev/null and b/static/images/elitebook2.jpg differ diff --git a/static/images/fineHP1.jpg b/static/images/fineHP1.jpg new file mode 100644 index 0000000..ca94e3f Binary files /dev/null and b/static/images/fineHP1.jpg differ diff --git a/static/images/hp1.jpg b/static/images/hp1.jpg new file mode 100644 index 0000000..8458cf6 Binary files /dev/null and b/static/images/hp1.jpg differ diff --git a/static/images/hp2.jpg b/static/images/hp2.jpg new file mode 100644 index 0000000..05ef99c Binary files /dev/null and b/static/images/hp2.jpg differ diff --git a/static/images/lenovo1.jpg b/static/images/lenovo1.jpg new file mode 100644 index 0000000..9a8250b Binary files /dev/null and b/static/images/lenovo1.jpg differ diff --git a/static/images/product.png b/static/images/product.png new file mode 100644 index 0000000..5f64a71 Binary files /dev/null and b/static/images/product.png differ diff --git a/static/js/cart.js b/static/js/cart.js new file mode 100644 index 0000000..c927881 --- /dev/null +++ b/static/js/cart.js @@ -0,0 +1,67 @@ +var updateBtns = document.getElementsByClassName('update-cart') + +for (var i =0; i < updateBtns.length; i++){ + updateBtns[i].addEventListener('click', function() + { + var productId = this.dataset.product + var action= this.dataset.action + console.log('productId:', productId, 'action:', action) + + console.log('USER:', user) + if (user === 'AnonymousUser'){ + addCookieItem(productId, action) + + + }else{ + updateUserOrder(productId, action) + } + }) + +} + +function addCookieItem(productId, action){ + console.log('Not logged in!....') + if (action == 'add'){ + if(cart[productId] == undefined){ + cart[productId] = {'quantity':1} + + }else{ + cart[productId]['quantity'] += 1 + } + } + if (action == 'remove'){ + cart[productId]['quantity'] -= 1 + if(cart[productId]['quantity']<= 0){ + console.log('Remove Item') + delete cart[productId] + } + } + console.log('Cart:', cart) + document.cookie = 'cart=' + JSON.stringify(cart) + ";domain=;path=/" + location.reload() + +} + +function updateUserOrder(productId, action){ + console.log('logged in. Sending Data') + var url ='/update_item/' + + fetch(url,{ + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'X-CSRFToken': csrftoken + }, + body:JSON.stringify({ 'productId':productId, 'action':action}) + }) + .then((response) =>{ + return response.json() + + }) + .then((data) =>{ + console.log('data:', data) + location.reload() + + }) + +} \ No newline at end of file