vesh-cli/template/Part/video.js

码农村nodejs版本VESH框架脚手架搭建器

(function(V, W, $) {
    V.registScript(function(path, vm) {
        var _ = this,
            __ = {}; {
            __.id = 'video_' + V.random();
            V.inherit.apply(_, [W.Control, [path || ' <div class="video_box"><video id="' + __.id + '" class="video-js vjs-default-skin" autobuffer="autobuffer" preload="auto" oncontextmenu="return false" style="width:100%;height:100%;" autoplay1="true"></video></div>', vm || { data: { controls: false, inaction: 'fadeIn', outaction: 'fadeOut' } }]]);
            __.onLoad = _.onLoad;
            __.render = _.render;
            _.addDesc('video 初级');
            _.addDesc('属性:');
            _.addDesc('\twidth:移动方向 fadeInLeft');
            _.addDesc('\theight:移动方向 fadeOutRight');
            _.addDesc('\tcontrol:是否出现控制条');
            _.addDesc('\tposter:预览图片');
            _.addDesc('\tsrc：播放地址');
            _.addDesc('\tplay：true/false 播放/暂停');
            _.addDesc('\tinaction：fadeIn');
            _.addDesc('\toutaction：fadeOut');
            _.addDesc('事件:');
            _.addDesc('\tonEnded:视频播放完成');
            _.addDesc('原型');
            _.addDesc('<video src="/cat.mp4" width="320" height="240" controls="" autobuffer=""></video>');

        }
        _.onLoad = function(node) {
            _.video = node.children('video:first');
            _.video.on('loadedmetadata', function() {
                _.call('time', { duration: _.video.duration });
            });

            //update HTML5 video current play time
            _.video.on('timeupdate', function() {
                _.call('time', { currentTime: _.video.currentTime });
            });
            _.video.on('canplay', function() {
                _.call('canplay');
            });
            __.onLoad(node);
            return;
        };
        _.render = function(data) {
            if (_.video)
                V.forC(data, function(k, v) {
                    switch (k.toLowerCase()) {
                        case 'width':
                            _.node.width(v || 10);
                            break;
                        case 'height':
                            _.node.height(v || 10);
                            break;
                        case 'poster':
                            //设置头部缩略图
                            _.video.attr('poster', v);
                            break;
                        case 'src':
                        case 'value':
                            //设置路径
                            _.video.attr('src', v);
                            //_.video.play();
                            break;
                        case 'play':
                            //是否播放
                            if (!!v && _.video.paused) {
                                _.video.play();
                            } else {
                                _.video.pause();
                            }
                            break;
                        case 'volume':
                            //控制音量0，100
                            _.video.volume = Math.min(1, Math.max(0, v / 100));
                            break;
                        case 'quiet':
                            //是否静音
                            _.video.muted = !v;
                            break;
                        case 'autoplay':
                            _.video.attr('autoplay', !!v);
                            break;
                        case 'fullscreen':
                            if (!!v)(_.video.webkitEnterFullscreen || _.video.mozRequestFullScreen || _.video.requestFullscreen)();
                            else(document.webkitCancelFullScreen || document.mozCancelFullScreen || document.exitFullscreen)();
                            break;
                    }
                }, function() {
                    data = __.render(data);
                });
        }
    });
})(VJ, VJ.view, jQuery);