Skip to content

Commit 2825f2a

Browse files
author
Natalia Momotenko
committed
MAGETWO-25662: MAP on Catalog and Product Pages
- Merge remote-tracking branch 'origin/MAGETWO-25662' into UI Conflicts: app/code/Magento/Msrp/view/base/templates/product/price/msrp.phtml
2 parents 32ee51e + ece7e14 commit 2825f2a

File tree

17 files changed

+556
-244
lines changed

17 files changed

+556
-244
lines changed

‎app/code/Magento/Msrp/view/base/templates/product/price/msrp.phtml

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ if ($product->isSaleable()) {
4646
}
4747
?>
4848
<?php if ($product->getMsrp()): ?>
49-
<span class="old-price msrp-price-wrapper"><?php echo $msrpPrice ?></span>
49+
<span class="old-price map-old-price msrp-price-wrapper"><?php echo $msrpPrice ?></span>
5050
<?php endif; ?>
5151

5252
<?php if ($priceType->isShowPriceOnGesture()): ?>
@@ -72,10 +72,11 @@ if ($product->isSaleable()) {
7272
<span id="<?php echo $block->getPriceId() ? $block->getPriceId() : $priceElementId ?>" style="display:none"></span>
7373
<a href="#"
7474
id="<?php echo($popupId);?>"
75+
class="action map-show-info"
7576
data-mage-init="<?=$block->escapeHtml($this->helper('Magento\Framework\Json\Helper\Data')->jsonEncode($data))?>"><?php echo __('Click for price'); ?>
7677
</a>
7778
<?php else: ?>
78-
<span class="msrp message">
79+
<span class="msrp-message">
7980
<?php echo $priceType->getMsrpPriceMessage() ?>
8081
</span>
8182
<?php endif; ?>
@@ -84,7 +85,7 @@ if ($product->isSaleable()) {
8485
<?php $helpLinkId = 'msrp-help-' . $productId . $block->getRandomString(20); ?>
8586
<a href="#"
8687
id="<?php echo $helpLinkId;?>"
87-
class="action show map"
88+
class="action map-show-info"
8889
data-mage-init='{"addToCart":{"helpLinkId": "#<?php echo $helpLinkId;?>",
8990
"productName": "<?php echo $product->getName() ?>",
9091
"closeButtonId": "#map-popup-close"}}'><span><?php echo __("What's this?"); ?></span>

‎app/code/Magento/Msrp/view/base/web/js/msrp.js

