cione-comp-lib
Version:
`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`
81 lines (80 loc) • 2.94 kB
JavaScript
import { defineComponent, reactive, ref, computed, onMounted, resolveComponent, openBlock, createElementBlock, createBlock } from "vue";
import FailView from "./component/fail_view.mjs";
import VideoView from "./component/video_view.mjs";
import WebRTC from "./lib.rtc.mjs";
import "./index3.mjs";
import _export_sfc from "../../_virtual/plugin-vue_export-helper.mjs";
const _sfc_main = defineComponent({
name: "CoRtc",
props: {
host: { type: String, default: "signalserver.cionetech.com" },
port: { type: Number, default: 0 },
size: { type: Number, default: 100 },
font: { type: Object, default: { fontSize: 20 } }
},
emits: [],
components: { FailView, VideoView },
setup(props) {
const state = reactive({ support: false, connectd: false, userId: 0 });
const rtc = ref();
const stream = ref();
const qrSize = computed(() => `${props.size}px`);
function addTrack(event) {
const track = event.track;
const mediaStream = stream.value;
mediaStream.addTrack(track);
}
function connectionSuccess() {
const webRTC = rtc.value;
state.userId = webRTC.userId;
}
function connectdSuccess() {
state.connectd = true;
}
function disconnectedCb() {
state.connectd = false;
stopLocalStream();
stream.value = new MediaStream();
}
function stopLocalStream() {
const stateStream = stream.value;
const trackList = stateStream ? stateStream.getTracks() : [];
for (let i = 0; i < trackList.length; i++) {
const track = trackList[i];
track.stop();
}
}
function init() {
let webRTC;
state.support = WebRTC.checkSupport();
if (!state.support)
return;
webRTC = new WebRTC(props.host, props.port);
rtc.value = webRTC;
stream.value = new MediaStream();
webRTC.on("track", addTrack);
webRTC.on("connection", connectionSuccess);
webRTC.on("connected", connectdSuccess);
webRTC.on("disconnected", disconnectedCb);
}
onMounted(init);
return { state, stream, size: qrSize, font: props.font };
}
});
const _hoisted_1 = { class: "co-rtc-container" };
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_video_view = resolveComponent("video-view");
const _component_fail_view = resolveComponent("fail-view");
return openBlock(), createElementBlock("div", _hoisted_1, [
_ctx.state.support ? (openBlock(), createBlock(_component_video_view, {
key: 0,
"user-id": _ctx.state.userId,
connectd: _ctx.state.connectd,
"media-stream": _ctx.stream,
size: _ctx.size,
fontStyle: _ctx.font
}, null, 8, ["user-id", "connectd", "media-stream", "size", "fontStyle"])) : (openBlock(), createBlock(_component_fail_view, { key: 1 }))
]);
}
var RTC = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
export { RTC as default };