Commit 61292688 authored by liujiaxin's avatar liujiaxin

添加iframe和白板切换按钮

parent 3a2d2dba
......@@ -66,7 +66,7 @@
display: flex;
flex-wrap: wrap;
overflow: hidden;
margin-top: 20px;
//margin-top: 20px;
.member{
flex: 33% 0;
height: 40px;
......
......@@ -106,8 +106,8 @@ export const RootProvider: React.FC<any> = ({children}) => {
});
rtmClient.on("AttributesUpdated", (attributes: object) => {
const channelAttrs = resolveChannelAttrs(attributes);
console.log('[rtm-client] updated resolved attrs', channelAttrs);
console.log('[rtm-client] updated origin attributes', attributes);
// console.log('[rtm-client] updated resolved attrs', channelAttrs);
// console.log('[rtm-client] updated origin attributes', attributes);
roomStore.updateRoomAttrs(channelAttrs)
});
rtmClient.on("MemberJoined", (memberId: string) => {
......@@ -166,4 +166,4 @@ export const RootProvider: React.FC<any> = ({children}) => {
{children}
</RootContext.Provider>
)
}
\ No newline at end of file
}
......@@ -131,8 +131,11 @@ export default function useStream () {
const teacherUid = course.teacherId;
const peerUsers = roomState.rtc.users;
// exclude teacher and me
let studentIds = peerUsers.filter((it: number) => it !== +teacherUid && it !== +me.uid && it !== SHARE_ID);
studentIds = studentIds.add(+me.uid);
let studentIds = peerUsers.filter((it: number) => `${it}` !== `${teacherUid}` && `${it}` !== `${me.uid}` && `${it}` !== `${SHARE_ID}`);
if (me.role != 'teacher') {
studentIds = studentIds.add(+me.uid);
}
const studentStreams: any[] = [];
const myAttr = userAttrs.get(me.uid);
......@@ -140,17 +143,19 @@ export default function useStream () {
console.log(100000, studentsOrder);
console.log(11111111, studentIds.toArray());
studentIds = studentIds.sort(function(a, b){
if (studentsOrder.indexOf(+a) < 0) {return 0}
if (studentsOrder.indexOf(+b) < 0) {return 0}
return studentsOrder.indexOf(+a) - studentsOrder.indexOf(+b);
});
console.log(222222, studentIds.toArray());
// when i m student
// capture all remote streams
for (let studentId of studentIds) {
if (me.role === 'student' && +me.uid == studentId) {
if (myAttr && roomState.rtc.localStream) {
console.log('use local stream')
const _tmpStream = {
...roomState.rtc.localStream,
account: myAttr.account,
......@@ -188,6 +193,7 @@ export default function useStream () {
}, [
course,
me.uid,
roomStore.state.studentsOrder,
roomState.rtc.users,
roomState.rtc.remoteStreams,
roomState.rtc.localStream
......
......@@ -158,6 +158,7 @@ export function RoomPage({ children }: any) {
}, [me.role, location.pathname, course.linkId]);
useEffect(() => {
console.log(4, 'rtc publish stream');
if (!rtcJoined || rtc.current) return;
if (platform === 'web') {
......@@ -209,6 +210,7 @@ export function RoomPage({ children }: any) {
useEffect(() => {
if (!roomState.me.uid || !roomState.course.rid) return;
if (classroom) {
debugger
if (platform === 'web') {
const webClient = roomStore.rtcClient as AgoraWebClient;
if (webClient.joined) {
......@@ -292,7 +294,9 @@ export function RoomPage({ children }: any) {
console.info(`[agora-web] stream: ${uid} fallback: ${msg}`);
})
rtc.current = true;
debugger
// WARN: IF YOU ENABLED APP CERTIFICATE, PLEASE SIGN YOUR TOKEN IN YOUR SERVER SIDE AND OBTAIN IT FROM YOUR OWN TRUSTED SERVER API
console.info(1, 'rtc join')
webClient
.joinChannel({
uid: +roomState.me.uid,
......@@ -300,11 +304,21 @@ export function RoomPage({ children }: any) {
token: '',
dual: isSmallClass
}).then(() => {
console.info(2, 'rtc join ok')
// 如果当前用户是教师,直接发布,
if(roomStore.state.me.role == 'teacher') {
roomStore.publishMeStream();
} else {
// 看台上几个人里包含自己
if (roomStore.state.studentsOrder.includes(+me.uid)) {
roomStore.publishMeStream();
}
}
}).catch(console.warn).finally(() => {
rtc.current = false;
});
return () => {
console.log('exit')
const events = [
'onTokenPrivilegeWillExpire',
'onTokenPrivilegeDidExpire',
......
......@@ -6,6 +6,7 @@ import './small-class.scss';
import CourseWareFrame from "../../components/courseware-frame";
import VideoShowList from "../../components/video-stage-list";
import {ToolsSwitcherController} from "../../components/tools-switcher-controller";
import {roomStore} from "../../stores/room";
export default function SmallClass() {
const [tool, setTool] = useState(true);
......@@ -18,8 +19,11 @@ export default function SmallClass() {
<ToolsSwitcherController onClick={() => {
setTool(!tool);
}}/>
{tool ? <MediaBoard /> : <CourseWareFrame></CourseWareFrame>}
<Roomboard currentActive={'media'} />
{tool
? <div>MediaBoard</div> /*<MediaBoard />*/
: <CourseWareFrame></CourseWareFrame>}
{ roomStore.state.me.role == 'teacher' ? <Roomboard currentActive={'media'} /> : null}
</div>
</div>
)
......
......@@ -131,8 +131,8 @@ function HomePage() {
<div className="web-menu">
<div className="web-menu-container">
<div className="short-title">
<span className="title">Agora Education</span>
<span className="subtitle">Powered by agora.io</span>
<span className="title">iTeachABC 直播教室</span>
<span className="subtitle">Powered by iplayabc.com</span>
</div>
<Icon className="icon-setting" onClick={handleSetting}/>
</div>
......
This diff is collapsed.
......@@ -286,6 +286,7 @@ export class AgoraElectronClient {
}
exit () {
console.log('exit')
this.leave();
this.destroyClient();
}
......@@ -303,4 +304,4 @@ export class AgoraElectronClient {
}
}
export const nativeRTCClient = new AgoraElectronClient();
\ No newline at end of file
export const nativeRTCClient = new AgoraElectronClient();
......@@ -337,9 +337,16 @@ export default class AgoraWebClient {
await this.rtc.createClient(APP_ID, true);
await this.rtc.join(this.localUid, channel, token);
dual && await this.rtc.enableDualStream();
// 改成手动发布
// roomStore.setRTCJoined(true);
this.joined = true;
roomStore.setRTCJoined(true);
}
// async publishStream() {
// if (this.joined) {
// return roomStore.setRTCJoined(true);
// }
// }
async leaveChannel() { console.log('unpublish leaveChannel' , 3);
this.localUid = 0;
......
......@@ -55,7 +55,11 @@ export default class AgoraRTMClient {
this._client = AgoraRTM.createInstance(APP_ID, { enableLogUpload: false, logFilter });
}
async addOrUpdateChannelAttributes(data: any, enableNotificationToChannelMembers = true): Promise<string> {
return await this._client.addOrUpdateChannelAttributes(this._currentChannelName, data, {enableNotificationToChannelMembers});
const channelAttributes: {[key: string]: string} = {};
for (const k of Object.keys(data)) {
channelAttributes[k] = typeof(data[k]) != 'string' ? JSON.stringify(data[k]) : data[k];
}
return await this._client.addOrUpdateChannelAttributes(this._currentChannelName, channelAttributes, {enableNotificationToChannelMembers});
}
public removeAllListeners(): any {
......@@ -95,6 +99,10 @@ export default class AgoraRTMClient {
return
}
async clearChannelAttributes() {
await this._client.clearChannelAttributes(this._currentChannelName);
}
async logout () {
if (!this._logged) return;
await this.leave(this._currentChannelName);
......@@ -160,7 +168,7 @@ export default class AgoraRTMClient {
async setChannelAttrsKey(key: any) {
this._channelAttrsKey = `${key}`;
}
async updateChannelAttrsByKey (data: {[key: string]: string}/*key: string, attrs: any*/) {
async updateChannelAttrsByKey____ (data: {[key: string]: string}/*key: string, attrs: any*/) {
// this._channelAttrsKey = key;
const channelAttributes: {[key: string]: string} = {};
for (const k of Object.keys(data)) {
......@@ -169,7 +177,7 @@ export default class AgoraRTMClient {
// if (key) {
// channelAttributes[key] = JSON.stringify(attrs);
// }
console.log("[rtm-client] updateChannelAttrsByKey ", data);
console.log("[rtm-client] addOrUpdateChannelAttributes ", channelAttributes);
// console.log("[rtm-client] updateChannelAttrsByKey ", attrs, " key ", key, channelAttributes);
await this._client.addOrUpdateChannelAttributes(
this._currentChannelName,
......@@ -177,7 +185,7 @@ export default class AgoraRTMClient {
{enableNotificationToChannelMembers: true});
}
async ___updateChannelAttrsByKey (key: string, attrs: any) {
async updateChannelAttrsByKey (key: string, attrs: any) {
this._channelAttrsKey = key;
const channelAttributes: {[key: string]: string} = {}
if (key) {
......@@ -236,16 +244,17 @@ export default class AgoraRTMClient {
async getChannelAttributeBy(channelName: string) {
let json = await this._client.getChannelAttributes(channelName);
const accounts = [];
const data:any = {};
for (let key of Object.keys(json)) {
if (key === 'teacher') {
const teacherObj = jsonParse(_.get(json, `${key}.value`));
console.log("teacherObj ", teacherObj);
// when teacher is not empty object
if(teacherObj && Object.keys(teacherObj).length) {
accounts.push({role: 'teacher', ...teacherObj});
}
continue;
}
// if (key === 'teacher') {
// const teacherObj = jsonParse(_.get(json, `${key}.value`));
// console.log("teacherObj ", teacherObj);
// // when teacher is not empty object
// if(teacherObj && Object.keys(teacherObj).length) {
// accounts.push({role: 'teacher', ...teacherObj});
// }
// continue;
// }
// if (key === 'studentsOrder') {
// continue
// }
......@@ -256,9 +265,12 @@ export default class AgoraRTMClient {
student.uid = key;
accounts.push(student);
}
} else {
data[key] = jsonParse(_.get(json, `${key}.value`))
}
}
return accounts;
data.accounts = accounts;
return data;
}
async sendPeerMessage(peerId: string, body: MessageBody) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment