Skip to content

Commit

Permalink
Merge pull request #661 from magento-vanilla/MAGETWO-42700
Browse files Browse the repository at this point in the history
[Merchant Beta][Vanilla] Bugfixes
  • Loading branch information
Korshenko, Olexii(okorshenko) committed Oct 1, 2015
2 parents 0c6a9d2 + af758e3 commit 3c06d03
Show file tree
Hide file tree
Showing 3 changed files with 232 additions and 127 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -8,41 +8,41 @@

/** @var $block \Magento\Eav\Block\Adminhtml\Attribute\Edit\Options\Options */
?>
<fieldset class="fieldset">
<fieldset class="fieldset ignore-validate">
<legend class="legend"><span><?php echo __('Manage Options (values of your attribute)') ?></span></legend>
<div id="manage-options-panel">
<table class="admin__control-table">
<thead>
<tr id="attribute-options-table">
<th class="col-draggable"></th>
<th class="col-default control-table-actions-th"><?php echo __('Is Default') ?></th>
<?php
$storelist = $block->getStores();
foreach ($storelist as $_store):
?>
<th><?php echo $_store->getName() ?></th>
<?php endforeach;
$storetotal = count($storelist) + 3;
<tr id="attribute-options-table">
<th class="col-draggable"></th>
<th class="col-default control-table-actions-th"><?php echo __('Is Default') ?></th>
<?php
$storelist = $block->getStores();
foreach ($storelist as $_store):
?>
<th class="col-delete">&nbsp;</th>
</tr>
<th><?php echo $_store->getName() ?></th>
<?php endforeach;
$storetotal = count($storelist) + 3;
?>
<th class="col-delete">&nbsp;</th>
</tr>
</thead>
<tbody data-role="options-container"></tbody>
<tfoot>
<th colspan="<?php echo $storetotal; ?>" class="col-actions-add">
<?php if (!$block->getReadOnly() && !$block->canManageOptionDefaultOnly()):?>
<button id="add_new_option_button" title="<?php echo __('Add Option'); ?>"
<th colspan="<?php echo $storetotal; ?>" class="col-actions-add">
<?php if (!$block->getReadOnly() && !$block->canManageOptionDefaultOnly()):?>
<button id="add_new_option_button" title="<?php echo __('Add Option'); ?>"
type="button" class="action- scalable add">
<span><?php echo __('Add Option'); ?></span>
</button>
<?php endif; ?>
</th>
<span><?php echo __('Add Option'); ?></span>
</button>
<?php endif; ?>
</th>
</tfoot>
</table>
<input type="hidden" id="option-count-check" value="" />
</div>
<script id="row-template" type="text/x-magento-template">
<tr>
<tr>
<td class="col-draggable">
<?php if (!$block->getReadOnly() && !$block->canManageOptionDefaultOnly()): ?>
<div data-role="draggable-handle" class="draggable-handle" title="<?php echo __('Sort Option'); ?>"></div>
Expand All @@ -53,124 +53,35 @@
<input class="input-radio" type="<%- data.intype %>" name="default[]" value="<%- data.id %>" <%- data.checked %><?php if ($block->getReadOnly()):?>disabled="disabled"<?php endif;?>/>
</td>
<?php foreach ($block->getStores() as $_store): ?>
<td class="col-<%- data.id %>"><input name="option[value][<%- data.id %>][<?php echo $_store->getId() ?>]" value="<%- data.store<?php echo $_store->getId() ?> %>" class="input-text<?php if ($_store->getId() == \Magento\Store\Model\Store::DEFAULT_STORE_ID): ?> required-option<?php endif; ?>" type="text" <?php if ($block->getReadOnly() || $block->canManageOptionDefaultOnly()):?> disabled="disabled"<?php endif;?>/></td>
<td class="col-<%- data.id %>"><input name="option[value][<%- data.id %>][<?php echo $_store->getId() ?>]" value="<%- data.store<?php echo $_store->getId() ?> %>" class="input-text<?php if ($_store->getId() == \Magento\Store\Model\Store::DEFAULT_STORE_ID): ?> required-option<?php endif; ?>" type="text" <?php if ($block->getReadOnly() || $block->canManageOptionDefaultOnly()):?> disabled="disabled"<?php endif;?>/></td>
<?php endforeach; ?>
<td id="delete_button_container_<%- data.id %>" class="col-delete">
<input type="hidden" class="delete-flag" name="option[delete][<%- data.id %>]" value="" />
<?php if (!$block->getReadOnly() && !$block->canManageOptionDefaultOnly()):?>
<button id="delete_button_<%- data.id %>" title="<?php echo __('Delete') ?>" type="button"
class="action- scalable delete delete-option"
class="action- scalable delete delete-option"
>
<span><?php echo __('Delete') ?></span>
</button>
<?php endif;?>
</td>
</tr>
</script>
<script>
require([
'jquery',
'mage/template',
'jquery/ui',
'prototype'
], function(jQuery, mageTemplate){

var optionDefaultInputType = 'radio';

var attributeOption = {
table: $('attribute-options-table'),
itemCount: 0,
totalItems: 0,
isReadOnly: <?php echo (int)$block->getReadOnly(); ?>,
add: function(data) {
this.template = mageTemplate('#row-template');
var isNewOption = false;
if (typeof data.id == 'undefined') {
data = {
'id': 'option_' + this.itemCount,
'sort_order': this.itemCount + 1
};
isNewOption = true;
}
if (!data.intype) {
data.intype = optionDefaultInputType;
}

Element.insert($$('[data-role=options-container]')[0], this.template({data: data}));
if (isNewOption && !this.isReadOnly) {
this.enableNewOptionDeleteButton(data.id);
}
this.itemCount++;
this.totalItems++;
this.updateItemsCountField();
},
remove: function(event) {
var element = $(Event.findElement(event, 'tr')); // !!! Button already have table parent in safari
// Safari workaround
element.ancestors().each(function(parentItem) {
if (parentItem.hasClassName('option-row')) {
element = parentItem;
throw $break;
} else if (parentItem.hasClassName('box')) {
throw $break;
<?php
$values = [];
foreach($block->getOptionValues() as $value) {
array_push($values, $value->getData());
}
?>
<script type="text/x-magento-init">
{
"*": {
"Magento_Catalog/js/options": {
"attributesData": <?php /* @escapeNotVerified */ echo json_encode($values); ?>,
"isSortable": <?php echo (int)(!$block->getReadOnly() && !$block->canManageOptionDefaultOnly()) ?>,
"isReadOnly": <?php echo (int)$block->getReadOnly(); ?>
}
});

if (element) {
var elementFlags = element.getElementsByClassName('delete-flag');
if (elementFlags[0]) {
elementFlags[0].value = 1;
}

element.addClassName('no-display');
element.addClassName('template');
element.hide();
this.totalItems--;
this.updateItemsCountField();
}
},
updateItemsCountField: function() {
$('option-count-check').value = this.totalItems > 0 ? '1' : '';
},
enableNewOptionDeleteButton: function(id) {
$$('#delete_button_container_' + id + ' button').each(function(button) {
button.enable();
button.removeClassName('disabled');
});
},
};

if ($('add_new_option_button')) {
Event.observe('add_new_option_button', 'click', attributeOption.add.bind(attributeOption));
}

$('manage-options-panel').on('click', '.delete-option', function(event, element) {
attributeOption.remove(event);
});

<?php foreach ($block->getOptionValues() as $_value): ?>
attributeOption.add(<?php echo $_value->toJson() ?>);
<?php endforeach; ?>
<?php if (!$block->getReadOnly() && !$block->canManageOptionDefaultOnly()):?>
jQuery(function($) {
$('[data-role=options-container]').sortable({
distance: 8,
tolerance: "pointer",
cancel: 'input, button',
axis: 'y',
update: function() {
$('[data-role=options-container] [data-role=order]').each(function(index, element) {
$(element).val(index + 1);
});
}
});
});
<?php endif; ?>

window.attributeOption = attributeOption;
window.optionDefaultInputType = optionDefaultInputType;
//]]>

});
</script>
}
</script>
</fieldset>
168 changes: 168 additions & 0 deletions app/code/Magento/Catalog/view/adminhtml/web/js/options.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,168 @@
/**
* Copyright © 2015 Magento. All rights reserved.
* See COPYING.txt for license details.
*/

/* eslint-disable no-undef */
// jscs:disable jsDoc

define([
'jquery',
'mage/template',
'uiRegistry',
'jquery/ui',
'prototype'
], function (jQuery, mageTemplate, rg) {
'use strict';

return function (config) {
var optionDefaultInputType = 'radio',
attributeOption = {
table: $('attribute-options-table'),
itemCount: 0,
totalItems: 0,
rendered: 0,
template: mageTemplate('#row-template'),
isReadOnly: config.idReadOnly,
add: function (data, render) {
var isNewOption = false,
element;

if (typeof data.id == 'undefined') {
data = {
'id': 'option_' + this.itemCount,
'sort_order': this.itemCount + 1
};
isNewOption = true;
}

if (!data.intype) {
data.intype = optionDefaultInputType;
}
element = this.template({
data: data
});

if (isNewOption && !this.isReadOnly) {
this.enableNewOptionDeleteButton(data.id);
}
this.itemCount++;
this.totalItems++;
this.elements += element;

if (render) {
this.render();
}
},
remove: function (event) {
var element = $(Event.findElement(event, 'tr')),
elementFlags; // !!! Button already have table parent in safari

// Safari workaround
element.ancestors().each(function (parentItem) {
if (parentItem.hasClassName('option-row')) {
element = parentItem;
throw $break;
} else if (parentItem.hasClassName('box')) {
throw $break;
}
});

if (element) {
elementFlags = element.getElementsByClassName('delete-flag');

if (elementFlags[0]) {
elementFlags[0].value = 1;
}

element.addClassName('no-display');
element.addClassName('template');
element.hide();
this.totalItems--;
this.updateItemsCountField();
}
},
updateItemsCountField: function () {
$('option-count-check').value = this.totalItems > 0 ? '1' : '';
},
enableNewOptionDeleteButton: function (id) {
$$('#delete_button_container_' + id + ' button').each(function (button) {
button.enable();
button.removeClassName('disabled');
});
},
bindRemoveButtons: function () {
jQuery('#swatch-visual-options-panel').on('click', '.delete-option', this.remove.bind(this));
},
render: function () {
Element.insert($$('[data-role=options-container]')[0], this.elements);
this.elements = '';
},
renderWithDelay: function (data, from, step, delay) {
var arrayLength = data.length,
len;

for (len = from + step; from < len && from < arrayLength; from++) {
this.add(data[from]);
}
this.render();

if (from === arrayLength) {
this.updateItemsCountField();
this.rendered = 1;
jQuery('body').trigger('processStop');

return true;
}
setTimeout(this.renderWithDelay.bind(this, data, from, step, delay), delay);
},
ignoreValidate: function () {
var ignore = '.ignore-validate input, ' +
'.ignore-validate select, ' +
'.ignore-validate textarea';

jQuery('#edit_form').data('validator').settings.forceIgnore = ignore;
}
};

if ($('add_new_option_button')) {
Event.observe('add_new_option_button', 'click', attributeOption.add.bind(attributeOption, {}, true));
}

$('manage-options-panel').on('click', '.delete-option', function (event) {
attributeOption.remove(event);
});

jQuery('#manage-options-panel').on('render', function () {
attributeOption.ignoreValidate();

if (attributeOption.rendered) {
return false;
}
jQuery('body').trigger('processStart');
attributeOption.renderWithDelay(config.attributesData, 0, 100, 300);
attributeOption.bindRemoveButtons();
});

if (config.isSortable) {
jQuery(function ($) {
$('[data-role=options-container]').sortable({
distance: 8,
tolerance: 'pointer',
cancel: 'input, button',
axis: 'y',
update: function () {
$('[data-role=options-container] [data-role=order]').each(function (index, element) {
$(element).val(index + 1);
});
}
});
});
}

window.attributeOption = attributeOption;
window.optionDefaultInputType = optionDefaultInputType;

rg.set('manage-options-panel', attributeOption);
};
});
Loading

0 comments on commit 3c06d03

Please sign in to comment.