From d30b69bac0b931c86247c76f6652056909954a67 Mon Sep 17 00:00:00 2001 From: Avinal Kumar Date: Sat, 10 Sep 2022 19:58:17 +0530 Subject: [PATCH] add markdown loader Signed-off-by: Avinal Kumar --- elm.json | 4 + public/index.html | 69 ++++++--------- src/Blog.elm | 210 ++++++++++++++++++---------------------------- src/Main.elm | 21 +++-- 4 files changed, 125 insertions(+), 179 deletions(-) diff --git a/elm.json b/elm.json index 7443f40..0d5f54e 100644 --- a/elm.json +++ b/elm.json @@ -9,10 +9,14 @@ "elm/browser": "1.0.2", "elm/core": "1.0.5", "elm/html": "1.0.0", + "elm/http": "2.0.0", "elm/url": "1.0.0", + "elm-explorations/markdown": "1.0.0", "hecrj/html-parser": "2.4.0" }, "indirect": { + "elm/bytes": "1.0.8", + "elm/file": "1.0.5", "elm/json": "1.1.3", "elm/parser": "1.1.0", "elm/time": "1.0.0", diff --git a/public/index.html b/public/index.html index 3a5aef6..8fac638 100644 --- a/public/index.html +++ b/public/index.html @@ -7,62 +7,45 @@ - + + + Document
- + - - + + - - \ No newline at end of file diff --git a/src/Blog.elm b/src/Blog.elm index e7659a1..49ea5c9 100644 --- a/src/Blog.elm +++ b/src/Blog.elm @@ -1,9 +1,13 @@ module Blog exposing (..) import Html exposing (..) -import Html.Attributes exposing (class) +import Html.Attributes exposing (class, placeholder, value) +import Html.Events exposing (onClick, onInput) import Html.Parser import Html.Parser.Util +import Http exposing (Error(..)) +import Markdown exposing (defaultOptions) +import Url exposing (Protocol(..)) @@ -12,6 +16,9 @@ import Html.Parser.Util type alias Model = { blog : Blog + , markDownUrl : String + , markDown : String + , success : Bool } @@ -30,18 +37,37 @@ type alias Blog = } -view : Model -> Html msg +view : Model -> Html Msg view model = div [ class "foo-interface" ] - [ div [ class "max-width mx-auto px3 ltr" ] - [ div [ class "content index py4" ] - (textToHtml postString) + [ div [ class "foo-console foo-terminal foo-active" ] + [ div [ class "max-width mx-auto px3 ltr" ] + [ div + [ class "foo-term-story" ] + [ input + [ placeholder "Enter URL to a markdown file" + , value model.markDownUrl + , onInput StoreInput + ] + [] + , button [ onClick GetMarkdown ] [ text "Get Markdown" ] + ] + , div [ class "content index py4" ] + [ if model.success then + markdownToHtml model + + else + div [ class "foo-error" ] [ text model.markDown ] + ] + ] ] ] type Msg - = Nothing + = GetMarkdown + | StoreInput String + | DataReceived (Result Http.Error String) init : () -> ( Model, Cmd Msg ) @@ -51,10 +77,13 @@ init _ = , url = "my-first-blog-post" , description = "This is my first blog post" , content = "This is the content of my first blog post" - , category = "blog" + , category = "category" , tags = [ "elm", "blog" ] , date = "2018-01-01" } + , markDownUrl = "" + , markDown = "" + , success = True } , Cmd.none ) @@ -63,8 +92,42 @@ init _ = update : Msg -> Model -> ( Model, Cmd Msg ) update msg model = case msg of - Nothing -> - ( model, Cmd.none ) + GetMarkdown -> + ( model, Http.get { url = model.markDownUrl, expect = Http.expectString DataReceived } ) + + DataReceived (Ok data) -> + ( { model | markDown = data, success = True }, Cmd.none ) + + DataReceived (Err err) -> + ( { model | success = False, markDown = errorToString err }, Cmd.none ) + + StoreInput input -> + ( { model | markDownUrl = input }, Cmd.none ) + + +errorToString : Http.Error -> String +errorToString error = + case error of + BadUrl url -> + "The URL " ++ url ++ " was invalid" + + Timeout -> + "Unable to reach the server, try again" + + NetworkError -> + "Unable to reach the server, check your network connection" + + BadStatus 500 -> + "The server had a problem, try again later" + + BadStatus 400 -> + "Verify your information and try again" + + BadStatus _ -> + "Unknown error" + + BadBody errorMessage -> + errorMessage textToHtml : String -> List (Html.Html msg) @@ -77,124 +140,11 @@ textToHtml text = [] -testString : String -testString = - """ - -
-

- Find me on - - - - - - - - - - - - and - - - -

-
-
- Writing - -
- """ - - -postString : String -postString = - """ -
-
- -

- Hello World -

- - - -
- - -
- - - - -
- - - -
- - tech2 -
- - - - -
-
- - -
-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at dolor a sem consequat facilisis ut et augue. Vestibulum vestibulum lectus erat, id tincidunt sapien laoreet non. Ut nec ante eu lorem posuere fringilla sit amet in tortor.

-

This is a subtitle

Quisque ac maximus ligula, sed sagittis est. Integer venenatis pellentesque elit. Donec molestie turpis sit amet sodales cursus. Sed at risus cursus, feugiat lacus sit amet, rutrum sem. Vestibulum accumsan dui urna, vel feugiat lectus malesuada id. Quisque in interdum turpis, et pulvinar tortor. Vivamus tincidunt purus eu libero viverra, at posuere dolor gravida.

-
Hello worldhello_world.py
1
2
print "Hello World!"
=> "Hello World!"
- -

This is a second subtitle

Donec venenatis eu nunc non accumsan. Etiam elementum dapibus urna, ac mattis tortor volutpat a. Pellentesque eu purus metus. Curabitur vel nulla ut odio congue vulputate. Morbi lacinia tellus sit amet facilisis dictum. Nullam a erat felis. Vestibulum nec diam ac nisi pharetra tincidunt. Ut vitae ullamcorper ipsum. Sed vehicula vehicula dolor. Quisque ac tortor a neque scelerisque venenatis.

- - -

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque hendrerit lacus ut purus iaculis feugiat.

-
- -

Mauris quis lorem id arcu lobortis finibus in quis mauris. Cras lacinia neque arcu, id viverra nunc pretium eget. Aenean eu luctus diam. Maecenas blandit eros in fermentum cursus. Pellentesque hendrerit ipsum orci, tempor facilisis est maximus at. Suspendisse potenti. Sed eleifend ullamcorper eleifend. Nullam tincidunt eget ex vitae blandit. Donec molestie iaculis elementum. Interdum et malesuada fames ac ante ipsum primis in faucibus. Maecenas in suscipit ex. Integer molestie felis mi, in commodo dolor fermentum a. Cras blandit auctor enim, eu rhoncus turpis ullamcorper id.

- -
-
- """ +markdownToHtml : Model -> Html Msg +markdownToHtml model = + Markdown.toHtmlWith + { defaultOptions + | githubFlavored = Just { tables = True, breaks = False } + } + [] + model.markDown diff --git a/src/Main.elm b/src/Main.elm index 3e027ac..fc7e5e3 100644 --- a/src/Main.elm +++ b/src/Main.elm @@ -4,7 +4,7 @@ import Blog as Blog import Browser exposing (Document) import Browser.Navigation as Nav import Html exposing (Html, a, div, footer, header, img, li, text, ul) -import Html.Attributes exposing (class, href, src) +import Html.Attributes exposing (class, href, src, target) import Html.Lazy exposing (lazy) import Splash as Splash import Static as Static @@ -35,10 +35,10 @@ type alias Model = {-| Page designs - BlogPage: Page design for blogs - TerminalPage: Page design for terminal - StaticPage: Page design for static pages - NotFound: Page design for 404 page + BlogPage: Page design for blogs + TerminalPage: Page design for terminal + StaticPage: Page design for static pages + NotFound: Page design for 404 page -} type Page @@ -106,7 +106,7 @@ viewHeader page = _ -> header [ class "foo-logo" ] - [ img [ src "/website/logo-static.svg" ] + [ img [ src "/website/logo-static.svg", target urlPrefix ] [] ] in @@ -220,12 +220,18 @@ type Route | Static + +-- | BlogPost String String + + parser : Parser (Route -> a) a parser = Parser.oneOf [ Parser.map Splash Parser.top , Parser.map Splash (s urlPrefix) , Parser.map Blog (s urlPrefix s "posts") + + -- , Parser.map BlogPost (s urlPrefix s "posts" Parser.string Parser.string) , Parser.map Static (s urlPrefix s "pages") , Parser.map Terminal (s urlPrefix s "terminal") ] @@ -242,6 +248,9 @@ updateUrl model = Blog.init () |> toBlog model + -- Just (BlogPost category slug) -> + -- Blog.init { category = category, slug = slug } + -- |> toBlog model Just Terminal -> Terminal.init () |> toTerminal model