import { defineComponent as N, ref as l, computed as z, onMounted as $, createElementBlock as m, openBlock as f, Fragment as q, createElementVNode as o, withDirectives as E, vShow as L, createCommentVNode as g, normalizeClass as y, toDisplayString as A, nextTick as G, unref as k } from "vue";
const H = { class: "video-recorder__header" }, J = { class: "video-recorder__controls" }, K = { class: "video-recorder__recording-container" }, P = { class: "video-recorder__recording-time" }, X = /* @__PURE__ */ N({
  __name: "ModalVideoRecorder",
  emits: ["change", "submit", "close"],
  setup(Q, { emit: F }) {
    const S = l(), s = l(0), i = l(0), u = l(0), d = l(0), I = z(() => {
      let a = d.value < 10 ? "0" + d.value : d.value, e = u.value < 10 ? "0" + u.value : u.value, t = i.value < 10 ? "0" + i.value : i.value, b = s.value < 10 ? "00" + s.value : s.value < 100 ? "0" + s.value : s.value;
      return r.value ? a + ":" + e + ":" + t + ":" + b : " ";
    }), p = l(), R = l(), r = l(!1), v = l(), _ = l(), w = l([]), n = l(), V = l(), c = l("camera"), O = () => {
      c.value == "camera" ? (c.value = "screen", B()) : c.value == "screen" && (C(), c.value = "camera", M());
    }, T = async () => {
      !r.value && _.value instanceof MediaStream && (v.value = new MediaRecorder(_.value), v.value.start(), v.value.ondataavailable = (a) => {
        w.value.push(a.data);
      }, r.value = !0, S.value = setInterval(() => {
        s.value += 10, s.value == 1e3 && (s.value = 0, i.value++, i.value == 60 && (i.value = 0, u.value++, u.value == 60 && (u.value = 0, d.value++)));
      }, 10));
    }, U = async () => {
      D(), C(), n.value && (n.value = void 0, await M());
    }, j = () => {
      v.value && (v.value.stop(), v.value.onstop = async () => {
        V.value = new File(w.value, "videomessage.mp4", { type: "video/*" });
        const a = URL.createObjectURL(V.value);
        n.value = a, G(() => {
          R.value && (R.value.src = a);
        });
      }), D(), C();
    };
    function C() {
      var e;
      let a = (e = _.value) == null ? void 0 : e.getTracks();
      a == null || a.forEach((t) => t.stop());
    }
    const D = () => {
      clearInterval(S.value), s.value = 0, i.value = 0, u.value = 0, d.value = 0, r.value = !1, v.value = void 0, w.value = [];
    }, h = F, x = () => {
      h("change", { videoFile: V.value }), h("submit");
    }, M = async () => {
      await navigator.mediaDevices.getUserMedia({ audio: !0, video: !0 }).then((a) => {
        const e = k(p.value);
        _.value = a, e.srcObject = a, e.addEventListener("loadedmetadata", () => {
          var t;
          (t = k(p.value)) == null || t.play();
        }), e.muted = !0;
      });
    }, B = async () => {
      const a = {
        video: {
          cursor: "always"
        },
        audio: !1
      };
      await navigator.mediaDevices.getDisplayMedia(a).then((e) => {
        const t = k(p.value);
        _.value = e, t.srcObject = e, t.addEventListener("loadedmetadata", () => {
          var b;
          (b = k(p.value)) == null || b.play();
        }), t.muted = !0;
      });
    };
    return $(async () => {
      await M();
    }), (a, e) => (f(), m(q, null, [
      o("div", H, [
        o("button", {
          class: "video-recorder__button video-recorder__button-close",
          onClick: e[0] || (e[0] = (t) => h("close"))
        }, [...e[1] || (e[1] = [
          o("span", { class: "pi pi-times" }, null, -1)
        ])])
      ]),
      o("div", null, [
        E(o("video", {
          ref_key: "refVideo",
          ref: p,
          class: "video-recorder__view-area"
        }, null, 512), [
          [L, !n.value]
        ]),
        E(o("video", {
          ref_key: "refRecord",
          ref: R,
          class: "video-recorder__view-area",
          controls: ""
        }, null, 512), [
          [L, n.value]
        ]),
        o("div", J, [
          o("div", K, [
            !r.value && !n.value ? (f(), m("button", {
              key: 0,
              class: "video-recorder__button",
              onClick: O
            }, [
              o("span", {
                class: y({
                  "pi pi-desktop": c.value == "camera",
                  "pi pi-camera": c.value == "screen"
                })
              }, null, 2)
            ])) : g("", !0),
            n.value ? g("", !0) : (f(), m("button", {
              key: 1,
              class: y(["video-recorder__button", { "video-recorder__recording-button": r.value }]),
              onClick: T
            }, [
              o("span", {
                class: y(["pi", {
                  "pi-circle-fill video-recorder__recording-icon": r.value,
                  "pi-video": !r.value
                }])
              }, null, 2)
            ], 2)),
            !r.value && n.value ? (f(), m("button", {
              key: 2,
              class: "video-recorder__button",
              onClick: U
            }, [...e[2] || (e[2] = [
              o("span", { class: "pi pi-trash" }, null, -1)
            ])])) : g("", !0),
            r.value ? (f(), m("button", {
              key: 3,
              class: "video-recorder__button",
              onClick: j
            }, [...e[3] || (e[3] = [
              o("div", { class: "video-recorder__stop" }, null, -1)
            ])])) : g("", !0),
            o("span", P, A(I.value), 1)
          ]),
          o("button", {
            class: y(["video-recorder__button", { "video-recorder__button-disabled": !n.value }]),
            onClick: x
          }, [...e[4] || (e[4] = [
            o("span", { class: "video-recorder__save-button" }, " Прикрепить видео ", -1)
          ])], 2)
        ])
      ])
    ], 64));
  }
});
export {
  X as default
};
