@opendesign-plus-test/components 0.0.1-rc.81 → 0.0.1-rc.83

package/dist/treeshaking/cjs/components/meeting/components/OMeetingPlaybackSubtitles.vue.cjs

@@ -1,425 +0,0 @@
-"use strict";
-const vue = require("vue");
-const opendesign = require("@opensig/opendesign");
-const elementPlus = require("element-plus");
-require("element-plus/es/components/select/style/css");
-require("element-plus/es/components/checkbox/style/css");
-require("element-plus/es/components/option/style/css");
-const iconPlaying = require("../../../_virtual/icon-playing.cjs");
-const iconSearch = require("../../../_virtual/icon-search.cjs");
-const iconChevronDown = require("../../../_virtual/icon-chevron-down.cjs");
-const iconChevronUp = require("../../../_virtual/icon-chevron-up.cjs");
-const iconClose = require("../../../_virtual/icon-close.cjs");
-const iconSpeaker = require("../../../_virtual/icon-speaker.cjs");
-const core = require("@vueuse/core");
-const index = require("../../../i18n/index.cjs");
-const vueDompurifyHtml = require("vue-dompurify-html");
-const _hoisted_1 = { class: "o-meeting-playback-subtitles" };
-const _hoisted_2 = { class: "search-captions" };
-const _hoisted_3 = {
-  key: 0,
-  class: "suffix-box"
-};
-const _hoisted_4 = { class: "right-handle" };
-const _hoisted_5 = ["onClick"];
-const _hoisted_6 = { class: "info" };
-const _hoisted_7 = { class: "num" };
-const _hoisted_8 = { class: "speaker" };
-const _hoisted_9 = { class: "start-time" };
-const _hoisted_10 = { class: "text" };
-const _hoisted_11 = { key: 1 };
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  __name: "OMeetingPlaybackSubtitles",
-  props: {
-    captions: { default: () => [] },
-    instance: {},
-    trackIdx: {}
-  },
-  setup(__props) {
-    const vDompurifyHtml = vueDompurifyHtml.buildVueDompurifyHTMLDirective();
-    const props = __props;
-    const { t } = index.useI18n();
-    const currentIndex = vue.computed(() => props.trackIdx);
-    const scrollContainer = vue.ref();
-    const wheelVisible = vue.ref(false);
-    const handleScroll = () => {
-      wheelVisible.value = true;
-    };
-    const debounceFn = core.useDebounceFn(() => {
-      wheelVisible.value = false;
-    }, 3e3);
-    vue.watch(
-      () => wheelVisible.value,
-      (val) => {
-        if (val) {
-          debounceFn();
-        }
-      }
-    );
-    const computedCaptions = vue.ref([]);
-    vue.watch(
-      () => props.captions,
-      () => {
-        computedCaptions.value = props.captions || [];
-        vue.nextTick(() => {
-          var _a;
-          if (scrollContainer.value) {
-            (_a = scrollContainer.value) == null ? void 0 : _a.scrollTo({
-              top: 0,
-              behavior: "smooth"
-            });
-          }
-        });
-      },
-      {
-        immediate: true,
-        deep: true
-      }
-    );
-    const formatTime = (num) => {
-      const time = num.split(".")[0];
-      return `00:${time}`.slice(-8);
-    };
-    const transformTime = (time) => {
-      const arr = time.split(":");
-      const hh = arr[arr.length - 3] ? parseInt(arr[arr.length - 3]) : 0;
-      const mm = parseInt(arr[arr.length - 2]);
-      const ss = parseFloat(arr[arr.length - 1]);
-      return hh * 60 * 60 + mm * 60 + ss;
-    };
-    vue.onMounted(() => {
-      var _a;
-      scrollContainer.value = document.querySelector("#captionsScrollDom > .o-scroller-container");
-      (_a = scrollContainer.value) == null ? void 0 : _a.addEventListener("wheel", handleScroll);
-    });
-    vue.watch(
-      () => computedCaptions.value,
-      () => {
-        var _a;
-        scrollContainer.value = document.querySelector("#captionsScrollDom > .o-scroller-container");
-        (_a = scrollContainer.value) == null ? void 0 : _a.addEventListener("wheel", handleScroll);
-      }
-    );
-    const activeTab = vue.ref(0);
-    const changeTab = () => {
-    };
-    const videoPosition = (time) => {
-      const player = props.instance;
-      if (!player) {
-        return;
-      }
-      const startTime = transformTime(time);
-      player.currentTime(startTime);
-    };
-    const searchValue = vue.ref("");
-    const total = vue.ref(0);
-    const current = vue.ref(0);
-    const speakers = vue.ref([]);
-    const ALL = t("common.all");
-    const options = vue.computed(() => {
-      return [
-        ...new Set(
-          props.captions.map((item) => item.speakerLabel).sort().reverse()
-        )
-      ];
-    });
-    vue.watch(
-      () => currentIndex.value,
-      () => {
-        var _a, _b;
-        if (wheelVisible.value && searchValue.value) {
-          return;
-        }
-        const captionActive = (_a = scrollContainer.value) == null ? void 0 : _a.querySelectorAll(".captions-item")[currentIndex.value - 1];
-        (_b = scrollContainer.value) == null ? void 0 : _b.scrollTo({
-          top: (captionActive == null ? void 0 : captionActive.offsetTop) - 16,
-          behavior: "smooth"
-        });
-      }
-    );
-    vue.onUnmounted(() => {
-      if (scrollContainer.value) {
-        scrollContainer.value.removeEventListener("wheel", handleScroll);
-      }
-    });
-    const searchLocate = (step, val) => {
-      var _a, _b, _c, _d, _e, _f;
-      const currentLight = document.getElementsByClassName("light-keyword")[step - 1];
-      const nextLight = document.getElementsByClassName("light-keyword")[step - val];
-      nextLight == null ? void 0 : nextLight.classList.remove("light-keyword-active");
-      currentLight == null ? void 0 : currentLight.classList.add("light-keyword-active");
-      const aboveVisible = currentLight.offsetTop + currentLight.offsetHeight < ((_a = scrollContainer.value) == null ? void 0 : _a.scrollTop);
-      const exceedVisible = currentLight.offsetTop > ((_b = scrollContainer.value) == null ? void 0 : _b.offsetHeight) + ((_c = scrollContainer.value) == null ? void 0 : _c.scrollTop);
-      if (aboveVisible || exceedVisible) {
-        (_f = scrollContainer.value) == null ? void 0 : _f.scrollTo({
-          top: (_e = (_d = currentLight.parentElement) == null ? void 0 : _d.parentElement) == null ? void 0 : _e.offsetTop,
-          behavior: "smooth"
-        });
-      }
-    };
-    const prevKeyword = () => {
-      if (!total.value || current.value === 1) {
-        return;
-      }
-      current.value--;
-      searchLocate(current.value, 0);
-    };
-    const nextKeyword = (e) => {
-      if (e == null ? void 0 : e.shiftKey) {
-        return;
-      }
-      if (!total.value || current.value === total.value) {
-        return;
-      }
-      current.value++;
-      searchLocate(current.value, 2);
-    };
-    const highlightText = (val) => {
-      computedCaptions.value = props.captions.filter((v) => {
-        return speakers.value.includes(v.speakerLabel);
-      }).map((item) => {
-        return {
-          ...item,
-          contentHtml: val ? item.contentHtml.replaceAll(val, `<span class="light-keyword">${val}</span>`) : item.contentHtml
-        };
-      });
-      vue.nextTick(() => {
-        var _a;
-        const lightAll = document.getElementsByClassName("light-keyword");
-        total.value = lightAll.length;
-        if (total.value) {
-          nextKeyword();
-        } else {
-          (_a = scrollContainer.value) == null ? void 0 : _a.scrollTo({
-            top: 0,
-            behavior: "smooth"
-          });
-        }
-      });
-    };
-    const debounceTextFn = core.useDebounceFn(highlightText, 300);
-    vue.watch(
-      () => searchValue.value,
-      (val) => {
-        current.value = 0;
-        debounceTextFn(val);
-      }
-    );
-    vue.watch(
-      () => options.value,
-      (newVal) => {
-        speakers.value = newVal;
-      },
-      { immediate: true }
-    );
-    const checkAll = vue.ref(false);
-    const indeterminate = vue.ref(false);
-    const handleCheckAll = (checked) => {
-      indeterminate.value = false;
-      if (checked) {
-        speakers.value = options.value;
-      } else {
-        speakers.value = [];
-      }
-    };
-    vue.watch(
-      () => speakers.value,
-      (val) => {
-        if (val.length === 0) {
-          checkAll.value = false;
-          indeterminate.value = false;
-        } else if (val.length === options.value.length) {
-          checkAll.value = true;
-          indeterminate.value = false;
-        } else {
-          indeterminate.value = true;
-        }
-        debounceTextFn(searchValue.value);
-      },
-      { deep: true }
-    );
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-        vue.createElementVNode("div", _hoisted_2, [
-          vue.createVNode(vue.unref(opendesign.OInput), {
-            modelValue: searchValue.value,
-            "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => searchValue.value = $event),
-            onKeydown: [
-              vue.withKeys(nextKeyword, ["enter"]),
-              vue.withKeys(vue.withModifiers(prevKeyword, ["shift", "stop"]), ["enter"])
-            ],
-            placeholder: vue.unref(t)("meeting.searchSubtitlePlaceholder"),
-            size: "large",
-            class: "input-captions"
-          }, {
-            prefix: vue.withCtx(() => [
-              vue.createVNode(vue.unref(opendesign.OIcon), null, {
-                default: vue.withCtx(() => [
-                  vue.createVNode(vue.unref(iconSearch))
-                ]),
-                _: 1
-              })
-            ]),
-            suffix: vue.withCtx(() => [
-              searchValue.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
-                vue.createElementVNode("span", null, vue.toDisplayString(current.value) + "/" + vue.toDisplayString(total.value), 1),
-                vue.createVNode(vue.unref(opendesign.OIcon), { onClick: prevKeyword }, {
-                  default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(iconChevronUp))
-                  ]),
-                  _: 1
-                }),
-                vue.createVNode(vue.unref(opendesign.OIcon), { onClick: nextKeyword }, {
-                  default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(iconChevronDown))
-                  ]),
-                  _: 1
-                }),
-                vue.createVNode(vue.unref(opendesign.ODivider), { direction: "v" }),
-                vue.createVNode(vue.unref(opendesign.OIcon), {
-                  class: "hover-close",
-                  onClick: _cache[0] || (_cache[0] = ($event) => searchValue.value = "")
-                }, {
-                  default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(iconClose))
-                  ]),
-                  _: 1
-                })
-              ])) : vue.createCommentVNode("", true)
-            ]),
-            _: 1
-          }, 8, ["modelValue", "onKeydown", "placeholder"]),
-          vue.createElementVNode("div", _hoisted_4, [
-            vue.createVNode(vue.unref(elementPlus.ElSelect), {
-              multiple: "",
-              modelValue: speakers.value,
-              "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => speakers.value = $event),
-              "popper-class": "speakers-selector-popper",
-              class: "speakers-selector",
-              placement: "bottom"
-            }, {
-              prefix: vue.withCtx(() => [
-                vue.createVNode(vue.unref(opendesign.OIcon), null, {
-                  default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(iconSpeaker))
-                  ]),
-                  _: 1
-                })
-              ]),
-              header: vue.withCtx(() => [
-                vue.createVNode(vue.unref(elementPlus.ElCheckbox), {
-                  modelValue: checkAll.value,
-                  "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => checkAll.value = $event),
-                  indeterminate: indeterminate.value,
-                  onChange: handleCheckAll
-                }, {
-                  default: vue.withCtx(() => [
-                    vue.createTextVNode(vue.toDisplayString(vue.unref(ALL)), 1)
-                  ]),
-                  _: 1
-                }, 8, ["modelValue", "indeterminate"])
-              ]),
-              default: vue.withCtx(() => [
-                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(options.value, (t2) => {
-                  return vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElOption), {
-                    key: t2,
-                    label: t2,
-                    value: t2
-                  }, {
-                    default: vue.withCtx(() => [
-                      vue.createVNode(vue.unref(elementPlus.ElCheckbox), {
-                        "model-value": speakers.value.includes(t2)
-                      }, {
-                        default: vue.withCtx(() => [
-                          vue.createTextVNode(vue.toDisplayString(t2), 1)
-                        ]),
-                        _: 2
-                      }, 1032, ["model-value"])
-                    ]),
-                    _: 2
-                  }, 1032, ["label", "value"]);
-                }), 128))
-              ]),
-              _: 1
-            }, 8, ["modelValue"])
-          ])
-        ]),
-        vue.createVNode(vue.unref(opendesign.OTab), {
-          modelValue: activeTab.value,
-          "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => activeTab.value = $event),
-          variant: "text",
-          class: "captions-tab",
-          onChange: changeTab,
-          "max-show": 9999
-        }, {
-          default: vue.withCtx(() => [
-            vue.createVNode(vue.unref(opendesign.OTabPane), {
-              value: 0,
-              label: vue.unref(t)("meeting.audioToText")
-            }, {
-              default: vue.withCtx(() => [
-                computedCaptions.value.length ? (vue.openBlock(), vue.createBlock(vue.unref(opendesign.OScroller), {
-                  key: 0,
-                  id: "captionsScrollDom",
-                  class: "captions-scroller",
-                  "show-type": "hover",
-                  size: "small",
-                  "disabled-x": ""
-                }, {
-                  default: vue.withCtx(() => [
-                    vue.createVNode(vue.unref(opendesign.ORow), {
-                      gap: "0 8px",
-                      wrap: "wrap"
-                    }, {
-                      default: vue.withCtx(() => [
-                        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(computedCaptions.value, (item, i) => {
-                          return vue.openBlock(), vue.createBlock(vue.unref(opendesign.OCol), {
-                            flex: "0 0 100%",
-                            key: i
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createElementVNode("div", {
-                                class: vue.normalizeClass(["captions-item", { "captions-item-active": currentIndex.value === i + 1 }]),
-                                onClick: ($event) => videoPosition(item.start_time)
-                              }, [
-                                vue.createElementVNode("div", _hoisted_6, [
-                                  vue.createElementVNode("div", _hoisted_7, vue.toDisplayString(item.speakerIdx), 1),
-                                  vue.createElementVNode("div", _hoisted_8, vue.toDisplayString(item.speakerLabel), 1),
-                                  vue.createElementVNode("div", _hoisted_9, vue.toDisplayString(formatTime(item.start_time)), 1),
-                                  currentIndex.value === i + 1 ? (vue.openBlock(), vue.createBlock(vue.unref(opendesign.OIcon), {
-                                    key: 0,
-                                    class: "playing initial-fill"
-                                  }, {
-                                    default: vue.withCtx(() => [
-                                      vue.createVNode(vue.unref(iconPlaying))
-                                    ]),
-                                    _: 1
-                                  })) : vue.createCommentVNode("", true)
-                                ]),
-                                vue.withDirectives(vue.createElementVNode("div", _hoisted_10, null, 512), [
-                                  [vue.unref(vDompurifyHtml), item.contentHtml]
-                                ])
-                              ], 10, _hoisted_5)
-                            ]),
-                            _: 2
-                          }, 1024);
-                        }), 128))
-                      ]),
-                      _: 1
-                    })
-                  ]),
-                  _: 1
-                })) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_11, [
-                  vue.renderSlot(_ctx.$slots, "empty")
-                ]))
-              ]),
-              _: 3
-            }, 8, ["label"])
-          ]),
-          _: 3
-        }, 8, ["modelValue"])
-      ]);
-    };
-  }
-});
-module.exports = _sfc_main;

package/dist/treeshaking/cjs/components/meeting/components/OMeetingPlaybackSubtitles.vue4.cjs

@@ -1,5 +0,0 @@
-"use strict";
-const OMeetingPlaybackSubtitles_vue_vue_type_script_setup_true_lang = require("./OMeetingPlaybackSubtitles.vue.cjs");
-;require('./OMeetingPlaybackSubtitles.css');
-;require('./OMeetingPlaybackSubtitles2.css');
-module.exports = OMeetingPlaybackSubtitles_vue_vue_type_script_setup_true_lang;