updated scripts to use newly passed data

smithfield-studio · Sep 10, 2021 · 5062c9f · 5062c9f
1 parent e18d5ca
commit 5062c9f
Show file tree

Hide file tree

Showing 5 changed files with 161 additions and 5 deletions.
diff --git a/assets/css/style.min.css b/assets/css/style.min.css
diff --git a/assets/js/input-5.js b/assets/js/input-5.js
@@ -7,7 +7,7 @@
             dropdownAutoWidth: true,
             formatResult: svg_icon_format,
             formatSelection: svg_icon_format_small,
-            data: {results: svg_icon_format_data},
+            data: {results: svg_icon_format_data.items},
             allowClear: 1 == allowClear
         };
 

diff --git a/assets/js/input-5.min.js b/assets/js/input-5.min.js
@@ -1 +1,79 @@
-!function(t){acf.add_action("ready append",function(a){acf.get_fields({type:"svg_icon"},a).each(function(){!function(a){var i=a.find(".acf-input input"),n=t(i).attr("data-allow-clear")||0,e={dropdownCssClass:"bigdrop widefat",dropdownAutoWidth:!0,formatResult:function(a){return a.id?a.url?(s(a.url,a.id,a.text),t('<span class="acf_svg__icon icon" data-id="'+a.id+'">'+a.text+"</span>")):t('<svg class="acf_svg__icon icon '+a.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+a.id+'"></use></svg>'+a.text):a.text},formatSelection:function(a){return a.id?a.url?(s(a.url,a.id,a.text),t('<span class="acf_svg__icon icon" data-id="'+a.id+'">'+a.text+"</span>")):t('<svg class="acf_svg__icon icon '+a.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+a.id+'"></use></svg>'+a.text):a.text},data:{results:svg_icon_format_data},allowClear:1==n};async function s(a,i,n){var e=await fetch(a),s=await e.text();t('span[data-id="'+i+'"]').html(s+n)}i.select2(e)}(t(this))})})}(jQuery);
+!function(t){acf.add_action("ready append",function(i){acf.get_fields({type:"svg_icon"},i).each(function(){!function(i){var a=i.find(".acf-input input"),n=t(a).attr("data-allow-clear")||0,e={dropdownCssClass:"bigdrop widefat",dropdownAutoWidth:!0,formatResult:function(i){return i.id?i.url?(s(i.url,i.id,i.text),t('<span class="acf_svg__icon icon" data-id="'+i.id+'">'+i.text+"</span>")):t('<svg class="acf_svg__icon icon '+i.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+i.id+'"></use></svg>'+i.text):i.text},formatSelection:function(i){return i.id?i.url?(s(i.url,i.id,i.text),t('<span class="acf_svg__icon icon" data-id="'+i.id+'">'+i.text+"</span>")):t('<svg class="acf_svg__icon icon '+i.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+i.id+'"></use></svg>'+i.text):i.text},data:{results:svg_icon_format_data.items},allowClear:1==n};async function s(i,a,n){var e=await fetch(i),s=await e.text();t('span[data-id="'+a+'"]').html(s+n)}a.select2(e)}(t(this))})})}(jQuery);
+(function ($) {
+    function initialize_field($field) {
+        var input = $field.find('.acf-input input');
+        var allowClear = $(input).attr('data-allow-clear') || 0;
+        var opts = {
+            dropdownCssClass: "bigdrop widefat",
+            dropdownAutoWidth: true,
+            formatResult: svg_icon_format,
+            formatSelection: svg_icon_format_small,
+            data: {results: svg_icon_format_data.items},
+            allowClear: 1 == allowClear
+        };
+
+        input.select2(opts);
+
+        async function fetchSvg(url, id, text) {
+            var req = await fetch(url);
+            var svg = await req.text();
+            $('span[data-id="' + id + '"]').html(svg + text);
+        }
+
+        /**
+         * Format the content in select 2 for the selected item
+         *
+         * @param css
+         * @returns {string}
+         */
+        function svg_icon_format(css) {
+            if (!css.id) {
+                return css.text;
+            }
+            if (css.url) {
+                fetchSvg(css.url, css.id, css.text);
+                return $('<span class="acf_svg__icon icon" data-id="' + css.id + '">' + css.text + '</span>');
+            } else {
+                return $('<svg class="acf_svg__icon icon ' + css.id + '" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#' + css.id + '"></use></svg>' + css.text );
+            }
+        };
+
+        /**
+         * Format the content in select 2 for the dropdown list
+         *
+         * @param css
+         * @returns {string}
+         */
+        function svg_icon_format_small(css) {
+            if (!css.id) {
+                return css.text;
+            }
+            if (css.url) {
+                fetchSvg(css.url, css.id, css.text);
+                return $('<span class="acf_svg__icon icon" data-id="' + css.id + '">' + css.text + '</span>');
+            } else {
+                return $('<svg class="acf_svg__icon icon ' + css.id + '" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#' + css.id + '"></use></svg>' + css.text );
+            }
+        };
+    }
+
+    /*
+     *  ready append (ACF5)
+     *
+     *  These are 2 events which are fired during the page load
+     *  ready = on page load similar to jQuery(document).ready()
+     *  append = on new DOM elements appended via repeater field
+     *
+     *  @type	event
+     *  @date	20/07/13
+     *
+     *  @param	jQueryel (jQuery selection) the jQuery element which contains the ACF fields
+     *  @return	n/a
+     */
+    acf.add_action('ready append', function (jQueryel) {
+        // search jQueryel for fields of type 'FIELD_NAME'
+        acf.get_fields({type: 'svg_icon'}, jQueryel).each(function () {
+            initialize_field($(this));
+        });
+    });
+})(jQuery);
diff --git a/assets/js/input-56.js b/assets/js/input-56.js
@@ -7,7 +7,7 @@
             dropdownAutoWidth: true,
             templateResult: bea_svg_format,
             templateSelection: bea_svg_format_small,
