Skip to content

Commit 841390b

Browse files
authored
Merge pull request #486 from lowcoder-org/agora-integrationn
Agora integration final v1.1
2 parents 7757b96 + 5c0b4f3 commit 841390b

File tree

11 files changed

+152
-180
lines changed

11 files changed

+152
-180
lines changed

client/packages/lowcoder-cli/client.d.ts

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ declare module "*.svg" {
88
React.SVGProps<SVGSVGElement> & { title?: string }
99
>;
1010

11-
const src: string;
12-
export default src;
11+
// const src: string;
12+
// export default src;
1313
}
1414

1515
declare module "*.md" {
@@ -31,10 +31,6 @@ declare var REACT_APP_LANGUAGES: string;
3131
declare var REACT_APP_COMMIT_ID: string;
3232
declare var REACT_APP_API_HOST: string;
3333
declare var LOWCODER_NODE_SERVICE_URL: string;
34-
declare var REACT_APP_LOWCODER_SHOW_BRAND: string;
35-
declare var REACT_APP_LOWCODER_CUSTOM_LOGO: string;
36-
declare var REACT_APP_LOWCODER_CUSTOM_LOGO_SQUARE: string;
37-
declare var REACT_APP_LOWCODER_CUSTOM_AUTH_WELCOME_TEXT: string;
3834
declare var REACT_APP_ENV: string;
3935
declare var REACT_APP_BUILD_ID: string;
4036
declare var REACT_APP_LOG_LEVEL: string;

client/packages/lowcoder-dev-utils/buildVars.js

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -19,22 +19,6 @@ export const buildVars = [
1919
name: "REACT_APP_API_HOST",
2020
defaultValue: "",
2121
},
22-
{
23-
name: "REACT_APP_LOWCODER_SHOW_BRAND",
24-
defaultValue: 'false',
25-
},
26-
{
27-
name: "REACT_APP_LOWCODER_CUSTOM_LOGO",
28-
defaultValue: '',
29-
},
30-
{
31-
name: "REACT_APP_LOWCODER_CUSTOM_LOGO_SQUARE",
32-
defaultValue: '',
33-
},
34-
{
35-
name: "REACT_APP_LOWCODER_CUSTOM_AUTH_WELCOME_TEXT",
36-
defaultValue: '',
37-
},
3822
{
3923
name: "LOWCODER_NODE_SERVICE_URL",
4024
defaultValue: "",

client/packages/lowcoder/index.html

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -96,11 +96,5 @@
9696
<div id="root"></div>
9797
<script type="module" src="/src/index.ts"></script>
9898
<!-- <%- browserCheckScript %> -->
99-
<script>
100-
window.lowcoder_show_brand = "<%= process.env.REACT_APP_LOWCODER_SHOW_BRAND %>";
101-
window.lowcoder_custom_auth_welcome_text = "<%= process.env.REACT_APP_LOWCODER_CUSTOM_AUTH_WELCOME_TEXT %>";
102-
window.lowcoder_custom_logo = "<%= process.env.REACT_APP_LOWCODER_CUSTOM_LOGO %>";
103-
window.lowcoder_custom_logo_square = "<%= process.env.REACT_APP_LOWCODER_CUSTOM_LOGO_SQUARE %>";
104-
</script>
10599
</body>
106100
</html>

client/packages/lowcoder/src/app-env.d.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,6 @@ declare var REACT_APP_LANGUAGES: string;
3434
declare var REACT_APP_COMMIT_ID: string;
3535
declare var REACT_APP_API_HOST: string;
3636
declare var LOWCODER_NODE_SERVICE_URL: string;
37-
declare var REACT_APP_LOWCODER_SHOW_BRAND: string;
38-
declare var REACT_APP_LOWCODER_CUSTOM_LOGO: string;
39-
declare var REACT_APP_LOWCODER_CUSTOM_LOGO_SQUARE: string;
40-
declare var REACT_APP_LOWCODER_CUSTOM_AUTH_WELCOME_TEXT: string;
4137
declare var REACT_APP_ENV: string;
4238
declare var REACT_APP_BUILD_ID: string;
4339
declare var REACT_APP_LOG_LEVEL: string;

client/packages/lowcoder/src/components/PageSkeleton.tsx

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -78,15 +78,13 @@ export default function PageSkeleton(props: IProps) {
7878
</SkeletonWrapper>
7979
);
8080

81+
// {/* headerStart={REACT_APP_LOWCODER_SHOW_BRAND === 'true' ? REACT_APP_LOWCODER_CUSTOM_LOGO !== "" ? <img src={REACT_APP_LOWCODER_CUSTOM_LOGO} alt="logo" /> :<StyledLogoWithName branding={true} /> : <StyledLogoHome branding={true} />} */}
82+
8183
return (
8284
<Layout>
8385
{!hideHeader && isHeaderReady && (
84-
<Header
85-
headerStart={
86-
REACT_APP_LOWCODER_SHOW_BRAND === 'true' ?
87-
REACT_APP_LOWCODER_CUSTOM_LOGO !== "" ? <img src={REACT_APP_LOWCODER_CUSTOM_LOGO} alt="logo" /> :<StyledLogoWithName branding={true} /> :
88-
<StyledLogoHome branding={true} />
89-
}
86+
<Header
87+
headerStart={<StyledLogoWithName branding={true} />}
9088
style={{ backgroundColor: brandingConfig?.headerColor, ...props.headStyle }}
9189
/>
9290
)}
@@ -95,5 +93,6 @@ export default function PageSkeleton(props: IProps) {
9593
<MainContent>{!hideContent && skeleton}</MainContent>
9694
</Layout>
9795
</Layout>
96+
9897
);
9998
}

client/packages/lowcoder/src/comps/comps/meetingComp/videoMeetingControllerComp.tsx

Lines changed: 99 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -196,15 +196,6 @@ const publishVideo = async (
196196
await client.publish(videoTrack);
197197

198198
await rtmInit(appId, userId, channel);
199-
200-
const mediaStreamTrack = videoTrack.getMediaStreamTrack();
201-
if (mediaStreamTrack) {
202-
const videoSettings = mediaStreamTrack.getSettings();
203-
const videoWidth = videoSettings.width;
204-
const videoHeight = videoSettings.height;
205-
// height.videoWidth.change(videoWidth);
206-
// height.videoHeight.change(videoHeight);
207-
}
208199
};
209200

210201
const sendMessageRtm = (message: any) => {
@@ -278,12 +269,69 @@ let MTComp = (function () {
278269
});
279270
const [rtmMessages, setRtmMessages] = useState<any>([]);
280271
const [localUserSpeaking, setLocalUserSpeaking] = useState<any>(false);
272+
const [localUserVideo, setLocalUserVideo] =
273+
useState<IAgoraRTCRemoteUser>();
274+
const [userJoined, setUserJoined] = useState<IAgoraRTCRemoteUser>();
275+
const [userLeft, setUserLeft] = useState<IAgoraRTCRemoteUser>();
281276

282277
useEffect(() => {
283-
dispatch(
284-
changeChildAction("participants", getData(userIds).data, false)
285-
);
286-
}, [userIds]);
278+
if (userJoined) {
279+
let userData = {
280+
user: userJoined.uid,
281+
host: false,
282+
audiostatus: userJoined.hasAudio,
283+
streamingVideo: true,
284+
};
285+
setUserIds((userIds: any) => [...userIds, userData]);
286+
if (userIds.length == 0) {
287+
userData.host = true;
288+
} else {
289+
userData.host = false;
290+
}
291+
dispatch(
292+
changeChildAction(
293+
"participants",
294+
removeDuplicates(getData([...userIds, userData]).data, "user"),
295+
false
296+
)
297+
);
298+
}
299+
}, [userJoined]);
300+
function removeDuplicates(arr: any, prop: any) {
301+
const uniqueObjects = [];
302+
const seenValues = new Set();
303+
304+
for (const obj of arr) {
305+
const objValue = obj[prop];
306+
307+
if (!seenValues.has(objValue)) {
308+
seenValues.add(objValue);
309+
uniqueObjects.push(obj);
310+
}
311+
}
312+
313+
return uniqueObjects;
314+
}
315+
useEffect(() => {
316+
if (userLeft) {
317+
let newUsers = userIds.filter(
318+
(item: any) => item.user !== userLeft.uid
319+
);
320+
let hostExists = newUsers.filter((f: any) => f.host === true);
321+
if (hostExists.length == 0 && newUsers.length > 0) {
322+
newUsers[0].host = true;
323+
hostChanged(newUsers);
324+
}
325+
setUserIds(newUsers);
326+
dispatch(
327+
changeChildAction(
328+
"participants",
329+
removeDuplicates(getData(newUsers).data, "user"),
330+
false
331+
)
332+
);
333+
}
334+
}, [userLeft]);
287335

288336
useEffect(() => {
289337
if (updateVolume.userid) {
@@ -305,13 +353,17 @@ let MTComp = (function () {
305353
}, [updateVolume]);
306354

307355
useEffect(() => {
308-
if (props.endCall.value) {
309-
let newUsers = userIds.filter((item: any) => item.user !== userId);
310-
dispatch(
311-
changeChildAction("participants", getData(newUsers).data, false)
312-
);
313-
}
314-
}, [props.endCall.value]);
356+
let prevUsers: [] = props.participants as [];
357+
const updatedItems = prevUsers.map((userInfo: any) => {
358+
if (userInfo.user === localUserVideo?.uid) {
359+
return { ...userInfo, streamingVideo: localUserVideo?.hasVideo };
360+
}
361+
return userInfo;
362+
});
363+
dispatch(
364+
changeChildAction("participants", getData(updatedItems).data, false)
365+
);
366+
}, [localUserVideo?.hasVideo]);
315367

316368
useEffect(() => {
317369
if (rtmMessages) {
@@ -322,7 +374,7 @@ let MTComp = (function () {
322374
}, [rtmMessages]);
323375

324376
useEffect(() => {
325-
if (localUserSpeaking === true) {
377+
if (localUserSpeaking === true || localUserVideo) {
326378
let localObject = {
327379
user: userId + "",
328380
audiostatus: props.audioControl.value,
@@ -333,18 +385,6 @@ let MTComp = (function () {
333385
}
334386
}, [localUserSpeaking]);
335387

336-
useEffect(() => {
337-
if (props.localUser.value) {
338-
let newUsers = userIds.filter((item: any) => item.user !== userId);
339-
if (newUsers.length == 0) return;
340-
newUsers = props.localUser.value;
341-
let updatedUsers = [...userIds, newUsers];
342-
dispatch(
343-
changeChildAction("participants", getData(updatedUsers).data, false)
344-
);
345-
}
346-
}, [props.localUser.value]);
347-
348388
useEffect(() => {
349389
if (rtmChannelResponse) {
350390
rtmClient.on("MessageFromPeer", function (message, peerId) {
@@ -363,29 +403,10 @@ let MTComp = (function () {
363403
if (client) {
364404
client.enableAudioVolumeIndicator();
365405
client.on("user-joined", (user: IAgoraRTCRemoteUser) => {
366-
let userData = {
367-
user: user.uid,
368-
host: false,
369-
audiostatus: user.hasVideo,
370-
};
371-
372-
if (userIds.length == 0) {
373-
userData.host = true;
374-
} else {
375-
userData.host = false;
376-
}
377-
setUserIds((userIds: any) => [...userIds, userData]);
406+
setUserJoined(user);
378407
});
379408
client.on("user-left", (user: IAgoraRTCRemoteUser, reason: any) => {
380-
let newUsers = userIds.filter(
381-
(item: any) => item.user !== user.uid
382-
);
383-
let hostExists = newUsers.filter((f: any) => f.host === true);
384-
if (hostExists.length == 0 && newUsers.length > 0) {
385-
newUsers[0].host = true;
386-
hostChanged(newUsers);
387-
}
388-
setUserIds(newUsers);
409+
setUserLeft(user);
389410
});
390411
client.on("volume-indicator", (volumeInfos: any) => {
391412
if (volumeInfos.length == 0) return;
@@ -401,6 +422,21 @@ let MTComp = (function () {
401422
}
402423
});
403424
});
425+
426+
client.on(
427+
"user-published",
428+
async (user: IAgoraRTCRemoteUser, mediaType: "video" | "audio") => {
429+
setLocalUserVideo(user);
430+
}
431+
);
432+
client.on(
433+
"user-unpublished",
434+
(user: IAgoraRTCRemoteUser, mediaType: "video" | "audio") => {
435+
console.log("user-unpublished");
436+
437+
setLocalUserVideo(user);
438+
}
439+
);
404440
}
405441
}, [client]);
406442

@@ -540,6 +576,7 @@ MTComp = withMethodExposing(MTComp, [
540576
params: [],
541577
},
542578
execute: async (comp, values) => {
579+
if (!comp.children.meetingActive.getView().value) return;
543580
let sharing = !comp.children.sharing.getView().value;
544581
await shareScreen(sharing);
545582
comp.children.sharing.change(sharing);
@@ -552,6 +589,7 @@ MTComp = withMethodExposing(MTComp, [
552589
params: [],
553590
},
554591
execute: async (comp, values) => {
592+
if (!comp.children.meetingActive.getView().value) return;
555593
let value = !comp.children.audioControl.getView().value;
556594
comp.children.localUser.change({
557595
user: userId + "",
@@ -570,12 +608,16 @@ MTComp = withMethodExposing(MTComp, [
570608
params: [],
571609
},
572610
execute: async (comp, values) => {
611+
//check if meeting is active
612+
if (!comp.children.meetingActive.getView().value) return;
613+
//toggle videoControl
573614
let value = !comp.children.videoControl.getView().value;
574615
if (videoTrack) {
575616
videoTrack.setEnabled(value);
576617
} else {
577618
await turnOnCamera(value);
578619
}
620+
//change my local user data
579621
let localData = {
580622
user: userId + "",
581623
streamingVideo: value,
@@ -633,6 +675,7 @@ MTComp = withMethodExposing(MTComp, [
633675
params: [],
634676
},
635677
execute: async (comp, values) => {
678+
if (!comp.children.meetingActive.getView().value) return;
636679
let otherData =
637680
values != undefined && values[1] !== undefined ? values[1] : "";
638681
let toUsers: any =
@@ -684,6 +727,8 @@ MTComp = withMethodExposing(MTComp, [
684727
params: [],
685728
},
686729
execute: async (comp, values) => {
730+
if (!comp.children.meetingActive.getView().value) return;
731+
687732
let value = !comp.children.endCall.getView().value;
688733
comp.children.endCall.change(value);
689734
comp.children.meetingActive.change(false);

0 commit comments

Comments
 (0)