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; }); // 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); }); //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(); }); //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', 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; } // 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'); $('#removing-widget').hide().children('span').html(''); }, over: function(e,ui) { ui.draggable.addClass('deleting'); $('div.widget-placeholder').hide(); if ( ui.draggable.hasClass('ui-sortable-helper') ) $('#removing-widget').show().children('span') .html( ui.draggable.find('div.widget-title').children('h4').html() ); }, out: function(e,ui) { ui.draggable.removeClass('deleting'); $('div.widget-placeholder').show(); $('#removing-widget').hide().children('span').html(''); } }); // 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); 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); 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) { 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 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); } }, 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'); } }; $(document).ready(function($){ accuaWidgets.init(); }); })(jQuery);