Skip to content

J
joshine
Commit 49102ee5 by halweg
Options

size

parent 1731419d
Showing with 180 additions and 44 deletions
app/code/Magento/Swatches/view/frontend/templates/product/view/renderer.phtml
...@@ -20,7 +20,8 @@ $configurableViewModel = $block->getConfigurableViewModel() ...@@ -20,7 +20,8 @@ $configurableViewModel = $block->getConfigurableViewModel()
"mediaCallback": "<?= $block->escapeJs($block->escapeUrl($block->getMediaCallback())) ?>", "mediaCallback": "<?= $block->escapeJs($block->escapeUrl($block->getMediaCallback())) ?>",
"gallerySwitchStrategy": "<?= $block->escapeJs($block->getVar('gallery_switch_strategy', 'Magento_ConfigurableProduct')) ?: 'replace'; ?>", "gallerySwitchStrategy": "<?= $block->escapeJs($block->getVar('gallery_switch_strategy', 'Magento_ConfigurableProduct')) ?: 'replace'; ?>",
"jsonSwatchImageSizeConfig": <?= /* @noEscape */ $block->getJsonSwatchSizeConfig() ?>, "jsonSwatchImageSizeConfig": <?= /* @noEscape */ $block->getJsonSwatchSizeConfig() ?>,
"showTooltip": <?= $block->escapeJs($configurableViewModel->getShowSwatchTooltip()) ?> "showTooltip": <?= $block->escapeJs($configurableViewModel->getShowSwatchTooltip()) ?>,
"sizeChartData": <?= \Magepow\Sizechart\Block\Product\Sizechart::getChartJson() ?>
} }
}, },
"*" : { "*" : {
......
app/code/Magepow/Sizechart/Block/Product/Sizechart.php
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
namespace Magepow\Sizechart\Block\Product; namespace Magepow\Sizechart\Block\Product;
use Magento\Store\Model\ScopeInterface;
class Sizechart extends \Magento\Catalog\Block\Product\AbstractProduct class Sizechart extends \Magento\Catalog\Block\Product\AbstractProduct
{ {
...@@ -113,4 +114,26 @@ class Sizechart extends \Magento\Catalog\Block\Product\AbstractProduct ...@@ -113,4 +114,26 @@ class Sizechart extends \Magento\Catalog\Block\Product\AbstractProduct
if ($img) return $urlMedia . "magepow/sizechart/" . $img; if ($img) return $urlMedia . "magepow/sizechart/" . $img;
return $urlMedia; return $urlMedia;
} }
public function isEnabled()
{
return $this->_scopeConfig
->getValue(
'magepow_sizechart/general/enabled',
ScopeInterface::SCOPE_STORE
);
}
static public function getChartJson()
{
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$chartBlock = $objectManager->create(\Magepow\Sizechart\Block\Product\Sizechart::class);
$sizeChart = $chartBlock->getSizeChart();
$chartTableArray = [];
if ($sizeChart != null) {
$chartTable = $sizeChart->getData('custom_size');
$chartTableArray = json_encode($chartTable, true);
}
return $chartTableArray;
}
} }
\ No newline at end of file
app/code/Magepow/Sizechart/Cron/Cron.php deleted 100644 → 0
<?php
namespace Magepow\Sizechart\Cron;
class FlushCache
{
protected $helperCache;
public function __construct(
\Magepow\Sizechart\Helper\Cache $helperCache
) {
$this->helperCache = $helperCache;
}
public function flushCache()
{
$this->helperCache->flushCache();
}
}
\ No newline at end of file
app/code/Magepow/Sizechart/etc/crontab.xml deleted 100644 → 0
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Cron:etc/crontab.xsd">
<group id="default">
<job name="magepow_sizechart" instance="Magepow\Sizechart\Model\Cron" method="flushCache">
<schedule>*/2 * * * *</schedule>
</job>
</group>
</config>
\ No newline at end of file
app/code/Magepow/Sizechart/etc/frontend/routes.xml deleted 100644 → 0
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
<router id="standard">
<route id="sizechart" frontName="sizechart">
<module name="Magepow_Sizechart"/>
</route>
</router>
</config>
\ No newline at end of file
app/design/frontend/Joshine/breeze/Magento_Catalog/templates/product/view/addtocart.phtml
...@@ -321,7 +321,7 @@ ...@@ -321,7 +321,7 @@
</ul> </ul>
<div class="area-content"> <div class="area-content">
<div id="size-chart" style="display: none;"> <div id="size-chart" style="display: none;">
<?php if (count($chartTableArray) > 1): ?> <?php if ($chartBlock->isEnabled() && (count($chartTableArray) > 1)): ?>
<div id="chart-details"> <div id="chart-details">
<div class="chart-size-switch "> <div class="chart-size-switch ">
<input type="hidden" value=""> <input type="hidden" value="">
...@@ -348,7 +348,7 @@ ...@@ -348,7 +348,7 @@
?> ?>
<div style="display: table-row" class="tr"> <div style="display: table-row" class="tr">
<?php foreach ($body as $key2 => $item): ?> <?php foreach ($body as $key2 => $item): ?>
<div style="display: table-cell" class="td" <?php if($key2 != 0) { echo 'class=size-item'; } ?> data-size-item-cm="<?= $item ?>"><?= $item ?> </div> <div style="display: table-cell" class="td <?php if($key2 != 0) { echo 'size-item'; } ?> " data-size-item-cm="<?= $item ?>"><?= $item ?> </div>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
<?php endforeach; ?> <?php endforeach; ?>
......
app/design/frontend/Joshine/breeze/Magento_Swatches/web/js/swatch-renderer.js
...@@ -395,6 +395,149 @@ define([ ...@@ -395,6 +395,149 @@ define([
}; };
}, },
_getSizeChartData: function (item, value) {
var chartData = this.options.sizeChartData;
chartData = JSON.parse(chartData);
var len = chartData.length
var currentItem = [];
for (let i = 0; i < len; i++) {
var current = chartData[i];
if (value.toLowerCase() == current[0].toLowerCase()) {
currentItem = chartData[i];
break;
}
}
if (currentItem.length == 0) {
return '';
}
var option = chartData[0];
let label = '';
var labelLen = currentItem.length
for (let i = 0; i < labelLen; i++) {
if (i == 0) {
label += currentItem[i]+" : ";
continue;
}
label += option[i] + currentItem[i] +"(cm)";
if (i < labelLen - 1) {
label +=", ";
}
}
return label;
},
_RenderSwatchWithCustomerOptions: function (config, controlId) {
var optionConfig = this.options.jsonSwatchConfig[config.id],
optionClass = this.options.classes.optionClass,
sizeConfig = this.options.jsonSwatchImageSizeConfig,
moreLimit = parseInt(this.options.numberToShow, 10),
moreClass = this.options.classes.moreButton,
moreText = this.options.moreButtonText,
countAttributes = 0,
$widget = this,
html = '';
if (!this.options.jsonSwatchConfig.hasOwnProperty(config.id)) {
return '';
}
$.each(config.options, function (index) {
var id,
type,
value,
thumb,
label,
width,
height,
attr,
swatchImageWidth,
swatchImageHeight;
if (!optionConfig.hasOwnProperty(this.id)) {
return '';
}
// Add more button
if (moreLimit === countAttributes++) {
html += '<a href="#" class="' + moreClass + '"><span>' + moreText + '</span></a>';
}
id = this.id;
type = parseInt(optionConfig[id].type, 10);
value = optionConfig[id].hasOwnProperty('value') ?
$('<i></i>').text(optionConfig[id].value).html() : '';
thumb = optionConfig[id].hasOwnProperty('thumb') ? optionConfig[id].thumb : '';
width = _.has(sizeConfig, 'swatchThumb') ? sizeConfig.swatchThumb.width : 110;
height = _.has(sizeConfig, 'swatchThumb') ? sizeConfig.swatchThumb.height : 90;
label = this.label ? $('<i></i>').text(this.label).html() : '';
label = $widget._getSizeChartData($(this), optionConfig[id].value);
attr =
' id="' + controlId + '-item-' + id + '"' +
' index="' + index + '"';
if(index == 0)
{
attr += ' aria-checked="true"';
}
else {
attr += ' aria-checked="false"';
}
attr += ' aria-describedby="' + controlId + '"' +
' tabindex="0"' +
' data-option-type="' + type + '"' +
' data-option-id="' + id + '"' +
' data-option-label="' + label + '"' +
' aria-label="' + label + '"' +
' role="option"' +
' data-thumb-width="' + width + '"' +
' data-thumb-height="' + height + '"';
attr += thumb !== '' ? ' data-option-tooltip-thumb="' + thumb + '"' : '';
attr += value !== '' ? ' data-option-tooltip-value="' + value + '"' : '';
swatchImageWidth = _.has(sizeConfig, 'swatchImage') ? sizeConfig.swatchImage.width : 30;
swatchImageHeight = _.has(sizeConfig, 'swatchImage') ? sizeConfig.swatchImage.height : 20;
if (!this.hasOwnProperty('products') || this.products.length <= 0) {
attr += ' data-option-empty="true"';
}
var selectedStr = '';
if(index == 0)
{
selectedStr = ' selected';
}
if (type === 0) {
// Text
html += '<div class="' + optionClass + ' text' + selectedStr + '" ' + attr + '>' + (value ? value : label) +
'</div>';
} else if (type === 1) {
// Color
html += '<div class="' + optionClass + ' color' + selectedStr + '" ' + attr +
' style="background: ' + value +
' no-repeat center; background-size: cover;">' + '' +
'</div>';
} else if (type === 2) {
// Image
html += '<div class="' + optionClass + ' image' + selectedStr + '" ' + attr +
' style="background: url(' + value + ') no-repeat center; background-size: cover;width:' +
swatchImageWidth + 'px; height:' + swatchImageHeight + 'px">' + '' +
'</div>';
} else if (type === 3) {
// Clear
html += '<div class="' + optionClass + selectedStr + '" ' + attr + '></div>';
} else {
// Default
html += '<div class="' + optionClass + selectedStr + '" ' + attr + '>' + label + '</div>';
}
});
return html;
},
/** /**
* Render controls * Render controls
* *
...@@ -406,12 +549,13 @@ define([ ...@@ -406,12 +549,13 @@ define([
classes = this.options.classes, classes = this.options.classes,
chooseText = this.options.jsonConfig.chooseText, chooseText = this.options.jsonConfig.chooseText,
showTooltip = this.options.showTooltip; showTooltip = this.options.showTooltip;
var optionConfig = this.options.jsonSwatchConfig;
var that = this;
$widget.optionsMap = {}; $widget.optionsMap = {};
$.each(this.options.jsonConfig.attributes, function () { $.each(this.options.jsonConfig.attributes, function () {
var item = this, var item = this,
controlLabelId = 'option-label-' + item.code + '-' + item.id, controlLabelId = 'option-label-' + item.code + '-' + item.id,
options = $widget._RenderSwatchOptions(item, controlLabelId),
select = $widget._RenderSwatchSelect(item, chooseText), select = $widget._RenderSwatchSelect(item, chooseText),
areaCheckedId =$widget._RenderSwatchFirstOptionsId(item, controlLabelId), areaCheckedId =$widget._RenderSwatchFirstOptionsId(item, controlLabelId),
CheckedId =$widget._RenderSwatchCheckedOptionsId(item), CheckedId =$widget._RenderSwatchCheckedOptionsId(item),
...@@ -419,6 +563,12 @@ define([ ...@@ -419,6 +563,12 @@ define([
listLabel = '', listLabel = '',
label = ''; label = '';
if (item.code == "size") {
var options = $widget._RenderSwatchWithCustomerOptions(item, controlLabelId);
} else {
var options = $widget._RenderSwatchOptions(item, controlLabelId);
}
// Show only swatch controls // Show only swatch controls
if ($widget.options.onlySwatches && !$widget.options.jsonSwatchConfig.hasOwnProperty(item.id)) { if ($widget.options.onlySwatches && !$widget.options.jsonSwatchConfig.hasOwnProperty(item.id)) {
return; return;
...@@ -452,7 +602,7 @@ define([ ...@@ -452,7 +602,7 @@ define([
// Create new control // Create new control
var sizeContent = '<div class="swatch-attribute-selected-option-size-content" style="display:block;">'+ var sizeContent = '<div class="swatch-attribute-selected-option-size-content" style="display:block;">'+
'<div>'+$.mage.__("Product Size Describe")+ '</div>'+ '<div>'+$.mage.__("Product Size Describe")+ '</div>'+
'<span class="'+classes.attributeSelectedOptionLabelClass + '">'+item.options[0].label+'</span></div>'; '<span class="'+classes.attributeSelectedOptionLabelClass + '">'+that._getSizeChartData(item, optionConfig[137][item.options[0].id].value)+'</span></div>';
container.append( container.append(
'<div class="' + classes.attributeClass + ' ' + item.code + '" ' + '<div class="' + classes.attributeClass + ' ' + item.code + '" ' +
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment