Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
L
live
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
liujiaxin
live
Commits
e9179cd5
Commit
e9179cd5
authored
Feb 18, 2020
by
liujiaxin
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
调整退出清空数据,添加上传音视频图片,存到omt上了
parent
7252cf24
Changes
9
Show whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
67 additions
and
25 deletions
+67
-25
mediaboard.tsx
src/components/mediaboard.tsx
+5
-5
whiteboard.scss
src/components/whiteboard.scss
+2
-2
upload-btn.tsx
src/components/whiteboard/upload/upload-btn.tsx
+13
-6
root-container.tsx
src/containers/root-container.tsx
+0
-1
home.tsx
src/pages/home.tsx
+4
-4
agora-end-points.ts
src/services/agora-end-points.ts
+9
-0
room.ts
src/stores/room.ts
+3
-2
helper.ts
src/utils/helper.ts
+27
-1
upload-manager.ts
src/utils/upload-manager.ts
+4
-4
No files found.
src/components/mediaboard.tsx
View file @
e9179cd5
...
@@ -269,9 +269,9 @@ const items = [
...
@@ -269,9 +269,9 @@ const items = [
{
{
name
:
'
add
'
name
:
'
add
'
},
},
//
{
{
//
name: 'upload'
name
:
'
upload
'
//
},
},
{
{
name
:
'
hand_tool
'
name
:
'
hand_tool
'
},
},
...
@@ -552,13 +552,13 @@ const items = [
...
@@ -552,13 +552,13 @@ const items = [
items=
{
toolItems
}
items=
{
toolItems
}
currentTool=
{
tool
}
currentTool=
{
tool
}
handleToolClick=
{
handleToolClick
}
/>
handleToolClick=
{
handleToolClick
}
/>
{
tool
===
'
color_picker
'
&&
strokeColor
?
{
tool
===
'
color_picker
'
&&
strokeColor
&&
roomStore
.
state
.
me
.
role
==
'
teacher
'
?
<
SketchPicker
<
SketchPicker
color=
{
strokeColor
}
color=
{
strokeColor
}
onChangeComplete=
{
onColorChanged
}
/>
onChangeComplete=
{
onColorChanged
}
/>
:
null
}
:
null
}
</>
:
null
}
</>
:
null
}
{
/*<UploadPanel />*/
}
<
UploadPanel
/>
{
children
?
children
:
null
}
{
children
?
children
:
null
}
</
div
>
</
div
>
{
/*me.role === 'teacher' && room ?
{
/*me.role === 'teacher' && room ?
...
...
src/components/whiteboard.scss
View file @
e9179cd5
...
@@ -242,8 +242,8 @@
...
@@ -242,8 +242,8 @@
box-shadow
:
0px
2px
4px
0px
rgba
(
0
,
0
,
0
,
0
.1
);
box-shadow
:
0px
2px
4px
0px
rgba
(
0
,
0
,
0
,
0
.1
);
border-radius
:
6px
;
border-radius
:
6px
;
border
:
1px
solid
rgba
(
219
,
226
,
229
,
1
);
border
:
1px
solid
rgba
(
219
,
226
,
229
,
1
);
top
:
183px
;
top
:
275px
/*
183
*/
;
lef
t
:
63px
;
righ
t
:
63px
;
z-index
:
5
;
z-index
:
5
;
position
:
absolute
;
position
:
absolute
;
pointer-events
:
all
;
pointer-events
:
all
;
...
...
src/components/whiteboard/upload/upload-btn.tsx
View file @
e9179cd5
...
@@ -3,7 +3,7 @@ import OSS from "ali-oss";
...
@@ -3,7 +3,7 @@ import OSS from "ali-oss";
import
uuidv4
from
'
uuid/v4
'
;
import
uuidv4
from
'
uuid/v4
'
;
import
{
PPTProgressListener
,
UploadManager
}
from
"
../../../utils/upload-manager
"
;
import
{
PPTProgressListener
,
UploadManager
}
from
"
../../../utils/upload-manager
"
;
import
{
PptKind
,
Room
}
from
"
white-web-sdk
"
;
import
{
PptKind
,
Room
}
from
"
white-web-sdk
"
;
import
{
ossConfig
,
ossClient
,
resolveFileInfo
}
from
'
../../../utils/helper
'
;
import
{
ossConfig
,
ossClient
,
resolveFileInfo
,
getOssClient
}
from
'
../../../utils/helper
'
;
import
{
whiteboard
}
from
'
../../../stores/whiteboard
'
;
import
{
whiteboard
}
from
'
../../../stores/whiteboard
'
;
export
type
UploadBtnProps
=
{
export
type
UploadBtnProps
=
{
...
@@ -22,6 +22,7 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
...
@@ -22,6 +22,7 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
try
{
try
{
const
file
=
event
.
currentTarget
.
files
[
0
];
const
file
=
event
.
currentTarget
.
files
[
0
];
if
(
file
)
{
if
(
file
)
{
const
ossClient
=
await
getOssClient
();
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
pptConverter
=
whiteboard
.
client
.
pptConverter
(
roomToken
);
const
pptConverter
=
whiteboard
.
client
.
pptConverter
(
roomToken
);
await
uploadManager
.
convertFile
(
await
uploadManager
.
convertFile
(
...
@@ -43,6 +44,7 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
...
@@ -43,6 +44,7 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
try
{
try
{
const
file
=
event
.
currentTarget
.
files
[
0
];
const
file
=
event
.
currentTarget
.
files
[
0
];
if
(
file
)
{
if
(
file
)
{
const
ossClient
=
await
getOssClient
();
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
pptConverter
=
whiteboard
.
client
.
pptConverter
(
roomToken
);
const
pptConverter
=
whiteboard
.
client
.
pptConverter
(
roomToken
);
await
uploadManager
.
convertFile
(
await
uploadManager
.
convertFile
(
...
@@ -65,6 +67,7 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
...
@@ -65,6 +67,7 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
if
(
file
)
{
if
(
file
)
{
const
uploadFileArray
:
File
[]
=
[];
const
uploadFileArray
:
File
[]
=
[];
uploadFileArray
.
push
(
file
);
uploadFileArray
.
push
(
file
);
const
ossClient
=
await
getOssClient
();
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
$whiteboard
=
document
.
getElementById
(
'
whiteboard
'
)
as
HTMLDivElement
;
const
$whiteboard
=
document
.
getElementById
(
'
whiteboard
'
)
as
HTMLDivElement
;
if
(
$whiteboard
)
{
if
(
$whiteboard
)
{
...
@@ -83,14 +86,16 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
...
@@ -83,14 +86,16 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
}
}
const
uploadAudioVideo
=
async
(
event
:
any
)
=>
{
const
uploadAudioVideo
=
async
(
event
:
any
)
=>
{
event
.
persist
();
const
ossClient
=
await
getOssClient
();
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
uploadManager
=
new
UploadManager
(
ossClient
,
room
);
const
file
=
event
.
currentT
arget
.
files
[
0
];
const
file
=
event
.
t
arget
.
files
[
0
];
if
(
file
)
{
if
(
file
)
{
try
{
try
{
const
{
fileName
,
fileType
}
=
resolveFileInfo
(
file
);
const
{
fileName
,
fileType
}
=
resolveFileInfo
(
file
);
const
path
=
`/
${
ossConfig
.
folder
}
`
const
path
=
`/
${
ossConfig
.
folder
}
`
const
uuid
=
uuidv4
();
const
uuid
=
uuidv4
();
const
res
=
await
uploadManager
.
addFile
(
`
${
path
}
/
video-
${
fileName
}${
uuid
}
`
,
file
,
const
res
=
await
uploadManager
.
addFile
(
`
${
path
}
/
${
uuid
}${
fileName
}
`
,
file
,
onProgress
onProgress
);
);
const
isHttps
=
res
.
indexOf
(
"
https
"
)
!==
-
1
;
const
isHttps
=
res
.
indexOf
(
"
https
"
)
!==
-
1
;
...
@@ -139,13 +144,14 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
...
@@ -139,13 +144,14 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
<
label
htmlFor=
"upload-image"
>
<
label
htmlFor=
"upload-image"
>
<
div
className=
"upload-image-resource"
></
div
>
<
div
className=
"upload-image-resource"
></
div
>
<
div
className=
"text-container"
>
<
div
className=
"text-container"
>
<
div
className=
"title"
>
Convert Picture
</
div
>
<
div
className=
"title"
>
上传图片
</
div
>
<
div
className=
"description"
>
bmp, jpg, png, gif
</
div
>
<
div
className=
"description"
>
bmp, jpg, png, gif
</
div
>
</
div
>
</
div
>
</
label
>
</
label
>
<
input
id=
"upload-image"
accept=
"image/*,.bmp,.jpg,.png,.gif"
<
input
id=
"upload-image"
accept=
"image/*,.bmp,.jpg,.png,.gif"
onChange=
{
uploadImage
}
type=
"file"
></
input
>
onChange=
{
uploadImage
}
type=
"file"
></
input
>
</
div
>
</
div
>
{
/*
<div className="slice-dash"></div>
<div className="slice-dash"></div>
<div className="upload-items">
<div className="upload-items">
<label htmlFor="upload-dynamic">
<label htmlFor="upload-dynamic">
...
@@ -168,12 +174,13 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
...
@@ -168,12 +174,13 @@ export const UploadBtn: React.FC<UploadBtnProps> = ({
</label>
</label>
<input id="upload-static" accept=".doc,.docx,.ppt,.pptx,.pdf" onChange={uploadStatic} type="file"></input>
<input id="upload-static" accept=".doc,.docx,.ppt,.pptx,.pdf" onChange={uploadStatic} type="file"></input>
</div>
</div>
*/
}
<
div
className=
"slice-dash"
></
div
>
<
div
className=
"slice-dash"
></
div
>
<
div
className=
"upload-items"
>
<
div
className=
"upload-items"
>
<
label
htmlFor=
"upload-video"
>
<
label
htmlFor=
"upload-video"
>
<
div
className=
"upload-static-resource"
></
div
>
<
div
className=
"upload-static-resource"
></
div
>
<
div
className=
"text-container"
>
<
div
className=
"text-container"
>
<
div
className=
"title"
>
Upload audio/video
</
div
>
<
div
className=
"title"
>
上传音视频
</
div
>
<
div
className=
"description"
>
mp4,mp3
</
div
>
<
div
className=
"description"
>
mp4,mp3
</
div
>
</
div
>
</
div
>
</
label
>
</
label
>
...
...
src/containers/root-container.tsx
View file @
e9179cd5
...
@@ -155,7 +155,6 @@ export const RootProvider: React.FC<any> = ({children}) => {
...
@@ -155,7 +155,6 @@ export const RootProvider: React.FC<any> = ({children}) => {
if
(
location
.
pathname
===
'
/
'
)
{
if
(
location
.
pathname
===
'
/
'
)
{
return
;
return
;
}
}
const
room
=
value
.
roomState
;
const
room
=
value
.
roomState
;
GlobalStorage
.
save
(
'
agora_room
'
,
{
GlobalStorage
.
save
(
'
agora_room
'
,
{
me
:
room
.
me
,
me
:
room
.
me
,
...
...
src/pages/home.tsx
View file @
e9179cd5
...
@@ -82,7 +82,7 @@ function HomePage() {
...
@@ -82,7 +82,7 @@ function HomePage() {
///////////////////////////////
///////////////////////////////
/*
session
.
roomName
=
"
test_01__123
"
;
// userInfo["class_id"];
session
.
roomName
=
"
test_01__123
"
;
// userInfo["class_id"];
// session.yourName = userInfo["nick_name"];
// session.yourName = userInfo["nick_name"];
session
.
role
=
`
${
session
.
yourName
}
`
===
"
1
"
?
"
teacher
"
:
"
student
"
;
session
.
role
=
`
${
session
.
yourName
}
`
===
"
1
"
?
"
teacher
"
:
"
student
"
;
...
@@ -128,10 +128,10 @@ function HomePage() {
...
@@ -128,10 +128,10 @@ function HomePage() {
ref
.
current
=
false
;
ref
.
current
=
false
;
globalStore
.
stopLoading
();
globalStore
.
stopLoading
();
})
})
*/
///////////////////////////////
///////////////////////////////
/*
endPoint.login({username: session.yourName, password: session.yourPass}).then((userInfo: any) => {
endPoint.login({username: session.yourName, password: session.yourPass}).then((userInfo: any) => {
console.log(userInfo);
console.log(userInfo);
session.roomName = userInfo["class_id"];// userInfo["class_id"];
session.roomName = userInfo["class_id"];// userInfo["class_id"];
...
@@ -186,7 +186,7 @@ function HomePage() {
...
@@ -186,7 +186,7 @@ function HomePage() {
message: err
message: err
})
})
});
});
*/
}
}
...
...
src/services/agora-end-points.ts
View file @
e9179cd5
...
@@ -50,6 +50,13 @@ export class EndPoint {
...
@@ -50,6 +50,13 @@ export class EndPoint {
userToken
:
string
=
''
;
userToken
:
string
=
''
;
recordId
:
string
=
''
;
recordId
:
string
=
''
;
async
sts
()
{
let
response
=
await
AgoraFetch
(
`https://omt.iplayabc.com/api/oss/live/static`
,
{
method
:
'
GET
'
,
});
let
json
=
await
response
.
json
();
return
json
.
data
;
}
async
login
(
data
:
any
)
{
async
login
(
data
:
any
)
{
let
json
=
await
AgoraFetchJson
({
let
json
=
await
AgoraFetchJson
({
url
:
`
${
ENDPOINT
}
/api/login`
,
url
:
`
${
ENDPOINT
}
/api/login`
,
...
@@ -219,3 +226,5 @@ export class EndPoint {
...
@@ -219,3 +226,5 @@ export class EndPoint {
}
}
export
const
endPoint
=
new
EndPoint
();
export
const
endPoint
=
new
EndPoint
();
// @ts-ignore
window
.
endPoint
=
endPoint
;
src/stores/room.ts
View file @
e9179cd5
...
@@ -329,7 +329,6 @@ export class RoomStore {
...
@@ -329,7 +329,6 @@ export class RoomStore {
await
this
.
rtmClient
.
addOrUpdateChannelAttributes
(
data
);
await
this
.
rtmClient
.
addOrUpdateChannelAttributes
(
data
);
}
}
async
stageUp3333
(
uid
:
string
)
{
async
stageUp3333
(
uid
:
string
)
{
debugger
let
studentsOrder
:
any
[]
=
[...
this
.
state
.
studentsOrder
];
let
studentsOrder
:
any
[]
=
[...
this
.
state
.
studentsOrder
];
const
data
:
any
=
{};
const
data
:
any
=
{};
...
@@ -1462,7 +1461,8 @@ export class RoomStore {
...
@@ -1462,7 +1461,8 @@ export class RoomStore {
}
}
async
exitAll
()
{
async
exitAll
()
{
console
.
log
(
'
exitAll
'
)
console
.
log
(
'
exitAll
'
);
try
{
try
{
if
(
this
.
state
.
me
.
role
==
'
teacher
'
)
{
if
(
this
.
state
.
me
.
role
==
'
teacher
'
)
{
await
this
.
rtmClient
.
clearChannelAttributes
()
await
this
.
rtmClient
.
clearChannelAttributes
()
...
@@ -1491,6 +1491,7 @@ export class RoomStore {
...
@@ -1491,6 +1491,7 @@ export class RoomStore {
console
.
log
(
"
[agora-web] remove event listener
"
);
console
.
log
(
"
[agora-web] remove event listener
"
);
webClient
.
exit
().
then
(()
=>
{
webClient
.
exit
().
then
(()
=>
{
console
.
log
(
"
[agora-web] do remove event listener
"
);
console
.
log
(
"
[agora-web] do remove event listener
"
);
GlobalStorage
.
clear
(
'
agora_room
'
);
}).
catch
(
console
.
warn
)
}).
catch
(
console
.
warn
)
.
finally
(()
=>
{
.
finally
(()
=>
{
roomStore
.
removeLocalStream
();
roomStore
.
removeLocalStream
();
...
...
src/utils/helper.ts
View file @
e9179cd5
...
@@ -2,6 +2,7 @@ import { RoomMessage } from './agora-rtm-client';
...
@@ -2,6 +2,7 @@ import { RoomMessage } from './agora-rtm-client';
import
*
as
_
from
'
lodash
'
;
import
*
as
_
from
'
lodash
'
;
import
OSS
from
'
ali-oss
'
;
import
OSS
from
'
ali-oss
'
;
import
{
TOOL_TYPE
}
from
"
./types
"
;
import
{
TOOL_TYPE
}
from
"
./types
"
;
import
{
endPoint
}
from
"
../services/agora-end-points
"
;
export
interface
OSSConfig
{
export
interface
OSSConfig
{
accessKeyId
:
string
,
accessKeyId
:
string
,
...
@@ -19,7 +20,32 @@ export const ossConfig: OSSConfig = {
...
@@ -19,7 +20,32 @@ export const ossConfig: OSSConfig = {
"
folder
"
:
process
.
env
.
REACT_APP_AGORA_OSS_BUCKET_FOLDER
as
string
"
folder
"
:
process
.
env
.
REACT_APP_AGORA_OSS_BUCKET_FOLDER
as
string
}
}
export
const
ossClient
=
null
;
//new OSS(ossConfig);
export
let
ossClient
:
any
=
null
;
let
ossExpire
=
0
;
export
async
function
getOssClient
()
{
return
new
Promise
(
(
resolve
,
reject
)
=>
{
if
(
ossExpire
<
Date
.
now
())
{
ossClient
=
null
;
}
if
(
ossClient
)
{
resolve
(
ossClient
);
return
}
endPoint
.
sts
().
then
((
resp
:
any
)
=>
{
ossExpire
=
resp
.
Expiration
;
ossClient
=
new
OSS
({
region
:
resp
.
region
,
accessKeyId
:
resp
.
AccessKeyId
,
accessKeySecret
:
resp
.
AccessKeySecret
,
stsToken
:
resp
.
SecurityToken
,
bucket
:
resp
.
bucket
});
resolve
(
ossClient
);
})
})
}
const
OSS_PREFIX
=
process
.
env
.
REACT_APP_AGORA_RECORDING_OSS_URL
as
string
;
const
OSS_PREFIX
=
process
.
env
.
REACT_APP_AGORA_RECORDING_OSS_URL
as
string
;
...
...
src/utils/upload-manager.ts
View file @
e9179cd5
...
@@ -3,7 +3,7 @@ import uuidv4 from 'uuid/v4';
...
@@ -3,7 +3,7 @@ import uuidv4 from 'uuid/v4';
import
{
Room
,
PptConverter
,
PptKind
,
Ppt
}
from
'
white-web-sdk
'
;
import
{
Room
,
PptConverter
,
PptKind
,
Ppt
}
from
'
white-web-sdk
'
;
import
MD5
from
'
js-md5
'
;
import
MD5
from
'
js-md5
'
;
import
{
whiteboard
}
from
'
../stores/whiteboard
'
;
import
{
whiteboard
}
from
'
../stores/whiteboard
'
;
import
{
resolveFileInfo
}
from
'
./helper
'
;
import
{
ossConfig
,
resolveFileInfo
}
from
'
./helper
'
;
export
type
imageSize
=
{
export
type
imageSize
=
{
width
:
number
width
:
number
...
@@ -210,7 +210,7 @@ export class UploadManager {
...
@@ -210,7 +210,7 @@ export class UploadManager {
}
}
}
}
private
async
handleUploadTask
(
task
:
TaskType
,
onProgress
?:
PPTProgressListener
):
Promise
<
void
>
{
private
async
handleUploadTask
(
task
:
TaskType
,
onProgress
?:
PPTProgressListener
):
Promise
<
void
>
{
const
fileUrl
:
string
=
await
this
.
addFile
(
`
${
task
.
uuid
}${
task
.
imageFile
.
file
.
name
}
`
,
task
.
imageFile
.
file
,
onProgress
);
const
fileUrl
:
string
=
await
this
.
addFile
(
`
/
${
ossConfig
.
folder
}
/
${
task
.
uuid
}${
task
.
imageFile
.
file
.
name
}
`
,
task
.
imageFile
.
file
,
onProgress
);
this
.
room
.
completeImageUpload
(
task
.
uuid
,
fileUrl
);
this
.
room
.
completeImageUpload
(
task
.
uuid
,
fileUrl
);
}
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment