import { W as Watermark } from "./index18.js";
import { P as ProgressBar, f as formatTime, i as isFullScreen, r as requestFullScreen, e as exitFullScreen } from "./dom.js";
import { n as normalizeComponent } from "./index.js";
import "./v4.js";
import "vue";
var render = function() {
  var _vm = this;
  var _h = _vm.$createElement;
  var _c = _vm._self._c || _h;
  return _c("div", {
    staticClass: "preview-wrapper",
    style: _vm.size
  }, [_c("div", {
    staticClass: "video-wrapper",
    class: {
      fullScreen: _vm.isFullScreen
    },
    style: _vm.maxSize,
    on: {
      "mousemove": function($event) {
        $event.stopPropagation();
        _vm.isShowFooter = true;
      },
      "mouseleave": function($event) {
        $event.stopPropagation();
        _vm.isShowFooter = false;
      }
    }
  }, [_vm.canPlay && _vm.isShowFooter ? _c("div", {
    staticClass: "clipper-video--footer",
    on: {
      "click": function($event) {
        $event.stopPropagation();
      }
    }
  }, [_c("div", {
    staticClass: "clipper-video--footer__left"
  }, [_vm.isPlaying ? _c("div", {
    staticClass: "clipper-video--footer__left__pause",
    on: {
      "click": _vm.pauseVideo
    }
  }) : _vm._e(), !_vm.isPlaying ? _c("div", {
    staticClass: "clipper-video--footer__left__play",
    on: {
      "click": _vm.playVideo
    }
  }) : _vm._e(), _c("span", [_vm._v(_vm._s(_vm._f("formatDuration")(_vm.currentTime)))])]), _c("div", {
    staticClass: "clipper-video--footer__progress-bar"
  }, [_c("progress-bar", {
    attrs: {
      "progress": _vm.durationProgress
    },
    on: {
      "update:progress": _vm.setDuration
    }
  })], 1), _c("div", {
    staticClass: "clipper-video--footer__right"
  }, [_c("span", [_vm._v(_vm._s(_vm.duration))]), _c("div", {
    staticClass: "clipper-video--footer__right__line"
  }), _c("span", {
    staticClass: "clipper-video--footer__right__fullscreen",
    on: {
      "click": _vm.toggleFullScreen
    }
  }, [_vm._v(" " + _vm._s(_vm.isFullScreen ? "\u9000\u51FA\u5168\u5C4F" : "\u5168\u5C4F\u9884\u89C8") + " ")])])]) : _vm._e(), _c("video", {
    ref: "video",
    staticClass: "video-player",
    style: _vm.maxSize,
    attrs: {
      "controlslist": "nodownload",
      "src": _vm.videoUrl,
      "disablepictureinpicture": ""
    },
    on: {
      "click": function($event) {
        $event.stopPropagation();
        return _vm.toggle.apply(null, arguments);
      },
      "ended": _vm.onVideoPlayEnded
    }
  }), _vm.watermarkUrl ? _c("watermark", {
    attrs: {
      "watermarkUrl": _vm.watermarkUrl
    }
  }) : _vm._e(), !_vm.canPlay ? _c("div", {
    staticClass: "video-wrapper-loading"
  }) : _vm._e()], 1)]);
};
var staticRenderFns = [];
var player_vue_vue_type_style_index_0_scoped_true_lang = /* @__PURE__ */ (() => '.preview-wrapper[data-v-9735ebb4]{margin:auto;display:flex}.preview-wrapper .video-wrapper[data-v-9735ebb4]{width:100%;height:100%;margin:auto;position:relative}.preview-wrapper .video-wrapper video[data-v-9735ebb4]{width:100%;height:100%}.preview-wrapper .video-wrapper-loading[data-v-9735ebb4]{position:absolute;top:45%;left:45%;width:45px;height:45px;transform:translate(-50%,-50%);background:url(https://st-gdx.dancf.com/gaodingx/2113/configs/system/20210415-162648-d6a8.svg);animation:rotate-data-v-9735ebb4 1s infinite linear normal}@keyframes rotate-data-v-9735ebb4{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.preview-wrapper .video-player[data-v-9735ebb4]{background:#000;outline:none}.preview-wrapper .button[data-v-9735ebb4]{width:44px;height:44px;background-size:44px 44px;border-radius:50%;transform:translate(-50%,-50%);position:absolute;left:50%;top:50%;display:flex;justify-content:center;align-items:center;cursor:pointer}.preview-wrapper .fullScreen[data-v-9735ebb4]{position:fixed!important;background:#fff;width:100%!important;height:100%!important;top:0px;left:0px;z-index:1000}.preview-wrapper .clipper-video[data-v-9735ebb4]{position:relative;margin:0 auto;user-select:none;filter:drop-shadow(0px 8px 16px rgba(0,0,0,.12));border-radius:4px;border:1px solid #e8eaec;background:rgba(0,0,0,.6);width:fit-content;height:fit-content;min-width:400px;min-height:300px}.preview-wrapper .clipper-video--footer[data-v-9735ebb4]{display:flex;align-items:center;position:absolute;width:100%;height:61px;bottom:0px;left:0px;padding:0 14px 12px;background:linear-gradient(360deg,#000000 -4.92%,rgba(0,0,0,0) 100%);z-index:11;box-sizing:border-box}.preview-wrapper .clipper-video--footer__left[data-v-9735ebb4]{display:flex;align-items:center;font-weight:600}.preview-wrapper .clipper-video--footer__left__pause[data-v-9735ebb4],.preview-wrapper .clipper-video--footer__left__play[data-v-9735ebb4]{width:24px;height:24px;cursor:pointer}.preview-wrapper .clipper-video--footer__left__pause[data-v-9735ebb4]{background-image:svg-load("./assets/pause.svg")}.preview-wrapper .clipper-video--footer__left__play[data-v-9735ebb4]{background-image:svg-load("./assets/play.svg")}.preview-wrapper .clipper-video--footer__left span[data-v-9735ebb4]{margin-left:10px;font-size:14px;color:#fff}.preview-wrapper .clipper-video--footer__right[data-v-9735ebb4]{display:flex;color:#fff;align-items:center;justify-content:space-between;font-size:14px;font-weight:600}.preview-wrapper .clipper-video--footer__right__line[data-v-9735ebb4]{width:2px;height:16px;background:rgba(255,255,255,.3);margin:0 16px}.preview-wrapper .clipper-video--footer__right__fullscreen[data-v-9735ebb4]{cursor:pointer}.preview-wrapper .clipper-video--footer__progress-bar[data-v-9735ebb4]{flex:1;cursor:pointer;margin:0 16px}body[data-v-9735ebb4]{min-width:1200px;overflow:overlay;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0)}body[data-v-9735ebb4]::-webkit-scrollbar{width:7px}body[data-v-9735ebb4]::-webkit-scrollbar-thumb{background-color:#000000b3;border:1px solid #fff;border-radius:10rem}body[data-v-9735ebb4]::-webkit-scrollbar-track-piece:start,body[data-v-9735ebb4]::-webkit-scrollbar-track-piece:end{background:transparent}ul[data-v-9735ebb4]{padding:0;list-style:none}.tofh[data-v-9735ebb4]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[id^=HUABAN][data-v-9735ebb4],[class^=HUABAN][data-v-9735ebb4],[id^=ZCOOL][data-v-9735ebb4],[class^=ZCOOL][data-v-9735ebb4],[id^=lvye][data-v-9735ebb4],[class^=lvye][data-v-9735ebb4],[id^=xmt-][data-v-9735ebb4],[class^=xmt-][data-v-9735ebb4]{display:none!important}body>iframe[src="chrome-extension://gpdjojdkbbmdfjfahjcgigfpmkopogic/html/grid.html"][data-v-9735ebb4],body>iframe[src="chrome-extension://gpdjojdkbbmdfjfahjcgigfpmkopogic/html/search.html"][data-v-9735ebb4]{visibility:hidden!important;transform:translate(-10000px)!important}.eui-popup-base[data-v-9735ebb4]{z-index:2100!important}.eui-tabs__header[data-v-9735ebb4]{border-bottom-width:1px!important}.gda-btn[data-v-9735ebb4]:not(.gda-btn-sm){min-width:88px}.gda-btn>.gdaicon[data-v-9735ebb4]{font-size:20px;vertical-align:-.1em}.gda-btn svg[data-v-9735ebb4]{vertical-align:bottom}.gda-btn.disabled[data-v-9735ebb4],.gda-btn[disabled][data-v-9735ebb4]{cursor:default}.gda-dropdown-menu[data-v-9735ebb4]{box-shadow:0 2px 8px #00000029}.gda-dropdown-menu-item[data-v-9735ebb4]{padding:10px 12px;line-height:20px}.gda-dropdown-menu-item>.gdaicon[data-v-9735ebb4]:first-child{font-size:20px;vertical-align:bottom}.gda-dropdown-menu-item[data-v-9735ebb4]:hover,.gda-dropdown-menu-submenu-title[data-v-9735ebb4]:hover{background:#f6f7f9}.gda-dropdown-menu-item-disabled[data-v-9735ebb4]:hover,.gda-dropdown-menu-submenu-title-disabled[data-v-9735ebb4]:hover{background-color:#fff}.gda-modal-header[data-v-9735ebb4]{padding:18px 24px;border-bottom:none}.gda-modal-title[data-v-9735ebb4]{line-height:24px}.gda-modal-close-x[data-v-9735ebb4]{width:60px;height:60px;line-height:60px}.gda-modal-footer[data-v-9735ebb4]{border-top:none}.gda-form-item-label[data-v-9735ebb4]{font-weight:700}.gda-form-horizontal .gda-form-item[data-v-9735ebb4]{margin-bottom:10px}.gda-form-horizontal .gda-form-item-label[data-v-9735ebb4]{font-weight:700;line-height:48px}.gda-pagination-item[data-v-9735ebb4],.gda-pagination-item[data-v-9735ebb4]:focus,.gda-pagination-item[data-v-9735ebb4]:hover,.gda-pagination-prev .gda-pagination-item-link[data-v-9735ebb4],.gda-pagination-next .gda-pagination-item-link[data-v-9735ebb4]{color:#444950;background-color:#f0f3f4;border:none}.gda-pagination-item-active[data-v-9735ebb4],.gda-pagination-item-active[data-v-9735ebb4]:focus,.gda-pagination-item-active[data-v-9735ebb4]:hover{background:#2254f4;border:none}.gda-pagination-item-active a[data-v-9735ebb4],.gda-pagination-item-active:focus a[data-v-9735ebb4],.gda-pagination-item-active:hover a[data-v-9735ebb4]{color:#fff}.gda-pagination-prev.gda-pagination-disabled .gda-pagination-item-link[data-v-9735ebb4],.gda-pagination-next.gda-pagination-disabled .gda-pagination-item-link[data-v-9735ebb4]{opacity:.3}.gda-pagination-prev:focus .gda-pagination-item-link[data-v-9735ebb4],.gda-pagination-next:focus .gda-pagination-item-link[data-v-9735ebb4],.gda-pagination-prev:hover .gda-pagination-item-link[data-v-9735ebb4],.gda-pagination-next:hover .gda-pagination-item-link[data-v-9735ebb4]{color:#444950}.gda-tree li[data-v-9735ebb4],.gda-tree li[data-v-9735ebb4]:first-child,.gda-tree li[data-v-9735ebb4]:last-child{padding:0}.gda-tree-child-tree>li[data-v-9735ebb4]:first-child{padding-top:0}:root .gda-tree li span.gda-tree-switcher.gda-tree-switcher_close .gda-tree-switcher-icon[data-v-9735ebb4],:root .gda-tree li span.gda-tree-switcher.gda-tree-switcher_open .gda-tree-switcher-icon[data-v-9735ebb4]{font-size:16px;vertical-align:-3px}.gda-tree.gda-tree-directory>li span.gda-tree-node-content-wrapper[data-v-9735ebb4]:hover:before,.gda-tree.gda-tree-directory .gda-tree-child-tree>li span.gda-tree-node-content-wrapper[data-v-9735ebb4]:hover:before{border-radius:4px}.gda-tree .gda-tree-treenode-checkbox-checked .gda-tree-checkbox-checked[data-v-9735ebb4]:after{display:none}\n')();
const __vue2_script = {
  name: "editor-video-player",
  components: {
    Watermark,
    ProgressBar
  },
  filters: {
    formatDuration: (val) => {
      return formatTime(val, "s");
    }
  },
  props: {
    width: {
      type: [Number, String],
      default: "100%"
    },
    height: {
      type: [Number, String],
      default: "100%"
    },
    videoUrl: {
      type: String,
      default: ""
    },
    watermarkUrl: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      isPlayEnded: true,
      isPlaying: false,
      isFullScreen: false,
      isShowFooter: false,
      canPlay: false,
      duration: 0,
      currentTime: 0,
      video: null
    };
  },
  computed: {
    size() {
      const { width, height } = this;
      let _width = width;
      let _height = height;
      if (typeof width === "number") {
        _width += "px";
      }
      if (typeof height === "number") {
        _height += "px";
      }
      return { width: _width, height: _height };
    },
    maxSize() {
      return {
        "max-width": this.width + "px",
        "max-height": this.height + "px"
      };
    },
    durationProgress() {
      const { currentTime } = this;
      const duration = this.video.duration;
      return currentTime / duration * 100;
    }
  },
  mounted() {
    this.video = this.$refs.video;
    this.video.addEventListener("timeupdate", (e) => {
      this.currentTime = e.target.currentTime;
    });
    this.video.addEventListener("canplay", () => {
      this.duration = formatTime(this.video.duration, "s");
      this.isMute = this.video.muted;
      this.currentTime = this.video.currentTime;
      this.canPlay = true;
    });
    this.video.addEventListener("contextmenu", (e) => {
      e.preventDefault();
    });
    window.onresize = () => {
      if (!isFullScreen()) {
        this.isFullScreen = false;
      } else {
        this.isFullScreen = true;
      }
    };
  },
  methods: {
    pauseVideo() {
      if (this.video && this.canPlay) {
        this.video.pause();
        this.isPlaying = false;
      }
    },
    playVideo() {
      if (this.video && this.canPlay) {
        this.video.play();
        this.isPlayEnded = false;
        this.isPlaying = true;
      }
    },
    onVideoPlayEnded() {
      this.isPlaying = false;
      this.isPlayEnded = true;
    },
    toggleFullScreen() {
      if (!isFullScreen()) {
        this.isFullScreen = true;
        requestFullScreen(document.documentElement);
      } else {
        this.isFullScreen = false;
        exitFullScreen();
      }
    },
    toggle() {
      if (this.video.paused) {
        this.playVideo();
      } else {
        this.pauseVideo();
      }
    },
    setDuration(duration) {
      if (!this.video)
        return;
      this.video.currentTime = this.video.duration * (duration / 100);
    }
  }
};
const __cssModules = {};
var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles, "9735ebb4", null, null);
function __vue2_injectStyles(context) {
  for (let o in __cssModules) {
    this[o] = __cssModules[o];
  }
}
var VideoPlayer = /* @__PURE__ */ function() {
  return __component__.exports;
}();
export { VideoPlayer as default };