-            data: svg_icon_format_data,
+            data: svg_icon_format_data.items,
             allowClear: 1 == allowClear,
         };
 

diff --git a/assets/js/input-56.min.js b/assets/js/input-56.min.js
@@ -1 +1,79 @@
-!function(a){acf.add_action("ready append",function(t){acf.get_fields({type:"svg_icon"},t).each(function(){!function(t){var n=t.find(".acf-input input"),s=a(n).attr("data-allow-clear")||0,i={dropdownCssClass:"bigdrop widefat",dropdownAutoWidth:!0,templateResult:function(t){return t.id?t.url?(e(t.url,t.id,t.text),a('<span class="acf_svg__span" data-id="'+t.id+'">'+t.text+"</span>")):a('<span class="acf_svg__span"><svg class="acf_svg__icon icon '+t.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+t.id+'"></use></svg>'+t.text+"</span>"):t.text},templateSelection:function(t){return t.id?t.url?(e(t.url,t.id,t.text),a('<span class="acf_svg__span" data-id="'+t.id+'">'+t.text+"</span>")):a('<span class="acf_svg__span"><svg class="acf_svg__icon small icon '+t.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+t.id+'"></use></svg>'+t.text+"</span>"):t.text},data:svg_icon_format_data,allowClear:1==s};async function e(t,n,s){var i=await fetch(t),e=await i.text();a('span[data-id="'+n+'"]').html(e+s)}n.select2(i)}(a(this))})})}(jQuery);
+!function(a){acf.add_action("ready append",function(t){acf.get_fields({type:"svg_icon"},t).each(function(){!function(t){var n=t.find(".acf-input input"),s=a(n).attr("data-allow-clear")||0,i={dropdownCssClass:"bigdrop widefat",dropdownAutoWidth:!0,templateResult:function(t){return t.id?t.url?(e(t.url,t.id,t.text),a('<span class="acf_svg__span" data-id="'+t.id+'">'+t.text+"</span>")):a('<span class="acf_svg__span"><svg class="acf_svg__icon icon '+t.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+t.id+'"></use></svg>'+t.text+"</span>"):t.text},templateSelection:function(t){return t.id?t.url?(e(t.url,t.id,t.text),a('<span class="acf_svg__span" data-id="'+t.id+'">'+t.text+"</span>")):a('<span class="acf_svg__span"><svg class="acf_svg__icon small icon '+t.id+'" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#'+t.id+'"></use></svg>'+t.text+"</span>"):t.text},data:svg_icon_format_data.items,allowClear:1==s};async function e(t,n,s){var i=await fetch(t),e=await i.text();a('span[data-id="'+n+'"]').html(e+s)}n.select2(i)}(a(this))})})}(jQuery);
+(function ($) {
+    function initialize_field($field) {
+        var input = $field.find('.acf-input input');
+        var allowClear = $(input).attr('data-allow-clear') || 0;
+        var opts = {
+            dropdownCssClass: "bigdrop widefat",
+            dropdownAutoWidth: true,
+            templateResult: bea_svg_format,
+            templateSelection: bea_svg_format_small,
+            data: svg_icon_format_data.items,
+            allowClear: 1 == allowClear,
+        };
+
+        input.select2(opts);
+
+        async function fetchSvg(url, id, text) {
+            var req = await fetch(url);
+            var svg = await req.text();
+            $('span[data-id="' + id + '"]').html(svg + text);
+        }
+
+        /**
+         * Format the content in select 2 for the selected item
+         *
+         * @param css
+         * @returns {string}
+         */
+        function bea_svg_format(css) {
+            if (!css.id) {
+                return css.text;
+            }
+            if (css.url) {
+                fetchSvg(css.url, css.id, css.text);
+                return $('<span class="acf_svg__span" data-id="' + css.id + '">' + css.text + '</span>');
+            } else {
+                return $('<span class="acf_svg__span"><svg class="acf_svg__icon icon ' + css.id + '" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#' + css.id + '"></use></svg>' + css.text + '</span>');
+            }
+        };
+
+        /**
+         * Format the content in select 2 for the dropdown list
+         *
+         * @param css
+         * @returns {string}
+         */
+        function bea_svg_format_small(css) {
+            if (!css.id) {
+                return css.text;
+            }
+            if (css.url) {
+                fetchSvg(css.url, css.id, css.text);
+                return $('<span class="acf_svg__span" data-id="' + css.id + '">' + css.text + '</span>');
+            } else {
+                return $('<span class="acf_svg__span"><svg class="acf_svg__icon small icon ' + css.id + '" aria-hidden="true" role="img"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#' + css.id + '"></use></svg>' + css.text + '</span>');
+            }
+        };
+    }
+
+    /*
+     *  ready append (ACF5)
+     *
+     *  These are 2 events which are fired during the page load
+     *  ready = on page load similar to jQuery(document).ready()
+     *  append = on new DOM elements appended via repeater field
+     *
+     *  @type	event
+     *  @date	20/07/13
+     *
+     *  @param	jQueryel (jQuery selection) the jQuery element which contains the ACF fields
+     *  @return	n/a
+     */
+    acf.add_action('ready append', function (jQueryel) {
+        // search jQueryel for fields of type 'FIELD_NAME'
+        acf.get_fields({type: 'svg_icon'}, jQueryel).each(function () {
+            initialize_field($(this));
+        });
+    });
+})(jQuery);