https://hadarat.net/assets/js/broken-image.js?v=8910e179c301

1(function () {
2    'use strict';
3
4    function getDimensionsFromUrl(src) {
5        var match = src.match(/\/image\/(\d+)\/(\d+)\//);
6        if (match) {
7            return { w: parseInt(match[1], 10), h: parseInt(match[2], 10) };
8        }
9
10        match = src.match(/\/image\/(\d+)\/[^/]+$/);
11        if (match) {
12            var size = parseInt(match[1], 10);
13            return { w: size, h: size };
14        }
15
16        return null;
17    }
18
19    function hasExplicitHeight(img) {
20        var style = img.getAttribute('style') || '';
21
22        if (/height\s*:\s*\d+px/i.test(style)) {
23            return true;
24        }
25
26        if (/height\s*:\s*100%/i.test(style) && img.parentElement) {
27            var parentHeight = img.parentElement.offsetHeight;
28            return parentHeight > 0;
29        }
30
31        return false;
32    }
33
34    function preserveImageSpace(img) {
35        if (img.dataset.errorHandled) {
36            return;
37        }
38
39        img.dataset.errorHandled = '1';
40
41        if (!hasExplicitHeight(img)) {
42            var dims = getDimensionsFromUrl(img.src);
43
44            if (dims) {
45                img.style.aspectRatio = dims.w + ' / ' + dims.h;
46                if (!img.style.width) {
47                    img.style.width = '100%';
48                }
49            } else {
50                img.style.minHeight = '150px';
51            }
52        }
53
54        if (!img.style.objectFit) {
55            img.style.objectFit = 'cover';
56        }
57
58        img.classList.add('img-broken');
59
60        var dims = getDimensionsFromUrl(img.src);
61        if (dims) {
62            img.src = window.location.origin + '/image/' + dims.w + '/' + dims.h + '/no-image.jpg';
63        }
64    }
65
66    function watchImage(img) {
67        if (img.dataset.errorHandled) {
68            return;
69        }
70
71        if (img.complete) {
72            if (img.naturalWidth === 0) {
73                preserveImageSpace(img);
74            }
75            return;
76        }
77
78        img.addEventListener('error', function () {
79            preserveImageSpace(img);
80        });
81
82        img.addEventListener('load', function () {
83            if (img.naturalWidth === 0) {
84                preserveImageSpace(img);
85            }
86        });
87    }
88
89    function init() {
90        document.querySelectorAll('img').forEach(watchImage);
91
92        new MutationObserver(function (mutations) {
93            mutations.forEach(function (mutation) {
94                mutation.addedNodes.forEach(function (node) {
95                    if (node.tagName === 'IMG') {
96                        watchImage(node);
97                    } else if (node.querySelectorAll) {
98                        node.querySelectorAll('img').forEach(watchImage);
99                    }
100                });
101            });
102        }).observe(document.body, { childList: true, subtree: true });
103    }
104
105    if (document.readyState === 'loading') {
106        document.addEventListener('DOMContentLoaded', init);
107    } else {
108        init();
109    }
110})();