Skip to content

李宁 / Activity

Go to a project
Commit eafcb20d by 李宁
Options

1

2 parents d88d95b5 6cf9c4e8
Inline Side-by-side
Showing 4 changed files with 141 additions and 26 deletions
huaian/css/demo.css
......@@ -963,4 +963,13 @@ html,body{
div{
font-family: -apple-system, BlinkMacSystemFont, sans-serif;
}
#local-player video{
object-fit: cover;
width: 100%!important;
height: 100%!important;
position: absolute;
left: 0px;
top: 0px;
}
\ No newline at end of file
huaian/demo.html
......@@ -7,12 +7,16 @@
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>江苏移动</title>
<link rel="stylesheet" href="https://xpo.oss-cn-beijing.aliyuncs.com/huaian/css/vant.css"/>
<link rel="stylesheet" href="css/demo.css?676376">
<link rel="stylesheet" href="css/demo.css?6763276">
</head>
<body>
<div class="container">
<div class="cameraDiv" id="local-player"></div>
<div class="cameraDiv">
<div id="local-player" style="width: 100%;height: 100%;position: relative;overflow: hidden;">
</div>
</div>
<canvas id="canvas" style="display: none;"></canvas>
<div class="conDiv">
......@@ -69,7 +73,7 @@
</div>
<div class="swDown" id="tipDiv">
<div class="buttDiv">
<div class="buttDiv" style="flex-grow: 1;">
<div class="one none clickButt" id="readButt" key="ok">准备好了</div>
<div class="one none clickButt" id="nextQuestion" key="nextStep">下一个问题</div>
......@@ -358,9 +362,10 @@
<script type="text/javascript" charset="utf-8" src="js/vconsole.min.js"></script>
<script>
var vConsole = new VConsole();
console.log('vConsole 初始化')
var vConsole = new VConsole()
</script>
<script src="js/livekit-client.min.js"></script>
<script src="js/aliyun-oss-sdk-6.20.0.min.js"></script>
<script src="js/jquery-3.4.1.min.js"></script>
<script src="js/axios.min.js"></script>
......
huaian/js/demo.js
......@@ -288,6 +288,7 @@ function getProcess(){
setTimeout(()=>{
$("#mp3Source").attr('src', voiceUrl)
$("#mp3Source")[0].play()
//promptAndMute()
},350)
}
audioSet(false)
......@@ -612,9 +613,18 @@ $("#videoSwitch").click(async function(e){
camsId = arr[arr.length-1].deviceId
}
await localTracks.videoTrack.setDevice(camsId);
if(rtcType == 1){
await localTracks.videoTrack.setDevice(camsId);
}else{
await room.switchActiveDevice('videoinput', camsId);
}
}else{
await localTracks.videoTrack.setDevice(cams[0].deviceId);
if(rtcType == 1){
await localTracks.videoTrack.setDevice(cams[0].camsId);
}else{
await room.switchActiveDevice('videoinput', cams[0].camsId);
}
camsId = ''
}
}
......@@ -994,6 +1004,26 @@ async function setEnabled(type, state) {
}
}
async function initOrigin(data){
createClient()
options.channel = data.data.data.channel
options.uid = data.data.data.uid
options.token = data.data.data.token
let flag = await join()
if(!flag){
$('#loading').hide()
util.toast('加入频道失败')
return
}
util.toast('声网入会成功')
await createTrackAndPublish()
}
var room = null
var rtcType = ''
var startZjFlag = true
async function init(){
$('#loadingText').text('开启中，请稍候...')
......@@ -1013,8 +1043,6 @@ async function init(){
$("#mp3Source")[0].autoplay = true
$("#mp3Source")[0].play()
createClient()
let data = await util.httpRequest({
url: '/createRoom',
data: {
......@@ -1028,24 +1056,52 @@ async function init(){
return
}
options.channel = data.data.data.channel
options.uid = data.data.data.uid
options.token = data.data.data.token
let flag = await join()
if(!flag){
$('#loading').hide()
util.toast('加入频道失败')
return
}
callId = data.data.data.callId
sessionStorage.setItem('haCallId',callId)
await createTrackAndPublish()
rtcType = data.data.data.rtcType
if(data.data.data.rtcType == 1){
await initOrigin(data)
}else{
// 创建房间实例，启用自适应流和动态发布
room = new LivekitClient.Room({
adaptiveStream: true,
dynacast: true,
videoCaptureDefaults: {
resolution: LivekitClient.VideoPresets.h720.resolution,
frameRate: 25,
}
});
//resolution: LivekitClient.VideoPresets.h720.resolution,
//new VideoPreset(1280, 720, 1_700_000, 30)
//LivekitClient.VideoPresets.h720.resolution
//frameRate: 25,
// 设置事件监听器
room
.on(LivekitClient.RoomEvent.LocalTrackPublished, handleLocalTrackPublished)
let url = 'wss://lk.lgyzpt.com'
let roomToken = data.data.data.token
// 预连接以加速连接过程
await this.room.prepareConnection(url, roomToken);
// 连接到房间
await this.room.connect(url, roomToken);
util.toast('livekit入会成功')
await this.room.localParticipant.setCameraEnabled(true)
util.toast('摄像头开启成功')
await this.room.localParticipant.setMicrophoneEnabled(true)
util.toast('麦克风开启成功')
// await room.localParticipant.enableCameraAndMicrophone()
// util.toast('录像开启成功')
const devices = await LivekitClient.Room.getLocalDevices('videoinput');
cams = devices
}
$('#loading').hide()
startZjFlag = false
$('#loading').hide()
startZjFlag = false
$("#videoSwitch").css('display', 'flex')
if(isHuaweiPhone() == '1'){
......@@ -1055,8 +1111,47 @@ async function init(){
intervalStr = setInterval(() => {
getProcess()
}, 1000);
setTimeout(()=>{
$('#livekit-dummy-audio-el').remove();
},1000)
setTimeout(async ()=>{
const {mics,spks} = await getAudioDevices();
renderSelect($('#micSelect'), mics, 'mic');
renderSelect($('#spkSelect'), spks, 'spk');
// 事件绑定
$('#micSelect').on('change', e=> changeMic(e.target.value) );
$('#spkSelect').on('change', e=> changeSpk(e.target.value) );
$('#refreshBtn').on('click', init);
},2000)
}
function handleLocalTrackPublished(publication, participant) {
console.log(`本地轨道已发布: ${publication.trackName || publication.source}`);
if (publication.track && (publication.track.kind === LivekitClient.Track.Kind.Video || publication.track.kind === LivekitClient.Track.Kind.Audio)) {
// 将轨道附加到视频元素
const elements = publication.track.attach();
// 确保elements是一个数组，如果不是则包装成数组
const elementArray = Array.isArray(elements) ? elements : [elements];
elementArray.forEach(element => {
// 设置视频元素属性
if (element.tagName === 'VIDEO') {
element.setAttribute('autoplay', '');
element.setAttribute('playsinline', '');
}
$('#local-player').append(element);
});
$('#local-player audio').remove();
}
}
function isHuaweiPhone() {
let userAgent = navigator.userAgent.toLowerCase()
......@@ -1136,9 +1231,8 @@ $("#hideAccountExample").click(()=>{
$("#accountExampleAlert").hide()
})
$("#cameraDiv").click(()=>{
$("#cameraDiv").click(async ()=>{
let camArr = []
cams.forEach((item,index)=>{
camArr[camArr.length] = '镜头'+(index+1)
})
......@@ -1185,7 +1279,8 @@ var vm = new Vue({
this.reasonPickData.index = index
camsId = cams[index].deviceId
localTracks.videoTrack.setDevice(camsId);
//localTracks.videoTrack.setDevice(camsId);
room.switchActiveDevice('videoinput', camsId);
this.reasonCancel()
},
......@@ -1403,3 +1498,9 @@ async function queryImgUrl() {
return ''
}
}
// // 页面加载完成后初始化客户端
// document.addEventListener('DOMContentLoaded', () => {
// new LiveKitClient();
// });
\ No newline at end of file
huaian/js/livekit-client.min.js 0 → 100644
This diff could not be displayed because it is too large.
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!