Files
Select files. Download files. Work with file content.
Maybe you generate an SVG floorplan or a PDF legal document? You can use File.Download
to save those files to disk. Maybe you want people to upload a CSV of microbe data or a JPG of their face? You can use File.Select
to get those files into the browser.
This package does not allow arbitrary access to the file system though. Browsers restrict access to the file system for security. Otherwise, any website on the internet could go try to read private keys out of ~/.ssh
or whatever else they want!
Download Example
Maybe you want people to download the floorplan they just designed as an SVG file? You could use File.Download.string
like this:
import File.Download as Download
download : String -> Cmd msg
download svgContent =
Download.string "floorplan.svg" "image/svg+xml" svgContent
Upload Example
Maybe you want to help scientists explore and visualize data? Maybe they need to upload CSV files like this:
Name,Age,Weight,Height
Tom,22,63,1.8
Sue,55,50,1.6
Bob,35,75,1.85
You could use File.Select.file
and File.toString
to create a program like this:
import Browser
import File exposing (File)
import File.Select as Select
import Html exposing (Html, button, p, text)
import Html.Attributes exposing (style)
import Html.Events exposing (onClick)
import Task
-- MAIN
main : Program () Model Msg
main =
Browser.element
{ init = init
, view = view
, update = update
, subscriptions = subscriptions
}
-- MODEL
type alias Model =
{ csv : Maybe String
}
init : () -> (Model, Cmd Msg)
init _ =
( Model Nothing, Cmd.none )
-- UPDATE
type Msg
= CsvRequested
| CsvSelected File
| CsvLoaded String
update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
case msg of
CsvRequested ->
( model
, Select.file ["text/csv"] CsvSelected
)
CsvSelected file ->
( model
, Task.perform CsvLoaded (File.toString file)
)
CsvLoaded content ->
( { model | csv = Just content }
, Cmd.none
)
-- VIEW
view : Model -> Html Msg
view model =
case model.csv of
Nothing ->
button [ onClick CsvRequested ] [ text "Load CSV" ]
Just content ->
p [ style "white-space" "pre" ] [ text content ]
-- SUBSCRIPTIONS
subscriptions : Model -> Sub Msg
subscriptions _ =
Sub.none
From there you could parse the CSV file, start showing scatter plots, etc.