/*
 * 特别声明：本技术材料受《中华人民共和国著作权法》、《计算机软件保护条例》等法律、法规、行政
 * 规章以及有关国际条约的保护，赞同科技享有知识产权、保留一切权利并视其为技术秘密。未经本公司书
 * 面许可，任何人不得擅自（包括但不限于：以非法的方式复制、传播、展示、镜像、上载、下载）使用，
 * 不得向第三方泄露、透露、披露。否则，本公司将依法追究侵权者的法律责任。特此声明！
 *
 * Special Declaration: These technical material reserved as the technical secrets by AGREE 
 * TECHNOLOGY have been protected by the "Copyright Law" "ordinances on Protection of Computer 
 * Software" and other relevant administrative regulations and international treaties. Without 
 * the written permission of the Company, no person may use (including but not limited to the 
 * illegal copy, distribute, display, image, upload, and download) and disclose the above 
 * technical documents to any third party. Otherwise, any infringer shall afford the legal 
 * liability to the company.
 */
import {Widget} from "widget/Widget";
/// <reference path="../typings/jquery.d.ts" />
/**
 * Created by tangqianchong on 2016/6/14.
 */
export class Video extends Widget {

    private $videoNode: JQuery;
    private videoElement: HTMLVideoElement;

    private autoplay: boolean = false;
    private sourceElement: HTMLSourceElement;
    private static template: string = `
    <div>
       <video controls="controls">
         <source>
       </video>
    </div>
    `;
    private resizeListener: any;

    constructor(parentId: string, id: string, style: number) {
        super(parentId, id, style);
        this.$thisNode = $(Video.template).attr({ id: this.id });
        this.$videoNode = this.$thisNode.find("video").attr("id", this.id + "-content");
        this.videoElement = this.$videoNode.get(0) as HTMLVideoElement;
        this.sourceElement = this.$thisNode.find("source")[0] as HTMLSourceElement;
        let own = this;
        this.resizeListener = function () {
            own.refreshVideoWidth();
        };
        $(window).on("resize", this.resizeListener);
    }

    public playVideo() {
        this.videoElement.play();
    }

    public pauseVideo() {
        this.videoElement.pause();
    }

    public setVideoPath(args: { path: string }) {
        if (!args.path) {
            return;
        }
        let type = "ogg";
        let index: number = args.path.lastIndexOf(".");
        if (index !== -1) {
            type = args.path.substring(index + 1, args.path.length);
        }
        this.sourceElement.type = "video/" + type;
        this.sourceElement.src = args.path;
        this.videoElement.load();
        this.refreshVideoWidth();
    }

    public setAutoPlay(args: { autoPlay: boolean }) {
        if (args.autoPlay) {
            this.$videoNode.attr("autoplay", "autoplay");
        } else {
            this.$videoNode.removeAttr("autoplay");
        }
    }

    public postLayout() {
        super.postLayout();
        this.refreshVideoWidth();
    }

    private refreshVideoWidth() {
        let w = this.$thisNode.css("width");
        if (w.indexOf("px") !== -1 || w.indexOf("%") !== -1 || w.indexOf("rem") !== -1) {
            this.$videoNode.css("width", w);
        } else {
            this.$videoNode.css("width", w + "px");
        }
    }

    public dispose() {
        $(window).off("resize", this.resizeListener);
        super.dispose();
    }
}