Add a button to reconnect.
This commit is contained in:
parent
4de9063e67
commit
b0e796ee16
|
@ -49,6 +49,7 @@ init _ url key =
|
|||
, roomText = Dict.empty
|
||||
, transactionId = 0
|
||||
, userData = Dict.empty
|
||||
, connected = True
|
||||
}
|
||||
cmd = getStoreValuePort "scylla.loginInfo"
|
||||
in
|
||||
|
@ -94,6 +95,7 @@ update msg model = case msg of
|
|||
SendFileResponse _ -> (model, Cmd.none)
|
||||
ReceiveMarkdown md -> updateMarkdown model md
|
||||
DismissError i -> updateDismissError model i
|
||||
AttemptReconnect -> ({ model | connected = True }, firstSync model.apiUrl (Maybe.withDefault "" model.token))
|
||||
|
||||
updateDismissError : Model -> Int -> (Model, Cmd Msg)
|
||||
updateDismissError m i = ({ m | errors = (List.take i m.errors) ++ (List.drop (i+1) m.errors)}, Cmd.none)
|
||||
|
@ -319,7 +321,7 @@ updateSyncResponse model r notify =
|
|||
, setScrollCmd sr
|
||||
, setReadReceiptCmd sr
|
||||
])
|
||||
_ -> (model, Cmd.none)
|
||||
_ -> ({ model | connected = False }, Cmd.none)
|
||||
|
||||
subscriptions : Model -> Sub Msg
|
||||
subscriptions m =
|
||||
|
|
|
@ -29,6 +29,7 @@ type alias Model =
|
|||
, roomText : Dict String String
|
||||
, transactionId : Int
|
||||
, userData : Dict Username UserData
|
||||
, connected : Bool
|
||||
}
|
||||
|
||||
type Msg =
|
||||
|
@ -64,6 +65,7 @@ type Msg =
|
|||
| SendFileResponse (Result Http.Error ())
|
||||
| ReceiveMarkdown MarkdownResponse
|
||||
| DismissError Int
|
||||
| AttemptReconnect
|
||||
|
||||
displayName : Model -> Username -> String
|
||||
displayName m s = Maybe.withDefault (senderName s) <| Maybe.andThen .displayName <| Dict.get s m.userData
|
||||
|
|
|
@ -18,6 +18,9 @@ import Html.Events exposing (onInput, onClick, preventDefaultOn)
|
|||
import Dict exposing (Dict)
|
||||
import Tuple
|
||||
|
||||
maybeHtml : List (Maybe (Html Msg)) -> List (Html Msg)
|
||||
maybeHtml = List.filterMap (\i -> i)
|
||||
|
||||
contentRepositoryDownloadUrl : ApiUrl -> String -> String
|
||||
contentRepositoryDownloadUrl apiUrl s =
|
||||
let
|
||||
|
@ -59,14 +62,19 @@ errorView i s = div [ class "error-wrapper", onClick <| DismissError i ] [ iconV
|
|||
baseView : Model -> Maybe (String, JoinedRoom) -> Html Msg
|
||||
baseView m jr =
|
||||
let
|
||||
roomView = case jr of
|
||||
Just (id, r) -> joinedRoomView m id r
|
||||
Nothing -> div [] []
|
||||
roomView = Maybe.map (\(id, r) -> joinedRoomView m id r) jr
|
||||
reconnect = reconnectView m
|
||||
in
|
||||
div [ class "base-wrapper" ]
|
||||
[ roomListView m
|
||||
, roomView
|
||||
]
|
||||
div [ class "base-wrapper" ] <| maybeHtml
|
||||
[ Just <| roomListView m
|
||||
, roomView
|
||||
, reconnect
|
||||
]
|
||||
|
||||
reconnectView : Model -> Maybe (Html Msg)
|
||||
reconnectView m = if m.connected
|
||||
then Nothing
|
||||
else Just <| div [ class "reconnect-wrapper", onClick AttemptReconnect ] [ iconView "zap", text "Disconnected. Click here to reconnect." ]
|
||||
|
||||
roomListView : Model -> Html Msg
|
||||
roomListView m =
|
||||
|
|
|
@ -2,17 +2,20 @@
|
|||
$primary-color: #53C0FA;
|
||||
$primary-color-highlight: #4298C7;
|
||||
$primary-color-light: #9FDBFB;
|
||||
$active-input-color: #282d30;
|
||||
|
||||
$background-color: #1b1e21;
|
||||
$background-color-dark: darken($background-color, 4%);
|
||||
|
||||
$error-color: #f01d43;
|
||||
$error-color-dark: darken(#f01d43, 10%);
|
||||
$transition-duration: .125s;
|
||||
|
||||
$inactive-input-color: darken($active-input-color, 3%);
|
||||
$active-input-color: #282d30;
|
||||
$active-input-border-color: $primary-color;
|
||||
$inactive-input-color: darken($active-input-color, 3%);
|
||||
$inactive-input-border-color: darken($inactive-input-color, 10%);
|
||||
|
||||
$transition-duration: .125s;
|
||||
|
||||
html, body {
|
||||
height: 100vh;
|
||||
}
|
||||
|
@ -160,6 +163,21 @@ div.room-link-wrapper {
|
|||
}
|
||||
}
|
||||
|
||||
div.reconnect-wrapper {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: $inactive-input-color;
|
||||
border: 1px solid $inactive-input-border-color;
|
||||
border-radius: 3px;
|
||||
|
||||
.feather-icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* The current room, if any.
|
||||
*/
|
||||
|
|
Loading…
Reference in New Issue
Block a user