pro
1 year ago
_acf-compatibility.js
1 year ago
_acf-condition-types.js
1 year ago
_acf-condition.js
1 year ago
_acf-conditions.js
1 year ago
_acf-field-accordion.js
1 year ago
_acf-field-button-group.js
1 year ago
_acf-field-checkbox.js
1 year ago
_acf-field-color-picker.js
1 year ago
_acf-field-date-picker.js
1 year ago
_acf-field-date-time-picker.js
1 year ago
_acf-field-file.js
1 year ago
_acf-field-google-map.js
1 year ago
_acf-field-icon-picker.js
1 year ago
_acf-field-image.js
1 year ago
_acf-field-link.js
1 year ago
_acf-field-oembed.js
1 year ago
_acf-field-page-link.js
1 year ago
_acf-field-post-object.js
1 year ago
_acf-field-radio.js
1 year ago
_acf-field-range.js
1 year ago
_acf-field-relationship.js
1 year ago
_acf-field-select.js
1 year ago
_acf-field-tab.js
1 year ago
_acf-field-taxonomy.js
1 year ago
_acf-field-time-picker.js
1 year ago
_acf-field-true-false.js
1 year ago
_acf-field-url.js
1 year ago
_acf-field-user.js
1 year ago
_acf-field-wysiwyg.js
1 year ago
_acf-field.js
1 year ago
_acf-fields.js
1 year ago
_acf-helpers.js
1 year ago
_acf-hooks.js
1 year ago
_acf-internal-post-type.js
1 year ago
_acf-media.js
1 year ago
_acf-modal.js
1 year ago
_acf-model.js
1 year ago
_acf-notice.js
1 year ago
_acf-panel.js
1 year ago
_acf-popup.js
1 year ago
_acf-postbox.js
1 year ago
_acf-screen.js
1 year ago
_acf-select2.js
1 year ago
_acf-tinymce.js
1 year ago
_acf-tooltip.js
1 year ago
_acf-unload.js
1 year ago
_acf-validation.js
1 year ago
_acf.js
1 year ago
_browse-fields-modal.js
1 year ago
_field-group-compatibility.js
1 year ago
_field-group-conditions.js
1 year ago
_field-group-field.js
1 year ago
_field-group-fields.js
1 year ago
_field-group-locations.js
1 year ago
_field-group-settings.js
1 year ago
_field-group.js
1 year ago
acf-escaped-html-notice.js
1 year ago
acf-field-group.js
1 year ago
acf-input.js
1 year ago
acf-internal-post-type.js
1 year ago
acf.js
1 year ago
_field-group.js
399 lines
| 1 | ( function ( $, undefined ) { |
| 2 | /** |
| 3 | * fieldGroupManager |
| 4 | * |
| 5 | * Generic field group functionality |
| 6 | * |
| 7 | * @date 15/12/17 |
| 8 | * @since ACF 5.7.0 |
| 9 | * |
| 10 | * @param void |
| 11 | * @return void |
| 12 | */ |
| 13 | |
| 14 | var fieldGroupManager = new acf.Model( { |
| 15 | id: 'fieldGroupManager', |
| 16 | |
| 17 | events: { |
| 18 | 'submit #post': 'onSubmit', |
| 19 | 'click a[href="#"]': 'onClick', |
| 20 | 'click .acf-delete-field-group': 'onClickDeleteFieldGroup', |
| 21 | 'blur input#title': 'validateTitle', |
| 22 | 'input input#title': 'validateTitle', |
| 23 | }, |
| 24 | |
| 25 | filters: { |
| 26 | find_fields_args: 'filterFindFieldArgs', |
| 27 | find_fields_selector: 'filterFindFieldsSelector', |
| 28 | }, |
| 29 | |
| 30 | initialize: function () { |
| 31 | acf.addAction( 'prepare', this.maybeInitNewFieldGroup ); |
| 32 | acf.add_filter( 'select2_args', this.setBidirectionalSelect2Args ); |
| 33 | acf.add_filter( |
| 34 | 'select2_ajax_data', |
| 35 | this.setBidirectionalSelect2AjaxDataArgs |
| 36 | ); |
| 37 | }, |
| 38 | |
| 39 | setBidirectionalSelect2Args: function ( |
| 40 | args, |
| 41 | $select, |
| 42 | settings, |
| 43 | field, |
| 44 | instance |
| 45 | ) { |
| 46 | if ( field?.data?.( 'key' ) !== 'bidirectional_target' ) return args; |
| 47 | |
| 48 | args.dropdownCssClass = 'field-type-select-results'; |
| 49 | |
| 50 | // Check for a full modern version of select2 like the one provided by ACF. |
| 51 | try { |
| 52 | $.fn.select2.amd.require( 'select2/compat/dropdownCss' ); |
| 53 | } catch ( err ) { |
| 54 | console.warn( |
| 55 | 'ACF was not able to load the full version of select2 due to a conflicting version provided by another plugin or theme taking precedence. Skipping styling of bidirectional settings.' |
| 56 | ); |
| 57 | delete args.dropdownCssClass; |
| 58 | } |
| 59 | |
| 60 | args.templateResult = function ( selection ) { |
| 61 | if ( 'undefined' !== typeof selection.element ) { |
| 62 | return selection; |
| 63 | } |
| 64 | |
| 65 | if ( selection.children ) { |
| 66 | return selection.text; |
| 67 | } |
| 68 | |
| 69 | if ( |
| 70 | selection.loading || |
| 71 | ( selection.element && |
| 72 | selection.element.nodeName === 'OPTGROUP' ) |
| 73 | ) { |
| 74 | var $selection = $( '<span class="acf-selection"></span>' ); |
| 75 | $selection.html( acf.escHtml( selection.text ) ); |
| 76 | return $selection; |
| 77 | } |
| 78 | |
| 79 | if ( |
| 80 | 'undefined' === typeof selection.human_field_type || |
| 81 | 'undefined' === typeof selection.field_type || |
| 82 | 'undefined' === typeof selection.this_field |
| 83 | ) { |
| 84 | return selection.text; |
| 85 | } |
| 86 | |
| 87 | var $selection = $( |
| 88 | '<i title="' + |
| 89 | acf.escHtml( selection.human_field_type ) + |
| 90 | '" class="field-type-icon field-type-icon-' + |
| 91 | acf.escHtml( |
| 92 | selection.field_type.replaceAll( '_', '-' ) |
| 93 | ) + |
| 94 | '"></i><span class="acf-selection has-icon">' + |
| 95 | acf.escHtml( selection.text ) + |
| 96 | '</span>' |
| 97 | ); |
| 98 | if ( selection.this_field ) { |
| 99 | $selection |
| 100 | .last() |
| 101 | .append( |
| 102 | '<span class="acf-select2-default-pill">' + |
| 103 | acf.__( 'This Field' ) + |
| 104 | '</span>' |
| 105 | ); |
| 106 | } |
| 107 | $selection.data( 'element', selection.element ); |
| 108 | return $selection; |
| 109 | }; |
| 110 | |
| 111 | return args; |
| 112 | }, |
| 113 | |
| 114 | setBidirectionalSelect2AjaxDataArgs: function ( |
| 115 | data, |
| 116 | args, |
| 117 | $input, |
| 118 | field, |
| 119 | instance |
| 120 | ) { |
| 121 | if ( data.field_key !== 'bidirectional_target' ) return data; |
| 122 | |
| 123 | const $fieldObject = acf.findFieldObjects( { child: field } ); |
| 124 | const fieldObject = acf.getFieldObject( $fieldObject ); |
| 125 | data.field_key = '_acf_bidirectional_target'; |
| 126 | data.parent_key = fieldObject.get( 'key' ); |
| 127 | data.field_type = fieldObject.get( 'type' ); |
| 128 | |
| 129 | // This might not be needed, but I wanted to figure out how to get a field setting in the JS API when the key isn't unique. |
| 130 | data.post_type = acf |
| 131 | .getField( |
| 132 | acf.findFields( { parent: $fieldObject, key: 'post_type' } ) |
| 133 | ) |
| 134 | .val(); |
| 135 | |
| 136 | return data; |
| 137 | }, |
| 138 | |
| 139 | maybeInitNewFieldGroup: function () { |
| 140 | let $field_list_wrapper = $( |
| 141 | '#acf-field-group-fields > .inside > .acf-field-list-wrap.acf-auto-add-field' |
| 142 | ); |
| 143 | |
| 144 | if ( $field_list_wrapper.length ) { |
| 145 | $( '.acf-headerbar-actions .add-field' ).trigger( 'click' ); |
| 146 | $( '.acf-title-wrap #title' ).trigger( 'focus' ); |
| 147 | } |
| 148 | }, |
| 149 | |
| 150 | onSubmit: function ( e, $el ) { |
| 151 | // vars |
| 152 | var $title = $( '.acf-title-wrap #title' ); |
| 153 | |
| 154 | // empty |
| 155 | if ( ! $title.val() ) { |
| 156 | // prevent default |
| 157 | e.preventDefault(); |
| 158 | |
| 159 | // unlock form |
| 160 | acf.unlockForm( $el ); |
| 161 | |
| 162 | // focus |
| 163 | $title.trigger( 'focus' ); |
| 164 | } |
| 165 | }, |
| 166 | |
| 167 | onClick: function ( e ) { |
| 168 | e.preventDefault(); |
| 169 | }, |
| 170 | |
| 171 | onClickDeleteFieldGroup: function ( e, $el ) { |
| 172 | e.preventDefault(); |
| 173 | $el.addClass( '-hover' ); |
| 174 | |
| 175 | // Add confirmation tooltip. |
| 176 | acf.newTooltip( { |
| 177 | confirm: true, |
| 178 | target: $el, |
| 179 | context: this, |
| 180 | text: acf.__( 'Move field group to trash?' ), |
| 181 | confirm: function () { |
| 182 | window.location.href = $el.attr( 'href' ); |
| 183 | }, |
| 184 | cancel: function () { |
| 185 | $el.removeClass( '-hover' ); |
| 186 | }, |
| 187 | } ); |
| 188 | }, |
| 189 | |
| 190 | validateTitle: function ( e, $el ) { |
| 191 | let $submitButton = $( '.acf-publish' ); |
| 192 | |
| 193 | if ( ! $el.val() ) { |
| 194 | $el.addClass( 'acf-input-error' ); |
| 195 | $submitButton.addClass( 'disabled' ); |
| 196 | $( '.acf-publish' ).addClass( 'disabled' ); |
| 197 | } else { |
| 198 | $el.removeClass( 'acf-input-error' ); |
| 199 | $submitButton.removeClass( 'disabled' ); |
| 200 | $( '.acf-publish' ).removeClass( 'disabled' ); |
| 201 | } |
| 202 | }, |
| 203 | |
| 204 | filterFindFieldArgs: function ( args ) { |
| 205 | args.visible = true; |
| 206 | |
| 207 | if ( |
| 208 | args.parent && |
| 209 | ( args.parent.hasClass( 'acf-field-object' ) || |
| 210 | args.parent.hasClass( 'acf-browse-fields-modal-wrap' ) || |
| 211 | args.parent.parents( '.acf-field-object' ).length ) |
| 212 | ) { |
| 213 | args.visible = false; |
| 214 | args.excludeSubFields = true; |
| 215 | } |
| 216 | |
| 217 | // If the field has any open subfields, don't exclude subfields as they're already being displayed. |
| 218 | if ( |
| 219 | args.parent && |
| 220 | args.parent.find( '.acf-field-object.open' ).length |
| 221 | ) { |
| 222 | args.excludeSubFields = false; |
| 223 | } |
| 224 | |
| 225 | return args; |
| 226 | }, |
| 227 | |
| 228 | filterFindFieldsSelector: function ( selector ) { |
| 229 | return selector + ', .acf-field-acf-field-group-settings-tabs'; |
| 230 | }, |
| 231 | } ); |
| 232 | |
| 233 | /** |
| 234 | * screenOptionsManager |
| 235 | * |
| 236 | * Screen options functionality |
| 237 | * |
| 238 | * @date 15/12/17 |
| 239 | * @since ACF 5.7.0 |
| 240 | * |
| 241 | * @param void |
| 242 | * @return void |
| 243 | */ |
| 244 | |
| 245 | var screenOptionsManager = new acf.Model( { |
| 246 | id: 'screenOptionsManager', |
| 247 | wait: 'prepare', |
| 248 | |
| 249 | events: { |
| 250 | 'change #acf-field-key-hide': 'onFieldKeysChange', |
| 251 | 'change #acf-field-settings-tabs': 'onFieldSettingsTabsChange', |
| 252 | 'change [name="screen_columns"]': 'render', |
| 253 | }, |
| 254 | |
| 255 | initialize: function () { |
| 256 | // vars |
| 257 | var $div = $( '#adv-settings' ); |
| 258 | var $append = $( '#acf-append-show-on-screen' ); |
| 259 | |
| 260 | // append |
| 261 | $div.find( '.metabox-prefs' ).append( $append.html() ); |
| 262 | $div.find( '.metabox-prefs br' ).remove(); |
| 263 | |
| 264 | // clean up |
| 265 | $append.remove(); |
| 266 | |
| 267 | // initialize |
| 268 | this.$el = $( '#screen-options-wrap' ); |
| 269 | |
| 270 | // render |
| 271 | this.render(); |
| 272 | }, |
| 273 | |
| 274 | isFieldKeysChecked: function () { |
| 275 | return this.$el.find( '#acf-field-key-hide' ).prop( 'checked' ); |
| 276 | }, |
| 277 | |
| 278 | isFieldSettingsTabsChecked: function () { |
| 279 | const $input = this.$el.find( '#acf-field-settings-tabs' ); |
| 280 | |
| 281 | // Screen option is hidden by filter. |
| 282 | if ( ! $input.length ) { |
| 283 | return false; |
| 284 | } |
| 285 | |
| 286 | return $input.prop( 'checked' ); |
| 287 | }, |
| 288 | |
| 289 | getSelectedColumnCount: function () { |
| 290 | return this.$el |
| 291 | .find( 'input[name="screen_columns"]:checked' ) |
| 292 | .val(); |
| 293 | }, |
| 294 | |
| 295 | onFieldKeysChange: function ( e, $el ) { |
| 296 | var val = this.isFieldKeysChecked() ? 1 : 0; |
| 297 | acf.updateUserSetting( 'show_field_keys', val ); |
| 298 | this.render(); |
| 299 | }, |
| 300 | |
| 301 | onFieldSettingsTabsChange: function () { |
| 302 | const val = this.isFieldSettingsTabsChecked() ? 1 : 0; |
| 303 | acf.updateUserSetting( 'show_field_settings_tabs', val ); |
| 304 | this.render(); |
| 305 | }, |
| 306 | |
| 307 | render: function () { |
| 308 | if ( this.isFieldKeysChecked() ) { |
| 309 | $( '#acf-field-group-fields' ).addClass( 'show-field-keys' ); |
| 310 | } else { |
| 311 | $( '#acf-field-group-fields' ).removeClass( 'show-field-keys' ); |
| 312 | } |
| 313 | |
| 314 | if ( ! this.isFieldSettingsTabsChecked() ) { |
| 315 | $( '#acf-field-group-fields' ).addClass( 'hide-tabs' ); |
| 316 | $( '.acf-field-settings-main' ) |
| 317 | .removeClass( 'acf-hidden' ) |
| 318 | .prop( 'hidden', false ); |
| 319 | } else { |
| 320 | $( '#acf-field-group-fields' ).removeClass( 'hide-tabs' ); |
| 321 | |
| 322 | $( '.acf-field-object' ).each( function () { |
| 323 | const tabFields = acf.getFields( { |
| 324 | type: 'tab', |
| 325 | parent: $( this ), |
| 326 | excludeSubFields: true, |
| 327 | limit: 1, |
| 328 | } ); |
| 329 | |
| 330 | if ( tabFields.length ) { |
| 331 | tabFields[ 0 ].tabs.set( 'initialized', false ); |
| 332 | } |
| 333 | |
| 334 | acf.doAction( 'show', $( this ) ); |
| 335 | } ); |
| 336 | } |
| 337 | |
| 338 | if ( this.getSelectedColumnCount() == 1 ) { |
| 339 | $( 'body' ).removeClass( 'columns-2' ); |
| 340 | $( 'body' ).addClass( 'columns-1' ); |
| 341 | } else { |
| 342 | $( 'body' ).removeClass( 'columns-1' ); |
| 343 | $( 'body' ).addClass( 'columns-2' ); |
| 344 | } |
| 345 | }, |
| 346 | } ); |
| 347 | |
| 348 | /** |
| 349 | * appendFieldManager |
| 350 | * |
| 351 | * Appends fields together |
| 352 | * |
| 353 | * @date 15/12/17 |
| 354 | * @since ACF 5.7.0 |
| 355 | * |
| 356 | * @param void |
| 357 | * @return void |
| 358 | */ |
| 359 | |
| 360 | var appendFieldManager = new acf.Model( { |
| 361 | actions: { |
| 362 | new_field: 'onNewField', |
| 363 | }, |
| 364 | |
| 365 | onNewField: function ( field ) { |
| 366 | // bail early if not append |
| 367 | if ( ! field.has( 'append' ) ) return; |
| 368 | |
| 369 | // vars |
| 370 | var append = field.get( 'append' ); |
| 371 | var $sibling = field.$el |
| 372 | .siblings( '[data-name="' + append + '"]' ) |
| 373 | .first(); |
| 374 | |
| 375 | // bail early if no sibling |
| 376 | if ( ! $sibling.length ) return; |
| 377 | |
| 378 | // ul |
| 379 | var $div = $sibling.children( '.acf-input' ); |
| 380 | var $ul = $div.children( 'ul' ); |
| 381 | |
| 382 | // create ul |
| 383 | if ( ! $ul.length ) { |
| 384 | $div.wrapInner( '<ul class="acf-hl"><li></li></ul>' ); |
| 385 | $ul = $div.children( 'ul' ); |
| 386 | } |
| 387 | |
| 388 | // li |
| 389 | var html = field.$( '.acf-input' ).html(); |
| 390 | var $li = $( '<li>' + html + '</li>' ); |
| 391 | $ul.append( $li ); |
| 392 | $ul.attr( 'data-cols', $ul.children().length ); |
| 393 | |
| 394 | // clean up |
| 395 | field.remove(); |
| 396 | }, |
| 397 | } ); |
| 398 | } )( jQuery ); |
| 399 |