12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364 |
- /**
- * Copyright © Magento, Inc. All rights reserved.
- * See COPYING.txt for license details.
- */
- define([
- 'jquery',
- 'jquery/ui'
- ], function ($) {
- 'use strict';
- $.widget('mage.giftMessage', {
- options: {
- rowPrefix: '#order-item-row-', // Selector prefix for item's row in the table.
- linkPrefix: '#order-item-gift-message-link-', // Selector prefix for the 'Gift Message' link.
- duration: 100, // Toggle duration.
- expandedClass: 'expanded', // Class added/removed to/from the 'Gift Message' link.
- expandedContentClass: 'expanded-content', // Class added/removed to/from the 'Gift Message' content.
- lastClass: 'last' // Class added/removed to/from the last item's row in the products table.
- },
- /**
- * Bind a click handler on the widget's element to toggle the gift message.
- * @private
- */
- _create: function () {
- this.element.on('click', $.proxy(this._toggleGiftMessage, this));
- },
- /**
- * Toggle the display of the item's corresponding gift message.
- * @private
- * @param {jQuery.Event} event - Click event.
- */
- _toggleGiftMessage: function (event) {
- var element = $(event.target), // Click target. The 'Gift Message' link or 'Close' button.
- options = this.options, // Cached widget options.
- itemId = element.data('item-id'), // The individual item's numeric id.
- link = $(options.linkPrefix + itemId), // The 'Gift Message' expandable link.
- row = $(options.rowPrefix + itemId), // The item's row in the products table.
- region = $('#' + element.attr('aria-controls')); // The gift message container region.
- region.toggleClass(options.expandedContentClass, options.duration, function () {
- if (region.attr('aria-expanded') === 'true') {
- region.attr('aria-expanded', 'false');
- if (region.hasClass(options.lastClass)) {
- row.addClass(options.lastClass);
- }
- } else {
- region.attr('aria-expanded', 'true');
- if (region.hasClass(options.lastClass)) {
- row.removeClass(options.lastClass);
- }
- }
- link.toggleClass(options.expandedClass);
- });
- event.preventDefault(); // Prevent event propagation and avoid going to the link's href.
- }
- });
- return $.mage.giftMessage;
- });
|