Skip to content

Commit 7c992fb

Browse files
jissereitsmajissereitsma
committed
Rename containers
1 parent 17d2baf commit 7c992fb

3 files changed

Lines changed: 145 additions & 120 deletions

File tree

‎view/frontend/layout/loki_theme_default.xml‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,11 @@
99
<block name="loki.script.function.data-post" template="LokiTheme_LumaComponents::script/function/data-post.phtml"/>
1010
</referenceContainer>
1111

12-
<referenceContainer name="loki.components">
12+
<referenceContainer name="loki.script.component-type">
13+
<block name="loki.script.component.minicart-content" template="LokiTheme_LumaComponents::script/component-type/minicart-component-type.phtml"/>
14+
</referenceContainer>
15+
16+
<referenceContainer name="loki.script.component">
1317
<block name="loki.script.component.dropdown" template="LokiTheme_LumaComponents::script/component/dropdown.phtml"/>
1418
<block name="loki.script.component.main-menu" template="LokiTheme_LumaComponents::script/component/main-menu.phtml"/>
1519
<block name="loki.script.component.mobile-menu" template="LokiTheme_LumaComponents::script/component/mobile-menu.phtml"/>

‎view/frontend/templates/script/component-type/minicart-component-type.phtml‎

Lines changed: 139 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
<?php
2+
declare(strict_types=1);
3+
4+
use Magento\Framework\Escaper;
5+
use Magento\Framework\View\Element\Template;
6+
7+
/** @version 0.0.9 */
8+
/** @var Template $block */
9+
/** @var Escaper $escaper */
10+
?>
11+
<script>
12+
const LumaMiniCartComponentType = {
13+
cart: {},
14+
loading: false,
15+
init() {
16+
LokiToggle.toggle(
17+
'a.action.showcart',
18+
this.getMinicartBlock()
19+
);
20+
21+
Alpine.effect(() => {
22+
this.cart = Alpine.store('LokiLocalStorage').get('cart');
23+
24+
const qty = this.$el.querySelector('span.counter.qty');
25+
if (qty) {
26+
if (this.cart && this.cart.summary_count > 0) {
27+
qty.classList.remove('empty');
28+
} else {
29+
qty.classList.add('empty');
30+
}
31+
}
32+
33+
const counterNumber = this.$el.querySelector('span.counter-number');
34+
if (counterNumber) {
35+
const hasSummaryCount = this.cart && this.cart.summary_count > 0;
36+
counterNumber.innerHTML = hasSummaryCount && this.cart.summary_count;
37+
}
38+
});
39+
},
40+
getMinicartBlock() {
41+
return this.$root.querySelector('div.block-minicart');
42+
},
43+
qtyClass() {
44+
return this.cart.summary_count > 0 ? '' : 'empty';
45+
},
46+
closeContent() {
47+
this.getMinicartBlock().style.display = 'none';
48+
},
49+
proceedToCheckout() {
50+
window.location = '<?= /* @noEscape */ $block->getUrl(
51+
'checkout'
52+
) ?>';
53+
},
54+
toggleCartItemButton() {
55+
const cartItemOriginalQty = parseInt(this.$el.getAttribute('data-cart-item-qty'));
56+
const cartItemNewQty = parseInt(this.$el.value);
57+
const cartItemButton = this.$el.parentNode.querySelector('button');
58+
cartItemButton.style.display = (cartItemNewQty !== cartItemOriginalQty) ? 'inline-block' : 'none';
59+
},
60+
updateCartItemQty() {
61+
const cartItemId = this.$el.getAttribute('data-cart-item-id');
62+
const cartItemInput = document.getElementById('cart-item-' + cartItemId + '-qty');
63+
const cartItemQty = parseInt(cartItemInput.value);
64+
const cartItem = this.cart.items.find((item) => item.item_id === cartItemId);
65+
const currentQty = parseInt(cartItem.qty);
66+
67+
if (currentQty === cartItemQty) {
68+
return;
69+
}
70+
71+
const ajaxUpdateUrl = '<?= /* @noEscape */ $block->getUrl(
72+
'checkout/sidebar/updateItemQty'
73+
) ?>';
74+
75+
this.loading = true;
76+
fetch(ajaxUpdateUrl, {
77+
method: 'POST',
78+
headers: {
79+
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
80+
},
81+
body: new URLSearchParams({
82+
'item_id': cartItemId,
83+
'item_qty': cartItemQty,
84+
'form_key': window.LOKI_FORM_KEY
85+
})
86+
})
87+
.then(response => response.json())
88+
.then(data => {
89+
if (data.success) {
90+
Alpine.store('LokiLocalStorage').refresh('cart,messages', true);
91+
}
92+
93+
Alpine.store('LokiMessageStore').addNoticeMessage('<?= $escaper->escapeHtml(
94+
__('Updated quantity')
95+
) ?>');
96+
97+
this.loading = false;
98+
});
99+
},
100+
hasCartItems() {
101+
if (!this.cart || !this.cart.items) {
102+
return false;
103+
}
104+
105+
return this.cart.items.length > 0;
106+
},
107+
hasNoCartItems() {
108+
return !this.hasCartItems();
109+
},
110+
removeCartItem(event) {
111+
const cartItemId = this.$el.getAttribute('data-cart-item');
112+
113+
const ajaxUpdateUrl = '<?= /* @noEscape */ $block->getUrl(
114+
'checkout/sidebar/removeItem'
115+
) ?>';
116+
117+
fetch(ajaxUpdateUrl, {
118+
method: 'POST',
119+
headers: {
120+
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
121+
},
122+
body: new URLSearchParams({
123+
'item_id': cartItemId,
124+
'form_key': window.LOKI_FORM_KEY
125+
})
126+
})
127+
.then(response => response.json())
128+
.then(data => {
129+
if (data.success) {
130+
Alpine.store('LokiLocalStorage').refresh('cart,messages', true);
131+
}
132+
133+
Alpine.store('LokiMessageStore').addNoticeMessage('<?= $escaper->escapeHtml(
134+
__('Removed item')
135+
) ?>');
136+
});
137+
}
138+
}
139+
</script>

