website/modules/contrib/webform/js/webform.element.details.savedfb4.js
2023-09-30 09:40:37 +02:00

126 lines
3.3 KiB
JavaScript

/**
* @file
* JavaScript behaviors for details element.
*/
(function ($, Drupal) {
'use strict';
// Determine if local storage exists and is enabled.
// This approach is copied from Modernizr.
// @see https://github.com/Modernizr/Modernizr/blob/c56fb8b09515f629806ca44742932902ac145302/modernizr.js#L696-731
var hasLocalStorage = (function () {
try {
localStorage.setItem('webform', 'webform');
localStorage.removeItem('webform');
return true;
}
catch (e) {
return false;
}
}());
/**
* Attach handler to save details open/close state.
*
* @type {Drupal~behavior}
*/
Drupal.behaviors.webformDetailsSave = {
attach: function (context) {
if (!hasLocalStorage) {
return;
}
// Summary click event handler.
$('details > summary', context).once('webform-details-summary-save').on('click', function () {
var $details = $(this).parent();
// @see https://css-tricks.com/snippets/jquery/make-an-jquery-hasattr/
if ($details[0].hasAttribute('data-webform-details-nosave')) {
return;
}
var name = Drupal.webformDetailsSaveGetName($details);
if (!name) {
return;
}
var open = ($details.attr('open') !== 'open') ? '1' : '0';
localStorage.setItem(name, open);
});
// Initialize details open state via local storage.
$('details', context).once('webform-details-save').each(function () {
var $details = $(this);
var name = Drupal.webformDetailsSaveGetName($details);
if (!name) {
return;
}
var open = localStorage.getItem(name);
if (open === null) {
return;
}
if (open === '1') {
$details.attr('open', 'open');
}
else {
$details.removeAttr('open');
}
});
}
};
/**
* Get the name used to store the state of details element.
*
* @param {jQuery} $details
* A details element.
*
* @return {string}
* The name used to store the state of details element.
*/
Drupal.webformDetailsSaveGetName = function ($details) {
if (!hasLocalStorage) {
return '';
}
// Ignore details that are vertical tabs pane.
if ($details.hasClass('vertical-tabs__pane')) {
return '';
}
// Any details element not included a webform must have define its own id.
var webformId = $details.attr('data-webform-element-id');
if (webformId) {
return 'Drupal.webform.' + webformId.replace('--', '.');
}
var detailsId = $details.attr('id');
if (!detailsId) {
return '';
}
var $form = $details.parents('form');
if (!$form.length || !$form.attr('id')) {
return '';
}
var formId = $form.attr('id');
if (!formId) {
return '';
}
// ISSUE: When Drupal renders a webform in a modal dialog it appends a unique
// identifier to webform ids and details ids. (i.e. my-form--FeSFISegTUI)
// WORKAROUND: Remove the unique id that delimited using double dashes.
formId = formId.replace(/--.+?$/, '').replace(/-/g, '_');
detailsId = detailsId.replace(/--.+?$/, '').replace(/-/g, '_');
return 'Drupal.webform.' + formId + '.' + detailsId;
};
})(jQuery, Drupal);