Files
localTube/Modules/Website/src/Files.elm
2021-05-29 02:34:49 +02:00

209 lines
4.3 KiB
Elm

module Files exposing (..)
import Element exposing (..)
import Element.Background as Background
import Element.Border as Border
import Element.Font as Font
import Element.Input as Input
import Element.Region as Region
import Http
import Json.Decode exposing (Decoder, int, list, string, succeed)
import Json.Decode.Pipeline exposing (required)
import String exposing (left)
import Debug exposing (toString)
type alias File =
{ name : String
, file_name : String
, source : String
, id : Int
, status : String
}
type alias FilesResponse =
{ queue : List File }
-- Model --
type alias Model =
{ files : List File
, filter : String
, error : Maybe String
}
initModel : Model
initModel =
{ files =
[]
, filter = ""
, error = Nothing
}
init : ( Model, Cmd Msg )
init =
( initModel, queryFiles )
-- Messages --
type Msg
= Reload
| QueryRequestResult (Result Http.Error FilesResponse)
-- Request --
fileDecoder : Decoder File
fileDecoder =
succeed File
|> required "name" string
|> required "file_name" string
|> required "source" string
|> required "id" int
|> required "status" string
queueDecoder : Decoder FilesResponse
queueDecoder =
succeed FilesResponse
|> required "queue" (list fileDecoder)
-- Update --
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
QueryRequestResult (Ok res) ->
( { model | files = res.queue }, Cmd.none )
QueryRequestResult (Err (Http.BadBody er)) ->
( { model | error = Just er }, Cmd.none )
_ ->
( model, Cmd.none )
queryFiles : Cmd Msg
queryFiles =
Http.get
{ url = "http://127.0.0.1/api/files"
, expect = Http.expectJson QueryRequestResult queueDecoder
}
-- View --
shadow : Attr decorative msg
shadow =
Border.shadow
{ offset = ( 2, 2 )
, size = 2
, blur = 2
, color = rgb 0.5 0.5 0.5
}
viewFile : File -> Element Msg
viewFile file =
el
[ width fill
, Background.color (rgb 0.8 0.8 0.8)
, padding 10
, Border.rounded 3
, shadow
, height (px 110)
]
(Element.column
[ width fill
, spacing 6
]
[ Element.row
[ width fill ]
[ el
[ Region.heading 1
, alignLeft
, Font.size 24
]
(text file.name)
, el
[ Region.heading 1
, alignRight
, Font.color (rgba 0 0 0 0.6)
, Font.size 20
]
(text (String.concat [ "[", file.status, "]" ]))
]
, el
[ Region.heading 2
, Font.size 16
, spacingXY 0 10
]
(text (String.concat ["File name: ", file.file_name]))
,el
[ Region.heading 2
, Font.size 16
]
(text (String.concat ["Source: ", file.source]))
, download
[ Region.footer
, Font.color (rgb 0 0 0.8)
, Font.size 16
, alignBottom
, alignRight
]
{ url = String.concat ["http://127.0.0.1/api/file/", toString file.id ]
, label = text "Download"
}
]
)
view : Model -> Element Msg
view model =
Element.column
[ width (px 800)
, height shrink
, centerX
, spacing 36
, padding 10
]
[ el
[ Region.heading 1
, width fill
, alignLeft
, Font.size 36
]
(text "Files")
, case model.error of
Just e ->
el
[ Font.color (rgb 1 0 0)
, Font.size 16
]
(text e)
Nothing ->
Element.column
[ width fill
, centerX
, spacing 10
]
(List.map viewFile model.files)
]