miyamoen / bibliopola / Bibliopola

UI Catalog for Elm applications built by elm-ui inspired by Storybook

demo

Types


type alias Program =
Platform.Program () Types.Model Types.Msg

Type for type annotation.

main : Bibliopola.Program
main =
    fromBook book


type alias Book =
Types.Book

Book has views.

Use intoBook or bookWithFrontCover.


type alias Shelf =
Types.Shelf

Shelf is tree structure that has books.

type alias Shelf =
    Tree Book

Use emptyShelf or shelfWith.

Program

Entry point of Bibliopola

fromBook : Book -> Program

main : Bibliopola.Program
main =
    fromBook book

fromShelf : Shelf -> Program

main : Bibliopola.Program
main =
    fromShelf shelf

Book

withFrontCover : Element String -> Book -> Book

Add first view to a book.

book : Book
book =
    intoBook "HelloYou" identity view
        |> addStory (Story.build "name" identity [ "spam", "egg", "ham" ])
        |> buildBook
        |> withFrontCover (view "Bibliopola")

Build Book


type alias IntoBook msg view =
{ title : String
, views : List ( List String
, view )
, stories : List ( String
, List String )
, toString : msg -> String 
}

IntoBook is building Book type.

Use intoBook.


type alias Story a =
{ label : String
, options : List ( String
, a ) 
}

Story is options of view argument.

Story has label, argument name, and options that have value and label.

|> addStory
    (Story "msg" [ ( "nothing", Nothing ), ( "click", Just "msg" ) ])

To build Story, see Bibliopola.Story.

intoBook : String -> (msg -> String) -> view -> IntoBook msg view

Build IntoBook

First argument, String, is book title. Second, msg -> String, is for message logger. Last, view, is your view function.

book : Book
book =
    intoBook "HelloYou" identity view
        |> addStory (Story.build "name" identity [ "spam", "egg", "ham" ])
        |> buildBook

addStory : Story a -> IntoBook msg (a -> view) -> IntoBook msg view

Add a story to IntoBook.

buildBook : IntoBook msg (Element msg) -> Book

Turn IntoBook to Book.

To use intoBook and addStory, view function is filled up with arguments.

This is for elm-ui Element.

buildHtmlBook : IntoBook msg (Html msg) -> Book

Turn IntoBook to Book

This is for Html.

bookWithFrontCover : String -> Element String -> Book

Build a book that has a static view.

book : Book
book =
    bookWithFrontCover "Hello" view

Shelf

emptyShelf : String -> Shelf

A Shelf has no books in itself.

shelf : Shelf
shelf =
    emptyShelf "Hello"
        |> addBook Hello.book
        |> addBook HelloYou.book

shelfWith : Book -> Shelf

A Shelf has one book in itself.

shelf : Shelf
shelf =
    shelfWith ViewNum.book
        |> addBook ViewFloat.book
        |> addBook ViewInt.book

addBook : Book -> Shelf -> Shelf

Add a book to shelf.

This book becomes child of shelf.

addShelf : Shelf -> Shelf -> Shelf

Add a shelf to shelf.

This shelf becomes child of shelf.

shelf : Shelf
shelf =
    emptyShelf "Bibliopola"
        |> addShelf Atom.Index.shelf
        |> addShelf Molecule.Index.shelf
        |> addShelf Organism.Index.shelf
        |> addShelf Page.Index.shelf