robotembed/lib.js at main · PHSWireClippers5902/robotembed · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
const splat3DStyleDefault = document.createElement('style');
splat3DStyleDefault.innerHTML = `
.splat3D {
    border-radius: 15px;
    border: none;
    width: 100%;
    height: 100%;
    background: black;
}
.splat3DError {
    border-radius: 15px;
    width: 100%;
    height: 100%;
    background: black;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: sans-serif;
    text-align: center;
}
`;
document.head.insertBefore(splat3DStyleDefault, document.head.firstChild);

const iframeVisibilityObserver = new IntersectionObserver(function (entries) {
    entries.forEach(function (entry) {
        const iframe = entry.target;
        const originalSrc = iframe.dataset.originalSrc;

        if (!entry.isIntersecting) {
            if (!iframe.dataset.unloaded) {
                iframe.src = "";
                iframe.dataset.unloaded = "true";
            };
        } else {
            if (iframe.dataset.unloaded) {
                iframe.src = originalSrc;
                iframe.dataset.unloaded = "";
            };
        };
    });
}, { threshold: 0 });

function loadSplats() {
    document.querySelectorAll('splat3D').forEach(function (player) {

        if (location.protocol && location.protocol === "http:") {
            const error = document.createElement('div');
            error.className = player.className + " splat3DError";
            error.id = player.id;
            error.style.cssText = player.style.cssText;
            error.textContent = "Splat3D does not work on insecure sites. Please upgrade to HTTPS.";
            player.replaceWith(error);
            return;
        };

        var modeliframe = document.createElement('iframe');
        var params = new URLSearchParams();

        for (var attr of player.attributes) {
            params.set(attr.name, attr.value);
        };

        var src = `https://pooiod7.pages.dev/widgets/splat3D?${params.toString()}`;

        modeliframe.src = src;
        modeliframe.dataset.originalSrc = src;
        modeliframe.className = player.className;
        modeliframe.id = player.id;
        modeliframe.style.cssText = player.style.cssText;
        modeliframe.classList.add("splat3D");

        player.replaceWith(modeliframe);

        iframeVisibilityObserver.observe(modeliframe);
    });
};

loadSplats();

document.addEventListener('DOMContentLoaded', function() {
    loadSplats();
});