| 1 |
/** |
| 2 |
* @file: ../includes/page-form-builder/admin-page-tpl/_src/modal__form_templates.js |
| 3 |
*/ |
| 4 |
(function (w, d) { |
| 5 |
'use strict'; |
| 6 |
|
| 7 |
const Core = (w.WPBC_BFB_Core = w.WPBC_BFB_Core || {}); |
| 8 |
const UI = (Core.UI = Core.UI || {}); |
| 9 |
|
| 10 |
UI.Template_Picker = UI.Template_Picker || {}; |
| 11 |
|
| 12 |
function wpbc_bfb__i18n(key, fallback) { |
| 13 |
try { |
| 14 |
const cfg = w.WPBC_BFB_Ajax || {}; |
| 15 |
const val = (cfg && typeof cfg[key] !== 'undefined') ? String( cfg[key] ) : ''; |
| 16 |
return val ? val : String( fallback || '' ); |
| 17 |
} catch ( _e ) { |
| 18 |
return String( fallback || '' ); |
| 19 |
} |
| 20 |
} |
| 21 |
|
| 22 |
/** |
| 23 |
* Get configured OR separator for multi-keyword search. |
| 24 |
* |
| 25 |
* @returns {string} |
| 26 |
*/ |
| 27 |
function wpbc_bfb__get_template_search_or_sep() { |
| 28 |
try { |
| 29 |
const cfg = w.WPBC_BFB_Ajax || {}; |
| 30 |
const v = ( cfg && cfg.template_search_or_sep ) ? String( cfg.template_search_or_sep ) : ''; |
| 31 |
return v ? v : '|'; |
| 32 |
} catch ( _e ) { |
| 33 |
return '|'; |
| 34 |
} |
| 35 |
} |
| 36 |
|
| 37 |
/** |
| 38 |
* Get URL OR separator. |
| 39 |
* |
| 40 |
* @returns {string} |
| 41 |
*/ |
| 42 |
function wpbc_bfb__get_template_search_or_sep_url() { |
| 43 |
try { |
| 44 |
const cfg = w.WPBC_BFB_Ajax || {}; |
| 45 |
const v = ( cfg && cfg.template_search_or_sep_url ) ? String( cfg.template_search_or_sep_url ) : ''; |
| 46 |
return v ? v : '^'; |
| 47 |
} catch ( _e ) { |
| 48 |
return '^'; |
| 49 |
} |
| 50 |
} |
| 51 |
|
| 52 |
/** |
| 53 |
* Escape a string for use in RegExp constructor. |
| 54 |
* |
| 55 |
* @param {string} s |
| 56 |
* @returns {string} |
| 57 |
*/ |
| 58 |
function wpbc_bfb__escape_regex(s) { |
| 59 |
return String( s || '' ).replace( /[.*+?^${}()|[\]\\]/g, '\\$&' ); |
| 60 |
} |
| 61 |
|
| 62 |
/** |
| 63 |
* Normalize a search string so server-side split works. |
| 64 |
* |
| 65 |
* @param {string} raw |
| 66 |
* @returns {string} |
| 67 |
*/ |
| 68 |
function wpbc_bfb__normalize_template_search(raw) { |
| 69 |
let s = String( raw || '' ) |
| 70 |
.replace( /[\u0000-\u001F\u007F]/g, ' ' ) |
| 71 |
.replace( /\s+/g, ' ' ) |
| 72 |
.trim(); |
| 73 |
|
| 74 |
const sep = wpbc_bfb__get_template_search_or_sep(); |
| 75 |
const url_sep = wpbc_bfb__get_template_search_or_sep_url(); |
| 76 |
|
| 77 |
if ( url_sep && url_sep !== sep ) { |
| 78 |
const esc_url = wpbc_bfb__escape_regex( url_sep ); |
| 79 |
s = s.replace( new RegExp( '\\s*' + esc_url + '\\s*', 'g' ), sep ); |
| 80 |
} |
| 81 |
|
| 82 |
s = s.replace( /\s*\|\s*/g, sep ); |
| 83 |
|
| 84 |
const esc = wpbc_bfb__escape_regex( sep ); |
| 85 |
s = s.replace( new RegExp( '\\s*' + esc + '\\s*', 'g' ), sep ); |
| 86 |
s = s.replace( new RegExp( esc + '{2,}', 'g' ), sep ); |
| 87 |
s = s.replace( new RegExp( '^' + esc + '+|' + esc + '+$', 'g' ), '' ).trim(); |
| 88 |
|
| 89 |
if ( s.length > 80 ) { |
| 90 |
s = s.slice( 0, 80 ).trim(); |
| 91 |
} |
| 92 |
|
| 93 |
return s; |
| 94 |
} |
| 95 |
|
| 96 |
/** |
| 97 |
* Escape HTML. |
| 98 |
* |
| 99 |
* @param {*} s |
| 100 |
* @returns {string} |
| 101 |
*/ |
| 102 |
function wpbc_bfb__escape_html(s) { |
| 103 |
return String( s == null ? '' : s ) |
| 104 |
.replace( /&/g, '&' ) |
| 105 |
.replace( /</g, '<' ) |
| 106 |
.replace( />/g, '>' ) |
| 107 |
.replace( /"/g, '"' ) |
| 108 |
.replace( /'/g, ''' ); |
| 109 |
} |
| 110 |
|
| 111 |
/** |
| 112 |
* Get config text. |
| 113 |
* |
| 114 |
* @param {string} key |
| 115 |
* @param {string} fallback |
| 116 |
* @returns {string} |
| 117 |
*/ |
| 118 |
function wpbc_bfb__get_cfg_text(key, fallback) { |
| 119 |
try { |
| 120 |
const cfg = w.WPBC_BFB_Ajax || {}; |
| 121 |
const val = ( cfg && cfg[ key ] ) ? String( cfg[ key ] ) : ''; |
| 122 |
return val ? val : String( fallback || '' ); |
| 123 |
} catch ( _e ) { |
| 124 |
return String( fallback || '' ); |
| 125 |
} |
| 126 |
} |
| 127 |
|
| 128 |
|
| 129 |
/** |
| 130 |
* Toggle busy state for template delete button. |
| 131 |
* |
| 132 |
* @param {HTMLElement|null} delete_btn |
| 133 |
* @param {boolean} is_busy |
| 134 |
* @returns {void} |
| 135 |
*/ |
| 136 |
function wpbc_bfb__set_tpl_delete_busy(delete_btn, is_busy) { |
| 137 |
if ( ! delete_btn ) { |
| 138 |
return; |
| 139 |
} |
| 140 |
|
| 141 |
if ( is_busy ) { |
| 142 |
delete_btn.setAttribute( 'aria-disabled', 'true' ); |
| 143 |
delete_btn.style.pointerEvents = 'none'; |
| 144 |
delete_btn.style.opacity = '0.5'; |
| 145 |
} else { |
| 146 |
delete_btn.setAttribute( 'aria-disabled', 'false' ); |
| 147 |
delete_btn.style.pointerEvents = ''; |
| 148 |
delete_btn.style.opacity = ''; |
| 149 |
} |
| 150 |
} |
| 151 |
|
| 152 |
UI.Template_Picker.create = function (args) { |
| 153 |
|
| 154 |
args = args || {}; |
| 155 |
|
| 156 |
const api = {}; |
| 157 |
|
| 158 |
api.modal_el = args.modal_el || null; |
| 159 |
api.search_input_id = args.search_input_id || ''; |
| 160 |
api.blank_template_slug = args.blank_template_slug || '__blank__'; |
| 161 |
api.allow_delete = !! args.allow_delete; |
| 162 |
api.allow_presets = !! args.allow_presets; |
| 163 |
api.allow_same_click_blank = !! args.allow_same_click_blank; |
| 164 |
api.empty_text = String( args.empty_text || 'No templates found.' ); |
| 165 |
api.blank_desc = String( args.blank_desc || 'Start with an empty layout.' ); |
| 166 |
api.list_helper_missing_text = String( args.list_helper_missing_text || 'WPBC BFB: list forms helper missing.' ); |
| 167 |
api.load_failed_text = String( args.load_failed_text || 'Failed to load templates list.' ); |
| 168 |
api.on_selection_change = ( typeof args.on_selection_change === 'function' ) ? args.on_selection_change : function () {}; |
| 169 |
api.on_delete_click = ( typeof args.on_delete_click === 'function' ) ? args.on_delete_click : null; |
| 170 |
api.on_set_error = ( typeof args.on_set_error === 'function' ) ? args.on_set_error : function () {}; |
| 171 |
|
| 172 |
api.get_search_input = function () { |
| 173 |
return api.search_input_id ? d.getElementById( api.search_input_id ) : null; |
| 174 |
}; |
| 175 |
|
| 176 |
api.get_list_root = function () { |
| 177 |
return api.modal_el ? api.modal_el.querySelector( '[data-wpbc-bfb-tpl-list="1"]' ) : null; |
| 178 |
}; |
| 179 |
|
| 180 |
api.get_pager_root = function () { |
| 181 |
return api.modal_el ? api.modal_el.querySelector( '[data-wpbc-bfb-tpl-pager="1"]' ) : null; |
| 182 |
}; |
| 183 |
|
| 184 |
api.get_selected_template_slug = function () { |
| 185 |
if ( ! api.modal_el ) { |
| 186 |
return api.blank_template_slug; |
| 187 |
} |
| 188 |
const v = String( api.modal_el.__wpbc_bfb_selected_template_slug || '' ); |
| 189 |
return v ? v : api.blank_template_slug; |
| 190 |
}; |
| 191 |
|
| 192 |
api.set_selected_template_slug = function (slug) { |
| 193 |
if ( ! api.modal_el ) { |
| 194 |
return; |
| 195 |
} |
| 196 |
slug = String( slug || '' ).trim(); |
| 197 |
api.modal_el.__wpbc_bfb_selected_template_slug = slug ? slug : api.blank_template_slug; |
| 198 |
}; |
| 199 |
|
| 200 |
api.count_real_templates = function (forms) { |
| 201 |
let count = 0; |
| 202 |
|
| 203 |
for ( let i = 0; i < ( forms || [] ).length; i++ ) { |
| 204 |
const item = forms[ i ] || {}; |
| 205 |
const slug = String( item.form_slug || '' ); |
| 206 |
|
| 207 |
if ( slug && slug !== api.blank_template_slug ) { |
| 208 |
count++; |
| 209 |
} |
| 210 |
} |
| 211 |
|
| 212 |
return count; |
| 213 |
}; |
| 214 |
|
| 215 |
api.get_first_real_template_slug = function (forms) { |
| 216 |
for ( let i = 0; i < ( forms || [] ).length; i++ ) { |
| 217 |
const item = forms[ i ] || {}; |
| 218 |
const slug = String( item.form_slug || '' ); |
| 219 |
|
| 220 |
if ( slug && slug !== api.blank_template_slug ) { |
| 221 |
return slug; |
| 222 |
} |
| 223 |
} |
| 224 |
|
| 225 |
return ''; |
| 226 |
}; |
| 227 |
|
| 228 |
api.select_first_real_template = function (forms) { |
| 229 |
const slug = api.get_first_real_template_slug( |
| 230 |
forms || ( api.modal_el && api.modal_el.__wpbc_bfb_templates_cache ) || [] |
| 231 |
); |
| 232 |
|
| 233 |
if ( ! slug ) { |
| 234 |
return false; |
| 235 |
} |
| 236 |
|
| 237 |
api.set_selected_template_slug( slug ); |
| 238 |
api.refresh_selection_highlight(); |
| 239 |
api.on_selection_change( slug, api ); |
| 240 |
|
| 241 |
return true; |
| 242 |
}; |
| 243 |
|
| 244 |
/** |
| 245 |
* Delete template by delete button element and refresh current picker list. |
| 246 |
* |
| 247 |
* @param {HTMLElement} delete_btn |
| 248 |
* @param {Function} done Optional callback function(ok:boolean, resp:Object|null) |
| 249 |
* @returns {void} |
| 250 |
*/ |
| 251 |
api.delete_template = function (delete_btn, done) { |
| 252 |
|
| 253 |
if ( ! delete_btn ) { |
| 254 |
if ( typeof done === 'function' ) { |
| 255 |
done( false, null ); |
| 256 |
} |
| 257 |
return; |
| 258 |
} |
| 259 |
|
| 260 |
if ( delete_btn.getAttribute( 'aria-disabled' ) === 'true' ) { |
| 261 |
return; |
| 262 |
} |
| 263 |
|
| 264 |
const template_slug = String( delete_btn.getAttribute( 'data-template-slug' ) || '' ).trim(); |
| 265 |
const template_title = String( delete_btn.getAttribute( 'data-template-title' ) || template_slug ).trim(); |
| 266 |
|
| 267 |
if ( ! template_slug || template_slug === api.blank_template_slug ) { |
| 268 |
if ( typeof done === 'function' ) { |
| 269 |
done( false, null ); |
| 270 |
} |
| 271 |
return; |
| 272 |
} |
| 273 |
|
| 274 |
if ( typeof w.wpbc_bfb__ajax_delete_template_by_slug !== 'function' ) { |
| 275 |
const missing_msg = wpbc_bfb__get_cfg_text( |
| 276 |
'template_delete_missing_helper', |
| 277 |
'WPBC BFB: template delete helper is not available.' |
| 278 |
); |
| 279 |
|
| 280 |
api.on_set_error( missing_msg ); |
| 281 |
|
| 282 |
if ( typeof w.wpbc_admin_show_message === 'function' ) { |
| 283 |
w.wpbc_admin_show_message( missing_msg, 'error', 10000 ); |
| 284 |
} |
| 285 |
|
| 286 |
if ( typeof done === 'function' ) { |
| 287 |
done( false, null ); |
| 288 |
} |
| 289 |
return; |
| 290 |
} |
| 291 |
|
| 292 |
const confirm_text = wpbc_bfb__get_cfg_text( |
| 293 |
'template_delete_confirm', |
| 294 |
'Delete template "%s"? This action cannot be undone.' |
| 295 |
).replace( '%s', template_title || template_slug ); |
| 296 |
|
| 297 |
if ( ! w.confirm( confirm_text ) ) { |
| 298 |
return; |
| 299 |
} |
| 300 |
|
| 301 |
api.on_set_error( '' ); |
| 302 |
wpbc_bfb__set_tpl_delete_busy( delete_btn, true ); |
| 303 |
|
| 304 |
w.wpbc_bfb__ajax_delete_template_by_slug( template_slug, function (ok, resp) { |
| 305 |
|
| 306 |
wpbc_bfb__set_tpl_delete_busy( delete_btn, false ); |
| 307 |
|
| 308 |
if ( ! ok || ! resp || ! resp.success ) { |
| 309 |
|
| 310 |
let error_message = ''; |
| 311 |
|
| 312 |
try { |
| 313 |
error_message = ( resp && resp.data && resp.data.message ) ? String( resp.data.message ) : ''; |
| 314 |
} catch ( _e0 ) { |
| 315 |
error_message = ''; |
| 316 |
} |
| 317 |
|
| 318 |
if ( ! error_message ) { |
| 319 |
error_message = wpbc_bfb__get_cfg_text( |
| 320 |
'template_delete_failed', |
| 321 |
'Failed to delete template.' |
| 322 |
); |
| 323 |
} |
| 324 |
|
| 325 |
api.on_set_error( error_message ); |
| 326 |
|
| 327 |
if ( typeof w.wpbc_admin_show_message === 'function' ) { |
| 328 |
w.wpbc_admin_show_message( error_message, 'error', 10000 ); |
| 329 |
} |
| 330 |
|
| 331 |
if ( typeof done === 'function' ) { |
| 332 |
done( false, resp ); |
| 333 |
} |
| 334 |
return; |
| 335 |
} |
| 336 |
|
| 337 |
if ( api.get_selected_template_slug() === template_slug ) { |
| 338 |
api.set_selected_template_slug( api.blank_template_slug ); |
| 339 |
} |
| 340 |
|
| 341 |
const current_page = parseInt( ( api.modal_el && api.modal_el.__wpbc_bfb_tpl_page ) || 1, 10 ) || 1; |
| 342 |
const current_search = String( ( api.modal_el && api.modal_el.__wpbc_bfb_tpl_search ) || '' ); |
| 343 |
|
| 344 |
const finish_success = function () { |
| 345 |
api.on_selection_change( api.get_selected_template_slug(), api ); |
| 346 |
|
| 347 |
if ( typeof w.wpbc_admin_show_message === 'function' ) { |
| 348 |
const success_message = ( resp && resp.data && resp.data.message ) |
| 349 |
? String( resp.data.message ) |
| 350 |
: wpbc_bfb__get_cfg_text( 'template_delete_success', 'Template deleted.' ); |
| 351 |
|
| 352 |
w.wpbc_admin_show_message( success_message, 'success', 4000, false ); |
| 353 |
} |
| 354 |
|
| 355 |
if ( typeof done === 'function' ) { |
| 356 |
done( true, resp ); |
| 357 |
} |
| 358 |
}; |
| 359 |
|
| 360 |
api.load_templates( current_page, current_search, function (load_ok) { |
| 361 |
|
| 362 |
if ( |
| 363 |
load_ok && |
| 364 |
current_page > 1 && |
| 365 |
api.count_real_templates( ( api.modal_el && api.modal_el.__wpbc_bfb_templates_cache ) || [] ) < 1 |
| 366 |
) { |
| 367 |
api.load_templates( current_page - 1, current_search, function () { |
| 368 |
finish_success(); |
| 369 |
} ); |
| 370 |
return; |
| 371 |
} |
| 372 |
|
| 373 |
finish_success(); |
| 374 |
} ); |
| 375 |
} ); |
| 376 |
}; |
| 377 |
|
| 378 |
|
| 379 |
api.sync_template_search_presets = function (current_search) { |
| 380 |
if ( ! api.modal_el || ! api.allow_presets ) { |
| 381 |
return; |
| 382 |
} |
| 383 |
|
| 384 |
const root = api.modal_el.querySelector( '[data-wpbc-bfb-tpl-search-presets="1"]' ); |
| 385 |
if ( ! root ) { |
| 386 |
return; |
| 387 |
} |
| 388 |
|
| 389 |
current_search = wpbc_bfb__normalize_template_search( current_search ); |
| 390 |
|
| 391 |
root.querySelectorAll( '[data-wpbc-bfb-tpl-search-key]' ).forEach( function (btn) { |
| 392 |
const preset_search = wpbc_bfb__normalize_template_search( |
| 393 |
btn.getAttribute( 'data-wpbc-bfb-tpl-search-key' ) || '' |
| 394 |
); |
| 395 |
|
| 396 |
const is_active = ( preset_search === current_search ); |
| 397 |
|
| 398 |
btn.setAttribute( 'aria-pressed', is_active ? 'true' : 'false' ); |
| 399 |
btn.classList.toggle( 'is-active', is_active ); |
| 400 |
} ); |
| 401 |
}; |
| 402 |
|
| 403 |
api.set_loading = function (is_loading) { |
| 404 |
const root = api.get_list_root(); |
| 405 |
if ( ! root ) { |
| 406 |
return; |
| 407 |
} |
| 408 |
|
| 409 |
if ( is_loading ) { |
| 410 |
let spin = ''; |
| 411 |
|
| 412 |
try { |
| 413 |
const src = d.querySelector( '.wpbc_bfb_popup_modal__forms_loading_spin_container' ); |
| 414 |
if ( src ) { |
| 415 |
spin = src.outerHTML; |
| 416 |
} |
| 417 |
} catch ( _e ) {} |
| 418 |
|
| 419 |
root.innerHTML = spin || '<div style="padding:10px;color:#656565;">' + wpbc_bfb__escape_html( wpbc_bfb__i18n( 'text_loading', 'Loading...' ) ) + '</div>'; |
| 420 |
} |
| 421 |
}; |
| 422 |
|
| 423 |
api.set_pager = function (page, has_more) { |
| 424 |
const pager = api.get_pager_root(); |
| 425 |
if ( ! pager ) { |
| 426 |
return; |
| 427 |
} |
| 428 |
|
| 429 |
const prev = pager.querySelector( '[data-wpbc-bfb-tpl-page-prev="1"]' ); |
| 430 |
const next = pager.querySelector( '[data-wpbc-bfb-tpl-page-next="1"]' ); |
| 431 |
const lab = pager.querySelector( '[data-wpbc-bfb-tpl-page-label="1"]' ); |
| 432 |
|
| 433 |
page = parseInt( page || 1, 10 ); |
| 434 |
if ( ! page || page < 1 ) { |
| 435 |
page = 1; |
| 436 |
} |
| 437 |
|
| 438 |
if ( lab ) { |
| 439 |
lab.textContent = wpbc_bfb__escape_html( wpbc_bfb__i18n( 'text_page', 'Page' ) ) + ' ' + page; |
| 440 |
} |
| 441 |
|
| 442 |
function set_btn(btn, enabled) { |
| 443 |
if ( ! btn ) { |
| 444 |
return; |
| 445 |
} |
| 446 |
if ( enabled ) { |
| 447 |
btn.classList.remove( 'disabled' ); |
| 448 |
btn.setAttribute( 'aria-disabled', 'false' ); |
| 449 |
} else { |
| 450 |
btn.classList.add( 'disabled' ); |
| 451 |
btn.setAttribute( 'aria-disabled', 'true' ); |
| 452 |
} |
| 453 |
} |
| 454 |
|
| 455 |
set_btn( prev, page > 1 ); |
| 456 |
set_btn( next, !! has_more ); |
| 457 |
}; |
| 458 |
|
| 459 |
api.refresh_selection_highlight = function () { |
| 460 |
const root = api.get_list_root(); |
| 461 |
if ( ! root ) { |
| 462 |
return; |
| 463 |
} |
| 464 |
|
| 465 |
const sel = api.get_selected_template_slug(); |
| 466 |
let found = null; |
| 467 |
|
| 468 |
root.querySelectorAll( '.wpbc_bfb__load_form_item' ).forEach( function (el) { |
| 469 |
el.classList.remove( 'wpbc_bfb__load_form_item_selected' ); |
| 470 |
} ); |
| 471 |
|
| 472 |
try { |
| 473 |
found = root.querySelector( '[data-template-slug="' + CSS.escape( sel ) + '"]' ); |
| 474 |
} catch ( _e ) { |
| 475 |
found = null; |
| 476 |
} |
| 477 |
|
| 478 |
if ( found ) { |
| 479 |
found.classList.add( 'wpbc_bfb__load_form_item_selected' ); |
| 480 |
} |
| 481 |
}; |
| 482 |
|
| 483 |
api.render_list = function (forms) { |
| 484 |
const root = api.get_list_root(); |
| 485 |
if ( ! root ) { |
| 486 |
return; |
| 487 |
} |
| 488 |
|
| 489 |
let html = ''; |
| 490 |
|
| 491 |
html += '' |
| 492 |
+ '<div class="wpbc_bfb__load_form_item" data-wpbc-bfb-tpl-item="1" data-template-slug="' + wpbc_bfb__escape_html( api.blank_template_slug ) + '">' |
| 493 |
+ ' <div class="wpbc_bfb__load_form_item_thumb">' |
| 494 |
+ ' <div class="wpbc_bfb__load_form_item_thumb_blank_img">' + wpbc_bfb__escape_html( wpbc_bfb__i18n( 'text_blank_thumb', 'Blank' ) ) + '</div>' |
| 495 |
+ ' </div>' |
| 496 |
+ ' <div class="wpbc_bfb__load_form_item_text">' |
| 497 |
+ ' <div class="form_item_text_title">' + wpbc_bfb__escape_html( wpbc_bfb__i18n( 'text_blank_form_title', 'Blank Form' ) ) + '</div>' |
| 498 |
+ ' <div class="form_item_text_slug">' + wpbc_bfb__escape_html( api.blank_template_slug ) + '</div>' |
| 499 |
+ ' <div class="form_item_text_desc">' + wpbc_bfb__escape_html( api.blank_desc ) + '</div>' |
| 500 |
+ ' </div>' |
| 501 |
+ '</div>'; |
| 502 |
|
| 503 |
let any_templates = false; |
| 504 |
const delete_label = wpbc_bfb__get_cfg_text( 'template_delete_label', 'Delete template' ); |
| 505 |
|
| 506 |
for ( let i = 0; i < ( forms || [] ).length; i++ ) { |
| 507 |
const item = forms[ i ] || {}; |
| 508 |
const slug = String( item.form_slug || '' ); |
| 509 |
|
| 510 |
if ( ! slug || slug === api.blank_template_slug ) { |
| 511 |
continue; |
| 512 |
} |
| 513 |
|
| 514 |
any_templates = true; |
| 515 |
|
| 516 |
const title = String( item.title || slug || '' ); |
| 517 |
const desc = String( item.description || '' ); |
| 518 |
const pic = String( item.picture_url || item.image_url || '' ); |
| 519 |
|
| 520 |
const thumb = pic |
| 521 |
? '<img src="' + wpbc_bfb__escape_html( pic ) + '" alt="" />' |
| 522 |
: '<div class="wpbc_bfb__load_form_item_thumb_blank_img">' + wpbc_bfb__escape_html( wpbc_bfb__i18n( 'text_no_image_thumb', 'No image' ) ) + '</div>'; |
| 523 |
|
| 524 |
let delete_btn = ''; |
| 525 |
|
| 526 |
if ( api.allow_delete && parseInt( item.can_delete || 0, 10 ) === 1 ) { |
| 527 |
delete_btn = '' |
| 528 |
+ '<a href="#"' |
| 529 |
+ ' class="button-link-delete"' |
| 530 |
+ ' data-wpbc-bfb-tpl-delete="1"' |
| 531 |
+ ' data-template-slug="' + wpbc_bfb__escape_html( slug ) + '"' |
| 532 |
+ ' data-template-title="' + wpbc_bfb__escape_html( title ) + '"' |
| 533 |
+ ' aria-label="' + wpbc_bfb__escape_html( delete_label ) + '"' |
| 534 |
+ ' title="' + wpbc_bfb__escape_html( delete_label ) + '"' |
| 535 |
+ ' style="margin-left:auto;color:#b32d2e;text-decoration:none;line-height:1;">' |
| 536 |
+ ' <span class="dashicons dashicons-trash" aria-hidden="true"></span>' |
| 537 |
+ '</a>'; |
| 538 |
} |
| 539 |
|
| 540 |
const meta = '<div class="form_item_text_slug" title="' + wpbc_bfb__escape_html( slug ) + '">' + wpbc_bfb__escape_html( slug ) + '</div>'; |
| 541 |
|
| 542 |
const line2 = desc |
| 543 |
? '<div class="form_item_text_desc" title="' + wpbc_bfb__escape_html( desc ) + '">' |
| 544 |
+ '<span class="form_item_text_desc__text">' |
| 545 |
+ wpbc_bfb__escape_html( desc ) |
| 546 |
+ '</span>' |
| 547 |
+ delete_btn |
| 548 |
+ '</div>' |
| 549 |
: ( delete_btn ? '<div class="form_item_text_desc">' + delete_btn + '</div>' : '' ); |
| 550 |
|
| 551 |
html += '' |
| 552 |
+ '<div class="wpbc_bfb__load_form_item" data-wpbc-bfb-tpl-item="1" data-template-slug="' + wpbc_bfb__escape_html( slug ) + '">' |
| 553 |
+ ' <div class="wpbc_bfb__load_form_item_thumb">' + thumb + '</div>' |
| 554 |
+ ' <div class="wpbc_bfb__load_form_item_text">' |
| 555 |
+ ' <div style="display:flex;align-items:flex-start;gap:8px;">' |
| 556 |
+ ' <div class="form_item_text_title" style="flex:1 1 auto;">' + wpbc_bfb__escape_html( title ) + '</div>' |
| 557 |
+ ' </div>' |
| 558 |
+ meta |
| 559 |
+ line2 |
| 560 |
+ ' </div>' |
| 561 |
+ '</div>'; |
| 562 |
} |
| 563 |
|
| 564 |
if ( ! any_templates ) { |
| 565 |
html += '<div style="padding:10px;color:#666;">' + wpbc_bfb__escape_html( api.empty_text ) + '</div>'; |
| 566 |
} |
| 567 |
|
| 568 |
root.innerHTML = html; |
| 569 |
api.refresh_selection_highlight(); |
| 570 |
}; |
| 571 |
|
| 572 |
api.load_templates = function (page, search, done) { |
| 573 |
if ( typeof w.wpbc_bfb__ajax_list_user_forms !== 'function' ) { |
| 574 |
api.on_set_error( api.list_helper_missing_text ); |
| 575 |
api.set_loading( false ); |
| 576 |
api.set_pager( 1, false ); |
| 577 |
api.render_list( [] ); |
| 578 |
|
| 579 |
if ( typeof done === 'function' ) { |
| 580 |
done( false, null ); |
| 581 |
} |
| 582 |
return; |
| 583 |
} |
| 584 |
|
| 585 |
page = parseInt( page || 1, 10 ); |
| 586 |
search = wpbc_bfb__normalize_template_search( search ); |
| 587 |
|
| 588 |
if ( ! page || page < 1 ) { |
| 589 |
page = 1; |
| 590 |
} |
| 591 |
|
| 592 |
api.on_set_error( '' ); |
| 593 |
api.set_loading( true ); |
| 594 |
|
| 595 |
w.wpbc_bfb__ajax_list_user_forms( |
| 596 |
null, |
| 597 |
{ |
| 598 |
include_global : 1, |
| 599 |
status : 'template', |
| 600 |
page : page, |
| 601 |
limit : 20, |
| 602 |
search : search |
| 603 |
}, |
| 604 |
function (ok, data) { |
| 605 |
|
| 606 |
if ( ! ok || ! data || ! data.forms ) { |
| 607 |
api.set_loading( false ); |
| 608 |
api.on_set_error( api.load_failed_text ); |
| 609 |
api.set_pager( 1, false ); |
| 610 |
api.render_list( [] ); |
| 611 |
|
| 612 |
if ( typeof done === 'function' ) { |
| 613 |
done( false, null ); |
| 614 |
} |
| 615 |
return; |
| 616 |
} |
| 617 |
|
| 618 |
api.modal_el.__wpbc_bfb_templates_cache = data.forms || []; |
| 619 |
api.modal_el.__wpbc_bfb_tpl_page = data.page || page; |
| 620 |
api.modal_el.__wpbc_bfb_tpl_has_more = !! data.has_more; |
| 621 |
api.modal_el.__wpbc_bfb_tpl_search = search; |
| 622 |
|
| 623 |
api.sync_template_search_presets( search ); |
| 624 |
api.render_list( api.modal_el.__wpbc_bfb_templates_cache ); |
| 625 |
api.set_pager( api.modal_el.__wpbc_bfb_tpl_page, api.modal_el.__wpbc_bfb_tpl_has_more ); |
| 626 |
|
| 627 |
if ( typeof done === 'function' ) { |
| 628 |
done( true, data ); |
| 629 |
} |
| 630 |
} |
| 631 |
); |
| 632 |
}; |
| 633 |
|
| 634 |
api.apply_search_value = function (search_value, done) { |
| 635 |
const search_el = api.get_search_input(); |
| 636 |
const normalized_search = wpbc_bfb__normalize_template_search( search_value ); |
| 637 |
|
| 638 |
if ( search_el ) { |
| 639 |
search_el.value = normalized_search; |
| 640 |
} |
| 641 |
|
| 642 |
if ( api.modal_el ) { |
| 643 |
api.modal_el.__wpbc_bfb_tpl_search = normalized_search; |
| 644 |
} |
| 645 |
|
| 646 |
api.sync_template_search_presets( normalized_search ); |
| 647 |
api.load_templates( 1, normalized_search, done ); |
| 648 |
}; |
| 649 |
|
| 650 |
api.reset_state = function () { |
| 651 |
const search_el = api.get_search_input(); |
| 652 |
|
| 653 |
if ( search_el ) { |
| 654 |
search_el.value = ''; |
| 655 |
} |
| 656 |
|
| 657 |
if ( api.modal_el ) { |
| 658 |
api.modal_el.__wpbc_bfb_selected_template_slug = api.blank_template_slug; |
| 659 |
api.modal_el.__wpbc_bfb_templates_cache = []; |
| 660 |
api.modal_el.__wpbc_bfb_tpl_page = 1; |
| 661 |
api.modal_el.__wpbc_bfb_tpl_has_more = false; |
| 662 |
api.modal_el.__wpbc_bfb_tpl_search = ''; |
| 663 |
|
| 664 |
if ( api.modal_el.__wpbc_bfb_tpl_search_timer ) { |
| 665 |
try { |
| 666 |
clearTimeout( api.modal_el.__wpbc_bfb_tpl_search_timer ); |
| 667 |
} catch ( _e ) {} |
| 668 |
} |
| 669 |
api.modal_el.__wpbc_bfb_tpl_search_timer = 0; |
| 670 |
} |
| 671 |
|
| 672 |
api.sync_template_search_presets( '' ); |
| 673 |
api.on_set_error( '' ); |
| 674 |
}; |
| 675 |
|
| 676 |
api.bind_handlers = function () { |
| 677 |
if ( ! api.modal_el || api.modal_el.__wpbc_bfb_template_picker_handlers_bound ) { |
| 678 |
return; |
| 679 |
} |
| 680 |
api.modal_el.__wpbc_bfb_template_picker_handlers_bound = true; |
| 681 |
|
| 682 |
const search_el = api.get_search_input(); |
| 683 |
|
| 684 |
api.modal_el.addEventListener( 'click', function (e) { |
| 685 |
if ( ! e || ! e.target || ! e.target.closest ) { |
| 686 |
return; |
| 687 |
} |
| 688 |
|
| 689 |
const delete_btn = e.target.closest( '[data-wpbc-bfb-tpl-delete="1"]' ); |
| 690 |
if ( delete_btn ) { |
| 691 |
if ( ! api.allow_delete ) { |
| 692 |
return; |
| 693 |
} |
| 694 |
e.preventDefault(); |
| 695 |
e.stopPropagation(); |
| 696 |
if ( api.on_delete_click ) { |
| 697 |
api.on_delete_click( delete_btn, api ); |
| 698 |
} else if ( typeof api.delete_template === 'function' ) { |
| 699 |
api.delete_template( delete_btn ); |
| 700 |
} |
| 701 |
return; |
| 702 |
} |
| 703 |
|
| 704 |
const preset_btn = e.target.closest( '[data-wpbc-bfb-tpl-search-key]' ); |
| 705 |
if ( preset_btn ) { |
| 706 |
e.preventDefault(); |
| 707 |
e.stopPropagation(); |
| 708 |
api.apply_search_value( |
| 709 |
preset_btn.getAttribute( 'data-wpbc-bfb-tpl-search-key' ) || '', |
| 710 |
function () { |
| 711 |
api.on_selection_change( api.get_selected_template_slug(), api ); |
| 712 |
} |
| 713 |
); |
| 714 |
return; |
| 715 |
} |
| 716 |
|
| 717 |
const pager = e.target.closest( '[data-wpbc-bfb-tpl-pager="1"]' ); |
| 718 |
if ( pager ) { |
| 719 |
const prev = e.target.closest( '[data-wpbc-bfb-tpl-page-prev="1"]' ); |
| 720 |
const next = e.target.closest( '[data-wpbc-bfb-tpl-page-next="1"]' ); |
| 721 |
|
| 722 |
if ( ! prev && ! next ) { |
| 723 |
return; |
| 724 |
} |
| 725 |
|
| 726 |
e.preventDefault(); |
| 727 |
|
| 728 |
if ( |
| 729 |
( prev && ( prev.classList.contains( 'disabled' ) || prev.getAttribute( 'aria-disabled' ) === 'true' ) ) || |
| 730 |
( next && ( next.classList.contains( 'disabled' ) || next.getAttribute( 'aria-disabled' ) === 'true' ) ) |
| 731 |
) { |
| 732 |
return; |
| 733 |
} |
| 734 |
|
| 735 |
const page = parseInt( api.modal_el.__wpbc_bfb_tpl_page || 1, 10 ) || 1; |
| 736 |
const search = String( api.modal_el.__wpbc_bfb_tpl_search || '' ); |
| 737 |
|
| 738 |
if ( prev ) { |
| 739 |
api.load_templates( Math.max( 1, page - 1 ), search, function () {} ); |
| 740 |
} |
| 741 |
if ( next ) { |
| 742 |
api.load_templates( page + 1, search, function () {} ); |
| 743 |
} |
| 744 |
return; |
| 745 |
} |
| 746 |
|
| 747 |
const item = e.target.closest( '[data-wpbc-bfb-tpl-item="1"]' ); |
| 748 |
if ( ! item ) { |
| 749 |
return; |
| 750 |
} |
| 751 |
|
| 752 |
e.preventDefault(); |
| 753 |
|
| 754 |
const clicked = item.getAttribute( 'data-template-slug' ) || ''; |
| 755 |
const current = api.get_selected_template_slug(); |
| 756 |
|
| 757 |
if ( clicked && clicked === current && clicked !== api.blank_template_slug && api.allow_same_click_blank ) { |
| 758 |
api.set_selected_template_slug( api.blank_template_slug ); |
| 759 |
} else if ( clicked ) { |
| 760 |
api.set_selected_template_slug( clicked ); |
| 761 |
} else { |
| 762 |
api.set_selected_template_slug( api.blank_template_slug ); |
| 763 |
} |
| 764 |
|
| 765 |
api.refresh_selection_highlight(); |
| 766 |
api.on_selection_change( api.get_selected_template_slug(), api ); |
| 767 |
}, true ); |
| 768 |
|
| 769 |
if ( search_el ) { |
| 770 |
search_el.addEventListener( 'input', function () { |
| 771 |
const v = String( search_el.value || '' ); |
| 772 |
|
| 773 |
if ( api.modal_el.__wpbc_bfb_tpl_search_timer ) { |
| 774 |
clearTimeout( api.modal_el.__wpbc_bfb_tpl_search_timer ); |
| 775 |
} |
| 776 |
|
| 777 |
api.modal_el.__wpbc_bfb_tpl_search_timer = setTimeout( function () { |
| 778 |
api.apply_search_value( v, function () { |
| 779 |
api.on_selection_change( api.get_selected_template_slug(), api ); |
| 780 |
} ); |
| 781 |
}, 300 ); |
| 782 |
}, true ); |
| 783 |
} |
| 784 |
}; |
| 785 |
|
| 786 |
return api; |
| 787 |
}; |
| 788 |
|
| 789 |
w.wpbc_bfb__get_template_search_or_sep = wpbc_bfb__get_template_search_or_sep; |
| 790 |
w.wpbc_bfb__get_template_search_or_sep_url = wpbc_bfb__get_template_search_or_sep_url; |
| 791 |
w.wpbc_bfb__escape_regex = wpbc_bfb__escape_regex; |
| 792 |
w.wpbc_bfb__normalize_template_search = wpbc_bfb__normalize_template_search; |
| 793 |
w.wpbc_bfb__i18n = wpbc_bfb__i18n; |
| 794 |
|
| 795 |
}( window, document )); |
| 796 |
|
| 797 |
|
