tforgione
/
elm-video
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Adds a big play button when video not playing

This commit is contained in:
Thomas Forgione 2021-06-15 19:42:24 +02:00
parent ce9048d779
commit 51dd1736fd
2 changed files with 23 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/Events.elm
View File

@ -51,6 +51,7 @@ player =
List.map Element.htmlAttribute
[ Html.Events.on "fullscreenchange" decodeFullscreenChange
, Html.Events.on "mousemove" (Decode.succeed Video.MouseMove)
, Html.Events.on "click" (Decode.succeed Video.PlayPause)
]

25
src/Views.elm
View File

@ -58,13 +58,32 @@ embed screenSize model =
round ((model.duration - model.position) * 1000)
overlay =
Element.el [ Element.centerX, Element.centerY, Font.color (Element.rgb 1 1 1) ]
(case model.showIcon of
Just icon ->
Element.el
[ Element.width Element.fill
, Element.height Element.fill
, Font.color (Element.rgb 1 1 1)
, if not model.playing then
Background.color (Element.rgba 0 0 0 0.5)
else
Background.color (Element.rgba 0 0 0 0)
]
(case ( model.playing, model.showIcon ) of
( False, _ ) ->
Element.el
[ Element.centerX
, Element.centerY
, Element.scale 10
]
(Icons.play True)
( _, Just icon ) ->
animatedEl fadeOutZoom
[ Background.color (Element.rgb 0 0 0)
, Border.rounded 100
, Element.padding 10
, Element.centerX
, Element.centerY
]
icon