https://getrecast.com/wp-content/plugins/svg-support/js/svgs-inline.js

1/* eslint-env jquery */
2/* global svgSettings, ForceInlineSVGActive, cssTarget, frontSanitizationEnabled, DOMPurify, jQuery */
3
4jQuery(document).ready(function ($) {
5
6    let bodhisvgsReplacements = 0;
7    let target;
8
9    // Function to replace the img tag with the SVG
10    function bodhisvgsReplace(img) {
11        const hasTargetClass = img.hasClass(target);
12        const parentHasTargetClass = img.parent().hasClass(target);
13        const insideTargetContainer = img.closest('.' + target).length > 0;
14        
15        // First check if we should process at all
16        if (ForceInlineSVGActive !== 'true' && !hasTargetClass && !insideTargetContainer) {
17            return;
18        }
19
20        // If skip nested is enabled, only skip if:
21        // 1. Image doesn't have target class AND
22        // 2. Image's parent is not the target container but is inside one
23        if (svgSettings.skipNested && !hasTargetClass && !parentHasTargetClass && insideTargetContainer) {
24            return;
25        }
26
27        var imgID = img.attr('id');
28        var imgClass = img.attr('class');
29        var imgURL = img.attr('src');
30
31        // Ensure the URL ends with .svg before proceeding
32        if (!imgURL.endsWith('svg')) {
33            return;
34        }
35
36        // Use jQuery's get method to fetch the SVG
37        $.get(imgURL, function(data) {
38
39            // Get the SVG tag, ignore the rest
40            var $svg = $(data).find('svg');
41
42            var svgID = $svg.attr('id');
43
44            // Add replaced image's ID to the new SVG if necessary
45            if (typeof imgID === 'undefined') {
46                if (typeof svgID === 'undefined') {
47                    imgID = 'svg-replaced-' + bodhisvgsReplacements;
48                    $svg = $svg.attr('id', imgID);
49                } else {
50                    imgID = svgID;
51                }
52            } else {
53                $svg = $svg.attr('id', imgID);
54            }
55
56            // Add replaced image's classes to the new SVG
57            if (typeof imgClass !== 'undefined') {
58                $svg = $svg.attr('class', imgClass + ' replaced-svg svg-replaced-' + bodhisvgsReplacements);
59            }
60
61            // Remove any invalid XML tags as per http://validator.w3.org
62            $svg = $svg.removeAttr('xmlns:a');
63
64            // If sanitization is enabled, sanitize the SVG code
65            if (frontSanitizationEnabled === 'on' && $svg[0]['outerHTML'] != "") {
66                $svg = DOMPurify.sanitize($svg[0]['outerHTML']);
67            }
68
69            // Replace image with new SVG
70            img.replaceWith($svg);
71
72            // Increment the replacements counter
73            bodhisvgsReplacements++;
74
75            // Trigger custom event after SVG is loaded
76            $(document).trigger('svg.loaded', [imgID]);
77
78        }, 'xml').fail(function() {
79            // Silently fail
80        });
81
82    }
83
84    // Wrap in IIFE so that it can be called again later as bodhisvgsInlineSupport();
85    (bodhisvgsInlineSupport = function () {
86
87        // If force inline SVG option is active then add class
88        if (ForceInlineSVGActive === 'true') {
89
90            // Find all SVG inside img and add class if it hasn't got it
91            jQuery('img').each(function () {
92
93                // Check if the SRC attribute is present at all
94                if (typeof jQuery(this).attr('src') !== typeof undefined && jQuery(this).attr('src') !== false) {
95
96                    // Pick only those with the extension we want
97                    if (jQuery(this).attr('src').match(/\.(svg)/)) {
98
99                        // Add our class name
100                        if (!jQuery(this).hasClass(cssTarget.ForceInlineSVG)) {
101                            jQuery(this).addClass(cssTarget.ForceInlineSVG);
102                        }
103                    }
104                }
105            });
106        }
107

108        // Polyfill to support all older browsers
109        // delete when not needed in the future
110        if (!String.prototype.endsWith) {
111            String.prototype.endsWith = function (searchString, position) {
112                var subjectString = this.toString();
113                if (typeof position !== 'number' || !isFinite(position) || Math.floor(position) !== position || position > subjectString.length) {
114                    position = subjectString.length;
115                }
116                position -= searchString.length;
117                var lastIndex = subjectString.lastIndexOf(searchString, position);
118                return lastIndex !== -1 && lastIndex === position;
119            };
120        } // end polyfill
121
122        // Another snippet to support IE11
123        String.prototype.endsWith = function (pattern) {
124            var d = this.length - pattern.length;
125            return d >= 0 && this.lastIndexOf(pattern) === d;
126        };
127        // End snippet to support IE11
128
129        // Set target before we use it
130        if (ForceInlineSVGActive === 'true') {
131            target = cssTarget.Bodhi !== 'img.' ? cssTarget.ForceInlineSVG : 'style-svg';
132        } else {
133            target = cssTarget.Bodhi !== 'img.' ? cssTarget.Bodhi : 'style-svg';
134        }
135
136        // Ensure target is a string before applying replace method
137        if (typeof target === 'string') {
138            target = target.replace("img.", "");
139        } else {
140            return;
141        }
142
143        // Replace images with SVGs based on the target class
144        $('.' + target).each(function (index) {
145
146            // If image then send for replacement
147            if (typeof $(this).attr('src') !== typeof undefined && $(this).attr('src') !== false) {
148                bodhisvgsReplace($(this));
149            } else {
150
151                // Look for SVG children and send for replacement
152                $(this).find("img").each(function (i) {
153
154                    if (typeof $(this).attr('src') !== typeof undefined && $(this).attr('src') !== false) {
155                        bodhisvgsReplace($(this));
156                    }
157
158                });
159
160            }
161
162        });
163
164    })(); // Execute immediately
165
166});