elm/libraries/Text.elm

127 lines
2.8 KiB
Elm
Raw Normal View History

2013-04-28 12:21:46 +00:00
module Text where
2013-09-10 03:57:06 +00:00
{-| Functions for displaying text
2013-09-10 06:07:49 +00:00
# Creating Text
2013-09-10 03:57:06 +00:00
@docs toText
2013-09-10 06:07:49 +00:00
# Creating Elements
@docs leftAligned, rightAligned, centered, justified
2013-09-10 03:57:06 +00:00
# Style and Links
@docs Style, style, Line, link
2013-09-10 06:07:49 +00:00
# Convenience Functions
There are two convenience functions for creating an `Element` which can be
useful when debugging or prototyping:
@docs plainText, asText
There are also a bunch of functions to set parts of a `Style` individually:
@docs typeface, monospace, height, color, bold, italic, line
2013-09-10 03:57:06 +00:00
-}
import Basics (..)
2013-07-27 11:08:46 +00:00
import Color (Color)
import Graphics.Element (Element, Three, Pos, ElementPrim, Properties)
import Maybe (Maybe)
import JavaScript (JSString)
import Native.Text
2013-07-27 11:08:46 +00:00
data Text = Text
data Line = Under | Over | Through
{-| Representation of all the ways you can style `Text`.
-}
type Style =
{ typeface : [String]
, height : Maybe Float
, color : Color
, bold : Bool
, italic : Bool
, line : Maybe Line
}
2013-09-10 03:57:06 +00:00
{-| Convert a string into text which can be styled and displayed. -}
toText : String -> Text
toText = Native.Text.toText
{-| Set the style of some text.
-}
style : Style -> Text -> Text
style = Native.Text.style
{-| Provide a list of prefered typefaces for some text.
2013-09-10 03:57:06 +00:00
["helvetica","arial","sans-serif"]
2013-09-10 03:57:06 +00:00
Not everyone has access to the same typefaces, so rendering will use the first
typeface in the list that is found on the user's computer. If there are no
matches, it will use their default typeface. Works the same as the CSS
font-family property.
2013-09-10 03:57:06 +00:00
-}
typeface : [String] -> Text -> Text
typeface = Native.Text.typeface
2013-09-10 03:57:06 +00:00
{-| Switch to a monospace typeface. Good for code snippets. -}
monospace : Text -> Text
monospace = Native.Text.monospace
{-| Create a link.
link "http://elm-lang.org" (toText "Elm Website")
-}
2013-04-29 01:52:13 +00:00
link : String -> Text -> Text
link = Native.Text.link
height : Float -> Text -> Text
height = Native.Text.height
color : Color -> Text -> Text
color = Native.Text.color
bold : Text -> Text
bold = Native.Text.bold
italic : Text -> Text
italic = Native.Text.italic
line : Line -> Text -> Text
line = Native.Text.line
leftAligned : Text -> Element
leftAligned = Native.Text.leftAligned
rightAligned : Text -> Element
rightAligned = Native.Text.rightAligned
centered : Text -> Element
centered = Native.Text.centered
justified : Text -> Element
justified = Native.Text.justified
2013-09-10 03:57:06 +00:00
{-| Display a plain string. -}
plainText : String -> Element
plainText str =
leftAligned (toText str)
2013-09-10 03:57:06 +00:00
{-| for internal use only -}
markdown : Element
markdown = Native.Text.markdown
2013-10-30 15:19:02 +00:00
{-| Convert anything to its textual representation and make it displayable in
2013-10-30 15:37:28 +00:00
the browser:
2013-09-10 03:57:06 +00:00
asText == text . monospace . show
Excellent for debugging.
-}
asText : a -> Element
asText value =
leftAligned (monospace (toText (show value)))