Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
m0_68066342
uni-app
提交
c342ba26
U
uni-app
项目概览
m0_68066342
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
c342ba26
编写于
12月 25, 2019
作者:
Q
qiang
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix: 优化H5视频全屏播放效果
上级
83d52ceb
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
256 addition
and
271 deletion
+256
-271
src/core/view/mixins/index.js
src/core/view/mixins/index.js
+5
-0
src/core/view/mixins/interact.js
src/core/view/mixins/interact.js
+54
-0
src/platforms/h5/view/components/video/index.vue
src/platforms/h5/view/components/video/index.vue
+197
-271
未找到文件。
src/core/view/mixins/index.js
浏览文件 @
c342ba26
...
...
@@ -22,3 +22,8 @@ export {
default
as
keyboard
}
from
'
./keyboard
'
export
{
default
as
interact
}
from
'
./interact
'
src/core/view/mixins/interact.js
0 → 100644
浏览文件 @
c342ba26
import
{
supportsPassive
}
from
'
uni-shared
'
const
passiveOptions
=
supportsPassive
?
{
passive
:
true
,
capture
:
true
}
:
true
const
vms
=
[]
let
userInteract
=
0
let
inited
function
addInteractListener
(
vm
)
{
if
(
!
inited
)
{
const
eventNames
=
[
'
touchstart
'
,
'
touchmove
'
,
'
touchend
'
,
'
mousedown
'
,
'
mouseup
'
]
eventNames
.
forEach
(
eventName
=>
{
document
.
addEventListener
(
eventName
,
function
()
{
vms
.
forEach
(
vm
=>
{
vm
.
userInteract
=
true
userInteract
++
setTimeout
(()
=>
{
userInteract
--
if
(
!
userInteract
)
{
vm
.
userInteract
=
false
}
},
0
)
})
},
passiveOptions
)
})
}
vms
.
push
(
vm
)
}
function
removeInteractListener
(
vm
)
{
const
index
=
vms
.
indexOf
(
vm
)
if
(
index
>=
0
)
{
vms
.
splice
(
index
,
1
)
}
}
export
default
{
data
()
{
return
{
/**
* 是否用户交互行为
*/
userInteract
:
false
}
},
mounted
()
{
addInteractListener
(
this
)
},
beforeDestroy
()
{
removeInteractListener
(
this
)
}
}
src/platforms/h5/view/components/video/index.vue
浏览文件 @
c342ba26
<
template
>
<uni-video
:id=
"id"
v-on=
"$listeners"
>
v-on=
"$listeners"
>
<div
ref=
"container"
:class=
"
{'uni-video-type-fullscreen':fullscreen,'uni-video-type-rotate-left':rotateType==='left','uni-video-type-rotate-right':rotateType==='right'}"
:style="{width:fullscreen?width:'100%',height:fullscreen?height:'100%'}"
class=
"uni-video-container"
@
click=
"triggerControls"
@touchstart="touchstart($event)"
@touchend="touchend($event)"
@touchmove="touchmove($event)"
@
touchstart=
"touchstart"
@
touchend=
"touchend"
@
touchmove=
"touchmove"
@
fullscreenchange.stop=
"onFullscreenChange"
@
webkitfullscreenchange.stop=
"onFullscreenChange($event,true)"
>
<video
ref=
"video"
...
...
@@ -20,10 +19,24 @@
:loop="loop"
:src="srcSync"
:poster="poster"
:autoplay="autoplay"
v-bind="$attrs"
class="uni-video-video"
webkit-playsinline
playsinline
@durationchange="onDurationChange"
@loadedmetadata="onLoadedMetadata"
@progress="onProgress"
@waiting="onWaiting"
@error="onVideoError"
@play="onPlay"
@pause="onPause"
@ended="onEnded"
@timeupdate="onTimeUpdate"
@webkitbeginfullscreen="emitFullscreenChange(true)"
@x5videoenterfullscreen="emitFullscreenChange(true)"
@webkitendfullscreen="emitFullscreenChange(false)"
@x5videoexitfullscreen="emitFullscreenChange(false)"
/>
<div
v-show=
"controlsShow"
...
...
@@ -66,7 +79,7 @@
v-show=
"showFullscreenBtn"
:class=
"
{'uni-video-type-fullscreen':fullscreen}"
class="uni-video-fullscreen"
@click.stop="triggerFullscreen"
@click.stop="triggerFullscreen
(!fullscreen)
"
/>
</div>
<div
...
...
@@ -128,7 +141,8 @@
</
template
>
<
script
>
import
{
subscriber
subscriber
,
interact
}
from
'
uni-mixins
'
import
{
supportsPassive
...
...
@@ -149,20 +163,20 @@ export default {
name
:
'
Video
'
,
filters
:
{
getTime
(
time
)
{
var
h
=
Math
.
floor
(
time
/
3600
)
var
m
=
Math
.
floor
(
time
%
3600
/
60
)
var
s
=
Math
.
floor
(
time
%
3600
%
60
)
let
h
=
Math
.
floor
(
time
/
3600
)
let
m
=
Math
.
floor
(
time
%
3600
/
60
)
let
s
=
Math
.
floor
(
time
%
3600
%
60
)
h
=
(
h
<
10
?
'
0
'
:
''
)
+
h
m
=
(
m
<
10
?
'
0
'
:
''
)
+
m
s
=
(
s
<
10
?
'
0
'
:
''
)
+
s
var
str
=
m
+
'
:
'
+
s
let
str
=
m
+
'
:
'
+
s
if
(
h
!==
'
00
'
)
{
str
=
h
+
'
:
'
+
str
}
return
str
}
},
mixins
:
[
subscriber
],
mixins
:
[
subscriber
,
interact
],
props
:
{
id
:
{
type
:
String
,
...
...
@@ -216,7 +230,7 @@ export default {
},
direction
:
{
type
:
[
String
,
Number
],
default
:
360
default
:
''
},
showProgress
:
{
type
:
Boolean
,
...
...
@@ -254,11 +268,7 @@ export default {
enableDanmuSync
:
Boolean
(
this
.
enableDanmu
),
controlsVisible
:
true
,
fullscreen
:
false
,
width
:
'
0
'
,
height
:
'
0
'
,
fullscreenTriggering
:
false
,
controlsTouching
:
false
,
directionSync
:
Number
(
this
.
direction
),
touchStartOrigin
:
{
x
:
0
,
y
:
0
...
...
@@ -268,9 +278,8 @@ export default {
currentTimeNew
:
0
,
volumeOld
:
null
,
volumeNew
:
null
,
isIOS
:
false
,
buffered
:
0
,
rotateType
:
''
isSafari
:
/^Apple/
.
test
(
navigator
.
vendor
)
}
},
computed
:
{
...
...
@@ -295,38 +304,9 @@ export default {
this
.
autoHideEnd
()
}
},
fullscreen
(
val
)
{
var
container
=
this
.
$refs
.
container
var
playing
=
this
.
playing
this
.
fullscreenTriggering
=
true
container
.
remove
()
if
(
val
)
{
this
.
resize
()
document
.
body
.
appendChild
(
container
)
}
else
{
this
.
$el
.
appendChild
(
container
)
}
this
.
$trigger
(
'
fullscreenchange
'
,
{},
{
fullScreen
:
val
})
if
(
playing
)
{
this
.
play
()
}
setTimeout
(()
=>
{
this
.
fullscreenTriggering
=
false
},
0
)
},
direction
(
val
)
{
this
.
directionSync
=
Number
(
val
)
},
srcSync
(
val
)
{
this
.
playing
=
false
this
.
currentTime
=
0
if
(
val
&&
this
.
autoplay
)
{
this
.
$nextTick
(()
=>
{
this
.
$refs
.
video
.
play
()
})
}
},
currentTime
()
{
this
.
updateProgress
()
...
...
@@ -344,134 +324,40 @@ export default {
},
hideTiming
:
null
}
var
danmuList
=
this
.
otherData
.
danmuList
=
JSON
.
parse
(
JSON
.
stringify
(
this
.
danmuList
||
[]))
const
danmuList
=
this
.
otherData
.
danmuList
=
JSON
.
parse
(
JSON
.
stringify
(
this
.
danmuList
||
[]))
danmuList
.
sort
(
function
(
a
,
b
)
{
return
(
a
.
time
||
0
)
-
(
a
.
time
||
0
)
})
this
.
width
=
window
.
innerWidth
+
'
px
'
this
.
height
=
window
.
innerHeight
+
'
px
'
},
mounted
()
{
var
self
=
this
var
otherData
=
this
.
otherData
var
video
=
this
.
$refs
.
video
var
ball
=
this
.
$refs
.
ball
video
.
addEventListener
(
'
durationchange
'
,
function
(
event
)
{
self
.
durationTime
=
video
.
duration
})
video
.
addEventListener
(
'
loadedmetadata
'
,
function
(
event
)
{
var
initialTime
=
Number
(
self
.
initialTime
)
||
0
if
(
initialTime
>
0
)
{
video
.
currentTime
=
initialTime
}
})
video
.
addEventListener
(
'
progress
'
,
function
(
event
)
{
var
buffered
=
video
.
buffered
if
(
buffered
.
length
)
{
self
.
buffered
=
buffered
.
end
(
buffered
.
length
-
1
)
/
video
.
duration
}
})
video
.
addEventListener
(
'
waiting
'
,
function
(
$event
)
{
self
.
$trigger
(
'
waiting
'
,
$event
,
{})
})
video
.
addEventListener
(
'
error
'
,
function
(
$event
)
{
self
.
playing
=
false
self
.
$trigger
(
'
error
'
,
$event
,
{})
})
video
.
addEventListener
(
'
play
'
,
function
(
$event
)
{
self
.
start
=
true
self
.
playing
=
true
if
(
self
.
fullscreenTriggering
)
{
return
}
self
.
$trigger
(
'
play
'
,
$event
,
{})
})
video
.
addEventListener
(
'
pause
'
,
function
(
$event
)
{
self
.
playing
=
false
if
(
self
.
fullscreenTriggering
)
{
return
}
self
.
$trigger
(
'
pause
'
,
$event
,
{})
})
video
.
addEventListener
(
'
ended
'
,
function
(
$event
)
{
self
.
playing
=
false
self
.
$trigger
(
'
ended
'
,
$event
,
{})
})
video
.
addEventListener
(
'
timeupdate
'
,
function
(
$event
)
{
var
currentTime
=
self
.
currentTime
=
video
.
currentTime
var
duration
=
video
.
duration
var
oldDanmuIndex
=
otherData
.
danmuIndex
var
danmuIndex
=
{
time
:
currentTime
,
index
:
oldDanmuIndex
.
index
}
var
danmuList
=
otherData
.
danmuList
if
(
currentTime
>
oldDanmuIndex
.
time
)
{
for
(
let
index
=
oldDanmuIndex
.
index
+
1
;
index
<
danmuList
.
length
;
index
++
)
{
let
element
=
danmuList
[
index
]
if
(
currentTime
>=
(
element
.
time
||
0
))
{
danmuIndex
.
index
=
index
if
(
self
.
playing
&&
self
.
enableDanmuSync
)
{
self
.
playDanmu
(
element
)
}
}
else
{
break
}
}
}
else
if
(
currentTime
<
oldDanmuIndex
.
time
)
{
for
(
let
index
=
oldDanmuIndex
.
index
-
1
;
index
>
-
1
;
index
--
)
{
let
element
=
danmuList
[
index
]
if
(
currentTime
<=
(
element
.
time
||
0
))
{
danmuIndex
.
index
=
index
-
1
}
else
{
break
}
}
}
otherData
.
danmuIndex
=
danmuIndex
self
.
$trigger
(
'
timeupdate
'
,
$event
,
{
currentTime
,
duration
})
})
video
.
addEventListener
(
'
x5videoenterfullscreen
'
,
function
(
$event
)
{
self
.
$trigger
(
'
fullscreenchange
'
,
$event
,
{
fullScreen
:
true
})
})
video
.
addEventListener
(
'
x5videoexitfullscreen
'
,
function
(
$event
)
{
self
.
$trigger
(
'
fullscreenchange
'
,
$event
,
{
fullScreen
:
false
})
})
var
originX
var
originY
var
moveOnce
=
true
var
originProgress
ball
.
addEventListener
(
'
touchstart
'
,
function
(
event
)
{
self
.
controlsTouching
=
true
var
toucher
=
self
.
getScreenXY
(
event
.
targetTouches
[
0
])
const
self
=
this
let
originX
let
originY
let
moveOnce
=
true
let
originProgress
const
ball
=
this
.
$refs
.
ball
ball
.
addEventListener
(
'
touchstart
'
,
(
event
)
=>
{
this
.
controlsTouching
=
true
const
toucher
=
event
.
targetTouches
[
0
]
originX
=
toucher
.
pageX
originY
=
toucher
.
pageY
originProgress
=
self
.
progress
originProgress
=
this
.
progress
moveOnce
=
true
self
.
touching
=
true
this
.
touching
=
true
ball
.
addEventListener
(
'
touchmove
'
,
touchmove
,
passiveOptions
)
})
function
touchmove
(
event
)
{
var
toucher
=
self
.
getScreenXY
(
event
.
targetTouches
[
0
])
var
pageX
=
toucher
.
pageX
var
pageY
=
toucher
.
pageY
const
toucher
=
event
.
targetTouches
[
0
]
const
pageX
=
toucher
.
pageX
const
pageY
=
toucher
.
pageY
if
(
moveOnce
&&
Math
.
abs
(
pageX
-
originX
)
<
Math
.
abs
(
pageY
-
originY
))
{
touchend
()
return
}
moveOnce
=
false
var
w
=
self
.
$refs
.
progress
.
offsetWidth
var
progress
=
originProgress
+
(
pageX
-
originX
)
/
w
*
100
const
w
=
self
.
$refs
.
progress
.
offsetWidth
let
progress
=
originProgress
+
(
pageX
-
originX
)
/
w
*
100
if
(
progress
<
0
)
{
progress
=
0
}
else
if
(
progress
>
100
)
{
...
...
@@ -496,13 +382,9 @@ export default {
}
ball
.
addEventListener
(
'
touchend
'
,
touchend
)
ball
.
addEventListener
(
'
touchcancel
'
,
touchend
)
if
(
String
(
this
.
srcSync
).
length
&&
this
.
autoplay
)
{
video
.
play
()
}
},
beforeDestroy
()
{
this
.
$refs
.
container
.
remove
(
)
this
.
triggerFullscreen
(
false
)
clearTimeout
(
this
.
otherData
.
hideTiming
)
},
methods
:
{
...
...
@@ -510,56 +392,21 @@ export default {
type
,
data
=
{}
})
{
const
methods
=
[
'
play
'
,
'
pause
'
,
'
seek
'
,
'
sendDanmu
'
,
'
playbackRate
'
,
'
requestFullScreen
'
,
'
exitFullScreen
'
]
let
options
switch
(
type
)
{
case
'
play
'
:
this
.
play
()
break
case
'
pause
'
:
this
.
pause
()
break
case
'
seek
'
:
this
.
seek
(
data
.
position
)
options
=
data
.
position
break
case
'
sendDanmu
'
:
this
.
sendDanmu
(
data
)
options
=
data
break
case
'
playbackRate
'
:
this
.
$refs
.
video
.
playbackRate
=
data
.
rate
options
=
data
.
rate
break
case
'
requestFullScreen
'
:
this
.
enterFullscreen
()
break
case
'
exitFullScreen
'
:
this
.
leaveFullscreen
()
break
}
},
resize
()
{
var
w
=
window
.
innerWidth
var
h
=
window
.
innerHeight
var
direction
=
Math
.
abs
(
this
.
directionSync
)
if
(
direction
===
0
)
{
if
(
w
>
h
)
{
this
.
rotateType
=
'
left
'
}
else
{
this
.
rotateType
=
''
}
}
else
if
(
direction
===
90
)
{
if
(
w
>
h
)
{
this
.
rotateType
=
''
}
else
{
this
.
rotateType
=
'
right
'
}
}
else
{
this
.
rotateType
=
''
}
if
(
!
this
.
rotateType
)
{
this
.
width
=
w
+
'
px
'
this
.
height
=
h
+
'
px
'
}
else
{
this
.
width
=
h
+
'
px
'
this
.
height
=
w
+
'
px
'
if
(
methods
.
indexOf
(
type
)
>=
0
)
{
this
[
type
](
options
)
}
},
trigger
()
{
...
...
@@ -583,15 +430,15 @@ export default {
}
},
clickProgress
(
event
)
{
var
x
=
event
.
offsetX
var
_progress
=
this
.
$refs
.
progress
var
element
=
event
.
target
while
(
element
!==
_
progress
)
{
const
$progress
=
this
.
$refs
.
progress
let
element
=
event
.
target
let
x
=
event
.
offsetX
while
(
element
!==
$
progress
)
{
x
+=
element
.
offsetLeft
element
=
element
.
parentNode
}
var
w
=
_
progress
.
offsetWidth
var
progress
=
0
const
w
=
$
progress
.
offsetWidth
let
progress
=
0
if
(
x
>=
0
&&
x
<=
w
)
{
progress
=
x
/
w
this
.
seek
(
this
.
$refs
.
video
.
duration
*
progress
)
...
...
@@ -601,10 +448,10 @@ export default {
this
.
enableDanmuSync
=
!
this
.
enableDanmuSync
},
playDanmu
(
danmu
)
{
var
p
=
document
.
createElement
(
'
p
'
)
const
p
=
document
.
createElement
(
'
p
'
)
p
.
className
=
'
uni-video-danmu-item
'
p
.
innerText
=
danmu
.
text
var
style
=
`bottom:
${
Math
.
random
()
*
100
}
%;color:
${
danmu
.
color
}
;`
let
style
=
`bottom:
${
Math
.
random
()
*
100
}
%;color:
${
danmu
.
color
}
;`
p
.
setAttribute
(
'
style
'
,
style
)
this
.
$refs
.
danmu
.
appendChild
(
p
)
setTimeout
(
function
()
{
...
...
@@ -616,31 +463,144 @@ export default {
},
17
)
},
sendDanmu
(
danmu
)
{
var
otherData
=
this
.
otherData
const
otherData
=
this
.
otherData
otherData
.
danmuList
.
splice
(
otherData
.
danmuIndex
.
index
+
1
,
0
,
{
text
:
String
(
danmu
.
text
),
color
:
danmu
.
color
,
time
:
this
.
$refs
.
video
.
currentTime
||
0
})
},
triggerFullscreen
()
{
this
.
fullscreen
=
!
this
.
fullscreen
playbackRate
(
rate
)
{
this
.
$refs
.
video
.
playbackRate
=
rate
},
triggerFullscreen
(
val
)
{
const
container
=
this
.
$refs
.
container
const
video
=
this
.
$refs
.
video
let
mockFullScreen
if
(
val
)
{
if
((
document
.
fullscreenEnabled
||
document
.
webkitFullscreenEnabled
)
&&
(
!
this
.
isSafari
||
this
.
userInteract
))
{
container
[
document
.
fullscreenEnabled
?
'
requestFullscreen
'
:
'
webkitRequestFullscreen
'
]()
}
else
if
(
video
.
webkitEnterFullScreen
)
{
video
.
webkitEnterFullScreen
()
}
else
{
mockFullScreen
=
true
container
.
remove
()
container
.
classList
.
add
(
'
uni-video-type-fullscreen
'
)
document
.
body
.
appendChild
(
container
)
}
}
else
{
if
(
document
.
fullscreenEnabled
||
document
.
webkitFullscreenEnabled
)
{
document
[
document
.
fullscreenEnabled
?
'
exitFullscreen
'
:
'
webkitExitFullscreen
'
]()
}
else
if
(
video
.
webkitExitFullScreen
)
{
video
.
webkitExitFullScreen
()
}
else
{
mockFullScreen
=
true
container
.
remove
()
container
.
classList
.
remove
(
'
uni-video-type-fullscreen
'
)
this
.
$el
.
appendChild
(
container
)
}
}
if
(
mockFullScreen
)
{
this
.
emitFullscreenChange
(
val
)
}
},
onFullscreenChange
(
$event
,
webkit
)
{
if
(
webkit
&&
document
.
fullscreenEnabled
)
{
return
}
this
.
emitFullscreenChange
(
!!
(
document
.
fullscreenElement
||
document
.
webkitFullscreenElement
))
},
emitFullscreenChange
(
val
)
{
this
.
fullscreen
=
val
this
.
$trigger
(
'
fullscreenchange
'
,
{},
{
fullScreen
:
val
,
direction
:
'
vertical
'
})
},
requestFullScreen
()
{
this
.
triggerFullscreen
(
true
)
},
exitFullScreen
()
{
this
.
triggerFullscreen
(
false
)
},
onDurationChange
({
target
})
{
this
.
durationTime
=
target
.
duration
},
enterFullscreen
(
direction
)
{
var
directionSync
=
Number
(
direction
)
if
(
!
isNaN
(
NaN
)
)
{
t
his
.
directionSync
=
directionSync
onLoadedMetadata
({
target
}
)
{
const
initialTime
=
Number
(
this
.
initialTime
)
||
0
if
(
initialTime
>
0
)
{
t
arget
.
currentTime
=
initialTime
}
this
.
fullscreen
=
true
},
leaveFullscreen
()
{
this
.
fullscreen
=
false
onProgress
({
target
})
{
const
buffered
=
target
.
buffered
if
(
buffered
.
length
)
{
this
.
buffered
=
buffered
.
end
(
buffered
.
length
-
1
)
/
target
.
duration
}
},
onWaiting
(
$event
)
{
this
.
$trigger
(
'
waiting
'
,
$event
,
{})
},
onVideoError
(
$event
)
{
this
.
playing
=
false
this
.
$trigger
(
'
error
'
,
$event
,
{})
},
onPlay
(
$event
)
{
this
.
start
=
true
this
.
playing
=
true
this
.
$trigger
(
'
play
'
,
$event
,
{})
},
onPause
(
$event
)
{
this
.
playing
=
false
this
.
$trigger
(
'
pause
'
,
$event
,
{})
},
onEnded
(
$event
)
{
this
.
playing
=
false
this
.
$trigger
(
'
ended
'
,
$event
,
{})
},
onTimeUpdate
(
$event
)
{
const
video
=
$event
.
target
const
otherData
=
this
.
otherData
const
currentTime
=
this
.
currentTime
=
video
.
currentTime
const
oldDanmuIndex
=
otherData
.
danmuIndex
const
danmuIndex
=
{
time
:
currentTime
,
index
:
oldDanmuIndex
.
index
}
const
danmuList
=
otherData
.
danmuList
if
(
currentTime
>
oldDanmuIndex
.
time
)
{
for
(
let
index
=
oldDanmuIndex
.
index
+
1
;
index
<
danmuList
.
length
;
index
++
)
{
let
element
=
danmuList
[
index
]
if
(
currentTime
>=
(
element
.
time
||
0
))
{
danmuIndex
.
index
=
index
if
(
this
.
playing
&&
this
.
enableDanmuSync
)
{
this
.
playDanmu
(
element
)
}
}
else
{
break
}
}
}
else
if
(
currentTime
<
oldDanmuIndex
.
time
)
{
for
(
let
index
=
oldDanmuIndex
.
index
-
1
;
index
>
-
1
;
index
--
)
{
let
element
=
danmuList
[
index
]
if
(
currentTime
<=
(
element
.
time
||
0
))
{
danmuIndex
.
index
=
index
-
1
}
else
{
break
}
}
}
otherData
.
danmuIndex
=
danmuIndex
this
.
$trigger
(
'
timeupdate
'
,
$event
,
{
currentTime
,
duration
:
video
.
duration
})
},
triggerControls
()
{
this
.
controlsVisible
=
!
this
.
controlsVisible
},
touchstart
(
event
)
{
var
toucher
=
this
.
getScreenXY
(
event
.
targetTouches
[
0
])
const
toucher
=
event
.
targetTouches
[
0
]
this
.
touchStartOrigin
=
{
x
:
toucher
.
pageX
,
y
:
toucher
.
pageY
...
...
@@ -657,14 +617,14 @@ export default {
if
(
this
.
fullscreen
)
{
stop
()
}
var
gestureType
=
this
.
gestureType
const
gestureType
=
this
.
gestureType
if
(
gestureType
===
GestureType
.
STOP
)
{
return
}
var
toucher
=
this
.
getScreenXY
(
event
.
targetTouches
[
0
])
var
pageX
=
toucher
.
pageX
var
pageY
=
toucher
.
pageY
var
origin
=
this
.
touchStartOrigin
const
toucher
=
event
.
targetTouches
[
0
]
const
pageX
=
toucher
.
pageX
const
pageY
=
toucher
.
pageY
const
origin
=
this
.
touchStartOrigin
if
(
gestureType
===
GestureType
.
PROGRESS
)
{
this
.
changeProgress
(
pageX
-
origin
.
x
)
}
else
if
(
gestureType
===
GestureType
.
VOLUME
)
{
...
...
@@ -706,8 +666,8 @@ export default {
this
.
gestureType
=
GestureType
.
NONE
},
changeProgress
(
x
)
{
var
duration
=
this
.
$refs
.
video
.
duration
var
currentTimeNew
=
x
/
600
*
duration
+
this
.
currentTimeOld
const
duration
=
this
.
$refs
.
video
.
duration
let
currentTimeNew
=
x
/
600
*
duration
+
this
.
currentTimeOld
if
(
currentTimeNew
<
0
)
{
currentTimeNew
=
0
}
else
if
(
currentTimeNew
>
duration
)
{
...
...
@@ -716,8 +676,8 @@ export default {
this
.
currentTimeNew
=
currentTimeNew
},
changeVolume
(
y
)
{
var
valueOld
=
this
.
volumeOld
var
value
const
valueOld
=
this
.
volumeOld
let
value
if
(
typeof
valueOld
===
'
number
'
)
{
value
=
valueOld
-
y
/
200
if
(
value
<
0
)
{
...
...
@@ -735,35 +695,12 @@ export default {
},
3000
)
},
autoHideEnd
()
{
var
otherData
=
this
.
otherData
const
otherData
=
this
.
otherData
if
(
otherData
.
hideTiming
)
{
clearTimeout
(
otherData
.
hideTiming
)
otherData
.
hideTiming
=
null
}
},
getScreenXY
(
dataOrigin
)
{
var
rotateType
=
this
.
rotateType
if
(
!
this
.
fullscreen
||
!
rotateType
)
{
return
dataOrigin
}
var
w
=
screen
.
width
var
h
=
screen
.
height
var
x
=
dataOrigin
.
pageX
var
y
=
dataOrigin
.
pageY
var
pageX
var
pageY
if
(
rotateType
===
'
left
'
)
{
pageX
=
h
-
y
pageY
=
x
}
else
{
pageX
=
y
pageY
=
w
-
x
}
return
{
pageX
,
pageY
}
},
updateProgress
()
{
if
(
!
this
.
touching
)
{
this
.
progress
=
this
.
currentTime
/
this
.
durationTime
*
100
...
...
@@ -801,20 +738,9 @@ uni-video[hidden] {
.uni-video-container.uni-video-type-fullscreen
{
position
:
fixed
;
top
:
50%
;
left
:
50%
;
transform
:
translate
(
-50%
,
-50%
);
z-index
:
999
;
}
.uni-video-container.uni-video-type-fullscreen.uni-video-type-rotate-left
{
transform
:
translate
(
-50%
,
-50%
)
rotate
(
-90deg
);
}
.uni-video-container.uni-video-type-fullscreen.uni-video-type-rotate-right
{
transform
:
translate
(
-50%
,
-50%
)
rotate
(
90deg
);
}
.uni-video-video
{
width
:
100%
;
height
:
100%
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录