var accuaWidgets = {}; (function($) { accuaWidgets = { init : function() { var rem, sidebars = $('div.widgets-sortables'), isRTL = !! ( 'undefined' != typeof isRtl && isRtl ), margin = ( isRtl ? 'marginRight' : 'marginLeft' ), the_id; //Evento per widget-action (aggiunto in modalità "live") // Uses CSS class toggle instead of jQuery slideDown/slideUp $(document).on('click', 'a.widget-action', function(){ var $action = $(this), widget = $action.closest('div.widget'), $inside = widget.find('.widget-inside'), isOpen = widget.hasClass('open'); if ( !isOpen ) { // Opening: add .open class, fix labels, update ARIA accuaWidgets.fixLabels(widget); widget.addClass('open'); // Remove any inline display style (from jQuery .hide() during drag) $inside.css('display', ''); $action.attr('aria-expanded', 'true'); } else { // Closing: remove .open class, update ARIA widget.removeClass('open'); $action.attr('aria-expanded', 'false'); } return false; }); //Click sul bottone di salvataggio // $('input.widget-control-save').live('click', function(){ $(document).on('click', 'input.widget-control-save', function(){ var $button = $(this); var originalText = $button.val(); // Add saving state with "Saving..." text $button.addClass('accua-saving-active').val(accua_forms_i18n.saving || 'Saving...'); accuaWidgets.save( $button.closest('div.widget'), 0, 1, 0, function(success) { // Restore button text immediately $button.val(originalText); if (success) { // Show success state $button.removeClass('accua-saving-active').addClass('accua-saved-active'); // Remove success state after 1.5 seconds setTimeout(function() { $button.removeClass('accua-saved-active'); }, 1500); } else { // Show error state $button.removeClass('accua-saving-active').addClass('accua-error'); // Remove error state after 2 seconds setTimeout(function() { $button.removeClass('accua-error'); }, 2000); } }); return false; }); //Click sul bottone di rimozione //$('a.widget-control-remove').live('click', function(){ $(document).on('click', 'a.widget-control-remove', function(){ accuaWidgets.save( $(this).closest('div.widget'), 1, 1, 0 ); return false; }); //Click sul bottone di chiusura //$('a.widget-control-close').live('click', function(){ $(document).on('click', 'a.widget-control-close', function(){ accuaWidgets.close( $(this).closest('div.widget') ); return false; }); // Click "+" button to add field to form $(document).on('click', '#widget-list a.widget-add-action', function(e){ e.preventDefault(); var widget = $(this).closest('div.widget'); accuaWidgets.addFieldToForm(widget); }); // Refresh Preview link for Custom HTML fields $(document).on('click', 'a.accua-refresh-preview', function(e){ e.preventDefault(); var widget = $(this).closest('div.widget'); accuaWidgets.save( widget, 0, 0, 0, function(success) { if (success) { accuaWidgets.refreshPreviewWithCurrentOrder(); } }); }); // Auto-save + preview refresh when field options change // Only for widgets inside the form area (not the available-widgets sidebar) var previewDebounceTimers = {}; function saveAndRefreshPreview(widget) { accuaWidgets.saveSilent(widget, function(success) { if (success) { accuaWidgets.refreshPreviewWithCurrentOrder(); } }); } function debouncedSaveAndRefresh(widget, delay) { var widgetId = widget.attr('id'); if (previewDebounceTimers[widgetId]) { clearTimeout(previewDebounceTimers[widgetId]); } previewDebounceTimers[widgetId] = setTimeout(function() { delete previewDebounceTimers[widgetId]; saveAndRefreshPreview(widget); }, delay); } // Immediate change: checkboxes, selects $(document).on('change', 'div.widgets-sortables .widget-content select, div.widgets-sortables .widget-content input[type="checkbox"]', function() { var widget = $(this).closest('div.widget'); saveAndRefreshPreview(widget); }); // Debounced change: text inputs and textareas (800ms delay) $(document).on('input', 'div.widgets-sortables .widget-content input[type="text"], div.widgets-sortables .widget-content textarea', function() { var widget = $(this).closest('div.widget'); debouncedSaveAndRefresh(widget, 800); // Live-update widget title bar for fieldset fields if (widget.data('field-type') === 'fieldset-begin') { accuaWidgets.appendTitle(widget[0]); widget.nextAll('[data-field-type="fieldset-end"]').first().each(function() { accuaWidgets.appendTitle(this); }); } }); //Impostazione titolo e apertura widget se c'è un errore sidebars.children('.widget').each(function() { accuaWidgets.appendTitle(this); if ( $('p.widget-error', this).length ) $('a.widget-action', this).click(); }); // Show/hide static submit widget based on whether a custom submit is in the form accuaWidgets.updateDefaultSubmitVisibility(); // Watch for fields added/removed from the sortable area if (window.MutationObserver) { sidebars.each(function() { new MutationObserver(function() { accuaWidgets.updateDefaultSubmitVisibility(); }).observe(this, { childList: true }); }); } //Trascinabilità dei widget nella lista $('#widget-list').children('.widget').draggable({ connectToSortable: 'div.widgets-sortables', handle: '> .widget-top > .widget-title', distance: 2, helper: 'clone', zIndex: 5, containment: 'document', start: function(e,ui) { accuaWidgets.fixWebkit(1); ui.helper.find('div.widget-description').hide(); the_id = this.id; }, stop: function(e,ui) { if ( rem ) $(rem).hide(); rem = ''; accuaWidgets.fixWebkit(); } }); //Ordinabilità dei widget sidebars.sortable({ placeholder: 'widget-placeholder', items: '> .widget:not(.accua-static-widget)', handle: '> .widget-top > .widget-title', cursor: 'move', distance: 2, containment: 'document', start: function(e,ui) { accuaWidgets.fixWebkit(1); ui.item.children('.widget-inside').hide(); ui.item.css({margin:'', 'width':''}); }, stop: function(e,ui) { // Mark form as having unsaved changes if (window.accuaFormsEditorDirty) { window.accuaFormsEditorDirty.mark(); } if ( ui.item.hasClass('ui-draggable') && ui.item.data('draggable') ) ui.item.draggable('destroy'); if ( ui.item.hasClass('deleting') ) { accuaWidgets.save( ui.item, 1, 0, 1 ); // delete widget ui.item.remove(); return; } var add = ui.item.find('input.add_new').val(), n = ui.item.find('input.multi_number').val(), id = the_id, sb = $(this).attr('id'); ui.item.css({margin:'', 'width':''}); the_id = ''; accuaWidgets.fixWebkit(); if ( add ) { if ( 'multi' == add ) { ui.item.html( ui.item.html().replace(/<[^<>]+>/g, function(m){ return m.replace(/__i__|%i%/g, n); }) ); ui.item.attr( 'id', id.replace(/__i__|%i%/g, n) ); n++; $('div#' + id).find('input.multi_number').val(n); } else if ( 'single' == add ) { ui.item.attr( 'id', 'new-' + id ); rem = 'div#' + id; } // Save the new widget to DB, but DON'T save order yet accuaWidgets.save( ui.item, 0, 0, 0, function(success) { if (success) { // Refresh preview with current order accuaWidgets.refreshPreviewWithCurrentOrder(); } }); ui.item.find('input.add_new').val(''); ui.item.find('a.widget-action').click(); return; } // Ensure static widget always stays last var $staticWidget = $(this).children('.accua-static-widget'); if ($staticWidget.length && $staticWidget.next().length) { $(this).append($staticWidget); } // Refresh preview (without saving to database) accuaWidgets.refreshPreviewWithCurrentOrder(); }, receive: function(e,ui) { var t = $(this); if ( !t.is(':visible') ) { t.sortable('cancel'); } } }).sortable('option', 'connectWith', 'div.widgets-sortables').parent().filter('.closed').children('.widgets-sortables').sortable('disable'); //Droppabilità dei widget disponibili $('#available-widgets').droppable({ tolerance: 'pointer', accept: function(o){ return $(o).parent().attr('id') != 'widget-list'; }, drop: function(e,ui) { // Mark form as having unsaved changes if (window.accuaFormsEditorDirty) { window.accuaFormsEditorDirty.mark(); } ui.draggable.addClass('deleting'); }, over: function(e,ui) { ui.draggable.addClass('deleting'); $('div.widget-placeholder').hide(); }, out: function(e,ui) { ui.draggable.removeClass('deleting'); $('div.widget-placeholder').show(); } }); // Wrapper divs are now in PHP to prevent layout shift on load // var holders = $('#widgets-left .widget-holder, #widgets-right .widgets-sortables'); // holders.wrap('
'); }, // Get current field order from sortable areas (without saving) getCurrentOrder: function() { var order = {}; $('div.widgets-sortables').each(function() { var $sortable = $(this); if ($sortable.sortable) { order[$sortable.attr('id')] = $sortable.sortable('toArray').join(','); } }); return order; }, // Refresh preview with current (unsaved) order via POST refreshPreviewWithCurrentOrder: function() { var self = this; var $iframe = $('#accua_form_preview_area'); var $wrapper = $('#accua_form_preview_area_wrapper'); if (!$iframe.length || typeof accua_forms_nonces === 'undefined') { return; } var formId = $('#accua_form_save_settings_id').val(); if (!formId) { return; } // Show loading state $wrapper.addClass('accua-form-preview-loading'); // Get current unsaved order var orderData = self.getCurrentOrder(); // Create a hidden form to POST the order to a new iframe // This allows preview to render with unsaved order var previewUrl = 'admin-ajax.php?action=accua_forms_preview&fid=' + formId + '&_wpnonce=' + accua_forms_nonces.preview_nonce; // Add order as URL parameter (encoded JSON) previewUrl += '&preview_order=' + encodeURIComponent(JSON.stringify(orderData)); $iframe[0].src = previewUrl; // Remove loading state when iframe loads $iframe.off('load.previewRefresh').on('load.previewRefresh', function() { $wrapper.removeClass('accua-form-preview-loading'); }); }, // Refresh preview from database (after save) refreshPreview : function() { var $iframe = $('#accua_form_preview_area'); var $wrapper = $('#accua_form_preview_area_wrapper'); if ($iframe.length && typeof accua_forms_nonces !== 'undefined') { var formId = $('#accua_form_save_settings_id').val(); if (formId) { // Show loading state $wrapper.addClass('accua-form-preview-loading'); // Refresh from database $iframe[0].src = 'admin-ajax.php?action=accua_forms_preview&fid=' + formId + '&_wpnonce=' + accua_forms_nonces.preview_nonce; // Remove loading state when iframe loads $iframe.off('load.previewRefresh').on('load.previewRefresh', function() { $wrapper.removeClass('accua-form-preview-loading'); }); } } }, // Save field order to database via AJAX saveOrder : function(sb, callback) { var self = this; // Collect field order from all sortable areas var orderData = { action: 'accua-form-fields-order', _nonce_edit_form: $('#_nonce_edit_form').val(), sidebars: self.getCurrentOrder() }; // Save field order via AJAX $.post(ajaxurl, orderData, function(response) { if (typeof callback === 'function') { callback(true); } }).fail(function() { console.error('Failed to save field order'); if (typeof callback === 'function') { callback(false); } }); self.resize(); }, //Salvataggio stato widget save : function(widget, del, animate, order, callback) { var sb = widget.closest('div.widgets-sortables').attr('id'), data = widget.find('form').serialize(), a; widget = $(widget); // Nothing to save for a widget that carries no field form: the static // "Default Submit button" placeholder is one, and the global Save // chain walks every widget in the drop zone. Its serialized data holds // no form-id, so the handler could only reject the request - and did, // logging a warning and three PHP 8 deprecations on every save. The // reply was "-1", too short for the markup refresh below, so skipping // the round trip leaves the outcome exactly as it was. Deletes still // go through: their DOM cleanup lives in the response handler. if (!del && !widget.find('form [name="form-id"]').length) { if (callback) callback(true); return; } a = { action: 'accua-save-form-field', _nonce_edit_form: $('#_nonce_edit_form').val(), sidebar: sb }; if ( del ) a['delete_widget'] = 1; data += '&' + $.param(a); $.post( ajaxurl, data, function(r){ var id; if ( del ) { if ( !$('input.widget_number', widget).val() ) { id = $('input.widget-id', widget).val(); $('#available-widgets').find('input.widget-id').each(function(){ if ( $(this).val() == id ) $(this).closest('div.widget').show(); }); } if ( animate ) { order = 0; widget.slideUp('fast', function(){ $(this).remove(); // Refresh preview accuaWidgets.refreshPreviewWithCurrentOrder(); }); } else { widget.remove(); accuaWidgets.resize(); } if (callback) callback(true); } else { if ( r && r.length > 2 ) { $('div.widget-content', widget).html(r); accuaWidgets.appendTitle(widget); // Also update the paired fieldset-end title if this is fieldset-begin if (widget.data('field-type') === 'fieldset-begin') { widget.nextAll('[data-field-type="fieldset-end"]').first().each(function() { accuaWidgets.appendTitle(this); }); } accuaWidgets.fixLabels(widget); } if (callback) callback(true); } // Don't save order here - order is saved when user clicks global Save button }).fail(function() { if (callback) callback(false); }); }, // Save field to draft without replacing widget content (for auto-preview) saveSilent : function(widget, callback) { // Same skip as save(): no field form, nothing the handler could store. if (!$(widget).find('form [name="form-id"]').length) { if (callback) callback(true); return; } var sb = widget.closest('div.widgets-sortables').attr('id'), data = widget.find('form').serialize(), a = { action: 'accua-save-form-field', _nonce_edit_form: $('#_nonce_edit_form').val(), sidebar: sb }; data += '&' + $.param(a); $.post(ajaxurl, data, function() { if (callback) callback(true); }).fail(function() { if (callback) callback(false); }); }, //Aggiunta titolo appendTitle : function(widget) { var $widget = $(widget); var fieldType = $widget.data('field-type'); var title; if (fieldType === 'fieldset-end') { // Mirror the title from the nearest preceding fieldset-begin var $begin = $widget.prevAll('[data-field-type="fieldset-begin"]').first(); if (!$begin.length) { return; } title = $begin.find('input[id*="-label"]').val(); if (title) { title = title.replace(/<[^<>]+>/g, '').replace(//g, '>'); $widget.children('.widget-top').children('.widget-title').children() .children('.in-widget-title').html(': ' + title); } return; } if (fieldType === 'fieldset-begin') { title = $('input[id*="-label"]', widget); } else { title = $('input[id*="-title"]', widget); } if ( title = title.val() ) { title = title.replace(/<[^<>]+>/g, '').replace(//g, '>'); $widget.children('.widget-top').children('.widget-title').children() .children('.in-widget-title').html(': ' + title); } }, // Show the static "Default Submit button" widget only when no custom submit field is in the form updateDefaultSubmitVisibility: function() { var hasSubmit = $('div.widgets-sortables .widget[data-field-type="submit"]').length > 0; $('#accua-default-submit-widget').toggle(!hasSubmit); }, resize : function() { /* $('div.widgets-sortables').not('#wp_inactive_widgets').each(function(){ var t = $(this); var h = 50, H = t.children('.widget').length; h = h + parseInt(H * 48, 10); t.css( 'minHeight', h + 'px' ); }); */ }, fixWebkit : function(n) { n = n ? 'none' : ''; $('body').css({ WebkitUserSelect: n, KhtmlUserSelect: n }); }, fixLabels : function(widget) { widget.children('.widget-inside').find('label').each(function(){ var t = $(this); var f = t.attr('for'); if ( f && f == $('input', this).attr('id') ) { t.removeAttr('for'); } }); }, //Chiusura widget close : function(widget) { // Use CSS transition instead of jQuery slideUp widget.removeClass('open'); widget.find('a.widget-action').attr('aria-expanded', 'false'); }, /** * Add a field from the available list to the end of the form drop zone. */ addFieldToForm: function(widget) { var id = widget.attr('id'), add = widget.find('input.add_new').val(), n = widget.find('input.multi_number').val(), $sortable = $('div.widgets-sortables').first(), clone; if (add === 'multi') { // Multi-use field: clone with new number clone = widget.clone(); clone.html(clone.html().replace(/<[^<>]+>/g, function(m){ return m.replace(/__i__|%i%/g, n); })); clone.attr('id', id.replace(/__i__|%i%/g, n)); n++; widget.find('input.multi_number').val(n); } else { // Single-use field: move to form, hide original clone = widget.clone(); clone.attr('id', 'new-' + id); widget.hide(); widget.data('in-form-hidden', true); } // Remove the "+" button from the clone in the form area clone.find('a.widget-add-action').remove(); // Append to sortable area, before the static submit widget if present var $staticWidget = $sortable.children('.accua-static-widget'); if ($staticWidget.length) { $staticWidget.before(clone); } else { $sortable.append(clone); } // Remove draggable class/data from the clone in the form clone.removeClass('ui-draggable'); if (clone.data('draggable')) clone.draggable('destroy'); // Save the new widget clone.find('input.add_new').val(''); accuaWidgets.save(clone, 0, 0, 0, function(success) { if (success) { accuaWidgets.refreshPreviewWithCurrentOrder(); } }); // Open the widget settings clone.find('a.widget-action').click(); // Scroll the drop zone column so the new widget is visible var $dropCol = clone.closest('.widget-liquid-right'); if ($dropCol.length) { $dropCol[0].scrollTop = $dropCol[0].scrollHeight; } // Mark form as dirty if (window.accuaFormsEditorDirty) { window.accuaFormsEditorDirty.mark(); } }, /** * Instant filter for available fields list. * Matches if query appears as substring in the field name. */ initFieldsFilter: function() { var $filter = $('#accua-fields-filter'); if (!$filter.length) return; var $widgets = $('#widget-list > .widget'); // Snapshot which widgets are already in the form (inline display:none from PHP) $widgets.each(function() { if (this.style.display === 'none') { $(this).data('in-form-hidden', true); } }); function fuzzyMatch(text, query) { return text.toLowerCase().indexOf(query.toLowerCase()) !== -1; } $filter.on('input', function() { var query = $.trim(this.value); if (!query) { $widgets.each(function() { $(this).removeClass('accua-filter-hidden'); if (!$(this).data('in-form-hidden')) { this.style.removeProperty('display'); } }); return; } $widgets.each(function() { // Skip widgets already placed in the form if ($(this).data('in-form-hidden')) return; var name = $(this).find('.widget-title h4').text(); if (fuzzyMatch(name, query)) { $(this).removeClass('accua-filter-hidden'); this.style.removeProperty('display'); } else { $(this).addClass('accua-filter-hidden'); this.style.display = 'none'; } }); }); } }; $(document).ready(function($){ accuaWidgets.init(); accuaWidgets.initFieldsFilter(); }); })(jQuery);