<style>
    .tab-wrapper {
        position: relative;
    }

    .radio-btn {
        display: none;
    }

    .radio-btn:checked+.radio-label {
        background-color: #bbb;
        transition: 0.5s;
    }

    .radio-label {
        position: relative;
        z-index: 2;
        display: block;
        float: left;
        padding: 0.25em 0.5em;
    }

    .radio-btn:checked+.radio-label+.radio-box {
        visibility: visible;
        opacity: 1;
        transform: translateY(-3em);
    }

    .radio-box {
        visibility: hidden;
        position: absolute;
        top: 6em;
        opacity: 0;
        transition: transform 0.2s, opacity 0.7s;
    }

    .vod-channel {
        border: 1px solid #000;
        margin-right: 0.5em;
    }

    .vod-episodes {
        display: flex;
        flex-flow: wrap;
        gap: 0.5em;
    }

    .vod-episode {
        border: 1px solid #000;
        padding: 0.25em 0.5em;
    }

    .vod-episode a {
        text-decoration: none;
    }

    .vod-episode-curr {
        background-color: #f60;
    }

    .vod-episode-curr a {
        color: #fff;
    }
</style>
{[
local src_count = 0
for _, _ in pairs(ctx.vod.sources) do
src_count = src_count + 1
end
]}
{[ if src_count > 1 then ]}
<p>如不能播放请切换线路，记住你常用线路的名字。不同地区网络不同，可以多尝试选出最快的线路。</p>
{[ else ]}
<p></p>
{[ end ]}
<div class="tab-wrapper">
    {[ for _, ch in ipairs(ctx.channels) do ]}
    {[ if ctx.vod.sources[ch.code] then ]}
    {[ if ch.code == ctx.ch then ]}
    <input type="radio" name="tab-radio" id="radio-{{ ch.code }}" class="radio-btn radio-btn-curr" checked="checked">
    {[ else ]}
    <input type="radio" name="tab-radio" id="radio-{{ ch.code }}" class="radio-btn">
    {[ end ]}
    {[
    local ch_title = ch.title
    if ch.title:find('下载') then
    ch_title = ch_title .. '（点开视频后右键另存为）'
    end
    ]}
    <label for="radio-{{ ch.code }}" class="vod-channel radio-label">{{ ch_title }}
        <sup>{= #ctx.vod.sources[ch.code].urls =}</sup></label>
    <div class="vod-episodes radio-box">
        {[ for ep, url in ipairs(ctx.vod.sources[ch.code].urls) do ]}
        <div class="vod-episode{[ if ch.code == ctx.ch and ep == ctx.ep then ]} vod-episode-curr{[ end ]}">
            {[ if ch.title:find('下载') then ]}
            <a href="{= url.url =}" download="{{ ctx.vod.title }} {{ url.title }}">{{ url.title }}</a>
            {[ else ]}
            <a href="/vod/play/?id={= ctx.vod.id =}&ch={= ch.code =}&ep={= ep =}"
                title="{{ ctx.vod.title }} {{ url.title }}">{{ url.title }}</a>
            {[ end ]}
        </div>
        {[ end ]}
    </div>
    {[ end ]}
    {[ end ]}
</div>
