diff --git a/README.md b/README.md
index 8fe6ffe..e7364a4 100644
Binary files a/README.md and b/README.md differ
diff --git a/client/public/components/basket.mjs b/client/public/components/basket.mjs
index 75066cd..f106921 100644
--- a/client/public/components/basket.mjs
+++ b/client/public/components/basket.mjs
@@ -20,7 +20,7 @@ let basketCallback = null;
// TODO: Does the localstorage have a problem with mutual exclusion?
// TODO: Should the basket be persisted to the server?
-export function AddProductToBasket(product, amount) {
+export function AddProductToBasket(product, type, amount) {
if (localStorage.getItem('basket') === null || !localStorage.getItem('basket')) {
localStorage.setItem('basket', JSON.stringify({
items: {},
@@ -30,10 +30,13 @@ export function AddProductToBasket(product, amount) {
const basket = JSON.parse(localStorage.getItem('basket'));
- if (basket.items.product) {
- basket.items.product += amount;
+ if (basket.items[product]) {
+ basket.items[product].quantity += amount;
} else {
- basket.items.product = amount;
+ basket.items[product] = {
+ quantity: amount,
+ type,
+ };
}
basket.total += amount;
@@ -45,16 +48,16 @@ export function AddProductToBasket(product, amount) {
}
}
-export function RemoveProductFromBasket(item, amount) {
+export function RemoveProductFromBasket(product, amount) {
if (localStorage.getItem('basket') === null || !localStorage.getItem('basket')) {
return;
}
const basket = JSON.parse(localStorage.getItem('basket'));
- if (basket.items.item > amount) {
- basket.items.item -= amount;
+ if (basket.items[product] > amount) {
+ basket.items[product] -= amount;
} else {
- delete basket.items.item;
+ delete basket.items[product];
}
basket.total -= amount;
diff --git a/client/public/components/compact-listing.mjs b/client/public/components/compact-listing.mjs
index 656ef53..873e3e5 100644
--- a/client/public/components/compact-listing.mjs
+++ b/client/public/components/compact-listing.mjs
@@ -21,8 +21,8 @@ class CompactProductListing extends Component {
{this.state.name} {this.state.id}
${this.state.discount
- ? '£{this.state.price}£{this.state.discount}'
- : '£{this.state.price}'}
+ ? `£${parseFloat(this.state.price).toFixed(2)}£${parseFloat(this.state.discount).toFixed(2)}`
+ : `£${parseFloat(this.state.price).toFixed(2)}`}
`,
diff --git a/client/public/components/css/product-listing.css b/client/public/components/css/product-listing.css
index 4d13fe7..32cce28 100644
--- a/client/public/components/css/product-listing.css
+++ b/client/public/components/css/product-listing.css
@@ -233,7 +233,7 @@ input[type=number] {
height: 400px;
}
-.set-piece-container {
+.set-brick-container {
width: 100%;
display: flex;
flex-direction: row;
@@ -249,7 +249,7 @@ input[type=number] {
min-width: 0;
}
-.set-piece-amount {
+.set-brick-amount {
flex-grow: 1;
font-size: 2.3em;
font-weight: bold;
diff --git a/client/public/components/product-listing.mjs b/client/public/components/product-listing.mjs
index c08e77e..848f588 100644
--- a/client/public/components/product-listing.mjs
+++ b/client/public/components/product-listing.mjs
@@ -16,25 +16,32 @@ class ProductListing extends Component {
const getProductURL = new URL(`/api/${type}/${id}`, document.baseURI);
const productData = await fetch(getProductURL).then(response => response.json());
- let setContents = [];
- if (productData.data.type === 'set') {
- const allPieces = [];
- Object.keys(productData.data.includedPieces).forEach(key => {
- allPieces.push(key);
- });
+ this.state.image = `/api/cdn/${productData.data.id}.png`;
- const bulkSets = await fetch('/api/bulk/brick', {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json',
- },
- body: JSON.stringify({
- ids: allPieces,
- }),
- }).then(response => response.json());
- setContents = bulkSets.data;
+ if (productData.data.type !== 'set') {
+ this.setState({
+ ...this.getState,
+ ...productData.data,
+ }, false);
+ return;
}
+ let setContents = [];
+ const allBricks = [];
+ Object.keys(productData.data.includedBricks).forEach(key => {
+ allBricks.push(key);
+ });
+
+ const bulkSets = await fetch('/api/bulk/brick', {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json',
+ },
+ body: JSON.stringify({
+ ids: allBricks,
+ }),
+ }).then(response => response.json());
+ setContents = bulkSets.data;
this.setState({
...this.getState,
...productData.data,
@@ -44,7 +51,6 @@ class ProductListing extends Component {
Render() {
let setContents = '';
- console.log(this.state)
if (this.state.type === 'set') {
setContents = /* html */`