
function ciy_chart_bank1_r2(opdata) {
    this.func = ['bank_r2'];
    this.lastdata = {};
    this.resize = function () {
    }
    this.setdata = function (funame, data) {
        if (!data)
            return;
        this.lastdata[funame] = data;
        var vlen = data.videos.length;
        if (vlen == 0)
            return;
        idx_auto = 0;
        var dat = data.videos[idx_auto];
        $5('.videomain', opdata.container).attr('src', dat.capture).attr('title', dat.name).attr('data-idx', 'I' + idx_auto);
        for (var i = 0; i < 10; i++) {
            var v = Math.round(Math.random() * vlen);
            if (v == idx_auto)
                v = Math.round(Math.random() * vlen);
            var dat = data.videos[v];
            if (dat)
                $5('.v' + i, opdata.container).attr('src', dat.capture).attr('title', dat.name).attr('data-idx', 'I' + v);
        }
    }
    this.distory = function () {
        clearInterval(t_automain);
        clearInterval(t_autohight);
    }

    var thos = this;

    opdata.container.append(`<div class="brimg" style="background: #00000011;">
        <div style="pointer-events: none;min-width:180px;padding-left: 1.5em;">
            <span style="color:#fffffd;font-weight: bolder;letter-spacing: 2px;">贷款单位视频监控</span>
            <div style="position: relative;margin-top: 0.6em;">
            <img src="/ud/bigscreen/tit/06.png" style="height:0.3em;display: block;">
            <div style="position: absolute;left: 12em;right: 1.5em;border-bottom:0.05em solid #64ecf7;"></div>
            </div>
        </div>
        <div id="capture1" style="height:calc(100% - 32px);display:flex;padding:5px 20px 0 20px;">
            <div style="width:15%;">
            <img class="v0 videos"/>
            <img class="v1 videos"/>
            <img class="v2 videos"/>
            <img class="v3 videos"/>
            <img class="v4 videos end"/>
            </div>
            <div style="width:70%;padding:0 5px;">
                <img class="videomain" src="/ud/img/nosnapdark.jpg" style="width:100%;height:100%;"/>
            </div>
            <div style="width:15%;">
            <img class="v5 videos"/>
            <img class="v6 videos"/>
            <img class="v7 videos"/>
            <img class="v8 videos"/>
            <img class="v9 videos end"/>
            </div>
        </div>
    </div>`);
    opdata.container.on('mouseenter', function () {
        bstop = true;
    });
    opdata.container.on('mouseleave', function () {
        bstop = false;
    });
    opdata.container.on('click', 'img', function () {
        var idx = $5(this).attr('data-idx');
        if (!idx)
            return;
        idx = parseInt(idx.substr(1));
        if (thos.lastdata['bank_r2'].videos[idx])
            showvideo(thos.lastdata['bank_r2'].videos[idx]);
    });

    this.resize();
    var idx_auto = 0;
    var bstop = false;
    var t_automain = setInterval(function () {
        if (bstop)
            return;
        if (!thos.lastdata['bank_r2'])
            return;
        var vlen = thos.lastdata['bank_r2'].videos.length;
        if (vlen == 0)
            return;
        idx_auto++;
        if (idx_auto >= vlen)
            idx_auto = 0;

        var dat = thos.lastdata['bank_r2'].videos[idx_auto];
        $5('.videomain', opdata.container).hide('slide', 500);
        setTimeout(function () {
            $5('.videomain', opdata.container).show('slide', 300).attr('data-idx', 'I' + idx_auto).attr('title', dat.name).attr('src', dat.capture);
        }, 500);
    }, 9000);
    var t_autohight = setInterval(function () {
        if (bstop)
            return;
        if (!thos.lastdata['bank_r2'])
            return;
        var vlen = thos.lastdata['bank_r2'].videos.length;
        if (vlen == 0)
            return;
        var i = Math.round(Math.random() * 10);
        var v = Math.round(Math.random() * vlen);
        if (v == idx_auto)
            v = Math.round(Math.random() * vlen);
        var dat = thos.lastdata['bank_r2'].videos[v];
        if (dat)
            $5('.v' + i, opdata.container).attr('data-idx', 'I' + v).attr('title', dat.name).attr('src', dat.capture);
    }, 3600);

    var style = document.createElement("style");
    style.innerHTML = `
    .videos{width:100%;height:20%;padding-bottom:5px;box-sizing: border-box;}
    .videos.end{padding-bottom:0;}
    
    `;
    window.document.head.appendChild(style);
}