Lines changed: 123 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -2,86 +2,171 @@
22
* Copyright © 2015 Magento. All rights reserved.
33
* See COPYING.txt for license details.
44
*/
5-
/*jshint browser:true jquery:true*/
65
define([
7-
"jquery",
8-
"jquery/ui",
9-
"mage/dropdown"
10-
], function($){
6+
'jquery',
7+
'underscore',
8+
'jquery/ui',
9+
'mage/dropdown'
10+
], function ($, _) {
1111
'use strict';
1212

13+
var openDropDown = null;
1314
$.widget('mage.addToCart', {
1415
options: {
1516
showAddToCart: true,
16-
cartForm: '.form.map.checkout'
17+
submitUrl: '',
18+
singleOpenDropDown: true,
19+
dialog: {}, // Options for mage/dropdown
20+
dialogDelay: 500, // Delay in ms after resize dropdown shown again
21+
22+
// Selectors
23+
cartForm: '.form.map.checkout',
24+
cartButtonId: '', // better to be cartButton
25+
popupId: '', // better to be popup
26+
realPrice: '',
27+
msrpPrice: '',
28+
helpLinkId: '', // better to be helpLink
29+
addToCartButton: '',
30+
31+
// Text options
32+
productName: '',
33+
addToCartUrl: ''
1734
},
1835

19-
_create: function() {
20-
$(this.options.cartButtonId).on('click', $.proxy(function() {
21-
this._addToCartSubmit();
22-
}, this));
36+
openDropDown: null,
37+
38+
/**
39+
* Creates widget instance
40+
* @private
41+
*/
42+
_create: function () {
43+
$(this.options.cartButtonId).on('click', this._addToCartSubmit.bind(this));
44+
45+
$(this.options.popupId).on('click', function (event) {
46+
var dialog;
47+
event.preventDefault();
2348

24-
$(this.options.popupId).on('click', $.proxy(function(e) {
2549
if (this.options.submitUrl) {
2650
location.href = this.options.submitUrl;
2751
} else {
28-
$(this.options.popupCartButtonId).off('click');
29-
$(this.options.popupCartButtonId).on('click', $.proxy(function() {
30-
this._addToCartSubmit();
31-
}, this));
52+
$(this.options.popupCartButtonId)
53+
.off('click')
54+
.on('click', this._addToCartSubmit.bind(this));
3255
$('#map-popup-heading-price').text(this.options.productName);
33-
$('#map-popup-price').html($(this.options.realPrice));
56+
$('#map-popup-price').html($(this.options.realPrice).html().trim());
3457
$('#map-popup-msrp > span.price').html(this.options.msrpPrice);
58+
3559
this.element.trigger('reloadPrice');
36-
var dialog = $("#map-popup-click-for-price");
60+
61+
dialog = $('#map-popup-click-for-price');
3762
this._popupDialog(dialog, this.options.popupId);
63+
3864
if (this.options.addToCartUrl) {
3965
$(this.options.cartForm).attr('action', this.options.addToCartUrl);
4066
}
67+
4168
if (!this.options.showAddToCart) {
4269
$('#product_addtocart_form_from_popup').hide();
4370
}
71+
4472
return false;
4573
}
46-
}, this));
74+
}.bind(this));
4775

48-
$(this.options.helpLinkId).on('click', $.proxy(function(e) {
76+
$(this.options.helpLinkId).on('click', function () {
4977
$('#map-popup-heading-what-this').text(this.options.productName);
50-
var dialog = $("#map-popup-what-this");
51-
this._popupDialog(dialog, this.options.helpLinkId);
78+
this._popupDialog($('#map-popup-what-this'), this.options.helpLinkId);
79+
5280
return false;
53-
}, this));
81+
}.bind(this));
5482
},
5583

56-
_popupDialog: function(target, trigger) {
57-
if (!target.hasClass('ui-dialog-content')) {
58-
target.dropdownDialog({
59-
appendTo: ".column.main",
60-
dialogContentClass: 'active',
61-
timeout: "2000",
62-
autoPosition: true,
63-
"dialogClass": "popup"
64-
});
84+
/**
85+
* Handler for dialog popup
86+
* @param {jQuery} elementTarget
87+
* @param {jQuery} elementTrigger
88+
* @private
89+
*/
90+
_popupDialog: function (elementTarget, elementTrigger) {
91+
var target = $(elementTarget),
92+
trigger = $(elementTrigger),
93+
counter = 0,
94+
triggerClass = 'dropdown-active',
95+
options;
96+
97+
options = {
98+
appendTo: 'body',
99+
dialogContentClass: 'active',
100+
closeOnMouseLeave: false,
101+
autoPosition: true,
102+
'dialogClass': 'popup map-popup-wrapper',
103+
position: {
104+
my: 'left top',
105+
collision: 'fit none',
106+
at: 'left bottom',
107+
within: 'body',
108+
of: trigger
109+
},
110+
shadowHinter: 'popup popup-pointer'
111+
};
112+
options = _.extend(options, this.options.dialog);
113+
114+
if (openDropDown && openDropDown.is(':data(mage-dropdownDialog)')) {
115+
openDropDown.dropdownDialog('close');
65116
}
66-
$('.mage-dropdown-dialog > .ui-dialog-content').dropdownDialog("close");
67-
target.dropdownDialog("option", "position", {my: "right+50% top", collision: "none", at: "center bottom", of: trigger});
68-
target.dropdownDialog("option", "triggerTarget", trigger);
69-
target.dropdownDialog("open");
70117

118+
if (this.options.singleOpenDropDown) {
119+
this.openDropDown = openDropDown;
120+
}
121+
openDropDown = target
122+
.dropdownDialog(options)
123+
.off('dropdowndialogclose')
124+
.on('dropdowndialogclose', function () {
125+
if (!counter) {
126+
openDropDown = null;
127+
$(window).off('resize');
128+
}
129+
trigger.removeClass(triggerClass);
130+
})
131+
.on('dropdowndialogopen', function () {
132+
trigger.addClass(triggerClass);
133+
})
134+
.dropdownDialog('open');
135+
136+
$(window)
137+
.resize(_.debounce(function () {
138+
if (openDropDown) {
139+
counter--;
140+
openDropDown.dropdownDialog('open');
141+
}
142+
}, this.options.dialogDelay))
143+
.resize(_.debounce(function () {
144+
if (openDropDown) {
145+
counter++;
146+
openDropDown.dropdownDialog('close');
147+
}
148+
}, this.options.dialogDelay, true));
71149
},
72150

73-
_addToCartSubmit: function() {
151+
/**
152+
* Handler for addToCart action
153+
* @private
154+
*/
155+
_addToCartSubmit: function () {
74156
this.element.trigger('addToCart', this.element);
157+
75158
if (this.options.addToCartButton) {
76159
$(this.options.addToCartButton).click();
160+
77161
return;
78162
}
163+
79164
if (this.options.addToCartUrl) {
80-
$('.mage-dropdown-dialog > .ui-dialog-content').dropdownDialog("close");
165+
$('.mage-dropdown-dialog > .ui-dialog-content').dropdownDialog('close');
81166
}
82167
$(this.options.cartForm).submit();
83168
}
84169
});
85-
170+
86171
return $.mage.addToCart;
87172
});

‎app/code/Magento/Msrp/view/frontend/templates/popup.phtml

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -11,48 +11,50 @@
1111
/** @var \Magento\Msrp\Block\Popup $block */
1212
?>
1313
<?php if ($block->isEnabled()): ?>
14-
<div id="map-popup-click-for-price" class="map popup">
14+
<div id="map-popup-click-for-price" class="map-popup">
1515
<div class="popup-header">
1616
<strong class="title" id="map-popup-heading-price"></strong>
1717
</div>
1818
<div class="popup-content">
19-
<div class="map add form" id="map-popup-content">
19+
<div class="map-info-price" id="map-popup-content">
2020
<div class="price-box">
21-
<div class="map msrp" id="map-popup-msrp-box">
21+
<div class="map-msrp" id="map-popup-msrp-box">
2222
<span class="label"><?php echo __('Price'); ?></span>
23-
<span class="old-price" id="map-popup-msrp">
23+
<span class="old-price map-old-price" id="map-popup-msrp">
2424
<span class="price"></span>
2525
</span>
2626
</div>
27-
<div class="map price" id="map-popup-price-box">
27+
<div class="map-price" id="map-popup-price-box">
2828
<span class="label"><?php echo __('Actual Price'); ?></span>
2929
<span id="map-popup-price" class="actual-price"></span>
3030
</div>
3131
</div>
32-
<form action="" method="POST" id="product_addtocart_form_from_popup" class="form map checkout">
32+
<form action="" method="POST" id="product_addtocart_form_from_popup" class="map-form-addtocart">
3333
<input type="hidden" name="product" class="product_id" value="" id="map-popup-product-id"/>
3434

3535
<div class="additional-addtocart-box">
3636
<?php echo $block->getChildHtml(); ?>
3737
</div>
38-
<button type="button" title="<?php echo __('Add to Cart') ?>" class="action tocart"
38+
<button type="button"
39+
title="<?php echo $block->escapeHtml(__('Add to Cart')); ?>"
40+
class="action tocart primary"
3941
id="map-popup-button">
40-
<span><?php echo __('Add to Cart') ?></span>
42+
<span><?php echo __('Add to Cart'); ?></span>
4143
</button>
4244
</form>
4345
</div>
44-
<div class="map text" id="map-popup-text">
46+
<div class="map-text" id="map-popup-text">
4547
<?php echo $block->getExplanationMessage(); ?>
4648
</div>
4749
</div>
4850
</div>
4951

50-
<div id="map-popup-what-this" class="map popup">
51-
<div class="popup header">
52+
<div id="map-popup-what-this" class="map-popup">
53+
<div class="popup-header">
5254
<strong class="title" id="map-popup-heading-what-this"></strong>
5355
</div>
54-
<div class="popup content">
55-
<div class="map help text" id="map-popup-text-what-this">
56+
<div class="popup-content">
57+
<div class="map-help-text" id="map-popup-text-what-this">
5658
<?php echo $block->getExplanationMessageWhatsThis(); ?>
5759
</div>
5860
</div>

‎app/code/Magento/Msrp/view/frontend/templates/render/item/price_msrp_item.phtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
<div class="price-box msrp">
3030
<?php if ($_product->getMsrp()): ?>
3131
<?php $_msrpPrice = $pricingHelper->currency($_product->getMsrp(), true, false) ?>
32-
<span class="old-price" ><?php echo $_msrpPrice ?></span>
32+
<span class="old-price"><?php echo $_msrpPrice ?></span>
3333
<?php endif; ?>
3434
<?php if ($_catalogHelper->isShowPriceOnGesture($_product)): ?>
3535
<?php $priceElementId = 'product-price-' . $_id . $block->getIdSuffix(); ?>
@@ -46,7 +46,7 @@
4646
"cartForm": "#wishlist-view-form"}}'><?php echo __('Click for price') ?>
4747
</a>
4848
<?php else: ?>
49-
<span class="msrp message">
49+
<span class="msrp-message">
5050
<?php echo $_catalogHelper->getMsrpPriceMessage($_product) ?>
5151
</span>
5252
<?php endif; ?>

‎app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_module.less

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -335,7 +335,6 @@
335335
}
336336
.price-box {
337337
display: block;
338-
font-weight: @font-weight__semibold;
339338
margin: 7px 0;
340339
}
341340
.text {
@@ -541,38 +540,6 @@
541540

542541
& when (@media-common = true) {
543542

544-
//
545-
// Minimum Advertising Price
546-
//--------------------------------------
547-
.map.popup {
548-
.popup(
549-
@_popup-margin-top: @indent__s,
550-
@_popup-margin-left: false,
551-
@_popup-content-margin: 10px 0 0,
552-
@_popup-position-top: false,
553-
@_popup-position-left: false,
554-
@_popup-position: absolute
555-
);
556-
.ui-dialog & {
557-
padding: 22px;
558-
}
559-
.map.add.form {
560-
&:extend(.abs-add-clearfix all);
561-
margin-bottom: 15px;
562-
.price-box {
563-
float: left;
564-
.label {
565-
&:after {
566-
content: ": ";
567-
}
568-
}
569-
}
570-
}
571-
.form.map.checkout {
572-
float: right;
573-
}
574-
}
575-
576543
//
577544
// Compare Products Page
578545
//--------------------------------------

‎app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/_minicart.less

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -160,10 +160,6 @@
160160
float: left;
161161
}
162162
&-item-name {
163-
display: block;
164-
max-width: 100%;
165-
overflow: hidden;
166-
text-overflow: ellipsis;
167163
font-weight: @font-weight__regular;
168164
margin-top: 0;
169165
a {

0 commit comments

Comments
 (0)