snapview.elm

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
        }