all the functions I care about are working \o/

This commit is contained in:
Aaron Bieber 2023-05-18 12:53:36 -06:00
parent 15b8b6ed01
commit 501a8654a1
No known key found for this signature in database
2 changed files with 240 additions and 29 deletions

106
assets/index.html Normal file
View 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>

View File

@ -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 ] []
] ]