Skip to content

Instantly share code, notes, and snippets.

@kutyel
Created Feb 3, 2021
Embed
What would you like to do?
port module Main exposing (main)
import Browser
import Html exposing (Html, button, canvas, div, h1, h3, p, text)
import Html.Attributes exposing (class, height, id, width)
import Html.Events exposing (onClick)
port subscribeToVideoUpdates : () -> Cmd msg
port unsubscribe : () -> Cmd msg
---- MODEL ----
type Role
= Presenter
| Participant
type MobileFlag
= Mobile
| Desktop
type Tech
= VNC
| WebRTC
type alias Call =
{ role : Role
, technology : Tech
, mobileFlag : Maybe MobileFlag
, paused : Bool
, activeTab : ( String, ActiveTab ) -- title, and screen/window
}
type Model
= IdleCall
| Error String
| OnGoingVideoCall Call
type ActiveTab
= Window
| Screen
init : ( Model, Cmd Msg )
init =
-- TODO: get flag from the server
( IdleCall, Cmd.none )
---- UPDATE ----
type Msg
= GotServerAckTransmission (Maybe MobileFlag)
| GotServerRoleBit Role (List Tech)
| PauseTransmission
| ResumeTransmission
| SetActiveTab ActiveTab String
| StartedScreenSharing Tech
| StartVideoResponseReceived
| StopVideoCall
update : Msg -> Model -> ( Model, Cmd Msg )
update _ model =
-- no need to implement this for this interview...
( model, Cmd.none )
---- VIEW ----
view : Model -> Html Msg
view model =
div []
[ h1 [] [ text "Super Zoom Alternative!" ]
, case model of
IdleCall ->
p [] [ text "Video will start soon..." ]
Error msg ->
p [ class "error" ] [ text msg ]
OnGoingVideoCall call ->
let
title =
Tuple.first call.activeTab
selectScreenBtn =
button [ onClick <| SetActiveTab Screen "screen-01" ] [ text "Select Screen" ]
selectWindowBtn =
button [ onClick <| SetActiveTab Window "window-01" ] [ text "Select Window" ]
pauseResumeBtn =
button
[ onClick <|
if call.paused then
ResumeTransmission
else
PauseTransmission
]
[ text <|
if call.paused then
"Resume"
else
"Pause"
]
in
div []
[ p [] [ text "ready to present your screen?" ]
, button
[ onClick <|
if call.paused then
StartedScreenSharing call.technology
else
StopVideoCall
]
[ text
(if call.paused then
"Stop"
else
"Start"
)
]
, div [ class "video-header" ] <|
case ( call.technology, call.mobileFlag ) of
( WebRTC, _ ) ->
[ selectScreenBtn, pauseResumeBtn, h3 [] [ text title ] ]
( VNC, Nothing ) ->
[ selectScreenBtn, selectWindowBtn, pauseResumeBtn, h3 [] [ text title ] ]
( VNC, Just _ ) ->
[ pauseResumeBtn, h3 [] [ text "Mobile Display" ] ]
, canvas [ id "video-canvas", width 700, height 300 ] []
]
]
---- SUBSCRIPTIONS ----
subscriptions : Model -> Sub Msg
subscriptions _ =
-- TODO: if VNC && MobileFlag == Nothing, subscribe to server for messages...
Sub.none
---- PROGRAM ----
main : Program () Model Msg
main =
Browser.element
{ view = view
, init = \_ -> init
, update = update
, subscriptions = subscriptions
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment