| 1 |
jQuery(document).ready(function ($) { |
| 2 |
|
| 3 |
const prefix = WZSettingsAdmin.prefix || 'wz'; |
| 4 |
|
| 5 |
// File browser. |
| 6 |
$('.file-browser').on('click', function (event) { |
| 7 |
event.preventDefault(); |
| 8 |
|
| 9 |
var self = $(this); |
| 10 |
|
| 11 |
// Create the media frame. |
| 12 |
var file_frame = wp.media.frames.file_frame = wp.media({ |
| 13 |
title: self.data('uploader_title'), |
| 14 |
button: { |
| 15 |
text: self.data('uploader_button_text'), |
| 16 |
}, |
| 17 |
multiple: false |
| 18 |
}); |
| 19 |
|
| 20 |
file_frame.on('select', function () { |
| 21 |
attachment = file_frame.state().get('selection').first().toJSON(); |
| 22 |
self.prev('.file-url').val(attachment.url).change(); |
| 23 |
}); |
| 24 |
|
| 25 |
// Finally, open the modal |
| 26 |
file_frame.open(); |
| 27 |
}); |
| 28 |
|
| 29 |
$(function () { |
| 30 |
$("#post-body-content").tabs({ |
| 31 |
create: function (event, ui) { |
| 32 |
$(ui.tab.find("a")).addClass("nav-tab-active"); |
| 33 |
}, |
| 34 |
activate: function (event, ui) { |
| 35 |
$(ui.oldTab.find("a")).removeClass("nav-tab-active"); |
| 36 |
$(ui.newTab.find("a")).addClass("nav-tab-active"); |
| 37 |
} |
| 38 |
}); |
| 39 |
}); |
| 40 |
|
| 41 |
// Initialize ColorPicker. |
| 42 |
$('.color-field').each(function (i, element) { |
| 43 |
$(element).wpColorPicker(); |
| 44 |
}); |
| 45 |
|
| 46 |
// Reset default thumbnail - uses plugin-specific localized data. |
| 47 |
$('.reset-default-thumb').on('click', function () { |
| 48 |
var settingsKey = WZSettingsAdmin.settings_key || ''; |
| 49 |
var thumbDefault = (typeof window[WZSettingsAdmin.prefix + '_admin'] !== 'undefined') |
| 50 |
? window[WZSettingsAdmin.prefix + '_admin'].thumb_default |
| 51 |
: ''; |
| 52 |
$('#' + settingsKey + '\\[thumb_default\\]').val(thumbDefault); |
| 53 |
}); |
| 54 |
|
| 55 |
// Reset formmodified on submit. |
| 56 |
$('#' + prefix + '-settings-form').on('submit', function () { |
| 57 |
formmodified = 0; |
| 58 |
}); |
| 59 |
|
| 60 |
// Initialize Repeater Fields. |
| 61 |
$('.wz-repeater-wrapper').each(function () { |
| 62 |
var wrapper = $(this); |
| 63 |
var itemsContainer = wrapper.find('.wz-repeater-items'); |
| 64 |
var index = parseInt(wrapper.data('index'), 10) || 0; |
| 65 |
var liveUpdateField = wrapper.data('live-update-field') || 'name'; |
| 66 |
var fallbackTitle = wrapper.data('fallback-title') || ''; |
| 67 |
var liveUpdateOptions = wrapper.data('live-update-field-options') || {}; |
| 68 |
|
| 69 |
function reindexItems() { |
| 70 |
itemsContainer.find('.wz-repeater-item').each(function (idx) { |
| 71 |
$(this).find(':input').each(function () { |
| 72 |
var name = $(this).attr('name'); |
| 73 |
if (name) { |
| 74 |
name = name.replace(/\[\d+\](?=\[(?:fields|row_id)\])/, '[' + idx + ']'); |
| 75 |
$(this).attr('name', name); |
| 76 |
} |
| 77 |
}); |
| 78 |
}); |
| 79 |
} |
| 80 |
|
| 81 |
// Add Item. |
| 82 |
wrapper.on('click', '.add-item', function () { |
| 83 |
var templateEl = wrapper.find('.repeater-template').get(0); |
| 84 |
if (!templateEl) { |
| 85 |
return; |
| 86 |
} |
| 87 |
var template = templateEl.innerHTML; |
| 88 |
var uniqueId = 'row_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9); |
| 89 |
template = template.replace(/{{INDEX}}/g, index); |
| 90 |
template = template.replace(/{{ROW_ID}}/g, uniqueId); |
| 91 |
itemsContainer.append(template); |
| 92 |
index++; |
| 93 |
var newItem = itemsContainer.find('.wz-repeater-item:last'); |
| 94 |
itemsContainer.find('.repeater-item-header:last .toggle-icon').text('\u25b2'); |
| 95 |
itemsContainer.find('.repeater-item-content:last').css('display', 'block'); |
| 96 |
if (window.WZInitTomSelect) { |
| 97 |
window.WZInitTomSelect(newItem.get(0)); |
| 98 |
} |
| 99 |
document.dispatchEvent(new CustomEvent('wz:repeater-item-added', { detail: { container: newItem.get(0) } })); |
| 100 |
}); |
| 101 |
|
| 102 |
// Remove Item. |
| 103 |
wrapper.on('click', '.remove-item', function () { |
| 104 |
$(this).closest('.wz-repeater-item').remove(); |
| 105 |
reindexItems(); |
| 106 |
}); |
| 107 |
|
| 108 |
// Move Up. |
| 109 |
wrapper.on('click', '.move-up', function () { |
| 110 |
var item = $(this).closest('.wz-repeater-item'); |
| 111 |
var prev = item.prev(); |
| 112 |
if (prev.length) { |
| 113 |
item.insertBefore(prev); |
| 114 |
reindexItems(); |
| 115 |
} |
| 116 |
}); |
| 117 |
|
| 118 |
// Move Down. |
| 119 |
wrapper.on('click', '.move-down', function () { |
| 120 |
var item = $(this).closest('.wz-repeater-item'); |
| 121 |
var next = item.next(); |
| 122 |
if (next.length) { |
| 123 |
item.insertAfter(next); |
| 124 |
reindexItems(); |
| 125 |
} |
| 126 |
}); |
| 127 |
|
| 128 |
// Toggle Accordion. |
| 129 |
wrapper.on('click', '.repeater-item-header', function () { |
| 130 |
var $this = $(this); |
| 131 |
var $toggleIcon = $this.find('.toggle-icon'); |
| 132 |
var $content = $this.next('.repeater-item-content'); |
| 133 |
if ($content.is(':visible')) { |
| 134 |
$content.slideUp(); |
| 135 |
$toggleIcon.text('\u25bc'); |
| 136 |
} else { |
| 137 |
$content.slideDown(); |
| 138 |
$toggleIcon.text('\u25b2'); |
| 139 |
} |
| 140 |
}); |
| 141 |
|
| 142 |
// Enforce unique selection across rows for the field named in data-unique-field. |
| 143 |
var uniqueField = wrapper.data('unique-field') || ''; |
| 144 |
function syncUniqueSelects() { |
| 145 |
if (!uniqueField) { |
| 146 |
return; |
| 147 |
} |
| 148 |
var $selects = itemsContainer.find('.wz-repeater-item select[name$="[fields][' + uniqueField + ']"]'); |
| 149 |
var usedValues = {}; |
| 150 |
$selects.each(function () { |
| 151 |
var val = $(this).val(); |
| 152 |
if (val) { |
| 153 |
usedValues[val] = true; |
| 154 |
} |
| 155 |
}); |
| 156 |
$selects.each(function () { |
| 157 |
var $sel = $(this); |
| 158 |
var ownVal = $sel.val(); |
| 159 |
$sel.find('option').each(function () { |
| 160 |
var optVal = $(this).val(); |
| 161 |
if (!optVal) { |
| 162 |
return; |
| 163 |
} |
| 164 |
$(this).prop('disabled', optVal !== ownVal && usedValues[optVal]); |
| 165 |
}); |
| 166 |
}); |
| 167 |
} |
| 168 |
|
| 169 |
if (uniqueField) { |
| 170 |
syncUniqueSelects(); |
| 171 |
wrapper.on('change', '.wz-repeater-item select[name$="[fields][' + uniqueField + ']"]', function () { |
| 172 |
syncUniqueSelects(); |
| 173 |
}); |
| 174 |
wrapper.on('click', '.remove-item', function () { |
| 175 |
// Sync after DOM removal; removal handler fires before remove, so defer. |
| 176 |
setTimeout(syncUniqueSelects, 0); |
| 177 |
}); |
| 178 |
document.addEventListener('wz:repeater-item-added', function (e) { |
| 179 |
if (wrapper.get(0).contains(e.detail.container)) { |
| 180 |
syncUniqueSelects(); |
| 181 |
} |
| 182 |
}); |
| 183 |
} |
| 184 |
|
| 185 |
// Live update repeater title when the specified field changes. |
| 186 |
// Handles text inputs (input event), selects (change event, uses option text), |
| 187 |
// and TomSelect-enhanced inputs (change event, uses displayed text or value). |
| 188 |
function updateRepeaterTitle($field) { |
| 189 |
var newName; |
| 190 |
var val = $field.val(); |
| 191 |
if ($field.is('select')) { |
| 192 |
// Ignore placeholder options (empty value). |
| 193 |
newName = val ? $field.find('option:selected').text().trim() : ''; |
| 194 |
} else { |
| 195 |
newName = val ? (liveUpdateOptions[val] || val) : ''; |
| 196 |
} |
| 197 |
$field.closest('.wz-repeater-item').find('.repeater-title').text(newName || fallbackTitle); |
| 198 |
} |
| 199 |
|
| 200 |
wrapper.on('input change', '.wz-repeater-item :input[name$="[fields][' + liveUpdateField + ']"]', function () { |
| 201 |
updateRepeaterTitle($(this)); |
| 202 |
}); |
| 203 |
}); |
| 204 |
|
| 205 |
}); |
| 206 |
|
