misuzu/assets/misuzu.js/embed/embed.js

#include utility.js
#include embed/audio.js
#include embed/image.js
#include embed/video.js
#include ext/uiharu.js

const MszEmbed = (function() {
    let uiharu = undefined;

    return {
        init: function(endPoint) {
            uiharu = new MszUiharu(endPoint);
        },
        handle: function(targets) {
            if(!Array.isArray(targets))
                targets = Array.from(targets);

            const filtered = new Map;
            for(const target of targets) {
                if(!(target instanceof HTMLElement)
                    || !('dataset' in target)
                    || !('mszEmbedUrl' in target.dataset))
                    continue;

                const cleanUrl = target.dataset.mszEmbedUrl.replace(/ /, '%20');
                if(cleanUrl.indexOf('https://') !== 0
                    && cleanUrl.indexOf('http://') !== 0
                    && cleanUrl.indexOf('//') !== 0) {
                    target.textContent = target.dataset.mszEmbedUrl;
                    continue;
                }

                $rc(target);
                target.appendChild($e({
                    tag: 'i',
                    attrs: {
                        className: 'fas fa-2x fa-spinner fa-pulse',
                        style: {
                            width: '32px',
                            height: '32px',
                            lineHeight: '32px',
                            textAlign: 'center',
                        },
                    },
                }));

                if(filtered.has(cleanUrl))
                    filtered.get(cleanUrl).push(target);
                else
                    filtered.set(cleanUrl, [target]);
            }

            const replaceWithUrl = function(targets, url) {
                for(const target of targets) {
                    let body = $e({
                        tag: 'a',
                        attrs: {
                            className: 'link',
                            href: url,
                            target: '_blank',
                            rel: 'noopener noreferrer',
                        },
                        child: url
                    });
                    $ib(target, body);
                    $r(target);
                }
            };

            filtered.forEach(function(targets, url) {
                uiharu.lookupOne(url)
                    .catch(ex => {
                        replaceWithUrl(targets, url);
                        console.error(ex);
                    })
                    .then(result => {
                        const metadata = result.body;

                        if(metadata.error) {
                            replaceWithUrl(targets, url);
                            console.error(metadata.error);
                            return;
                        }

                        if(metadata.title === undefined) {
                            replaceWithUrl(targets, url);
                            console.warn('Media is no longer available.');
                            return;
                        }

                        let phc = undefined,
                            options = {
                                onembed: console.log,
                            };

                        if(metadata.type === 'youtube:video') {
                            phc = MszVideoEmbedPlaceholder;
                            options.type = 'youtube';
                            options.player = MszVideoEmbedYouTube;
                        } else if(metadata.type === 'niconico:video') {
                            phc = MszVideoEmbedPlaceholder;
                            options.type = 'nicovideo';
                            options.player = MszVideoEmbedNicoNico;
                        } else if(metadata.is_video) {
                            phc = MszVideoEmbedPlaceholder;
                            options.type = 'external';
                            options.player = MszVideoEmbedPlayer;
                            //options.frame = MszVideoEmbedFrame;
                            options.nativeControls = true;
                            options.autosize = false;
                            options.maxWidth = 640;
                            options.maxHeight = 360;
                        } else if(metadata.is_audio) {
                            phc = MszAudioEmbedPlaceholder;
                            options.type = 'external';
                            options.player = MszAudioEmbedPlayer;
                            options.nativeControls = true;
                        } else if(metadata.is_image) {
                            phc = MszImageEmbed;
                            options.type = 'external';
                        }

                        if(phc === undefined)
                            return;

                        for(const target of targets) {
                            const placeholder = new phc(metadata, options, target);
                            if(placeholder !== undefined)
                                placeholder.replaceElement(target);
                        }
                    });
            });
        },
    };
})();