all the functions I care about are working \o/
This commit is contained in:
parent
15b8b6ed01
commit
501a8654a1
106
assets/index.html
Normal file
106
assets/index.html
Normal file
@ -0,0 +1,106 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>gostart</title>
|
||||||
|
<style>
|
||||||
|
html {
|
||||||
|
background-color: #ffffea;
|
||||||
|
}
|
||||||
|
.icon {
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 10px;
|
||||||
|
margin: 10px;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid black;
|
||||||
|
list-style-type: none;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon img {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.col {
|
||||||
|
border: 1px solid black;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(6, 1fr);
|
||||||
|
gap: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon span {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
right: 7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bar {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
padding: 5px !important;
|
||||||
|
border-bottom: 1px solid black;
|
||||||
|
border-radius: 10px 10px 0px 0px;
|
||||||
|
background-color: #dedeff;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bar-left {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bar-right {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-content {
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
padding: 5px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul li span {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="main"></div>
|
||||||
|
|
||||||
|
<script src="main.js"></script>
|
||||||
|
<script>
|
||||||
|
var app = Elm.Main.init({
|
||||||
|
node: document.getElementById('main')
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
163
src/Main.elm
163
src/Main.elm
@ -3,7 +3,7 @@ module Main exposing (..)
|
|||||||
import Browser
|
import Browser
|
||||||
import Data
|
import Data
|
||||||
import Html exposing (..)
|
import Html exposing (..)
|
||||||
import Html.Attributes exposing (class, href, name, placeholder, src, type_)
|
import Html.Attributes exposing (checked, class, classList, href, name, placeholder, src, type_)
|
||||||
import Html.Events exposing (..)
|
import Html.Events exposing (..)
|
||||||
import Http
|
import Http
|
||||||
import Json.Decode as Decode
|
import Json.Decode as Decode
|
||||||
@ -36,10 +36,15 @@ type Msg
|
|||||||
| ReloadWatches
|
| ReloadWatches
|
||||||
| GotWatches (Result Http.Error (List Data.Watch))
|
| GotWatches (Result Http.Error (List Data.Watch))
|
||||||
| GotLinks (Result Http.Error (List Data.Link))
|
| GotLinks (Result Http.Error (List Data.Link))
|
||||||
| SubmitWatch
|
| AddedLink (Result Http.Error ())
|
||||||
| SubmitLink
|
| DeletedLink (Result Http.Error ())
|
||||||
| HideWatchedItem Int String
|
|
||||||
| HidItem (Result Http.Error ())
|
| HidItem (Result Http.Error ())
|
||||||
|
| SubmitLink
|
||||||
|
| GotNewLink NewLink
|
||||||
|
| SubmitWatch
|
||||||
|
| GotNewWatch NewWatch
|
||||||
|
| HideWatchedItem Int String
|
||||||
|
| DeleteLink Int
|
||||||
|
|
||||||
|
|
||||||
type Status
|
type Status
|
||||||
@ -114,32 +119,103 @@ hideWatched id repo =
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
addLink : Model -> Cmd Msg
|
||||||
|
addLink model =
|
||||||
|
let
|
||||||
|
body =
|
||||||
|
Encode.object
|
||||||
|
[ ( "name", Encode.string model.newlink.name )
|
||||||
|
, ( "url", Encode.string model.newlink.url )
|
||||||
|
, ( "logo_url", Encode.string model.newlink.logo_url )
|
||||||
|
, ( "shared", Encode.bool model.newlink.shared )
|
||||||
|
]
|
||||||
|
|> Http.jsonBody
|
||||||
|
in
|
||||||
|
Http.post
|
||||||
|
{ url = "/links"
|
||||||
|
, body = body
|
||||||
|
, expect = Http.expectWhatever AddedLink
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
addWatch : Model -> Cmd Msg
|
||||||
|
addWatch model =
|
||||||
|
let
|
||||||
|
body =
|
||||||
|
Encode.object
|
||||||
|
[ ( "name", Encode.string model.newwatch.name )
|
||||||
|
, ( "repo", Encode.string model.newwatch.repo )
|
||||||
|
]
|
||||||
|
|> Http.jsonBody
|
||||||
|
in
|
||||||
|
Http.post
|
||||||
|
{ url = "/watches"
|
||||||
|
, body = body
|
||||||
|
, expect = Http.expectWhatever AddedLink
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
deleteLink : Int -> Cmd Msg
|
||||||
|
deleteLink linkId =
|
||||||
|
Http.request
|
||||||
|
{ url = "/links/" ++ String.fromInt linkId
|
||||||
|
, method = "DELETE"
|
||||||
|
, timeout = Nothing
|
||||||
|
, tracker = Nothing
|
||||||
|
, headers = []
|
||||||
|
, body = Http.emptyBody
|
||||||
|
, expect = Http.expectWhatever DeletedLink
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
update : Msg -> Model -> ( Model, Cmd Msg )
|
update : Msg -> Model -> ( Model, Cmd Msg )
|
||||||
update msg model =
|
update msg model =
|
||||||
case msg of
|
case msg of
|
||||||
|
DeleteLink linkId ->
|
||||||
|
( model, deleteLink linkId )
|
||||||
|
|
||||||
|
GotNewWatch newwatch ->
|
||||||
|
( { model | newwatch = newwatch }, Cmd.none )
|
||||||
|
|
||||||
|
GotNewLink newlink ->
|
||||||
|
( { model | newlink = newlink }, Cmd.none )
|
||||||
|
|
||||||
|
AddedLink (Err _) ->
|
||||||
|
( { model | status = Errored "Server error adding a link!" }, Cmd.none )
|
||||||
|
|
||||||
|
AddedLink (Ok _) ->
|
||||||
|
( { model | newlink = initialModel.newlink }, getLinks )
|
||||||
|
|
||||||
|
DeletedLink (Ok _) ->
|
||||||
|
( model, getLinks )
|
||||||
|
|
||||||
|
DeletedLink (Err _) ->
|
||||||
|
( { model | status = Errored "Server error deleting link!" }, Cmd.none )
|
||||||
|
|
||||||
HidItem (Err _) ->
|
HidItem (Err _) ->
|
||||||
( { model | status = Errored "Server error when hiding a watch item!" }, Cmd.none )
|
( { model | status = Errored "Server error when hiding a watch item!" }, Cmd.none )
|
||||||
|
|
||||||
HidItem (Ok _) ->
|
HidItem (Ok _) ->
|
||||||
( model, Cmd.batch [ getWatches, getLinks ] )
|
( model, getWatches )
|
||||||
|
|
||||||
HideWatchedItem itemId repo ->
|
HideWatchedItem itemId repo ->
|
||||||
( model, Cmd.batch [ hideWatched itemId repo ] )
|
( model, hideWatched itemId repo )
|
||||||
|
|
||||||
SubmitWatch ->
|
SubmitWatch ->
|
||||||
( { model | newwatch = model.newwatch }, Cmd.batch [ getWatches ] )
|
-- TODO
|
||||||
|
( model, addWatch model )
|
||||||
|
|
||||||
SubmitLink ->
|
SubmitLink ->
|
||||||
( model, Cmd.batch [ getLinks ] )
|
( model, addLink model )
|
||||||
|
|
||||||
Reload ->
|
Reload ->
|
||||||
( model, Cmd.batch [ getWatches, getLinks ] )
|
( model, Cmd.batch [ getWatches, getLinks ] )
|
||||||
|
|
||||||
ReloadWatches ->
|
ReloadWatches ->
|
||||||
( model, Cmd.batch [ getWatches ] )
|
( model, getWatches )
|
||||||
|
|
||||||
ReloadLinks ->
|
ReloadLinks ->
|
||||||
( model, Cmd.batch [ getLinks ] )
|
( model, getLinks )
|
||||||
|
|
||||||
GotWatches (Err _) ->
|
GotWatches (Err _) ->
|
||||||
( { model | status = Errored "Server error when fetching watches!" }, Cmd.none )
|
( { model | status = Errored "Server error when fetching watches!" }, Cmd.none )
|
||||||
@ -209,6 +285,19 @@ view model =
|
|||||||
[ viewLinks model
|
[ viewLinks model
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
|
, div [ class "grid" ]
|
||||||
|
[ case model.status of
|
||||||
|
Errored e ->
|
||||||
|
div
|
||||||
|
[ classList
|
||||||
|
[ ( "error", True )
|
||||||
|
]
|
||||||
|
]
|
||||||
|
[ text e ]
|
||||||
|
|
||||||
|
_ ->
|
||||||
|
text ""
|
||||||
|
]
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
|
|
||||||
@ -276,40 +365,53 @@ repoInfoDecoder =
|
|||||||
(field "nameWithOwner" string)
|
(field "nameWithOwner" string)
|
||||||
|
|
||||||
|
|
||||||
watchForm : Model -> Html Msg
|
watchForm : NewWatch -> Html Msg
|
||||||
watchForm _ =
|
watchForm newwatch =
|
||||||
div []
|
div []
|
||||||
[ createForm SubmitWatch
|
[ createForm SubmitWatch
|
||||||
(div
|
(div
|
||||||
[]
|
[]
|
||||||
[ labeledTextBox "Item: " "some string..." ""
|
[ labeledTextBox "Item: " "some string..." "name" (\v -> GotNewWatch { newwatch | name = v })
|
||||||
, labeledTextBox "Repository: " "NixOS/nixpkgs" ""
|
, labeledTextBox "Repository: " "NixOS/nixpkgs" "repo" (\v -> GotNewWatch { newwatch | repo = v })
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
linkForm : Model -> Html Msg
|
linkForm : NewLink -> Html Msg
|
||||||
linkForm _ =
|
linkForm newlink =
|
||||||
div []
|
div []
|
||||||
[ createForm SubmitLink
|
[ createForm SubmitLink
|
||||||
(div
|
(div [ class "form-content" ]
|
||||||
[]
|
[ div
|
||||||
[ labeledTextBox "Name: " "Potato" ""
|
[]
|
||||||
, labeledTextBox "URL: " "https://...." ""
|
[ labeledTextBox "Name: " "Potato" "name" (\v -> GotNewLink { newlink | name = v })
|
||||||
, labeledTextBox "Icon: " "https://...." ""
|
, labeledTextBox "URL: " "https://...." "url" (\v -> GotNewLink { newlink | url = v })
|
||||||
|
, labeledTextBox "Icon: " "https://...." "logo_url" (\v -> GotNewLink { newlink | logo_url = v })
|
||||||
|
, label []
|
||||||
|
[ text "Shared: "
|
||||||
|
, input
|
||||||
|
[ type_ "checkbox"
|
||||||
|
, name "linkshared"
|
||||||
|
, onCheck (\v -> GotNewLink { newlink | shared = v })
|
||||||
|
, checked <| newlink.shared
|
||||||
|
]
|
||||||
|
[]
|
||||||
|
]
|
||||||
|
]
|
||||||
]
|
]
|
||||||
)
|
)
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
labeledTextBox : String -> String -> String -> Html Msg
|
labeledTextBox : String -> String -> String -> (String -> msg) -> Html msg
|
||||||
labeledTextBox labelStr placeStr inputName =
|
labeledTextBox labelStr placeStr inputName inputHandler =
|
||||||
label []
|
label []
|
||||||
[ text labelStr
|
[ text labelStr
|
||||||
, input
|
, input
|
||||||
[ type_ "text"
|
[ type_ "text"
|
||||||
, name inputName
|
, name inputName
|
||||||
|
, onInput inputHandler
|
||||||
, placeholder placeStr
|
, placeholder placeStr
|
||||||
]
|
]
|
||||||
[]
|
[]
|
||||||
@ -326,7 +428,9 @@ createForm action content =
|
|||||||
]
|
]
|
||||||
[ div [ class "form-content" ]
|
[ div [ class "form-content" ]
|
||||||
[ content
|
[ content
|
||||||
, button [] [ text "Submit" ]
|
, button
|
||||||
|
[]
|
||||||
|
[ text "Submit" ]
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
]
|
]
|
||||||
@ -343,7 +447,7 @@ bar left right =
|
|||||||
viewLinks : Model -> Html Msg
|
viewLinks : Model -> Html Msg
|
||||||
viewLinks model =
|
viewLinks model =
|
||||||
div []
|
div []
|
||||||
[ bar (linkForm model) (a [ onClick ReloadLinks ] [ text " ⟳" ])
|
[ bar (linkForm model.newlink) (a [ onClick ReloadLinks ] [ text " ⟳" ])
|
||||||
, case model.links of
|
, case model.links of
|
||||||
_ :: _ ->
|
_ :: _ ->
|
||||||
div
|
div
|
||||||
@ -358,7 +462,7 @@ viewLinks model =
|
|||||||
viewWatches : Model -> Html Msg
|
viewWatches : Model -> Html Msg
|
||||||
viewWatches model =
|
viewWatches model =
|
||||||
div []
|
div []
|
||||||
[ bar (watchForm model) (a [ onClick ReloadWatches ] [ text " ⟳" ])
|
[ bar (watchForm model.newwatch) (a [ onClick ReloadWatches ] [ text " ⟳" ])
|
||||||
, case model.watches of
|
, case model.watches of
|
||||||
_ :: _ ->
|
_ :: _ ->
|
||||||
ul [] (List.map viewWatch model.watches)
|
ul [] (List.map viewWatch model.watches)
|
||||||
@ -371,10 +475,11 @@ viewWatches model =
|
|||||||
viewLink : Data.Link -> Html Msg
|
viewLink : Data.Link -> Html Msg
|
||||||
viewLink link =
|
viewLink link =
|
||||||
div []
|
div []
|
||||||
[ div []
|
[ div [ class "icon" ]
|
||||||
[ a [ href link.url ]
|
[ span [ onClick (DeleteLink link.id) ] [ text "×" ]
|
||||||
|
, a [ href link.url ]
|
||||||
[ div
|
[ div
|
||||||
[ class "icon" ]
|
[]
|
||||||
[ header []
|
[ header []
|
||||||
[ img [ src link.logoURL ] []
|
[ img [ src link.logoURL ] []
|
||||||
]
|
]
|
||||||
|
Loading…
Reference in New Issue
Block a user