‎view/frontend/templates/script/component/minicart-content.phtml‎

Lines changed: 1 addition & 119 deletions
Original file line numberDiff line numberDiff line change
@@ -11,125 +11,7 @@ use Magento\Framework\View\Element\Template;
1111
<script>
1212
document.addEventListener('alpine:init', () => {
1313
Alpine.data('LumaMiniCart', () => ({
14-
cart: {},
15-
loading: false,
16-
init() {
17-
LokiToggle.toggle(
18-
'a.action.showcart',
19-
this.getMinicartBlock()
20-
);
21-
22-
Alpine.effect(() => {
23-
this.cart = Alpine.store('LokiLocalStorage').get('cart');
24-
25-
const qty = this.$el.querySelector('span.counter.qty');
26-
if (qty) {
27-
if (this.cart && this.cart.summary_count > 0) {
28-
qty.classList.remove('empty');
29-
} else {
30-
qty.classList.add('empty');
31-
}
32-
}
33-
34-
const counterNumber = this.$el.querySelector('span.counter-number');
35-
if (counterNumber) {
36-
const hasSummaryCount = this.cart && this.cart.summary_count > 0;
37-
counterNumber.innerHTML = hasSummaryCount && this.cart.summary_count;
38-
}
39-
});
40-
},
41-
getMinicartBlock() {
42-
return this.$root.querySelector('div.block-minicart');
43-
},
44-
qtyClass() {
45-
return this.cart.summary_count > 0 ? '' : 'empty';
46-
},
47-
closeContent() {
48-
this.getMinicartBlock().style.display = 'none';
49-
},
50-
proceedToCheckout() {
51-
window.location = '<?= /* @noEscape */ $block->getUrl('checkout') ?>';
52-
},
53-
toggleCartItemButton() {
54-
const cartItemOriginalQty = parseInt(this.$el.getAttribute('data-cart-item-qty'));
55-
const cartItemNewQty = parseInt(this.$el.value);
56-
const cartItemButton = this.$el.parentNode.querySelector('button');
57-
cartItemButton.style.display = (cartItemNewQty !== cartItemOriginalQty) ? 'inline-block' : 'none';
58-
},
59-
updateCartItemQty() {
60-
const cartItemId = this.$el.getAttribute('data-cart-item-id');
61-
const cartItemInput = document.getElementById('cart-item-' + cartItemId + '-qty');
62-
const cartItemQty = parseInt(cartItemInput.value);
63-
const cartItem = this.cart.items.find((item) => item.item_id === cartItemId);
64-
const currentQty = parseInt(cartItem.qty);
65-
66-
if (currentQty === cartItemQty) {
67-
return;
68-
}
69-
70-
const ajaxUpdateUrl = '<?= /* @noEscape */ $block->getUrl(
71-
'checkout/sidebar/updateItemQty'
72-
) ?>';
73-
74-
this.loading = true;
75-
fetch(ajaxUpdateUrl, {
76-
method: 'POST',
77-
headers: {
78-
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
79-
},
80-
body: new URLSearchParams({
81-
'item_id': cartItemId,
82-
'item_qty': cartItemQty,
83-
'form_key': window.LOKI_FORM_KEY
84-
})
85-
})
86-
.then(response => response.json())
87-
.then(data => {
88-
if (data.success) {
89-
Alpine.store('LokiLocalStorage').refresh('cart,messages', true);
90-
}
91-
92-
Alpine.store('LokiMessageStore').addNoticeMessage('<?= $escaper->escapeHtml(__('Updated quantity')) ?>');
93-
94-
this.loading = false;
95-
});
96-
},
97-
hasCartItems() {
98-
if (!this.cart || !this.cart.items) {
99-
return false;
100-
}
101-
102-
return this.cart.items.length > 0;
103-
},
104-
hasNoCartItems() {
105-
return !this.hasCartItems();
106-
},
107-
removeCartItem(event) {
108-
const cartItemId = this.$el.getAttribute('data-cart-item');
109-
110-
const ajaxUpdateUrl = '<?= /* @noEscape */ $block->getUrl(
111-
'checkout/sidebar/removeItem'
112-
) ?>';
113-
114-
fetch(ajaxUpdateUrl, {
115-
method: 'POST',
116-
headers: {
117-
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
118-
},
119-
body: new URLSearchParams({
120-
'item_id': cartItemId,
121-
'form_key': window.LOKI_FORM_KEY
122-
})
123-
})
124-
.then(response => response.json())
125-
.then(data => {
126-
if (data.success) {
127-
Alpine.store('LokiLocalStorage').refresh('cart,messages', true);
128-
}
129-
130-
Alpine.store('LokiMessageStore').addNoticeMessage('<?= $escaper->escapeHtml(__('Removed item')) ?>');
131-
});
132-
}
14+
...LumaMiniCartComponentType,
13315
}));
13416
});
13517
</script>

0 commit comments

Comments
 (0)