diff --git a/css/index.css b/css/index.css
index 3ca5740..e606a71 100644
--- a/css/index.css
+++ b/css/index.css
@@ -64,6 +64,10 @@ body {
background-color: #3331;
}
+#stores .card-header {
+ font-weight: bold;
+}
+
.priceWrapper {
float: right;
text-align: right;
@@ -77,11 +81,29 @@ span.price::after {
content: ' kr';
}
+body.dollars span.price::before {
+ content: "$";
+}
+body.dollars span.price::after {
+ content: '';
+}
+
.subtotal {
font-weight: bold;
}
+.itemAmountWrapper {
+ clear: both;
+}
+.itemAmount.itemAmountBtn {
+ -webkit-appearance: none;
+ -moz-appearance: textfield;
+ width: 29px;
+ padding: 0 5px;
+ text-align: center;
+}
+
.addItemForm div.form-control {
transition: width 0.5s;
}
diff --git a/icon/lock.svg b/icon/lock.svg
new file mode 100644
index 0000000..b50a68e
--- /dev/null
+++ b/icon/lock.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/icon/unlock.svg b/icon/unlock.svg
new file mode 100644
index 0000000..8eb0925
--- /dev/null
+++ b/icon/unlock.svg
@@ -0,0 +1,3 @@
+
\ No newline at end of file
diff --git a/plan/plan.js b/plan/plan.js
index ecf1e8b..25f2168 100644
--- a/plan/plan.js
+++ b/plan/plan.js
@@ -3,6 +3,7 @@
class Store {
constructor(title, storeID) {
this.items = [];
+ this.state = 'unlocked'; // states: unlocked/locked
let storeNum = $(".store").length+1;
this.title = title || "Store "+storeNum;
@@ -11,6 +12,7 @@ class Store {
let html = "";
html += "
";
html += " ";
+ html += "
";
html += "
";
html += "
";
html += "
";
@@ -19,8 +21,9 @@ class Store {
html += "
";
html += " - No items added
";
html += "
";
- html += "
";
+ html += "
";
+ html += "
";
html += " ";
html += " ";
+ html += " ";
html += "
";
html += " ";
@@ -53,6 +57,23 @@ class Store {
});
+ this.selector.find('.lockStore').tooltip({title: 'Lock Store'});
+ this.selector.find('.lockStore').on('click', ev => {
+ let lockIcon = $(ev.target);
+ if(this.lockStore() === 1){
+ lockIcon.attr({ 'src': '../icon/lock.svg', 'title': 'Unlock store' });
+ lockIcon.tooltip('dispose');
+ lockIcon.tooltip({title: 'Unlock Store'});
+ lockIcon.tooltip('show');
+ }
+ else {
+ lockIcon.attr({ 'src': '../icon/unlock.svg', 'title': 'Lock store' });
+ lockIcon.tooltip('dispose');
+ lockIcon.tooltip({title: 'Lock Store'});
+ lockIcon.tooltip('show');
+ }
+ });
+
this.selector.find('.editStoreName').one('click', ev => { this.editNameFn(ev); });
this.selector.find('.removeStore').on('click', ev => {
@@ -64,6 +85,22 @@ class Store {
});
}
+ lockStore(){
+ if(this.state === "unlocked"){
+ this.state = "locked";
+ this.selector.find('.itemAmountWrapper').slideUp(200);
+ this.selector.find('.addItemFormWrapper').slideUp(200);
+ // this.selector.find('.remItem').hide();
+ return 1;
+ }
+
+ this.state = "unlocked";
+ this.selector.find('.itemAmountWrapper').slideDown(200);
+ this.selector.find('.addItemFormWrapper').slideDown(200);
+ // this.selector.find('.remItem').show();
+ return 0;
+ }
+
editNameFn(ev){
if(ev.type === 'click'){
@@ -141,17 +178,19 @@ class Store {
html += "";
html += " "+text+"";
- html += "
";
+ html += " ";
html += " ";
html += " ";
- html += " ";
- html += " x"+price.toFixed(2)+"";
+ html += " ";
+ if(price !== 0) {
+ html += " x" + price.toFixed(2) + "";
+ }
html += " ";
html += "
";
html += " ";
- html += " "+price.toFixed(2)+"";
- html += "
";
+ html += " "+(price*amount).toFixed(2)+"";
+ html += "
";
html += "";
this.selector.find("ul").append(html);