ui-field.php 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <script type="text/html" id="tmpl-fl-builder-field">
  2. <# if ( ! data.field.label ) { #>
  3. <td class="fl-field-control" colspan="2">
  4. <# } else { #>
  5. <th class="fl-field-label">
  6. <label for="{{data.name}}">
  7. <# if ( 'button' === data.field.type ) { #>
  8. &nbsp;
  9. <# } else { #>
  10. {{{data.field.label}}}
  11. <# if ( undefined !== data.index ) { #>
  12. <# var index = data.index + 1; #>
  13. <span class="fl-builder-field-index">{{index}}</span>
  14. <# } #>
  15. <# } #>
  16. <# if ( data.responsive ) { #>
  17. <i class="fl-field-responsive-toggle dashicons dashicons-desktop" data-mode="default"></i>
  18. <# } #>
  19. <# if ( data.field.help ) { #>
  20. <span class="fl-help-tooltip">
  21. <i class="fl-help-tooltip-icon fas fa-question-circle"></i>
  22. <span class="fl-help-tooltip-text">{{{data.field.help}}}</span>
  23. </span>
  24. <# } #>
  25. </label>
  26. </th>
  27. <td class="fl-field-control">
  28. <# } #>
  29. <div class="fl-field-control-wrapper">
  30. <# if ( data.responsive ) { #>
  31. <i class="fl-field-responsive-toggle dashicons dashicons-desktop" data-mode="default"></i>
  32. <# } #>
  33. <# var devices = [ 'default', 'medium', 'responsive' ]; #>
  34. <# for ( var i = 0; i < devices.length; i++ ) { #>
  35. <# if ( 'default' !== devices[ i ] && ! data.responsive ) {
  36. continue;
  37. } #>
  38. <# if ( data.responsive ) {
  39. data.name = 'default' === devices[ i ] ? data.rootName : data.rootName + '_' + devices[ i ];
  40. data.value = data.settings[ data.name ] ? data.settings[ data.name ] : '';
  41. if ( 'object' === typeof data.responsive ) {
  42. for ( var key in data.responsive ) {
  43. if ( 'object' === typeof data.responsive[ key ] && data.responsive[ key ][ devices[ i ] ] ) {
  44. data.field[ key ] = data.responsive[ key ][ devices[ i ] ];
  45. }
  46. }
  47. }
  48. #>
  49. <div class="fl-field-responsive-setting fl-field-responsive-setting-{{devices[ i ]}}" data-device="{{devices[ i ]}}">
  50. <# } #>
  51. <# if ( data.template.length ) {
  52. var template = wp.template( 'fl-builder-field-' + data.field.type ),
  53. field = template( data ),
  54. before = data.field.html_before ? data.field.html_before : '',
  55. after = data.field.html_after ? data.field.html_after : '';
  56. #>
  57. {{{before}}}{{{field}}}{{{after}}}
  58. <# } else {
  59. var name = data.name.replace( '[]', '' );
  60. #>
  61. <div class="fl-legacy-field" data-field="{{name}}" />
  62. <# } #>
  63. <# if ( data.responsive ) { #>
  64. </div>
  65. <# } #>
  66. <# } #>
  67. <# if ( data.field.description ) { #>
  68. <span class="fl-field-description">{{{data.field.description}}}</span>
  69. <# } #>
  70. </div>
  71. </td>
  72. </script>