Skip to content

Commit 4c8caec

Browse files
authored
Create wishlist.js
1 parent 52405c5 commit 4c8caec

File tree

1 file changed

+237
-0
lines changed
  • app/code/Magento/Wishlist/view/frontend/web/js

1 file changed

+237
-0
lines changed
Lines changed: 237 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,237 @@
1+
/**
2+
* Copyright © 2013-2017 Magento, Inc. All rights reserved.
3+
* See COPYING.txt for license details.
4+
*/
5+
6+
define([
7+
'jquery',
8+
'mage/template',
9+
'Magento_Ui/js/modal/alert',
10+
'jquery/ui',
11+
'mage/validation/validation',
12+
'mage/dataPost'
13+
], function ($, mageTemplate, alert) {
14+
'use strict';
15+
16+
$.widget('mage.wishlist', {
17+
options: {
18+
dataAttribute: 'item-id',
19+
nameFormat: 'qty[{0}]',
20+
btnRemoveSelector: '[data-role=remove]',
21+
qtySelector: '[data-role=qty]',
22+
addToCartSelector: '[data-role=tocart]',
23+
addAllToCartSelector: '[data-role=all-tocart]',
24+
commentInputType: 'textarea',
25+
infoList: false
26+
},
27+
28+
/**
29+
* Bind handlers to events.
30+
*/
31+
_create: function () {
32+
var _this = this;
33+
34+
if (!this.options.infoList) {
35+
this.element
36+
.on('addToCart', function (event, context) {
37+
var urlParams;
38+
39+
event.stopPropagation(event);
40+
$(context).data('stop-processing', true);
41+
urlParams = _this._getItemsToCartParams(
42+
$(context).parents('[data-row=product-item]').find(_this.options.addToCartSelector)
43+
);
44+
$.mage.dataPost().postData(urlParams);
45+
46+
return false;
47+
})
48+
.on('click', this.options.btnRemoveSelector, $.proxy(function (event) {
49+
event.preventDefault();
50+
$.mage.dataPost().postData($(event.currentTarget).data('post-remove'));
51+
}, this))
52+
.on('click', this.options.addToCartSelector, $.proxy(this._beforeAddToCart, this))
53+
.on('click', this.options.addAllToCartSelector, $.proxy(this._addAllWItemsToCart, this))
54+
.on('focusin focusout', this.options.commentInputType, $.proxy(this._focusComment, this));
55+
}
56+
57+
// Setup validation for the form
58+
this.element.mage('validation', {
59+
/** @inheritdoc */
60+
errorPlacement: function (error, element) {
61+
error.insertAfter(element.next());
62+
}
63+
});
64+
},
65+
66+
/**
67+
* Process data before add to cart
68+
*
69+
* - update item's qty value.
70+
*
71+
* @param {Event} event
72+
* @private
73+
*/
74+
_beforeAddToCart: function (event) {
75+
var elem = $(event.currentTarget),
76+
itemId = elem.data(this.options.dataAttribute),
77+
qtyName = $.validator.format(this.options.nameFormat, itemId),
78+
qtyValue = elem.parents().find('[name="' + qtyName + '"]').val(),
79+
params = elem.data('post');
80+
81+
if (params) {
82+
params.data = $.extend({}, params.data, {
83+
'qty': qtyValue
84+
});
85+
elem.data('post', params);
86+
}
87+
},
88+
89+
/**
90+
* Add wish list items to cart.
91+
* @private
92+
* @param {jQuery} elem - clicked 'add to cart' button
93+
*/
94+
_getItemsToCartParams: function (elem) {
95+
var itemId, url, qtyName, qtyValue;
96+
97+
if (elem.data(this.options.dataAttribute)) {
98+
itemId = elem.data(this.options.dataAttribute);
99+
url = this.options.addToCartUrl;
100+
qtyName = $.validator.format(this.options.nameFormat, itemId);
101+
qtyValue = elem.parents().find('[name="' + qtyName + '"]').val();
102+
url.data.item = itemId;
103+
url.data.qty = qtyValue;
104+
105+
return url;
106+
}
107+
},
108+
109+
/**
110+
* Add all wish list items to cart
111+
* @private
112+
*/
113+
_addAllWItemsToCart: function () {
114+
var urlParams = this.options.addAllToCartUrl,
115+
separator = urlParams.action.indexOf('?') >= 0 ? '&' : '?';
116+
117+
this.element.find(this.options.qtySelector).each(function (index, element) {
118+
urlParams.action += separator + $(element).prop('name') + '=' + encodeURIComponent($(element).val());
119+
separator = '&';
120+
});
121+
$.mage.dataPost().postData(urlParams);
122+
},
123+
124+
/**
125+
* Toggle comment string.
126+
* @private
127+
* @param {Event} e
128+
*/
129+
_focusComment: function (e) {
130+
var commentInput = e.currentTarget;
131+
132+
if (commentInput.value === '' || commentInput.value === this.options.commentString) {
133+
commentInput.value = commentInput.value === this.options.commentString ?
134+
'' : this.options.commentString;
135+
}
136+
}
137+
});
138+
139+
// Extension for mage.wishlist - Select All checkbox
140+
$.widget('mage.wishlist', $.mage.wishlist, {
141+
options: {
142+
selectAllCheckbox: '#select-all',
143+
parentContainer: '#wishlist-table'
144+
},
145+
146+
/** @inheritdoc */
147+
_create: function () {
148+
var selectAllCheckboxParent, checkboxCount;
149+
150+
this._super();
151+
selectAllCheckboxParent = $(this.options.selectAllCheckbox).parents(this.options.parentContainer);
152+
checkboxCount = selectAllCheckboxParent
153+
.find('input:checkbox:not(' + this.options.selectAllCheckbox + ')').length;
154+
// If Select all checkbox is checked, check all item checkboxes, if unchecked, uncheck all item checkboxes
155+
$(this.options.selectAllCheckbox).on('click', function () {
156+
selectAllCheckboxParent.find('input:checkbox').attr('checked', $(this).is(':checked'));
157+
});
158+
// If all item checkboxes are checked, check select all checkbox,
159+
// if not all item checkboxes are checked, uncheck select all checkbox
160+
selectAllCheckboxParent.on(
161+
'click',
162+
'input:checkbox:not(' + this.options.selectAllCheckbox + ')',
163+
$.proxy(function () {
164+
var checkedCount = selectAllCheckboxParent
165+
.find('input:checkbox:checked:not(' + this.options.selectAllCheckbox + ')').length;
166+
167+
$(this.options.selectAllCheckbox).attr('checked', checkboxCount === checkedCount);
168+
}, this)
169+
);
170+
}
171+
});
172+
// Extension for mage.wishlist info add to cart
173+
$.widget('mage.wishlist', $.mage.wishlist, {
174+
/** @inheritdoc */
175+
_create: function () {
176+
this._super();
177+
178+
if (this.options.infoList) {
179+
this.element.on('addToCart', $.proxy(function (event, context) {
180+
this.element.find('input:checkbox').attr('checked', false);
181+
$(context).closest('tr').find('input:checkbox').attr('checked', true);
182+
this.element.submit();
183+
}, this));
184+
this._checkBoxValidate();
185+
}
186+
},
187+
188+
/**
189+
* validate checkbox selection.
190+
* @private
191+
*/
192+
_checkBoxValidate: function () {
193+
this.element.validation({
194+
submitHandler: $.proxy(function (form) {
195+
if ($(form).find('input:checkbox:checked').length) {
196+
form.submit();
197+
} else {
198+
alert({
199+
content: this.options.checkBoxValidationMessage
200+
});
201+
}
202+
}, this)
203+
});
204+
}
205+
});
206+
207+
// Extension for mage.wishlist - Add Wishlist item to Gift Registry
208+
$.widget('mage.wishlist', $.mage.wishlist, {
209+
options: {
210+
formTmplSelector: '#form-tmpl',
211+
formTmplId: '#wishlist-hidden-form'
212+
},
213+
214+
/** @inheritdoc */
215+
_create: function () {
216+
var _this = this;
217+
218+
this._super();
219+
this.element.on('click', '[data-wishlist-to-giftregistry]', function () {
220+
var json = $(this).data('wishlist-to-giftregistry'),
221+
tmplJson = {
222+
item: json.itemId,
223+
entity: json.entity,
224+
url: json.url
225+
},
226+
html = mageTemplate(_this.options.formTmplSelector, {
227+
data: tmplJson
228+
});
229+
230+
$(html).appendTo('body');
231+
$(_this.options.formTmplId).submit();
232+
});
233+
}
234+
});
235+
236+
return $.mage.wishlist;
237+
});

0 commit comments

Comments
 (0)