Skip to content

Commit 019cc17

Browse files
fixed meeting bug
1 parent 7292e25 commit 019cc17

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

58 files changed

+105
-287588
lines changed

client/packages/lowcoder-comps/package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -34,16 +34,16 @@
3434
"lowcoder": {
3535
"description": "",
3636
"comps": {
37-
"meetingSharing": {
38-
"name": "Agora Meeting Sharing",
37+
"meetingController": {
38+
"name": "Agora Meeting Controller",
3939
"icon": "./icons/icon-comp-calendar.svg",
4040
"layoutInfo": {
4141
"w": 15,
4242
"h": 60
4343
}
4444
},
45-
"meetingController": {
46-
"name": "Agora Meeting Controller",
45+
"meetingSharing": {
46+
"name": "Agora Meeting Sharing",
4747
"icon": "./icons/icon-comp-calendar.svg",
4848
"layoutInfo": {
4949
"w": 15,

client/packages/lowcoder-comps/src/comps/agoraMeetingComp/meetingControllerComp.tsx

Lines changed: 83 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import {
1616
gridItemCompToGridItems,
1717
Layers,
1818
isNumeric,
19-
EditorContext,
2019
withMethodExposing,
2120
eventHandlerControl,
2221
DrawerStyle,
@@ -26,19 +25,23 @@ import {
2625
Drawer,
2726
changeChildAction,
2827
HintPlaceHolder,
29-
styled,
28+
// styledm,
29+
// DrawerWrapper,
3030
BackgroundColorContext,
3131
ContainerCompBuilder,
3232
closeEvent,
3333
MeetingEventHandlerControl,
3434
} from "lowcoder-sdk";
35+
import { default as CloseOutlined } from "@ant-design/icons/CloseOutlined";
36+
import type { JSONValue } from "../../../../lowcoder/src/util/jsonTypes";
37+
// import { default as Button } from "antd/es/button";
3538

3639
const EventOptions = [closeEvent] as const;
3740
import { trans } from "../../i18n/comps";
38-
const DrawerWrapper = styled.div`
39-
// Shield the mouse events of the lower layer, the mask can be closed in the edit mode to prevent the lower layer from sliding
40-
pointer-events: auto;
41-
`;
41+
// const DrawerWrapper = styledm.div`
42+
// // Shield the mouse events of the lower layer, the mask can be closed in the edit mode to prevent the lower layer from sliding
43+
// pointer-events: auto;
44+
// `;
4245
import AgoraRTC, {
4346
type ICameraVideoTrack,
4447
type IMicrophoneAudioTrack,
@@ -80,7 +83,7 @@ let screenShareStream: ILocalVideoTrack;
8083
let userId: UID | null | undefined;
8184
let rtmChannelResponse: RtmChannel;
8285
let rtmClient: RtmClient;
83-
// const ButtonStyle = styled(Button)`
86+
// const ButtonStyle = styledm(Button)`
8487
// position: absolute;
8588
// left: 0;
8689
// top: 0;
@@ -209,6 +212,7 @@ const CanvasContainerID = "__canvas_container__";
209212
const meetingControllerChildren = {
210213
visible: withDefault(BooleanStateControl, "false"),
211214
onEvent: eventHandlerControl(EventOptions),
215+
onMeetingEvent: MeetingEventHandlerControl,
212216
width: StringControl,
213217
height: StringControl,
214218
autoHeight: AutoHeightControl,
@@ -219,12 +223,11 @@ const meetingControllerChildren = {
219223
meetingActive: withDefault(BooleanStateControl, "false"),
220224
audioControl: withDefault(BooleanStateControl, "false"),
221225
videoControl: withDefault(BooleanStateControl, "true"),
222-
onMeetingEvent: MeetingEventHandlerControl,
223226
endCall: withDefault(BooleanStateControl, "false"),
224227
sharing: withDefault(BooleanStateControl, "false"),
225228
appId: withDefault(StringControl, trans("meeting.appid")),
226-
participants: stateComp([]),
227-
usersScreenShared: stateComp([]),
229+
participants: stateComp<JSONValue>([]),
230+
usersScreenShared: stateComp<JSONValue>([]),
228231
localUser: jsonObjectExposingStateControl(""),
229232
localUserID: withDefault(
230233
stringStateControl(trans("meeting.localUserID")),
@@ -236,7 +239,7 @@ const meetingControllerChildren = {
236239
),
237240
rtmToken: stringStateControl(trans("meeting.rtmToken")),
238241
rtcToken: stringStateControl(trans("meeting.rtcToken")),
239-
messages: stateComp([]),
242+
messages: stateComp<JSONValue>([]),
240243
};
241244
let MTComp = (function () {
242245
return new ContainerCompBuilder(
@@ -483,74 +486,74 @@ let MTComp = (function () {
483486

484487
return (
485488
<BackgroundColorContext.Provider value={props.style.background}>
486-
<DrawerWrapper>
487-
<Drawer
488-
// resizable={resizable}
489-
onResizeStop={onResizeStop}
490-
rootStyle={
491-
props.visible.value
492-
? { overflow: "auto", pointerEvents: "auto" }
493-
: {}
494-
}
495-
styles={{
496-
wrapper: {
497-
maxHeight: "100%",
498-
maxWidth: "100%",
499-
},
500-
body: {
501-
padding: 0,
502-
backgroundColor: props.style.background,
503-
},
504-
}}
505-
closable={false}
506-
placement={props.placement}
507-
open={props.visible.value}
508-
getContainer={() =>
509-
document.querySelector(`#${CanvasContainerID}`) || document.body
510-
}
511-
footer={null}
512-
width={transToPxSize(props.width || DEFAULT_SIZE)}
513-
height={
514-
!props.autoHeight
515-
? transToPxSize(props.height || DEFAULT_SIZE)
516-
: ""
489+
{/* <DrawerWrapper> */}
490+
<Drawer
491+
// resizable={resizable}
492+
onResizeStop={onResizeStop}
493+
rootStyle={
494+
props.visible.value
495+
? { overflow: "auto", pointerEvents: "auto" }
496+
: {}
497+
}
498+
styles={{
499+
wrapper: {
500+
maxHeight: "100%",
501+
maxWidth: "100%",
502+
},
503+
body: {
504+
padding: 0,
505+
backgroundColor: props.style.background,
506+
},
507+
}}
508+
closable={false}
509+
placement={props.placement}
510+
open={props.visible.value}
511+
getContainer={() =>
512+
document.querySelector(`#${CanvasContainerID}`) || document.body
513+
}
514+
footer={null}
515+
width={transToPxSize(props.width || DEFAULT_SIZE)}
516+
height={
517+
!props.autoHeight
518+
? transToPxSize(props.height || DEFAULT_SIZE)
519+
: ""
520+
}
521+
onClose={(e: any) => {
522+
props.visible.onChange(false);
523+
}}
524+
afterOpenChange={(visible: any) => {
525+
if (!visible) {
526+
props.onEvent("close");
517527
}
518-
onClose={(e: any) => {
519-
props.visible.onChange(false);
520-
}}
521-
afterOpenChange={(visible: any) => {
522-
if (!visible) {
523-
props.onEvent("close");
524-
}
525-
}}
526-
zIndex={Layers.drawer}
527-
maskClosable={props.maskClosable}
528-
mask={props.showMask}
529-
>
530-
{/* <ButtonStyle
528+
}}
529+
zIndex={Layers.drawer}
530+
maskClosable={props.maskClosable}
531+
mask={props.showMask}
532+
>
533+
{/* <ButtonStyle
531534
onClick={() => {
532535
props.visible.onChange(false);
533536
}}
534537
>
535538
<CloseOutlined />
536539
</ButtonStyle> */}
537-
<InnerGrid
538-
{...otherContainerProps}
539-
items={gridItemCompToGridItems(items)}
540-
autoHeight={props.autoHeight}
541-
minHeight={isTopBom ? DEFAULT_SIZE + "px" : "100%"}
542-
style={{ height: "100%" }}
543-
containerPadding={[DEFAULT_PADDING, DEFAULT_PADDING]}
544-
hintPlaceholder={HintPlaceHolder}
545-
bgColor={props.style.background}
546-
/>
547-
</Drawer>
548-
</DrawerWrapper>
540+
<InnerGrid
541+
{...otherContainerProps}
542+
items={gridItemCompToGridItems(items)}
543+
autoHeight={props.autoHeight}
544+
minHeight={isTopBom ? DEFAULT_SIZE + "px" : "100%"}
545+
style={{ height: "100%" }}
546+
containerPadding={[DEFAULT_PADDING, DEFAULT_PADDING]}
547+
hintPlaceholder={HintPlaceHolder}
548+
bgColor={props.style.background}
549+
/>
550+
</Drawer>
551+
{/* </DrawerWrapper> */}
549552
</BackgroundColorContext.Provider>
550553
);
551554
}
552555
)
553-
.setPropertyViewFn((children:any) => (
556+
.setPropertyViewFn((children: any) => (
554557
<>
555558
{/* {(EditorContext.editorModeStatus === "logic" ||
556559
EditorContext.editorModeStatus === "both") && (
@@ -701,6 +704,12 @@ MTComp = withMethodExposing(MTComp, [
701704
params: [],
702705
},
703706
execute: async (comp: any, values: any) => {
707+
console.log("startMeeting ", {
708+
user: userId + "",
709+
audiostatus: false,
710+
speaking: false,
711+
streamingVideo: true,
712+
});
704713
if (comp.children.meetingActive.getView().value) return;
705714
userId =
706715
comp.children.localUserID.getView().value === ""
@@ -712,6 +721,12 @@ MTComp = withMethodExposing(MTComp, [
712721
speaking: false,
713722
streamingVideo: true,
714723
});
724+
console.log("startMeeting localUser ", {
725+
user: userId + "",
726+
audiostatus: false,
727+
speaking: false,
728+
streamingVideo: true,
729+
});
715730

716731
comp.children.localUser.children.value.dispatch(
717732
changeChildAction(

client/packages/lowcoder-comps/src/comps/agoraMeetingComp/videoMeetingStreamComp.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ let VideoCompBuilder = (function () {
118118
!user.hasVideo &&
119119
user.uid + "" !== userData.user &&
120120
userData.user !== ""
121-
) {
121+
) {
122122
props.onEvent("videoOff");
123123
}
124124
}
@@ -130,6 +130,8 @@ let VideoCompBuilder = (function () {
130130
setVideo(userData.streamingVideo);
131131
}
132132
}, [props.userId.value]);
133+
console.log("userId", userId);
134+
133135

134136
return (
135137
<EditorContext.Consumer>
@@ -242,7 +244,7 @@ VideoCompBuilder = class extends VideoCompBuilder {
242244
};
243245

244246
export const VideoMeetingStreamComp = withExposingConfigs(VideoCompBuilder, [
245-
// new NameConfig("loading", trans("meeting.loadingDesc")),
247+
new NameConfig("loading", trans("meeting.loadingDesc")),
246248
new NameConfig("profileImageUrl", trans("meeting.profileImageUrl")),
247249

248250
...CommonNameConfig,

client/packages/lowcoder-comps/src/comps/agoraMeetingComp/videoSharingStreamComp.tsx

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,14 @@ import {
1616
UICompBuilder,
1717
CommonNameConfig,
1818
hiddenPropertyView,
19-
// ButtonStyleControl,
2019
} from "lowcoder-sdk";
2120
import { useEffect, useRef, useState } from "react";
2221
import { client } from "./meetingControllerComp";
2322
import type { IAgoraRTCRemoteUser } from "agora-rtc-sdk-ng";
2423
import { trans } from "../../i18n/comps";
2524
import { useContext } from "react";
2625
import ReactResizeDetector from "react-resize-detector";
26+
import { ButtonStyleControl } from "./videobuttonCompConstants";
2727

2828
const VideoContainer = styled.video`
2929
height: 100%;
@@ -41,7 +41,7 @@ const sharingStreamChildren = {
4141
onEvent: MeetingEventHandlerControl,
4242
disabled: BoolCodeControl,
4343
loading: BoolCodeControl,
44-
// style: ButtonStyleControl,
44+
style: ButtonStyleControl,
4545
viewRef: RefControl,
4646
userId: withDefault(stringExposingStateControl(""), "{{meeting1.localUser}}"),
4747
noVideoText: stringExposingStateControl(trans("meeting.noVideo")),
@@ -95,8 +95,6 @@ let SharingCompBuilder = (function () {
9595
client.on(
9696
"user-unpublished",
9797
(user: IAgoraRTCRemoteUser, mediaType: "video" | "audio") => {
98-
// console.log("user-unpublished");
99-
10098
if (mediaType === "audio") {
10199
if (
102100
!user.hasAudio &&
@@ -161,7 +159,7 @@ let SharingCompBuilder = (function () {
161159
) : (
162160
<></>
163161
)}
164-
{/* <div
162+
<div
165163
style={{
166164
flexDirection: "column",
167165
alignItems: "center",
@@ -177,10 +175,10 @@ let SharingCompBuilder = (function () {
177175
width: "100%",
178176
overflow: "hidden",
179177
}}
180-
src={props.profileImageUrl.value}
178+
src={props.profileImageUrl?.value}
181179
/>
182180
<p style={{ margin: "0" }}>{userName ?? ""}</p>
183-
</div> */}
181+
</div>
184182
</div>
185183
</ReactResizeDetector>
186184
)}
@@ -233,6 +231,6 @@ SharingCompBuilder = class extends SharingCompBuilder {
233231
};
234232

235233
export const VideoSharingStreamComp = withExposingConfigs(SharingCompBuilder, [
236-
// new NameConfig("loading", trans("meeting.loadingDesc")),
234+
new NameConfig("loading", trans("meeting.loadingDesc")),
237235
...CommonNameConfig,
238236
]);

client/packages/lowcoder-comps/src/comps/agoraMeetingComp/videobuttonCompConstants.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -104,8 +104,8 @@ export const ButtonStyleControl = migrateOldData(
104104
fixOldData
105105
);
106106

107-
// export const buttonRefMethods = refMethods([
108-
// focusWithOptions,
109-
// blurMethod,
110-
// clickMethod,
111-
// ]);
107+
export const buttonRefMethods = refMethods([
108+
focusWithOptions,
109+
blurMethod,
110+
clickMethod,
111+
]);

client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,7 @@ export const en = {
100100
logLevel: "Agora SDK Log Level",
101101
placement: "Meeting Drawer Placement",
102102
meeting: "Meeting Settings",
103+
loadingDesc: "loadingDesc",
103104
cameraView: "Camera View",
104105
cameraViewDesc: "Camera View of the Local User (Host)",
105106
screenShared: "Screen Shared",
Binary file not shown.

0 commit comments

Comments
 (0)