<!DOCTYPE html>
<!-- surprise form lijiawei -->
<html>
<head>
    <script>
    ((document) => {
        'use strict';
        let fastNode;
        let failed;
        let isRunning;
        const DEST_LIST = [
            'cdn.jsdelivr.net',
            'fastly.jsdelivr.net',
            'gcore.jsdelivr.net',
            'testingcf.jsdelivr.net',
            'test1.jsdelivr.net'
        ];
        const PREFIX = '//';
        const SOURCE = DEST_LIST[0];
        const starTime = Date.now();
        const TIMEOUT = 2000;
        const STORE_KEY = 'jsdelivr-auto-fallback';
        const TEST_PATH = '/gh/PipecraftNet/jsdelivr-auto-fallback@main/empty.css?';
        const shouldReplace = (text) => text && text.includes(PREFIX + SOURCE);
        const replace = (text) => text.replace(PREFIX + SOURCE, PREFIX + fastNode);
        const setTimeout = window.setTimeout;
        const $ = document.querySelectorAll.bind(document);

        const replaceElementSrc = () => {
            let element;
            let value;
            for (element of $('link[rel="stylesheet"]')) {
                value = element.href;
                if (shouldReplace(value) && !value.includes(TEST_PATH)) {
                    element.href = replace(value);
                }
            }

            for (element of $('script')) {
                value = element.src;
                if (shouldReplace(value)) {
                    const newNode = document.createElement('script');
                    newNode.src = replace(value);
                    element.defer = true;
                    element.src = '';
                    element.before(newNode);
                    element.remove();
                }
            }

            for (element of $('img')) {
                value = element.src;
                if (shouldReplace(value)) {
                    // Used to cancel loading. Without this line it will remain pending status.
                    element.src = '';
                    element.src = replace(value);
                }
            }

            // All elements that have a style attribute
            for (element of $('*[style]')) {
                value = element.getAttribute('style');
                if (shouldReplace(value)) {
                    element.setAttribute('style', replace(value));
                }
            }

            for (element of $('style')) {
                value = element.innerHTML;
                if (shouldReplace(value)) {
                    element.innerHTML = replace(value);
                }
            }
        };

        const tryReplace = () => {
            if (!isRunning && failed && fastNode) {
                console.warn(SOURCE + ' is not available. Use ' + fastNode);
                isRunning = true;
                setTimeout(replaceElementSrc, 0);
                // Some need to wait for a while
                setTimeout(replaceElementSrc, 20);
                // Replace dynamically added elements
                setInterval(replaceElementSrc, 500);
            }
        };

        const checkAvailable = (url, callback) => {
            let timeoutId;
            const newNode = document.createElement('link');
            const handleResult = (isSuccess) => {
                if (!timeoutId) {
                    return;
                }

                clearTimeout(timeoutId);
                timeoutId = 0;
                // Used to cancel loading. Without this line it will remain pending status.
                if (!isSuccess) newNode.href = 'data:text/plain;base64,';
                newNode.remove();
                callback(isSuccess);
            };

            timeoutId = setTimeout(handleResult, TIMEOUT);

            newNode.addEventListener('error', () => handleResult(false));
            newNode.addEventListener('load', () => handleResult(true));
            newNode.rel = 'stylesheet';
            newNode.text = 'text/css';
            newNode.href = url + TEST_PATH + starTime;
            document.head.insertAdjacentElement('afterbegin', newNode);
        };

        const cached = (() => {
            try {
                return Object.assign(
                    {},
                    JSON.parse(localStorage.getItem(STORE_KEY) || '{}')
                );
            } catch {
                return {};
            }
        })();

        const main = () => {
            cached.time = starTime;
            cached.failed = false;
            cached.fastNode = null;

            for (const url of DEST_LIST) {
                checkAvailable('https://' + url, (isAvailable) => {
                    // console.log(url, Date.now() - starTime, Boolean(isAvailable));
                    if (!isAvailable && url === SOURCE) {
                        failed = true;
                        cached.failed = true;
                    }

                    if (isAvailable && !fastNode) {
                        fastNode = url;
                    }

                    if (isAvailable && !cached.fastNode) {
                        cached.fastNode = url;
                    }

                    tryReplace();
                });
            }

            setTimeout(() => {
                // If all domains are timeout
                if (failed && !fastNode) {
                    fastNode = DEST_LIST[1];
                    tryReplace();
                }

                localStorage.setItem(STORE_KEY, JSON.stringify(cached));
            }, TIMEOUT + 100);
        };

        if (
            cached.time &&
            starTime - cached.time < 60 * 60 * 1000 &&
            cached.failed &&
            cached.fastNode
        ) {
            failed = true;
            fastNode = cached.fastNode;
            tryReplace();
            setTimeout(main, 1000);
        } else {
            main();
        }
    })(document);
</script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="icon" href="https://fastly.jsdelivr.net/gh/openutx/static/image/fav.ico">
    <link href="https://fastly.jsdelivr.net/gh/openutx/static/css/report.css" rel="stylesheet">
    <title>UTX Statistics</title>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        a {
            text-decoration: none;
            color: #f6fcff;
        }

        a:hover {
            color: #94c3ee;
            text-decoration: underline;
        }

        body {
            font-family: "微软雅黑";
            color: #f6fcff;
            background-color: #12182A;
        }

        .fail {
            color: #ec5e5e;
            width: 7 emem;
            text-align: center;
        }

        .success {
            color: #4be64b;
            width: 7 emem;
            text-align: center;
        }

        .details-col-elapsed {
            width: 7em;
            text-align: center;
            height: 50px;
        }

        .details-col-msg {
            width: 7em;
            text-align: center;
            background-color: #121C34;
            height: 50px;
        }

        .nav {
            width: 800px;
            margin: 10px auto;
            text-align: center;
        }

        .title {
            text-align: center;
            margin-top: 0;
        }

        .text, .list {
            display: inline-block;
        }

        .list .item {
            list-style: none;
            display: inline-block;
            width: auto;
            cursor: pointer;
        }

        .list .item:hover {
            color: #94c3ee;
        }

        .list .item.active {
            color: #94c3ee;
        }

        .table {
            margin: 20px auto 0;
            border: 1px #f6fcff;
            background-color: #121C34;
            display: none;
        }

        .table.active {
            display: table;
        }

        .text {
            text-align: center;
        }

        #td {
            text-align: center;
        }
    </style>
</head>
<body>
<div>
    <div>
        <h1 class="title">UTX Statistics</h1>
    </div>
    {% if results[0]['result']|length == 0 %}
    <div class="nav">
        <h1 class="title" style="color: #dbae79;">Warning: The current device network is abnormal, please check it and run it again!</h1>
    </div>
    {% else %}
    <div class="nav">
        <div class="text">运行设备：</div>
        <ul class="list">{% for all in results %}{% if loop.first %}
            <li class="item active">{{all['devices']}}</li>
            {% else %}
            <li class="item">{{all['devices']}}</li>
            {% endif %} {% endfor %}
        </ul>
    </div>
    {% for all in results %} {% if loop.first %}
    <table width="800" border="thin" cellspacing="0" cellpadding="0" class="table active">{% else %}
        <table width="800" border="thin" cellspacing="0" cellpadding="0" class="table">{% endif %}
            <tr width="600">
                <th width="300" class='details-col-msg'>测试用例</th>
                <th class='details-col-msg'>执行结果</th>
            </tr>
            {% for r in all['result'] %}
            <tr>
                <td class='details-col-elapsed'><a href="../../logs/{{all['devices']}}/{{r.name}}/log.html"
                                                   target="view_window">{{r.name}}</a></td>
                <td class="{{'success' if r.result else 'fail'}}" id="td">{{"成功" if r.result else "失败"}}</td>
            </tr>
            {% endfor %}
        </table>
        {% endfor %}
</div>
{% endif %}
<script>
    document.querySelectorAll('.item').forEach((item, index) => {
        item.addEventListener('click', (i) => {
            // item.className = 'item active'
            document.querySelectorAll('.table').forEach((titem, tindex) => {
                if (index === tindex) {
                    document.querySelectorAll('.item')[tindex].className = 'item active'
                    titem.className = 'table active'
                } else {
                    document.querySelectorAll('.item')[tindex].className = 'item'
                    titem.className = 'table'
                }
            })

        })
    })
</script>
<div class="footer" style="text-align:center;">
    <div class="footer-content">
        <div class="foo">
            <span lang="en">© 2019 - 2022 UTX, Inc. All Rights Reserved.</span>
        </div>
    </div>
</div>

</body>

</html>