diff --git a/taoyao-server/src/main/resources/static/css/style.css b/taoyao-server/src/main/resources/static/css/style.css
index d69ee02..e553416 100644
--- a/taoyao-server/src/main/resources/static/css/style.css
+++ b/taoyao-server/src/main/resources/static/css/style.css
@@ -34,3 +34,6 @@ input::-webkit-calendar-picker-indicator{color:#1155AA;background:none;}
.taoyao .meeting > .video video{width:100%;height:100%;}
.taoyao .meeting .handler{position:absolute;bottom:0rem;text-align:center;width:100%;background:rgba(0,0,0,0.2);padding:0.2rem 0;}
.taoyao .meeting .handler a{color:#fff;}
+.taoyao .meeting .handler a.record:hover{color:#060!important;}
+.taoyao .meeting .handler a.record.active{color:#C00;}
+.taoyao .meeting .handler a.kick:hover{color:#C00;}
diff --git a/taoyao-server/src/main/resources/static/javascript/app.js b/taoyao-server/src/main/resources/static/javascript/app.js
new file mode 100644
index 0000000..197deb9
--- /dev/null
+++ b/taoyao-server/src/main/resources/static/javascript/app.js
@@ -0,0 +1,9 @@
+/** 桃夭WebRTC终端应用功能 */
+// 样式操作
+function classSwitch(e, className) {
+ if(e.className.indexOf(className) >= 0) {
+ e.className = e.className.replace(className, '').replace(/(^\s)|(\s$)/g, "");
+ } else {
+ e.className = e.className + ' ' + className;
+ }
+}
diff --git a/taoyao-server/src/main/resources/static/javascript/taoyao.js b/taoyao-server/src/main/resources/static/javascript/taoyao.js
index 9cb641a..fcee481 100644
--- a/taoyao-server/src/main/resources/static/javascript/taoyao.js
+++ b/taoyao-server/src/main/resources/static/javascript/taoyao.js
@@ -1,6 +1,4 @@
-/**
- * 桃夭WebRTC终端示例
- */
+/** 桃夭WebRTC终端核心功能 */
/** 配置 */
const config = {
// 当前终端SN
@@ -77,8 +75,10 @@ function Taoyao(
this.clientMedia = {};
/** 信令通道 */
this.signalChannel = null;
- /** 初始 */
- this.init = function() {
+ /** 发送信令 */
+ this.push = null;
+ /** 检查设备 */
+ this.checkDevice = function() {
let self = this;
if(navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) {
navigator.mediaDevices.enumerateDevices()
@@ -153,6 +153,10 @@ function Taoyao(
this.buildChannel = function(callback) {
this.signalChannel = signalChannel;
this.signalChannel.connect(this.webSocket, callback);
+ // 不能直接this.push = this.signalChannel.push这样导致this对象错误
+ this.push = function(data, callback) {
+ this.signalChannel.push(data, callback)
+ };
};
/** 本地媒体 */
this.buildLocalMedia = function() {
@@ -221,7 +225,7 @@ const protocol = {
},
"body": body
};
- return JSON.stringify(message);
+ return message;
}
};
/** 信令消息 */
@@ -233,6 +237,8 @@ const signalChannel = {
address: null,
/** 回调 */
callback: null,
+ /** 回调事件 */
+ callbackMapping: new Map(),
/** 心跳时间 */
heartbeatTime: 10 * 1000,
/** 心跳定时器 */
@@ -256,7 +262,7 @@ const signalChannel = {
let self = this;
self.heartbeatTimer = setTimeout(function() {
if (self.channel && self.channel.readyState == WebSocket.OPEN) {
- self.channel.send(protocol.buildProtocol(config.sn, protocol.pid.heartbeat));
+ self.push(protocol.buildProtocol(config.sn, protocol.pid.heartbeat));
self.heartbeat();
} else {
console.log('发送心跳失败', self.channel);
@@ -297,7 +303,7 @@ const signalChannel = {
self.channel = new WebSocket(address);
self.channel.onopen = function(e) {
console.log('信令通道打开', e);
- self.channel.send(protocol.buildProtocol(
+ self.push(protocol.buildProtocol(
config.sn,
protocol.pid.register,
{
@@ -329,11 +335,30 @@ const signalChannel = {
};
self.channel.onmessage = function(e) {
console.log('信令消息', e.data);
+ let data = JSON.parse(e.data);
+ // 注册回调
if(callback) {
- callback(JSON.parse(e.data));
+ callback(data);
+ }
+ // 请求回调
+ if(self.callbackMapping.has(data.header.id)) {
+ self.callbackMapping.get(data.header.id)();
+ self.callbackMapping.delete(data.header.id);
}
};
});
+ },
+ /** 信令消息 */
+ push: function(data, callback) {
+ // 注册回调
+ if(data && callback) {
+ this.callbackMapping.set(data.header.id, callback);
+ }
+ if(data && data.header) {
+ this.channel.send(JSON.stringify(data));
+ } else {
+ this.channel.send(data);
+ }
}
};
/*
diff --git a/taoyao-server/src/main/resources/static/meeting.html b/taoyao-server/src/main/resources/static/meeting.html
index a3ac6aa..4d7ed53 100644
--- a/taoyao-server/src/main/resources/static/meeting.html
+++ b/taoyao-server/src/main/resources/static/meeting.html
@@ -5,16 +5,17 @@
会议
+
@@ -50,8 +51,8 @@
list.appendChild(child);
}
const taoyao = new Taoyao();
- // 初始
- taoyao.init();
+ // 检查设备
+ taoyao.checkDevice();
// 配置媒体
taoyao.request('/config/media', {}, 'GET', false)
.then(response => {
@@ -68,11 +69,35 @@
// 信令回调
function callback(data) {
switch(data.header.pid) {
- case 1000:
+ case protocol.pid.heartbeat:
// 心跳
break;
+ case protocol.pid.register:
+ // 录制
+ break;
}
}
+ // 创建房间
+ function create() {
+ }
+ // 进入房间
+ function enter() {
+ }
+ // 声音控制
+ function audio() {
+ }
+ // 视频控制
+ function video() {
+ }
+ // 录制视频
+ function record(e) {
+ taoyao.push(protocol.buildProtocol(config.sn, protocol.pid.heartbeat), () => {
+ classSwitch(e, 'active');
+ });
+ }
+ // 踢出会议
+ function kick() {
+ }
// 信令通道
/*
taoyao.buildLocalMedia()