2a18fb6 · elk · git.iko.soy

git.iko.soy/elk

on master help sign in

Convert more libraries to the new doc format

2a18fb6Evan Czaplicki13 years ago

libraries/Graphics/Element.elm+62−48

compare with master

unifiedsplit

@@ -1,5 +1,8 @@

1−

2module Graphics.Element where

1module Graphics.Element where

2+{-| Graphical elements that snap together to build complex widgets and layouts.

3+Each Element is a rectangle with a known width and height, making them easy to

4+combine and position.

5+-}

4import open Basics

7import open Basics

5import Native.Utils

8import Native.Utils

@@ -22,19 +25,19 @@ type Properties = {

23type Element = { props : Properties, element : ElementPrim }

26type Element = { props : Properties, element : ElementPrim }

25−-- Get the width of an Element

28+{-| Get the width of an Element -}

26widthOf : Element -> Int

29widthOf : Element -> Int

27widthOf e = e.props.width

30widthOf e = e.props.width

29−-- Get the height of an Element

32+{-| Get the height of an Element -}

30heightOf : Element -> Int

33heightOf : Element -> Int

31heightOf e = e.props.height

34heightOf e = e.props.height

33−-- Get the width and height of an Element

36+{-| Get the width and height of an Element -}

34sizeOf : Element -> (Int,Int)

37sizeOf : Element -> (Int,Int)

35sizeOf e = (e.props.width, e.props.height)

38sizeOf e = (e.props.width, e.props.height)

37−-- Create an `Element` with a given width.

40+{-| Create an `Element` with a given width. -}

38width : Int -> Element -> Element

41width : Int -> Element -> Element

39width nw e =

42width nw e =

40 let p = e.props

43 let p = e.props

@@ -44,7 +47,7 @@ width nw e =

44 _ -> p

47 _ -> p

45 in { element=e.element, props={ props | width <- nw } }

48 in { element=e.element, props={ props | width <- nw } }

47−-- Create an `Element` with a given height.

50+{-| Create an `Element` with a given height. -}

48height : Int -> Element -> Element

51height : Int -> Element -> Element

49height nh e =

52height nh e =

50 let p = e.props

53 let p = e.props

@@ -53,30 +56,32 @@ height nh e =

53 _ -> p

56 _ -> p

54 in { element=e.element, props={ p | height <- nh} }

57 in { element=e.element, props={ p | height <- nh} }

56−-- Create an `Element` with a new width and height.

59+{-| Create an `Element` with a new width and height. -}

57size : Int -> Int -> Element -> Element

60size : Int -> Int -> Element -> Element

58size w h e = height h (width w e)

61size w h e = height h (width w e)

60−-- Create an `Element` with a given opacity. Opacity is a number between 0 and 1

63+{-| Create an `Element` with a given opacity. Opacity is a number between 0 and 1

61−-- where 0 means totally clear.

64+where 0 means totally clear.

65+-}

62opacity : Float -> Element -> Element

66opacity : Float -> Element -> Element

63opacity o e = let p = e.props in { element=e.element, props={p| opacity <- o} }

67opacity o e = let p = e.props in { element=e.element, props={p| opacity <- o} }

65−-- Create an `Element` with a given background color.

69+{-| Create an `Element` with a given background color. -}

66color : Color -> Element -> Element

70color : Color -> Element -> Element

67color c e = let p = e.props in

71color c e = let p = e.props in

68 { element = e.element

72 { element = e.element

69 , props = { p | color <- Just c}

73 , props = { p | color <- Just c}

70 }

74 }

72−-- Create an `Element` with a tag. This lets you link directly to it.

76+{-| Create an `Element` with a tag. This lets you link directly to it.

73−-- The element `(tag "all-about-badgers" thirdParagraph)` can be reached

77+The element `(tag "all-about-badgers" thirdParagraph)` can be reached

74−-- with a link lik this: `/facts-about-animals.elm#all-about-badgers`

78+with a link lik this: `/facts-about-animals.elm#all-about-badgers`

79+-}

75tag : String -> Element -> Element

80tag : String -> Element -> Element

76tag name e = let p = e.props in

81tag name e = let p = e.props in

77 { element=e.element, props={p | tag <- JS.fromString name} }

82 { element=e.element, props={p | tag <- JS.fromString name} }

79−-- Create an `Element` that is a hyper-link.

84+{-| Create an `Element` that is a hyper-link. -}

80link : String -> Element -> Element

85link : String -> Element -> Element

81link href e = let p = e.props in

86link href e = let p = e.props in

82 { element=e.element, props={p | href <- JS.fromString href} }

87 { element=e.element, props={p | href <- JS.fromString href} }

@@ -95,20 +100,22 @@ data ElementPrim

100

96data ImageStyle = Plain | Fitted | Cropped (Int,Int) | Tiled

101data ImageStyle = Plain | Fitted | Cropped (Int,Int) | Tiled

102

98−-- Create an image given a width, height, and image source.

103+{-| Create an image given a width, height, and image source. -}

99image : Int -> Int -> String -> Element

104image : Int -> Int -> String -> Element

100image w h src = newElement w h (Image Plain w h (JS.fromString src))

105image w h src = newElement w h (Image Plain w h (JS.fromString src))

101

106

102−-- Create a fitted image given a width, height, and image source.

107+{-| Create a fitted image given a width, height, and image source.

103−-- This will crop the picture to best fill the given dimensions.

108+This will crop the picture to best fill the given dimensions.

109+-}

104fittedImage : Int -> Int -> String -> Element

110fittedImage : Int -> Int -> String -> Element

105fittedImage w h src = newElement w h (Image Fitted w h (JS.fromString src))

111fittedImage w h src = newElement w h (Image Fitted w h (JS.fromString src))

106

112

107−-- Create a cropped image. Take a rectangle out of the picture starting

113+{-| Create a cropped image. Take a rectangle out of the picture starting

108−-- at the given top left coordinate. If you have a 140-by-140 image,

114+at the given top left coordinate. If you have a 140-by-140 image,

109−-- the following will cut a 100-by-100 square out of the middle of it.

115+the following will cut a 100-by-100 square out of the middle of it.

110−--

116+

111−-- croppedImage (20,20) 100 100 "yogi.jpg"

117+ croppedImage (20,20) 100 100 "yogi.jpg"

118+-}

112croppedImage : (Int,Int) -> Int -> Int -> String -> Element

119croppedImage : (Int,Int) -> Int -> Int -> String -> Element

113croppedImage pos w h src =

120croppedImage pos w h src =

114 newElement w h (Image (Cropped pos) w h (JS.fromString src))

121 newElement w h (Image (Cropped pos) w h (JS.fromString src))

@@ -121,31 +128,34 @@ data Three = P | Z | N

121data Pos = Absolute Int | Relative Float

128data Pos = Absolute Int | Relative Float

122type Position = { horizontal : Three, vertical : Three, x : Pos, y : Pos }

129type Position = { horizontal : Three, vertical : Three, x : Pos, y : Pos }

123

130

124−-- Put an element in a container. This lets you position the element really

131+{-| Put an element in a container. This lets you position the element really

125−-- easily, and there are tons of ways to set the `Position`.

132+easily, and there are tons of ways to set the `Position`.

126−-- To center `element` exactly in a 300-by-300 square you would say:

133+To center `element` exactly in a 300-by-300 square you would say:

127−--

134+

128−-- container 300 300 middle element

135+ container 300 300 middle element

129−--

136+

130−-- By setting the color of the container, you can create borders.

137+By setting the color of the container, you can create borders.

138+-}

131container : Int -> Int -> Position -> Element -> Element

139container : Int -> Int -> Position -> Element -> Element

132container w h pos e = newElement w h (Container pos e)

140container w h pos e = newElement w h (Container pos e)

133

141

134−-- Create an empty box. This is useful for getting your spacing right and

142+{-| Create an empty box. This is useful for getting your spacing right and

135−-- for making borders.

143+for making borders.

144+-}

136spacer : Int -> Int -> Element

145spacer : Int -> Int -> Element

137spacer w h = newElement w h Spacer

146spacer w h = newElement w h Spacer

138

147

140

149

141−-- Have a list of elements flow in a particular direction.

150+{-| Have a list of elements flow in a particular direction.

142−-- The `Direction` starts from the first element in the list.

151+The `Direction` starts from the first element in the list.

143−--

152+

144−-- flow right [a,b,c]

153+ flow right [a,b,c]

145−--

154+

146−-- +---+---+---+

155+ +---+---+---+

147−-- | a | b | c |

156+ | a | b | c |

148−-- +---+---+---+

157+ +---+---+---+

158+-}

149flow : Direction -> [Element] -> Element

159flow : Direction -> [Element] -> Element

150flow dir es =

160flow dir es =

151 let ws = List.map widthOf es

161 let ws = List.map widthOf es

@@ -161,33 +171,37 @@ flow dir es =

161 DIn -> newFlow (List.maximum ws) (List.maximum hs)

171 DIn -> newFlow (List.maximum ws) (List.maximum hs)

162 DOut -> newFlow (List.maximum ws) (List.maximum hs)

172 DOut -> newFlow (List.maximum ws) (List.maximum hs)

163

173

164−-- Stack elements vertically. To put `a` above `b` you would say:

174+{-| Stack elements vertically. To put `a` above `b` you would say:

165−--

175+

166−-- a `above` b

176+ a `above` b

177+-}

167above : Element -> Element -> Element

178above : Element -> Element -> Element

168above hi lo =

179above hi lo =

169 newElement (max (widthOf hi) (widthOf lo))

180 newElement (max (widthOf hi) (widthOf lo))

170 (heightOf hi + heightOf lo)

181 (heightOf hi + heightOf lo)

171 (Flow DDown [hi,lo])

182 (Flow DDown [hi,lo])

172

183

173−-- Stack elements vertically. To put `a` below `b` you would say:

184+{-| Stack elements vertically. To put `a` below `b` you would say:

174−--

185+

175−-- a `below` b

186+ a `below` b

187+-}

176below : Element -> Element -> Element

188below : Element -> Element -> Element

177below lo hi =

189below lo hi =

178 newElement (max (widthOf hi) (widthOf lo))

190 newElement (max (widthOf hi) (widthOf lo))

179 (heightOf hi + heightOf lo)

191 (heightOf hi + heightOf lo)

180 (Flow DDown [hi,lo])

192 (Flow DDown [hi,lo])

181

193

182−-- Put elements beside each other horizontally.

194+{-| Put elements beside each other horizontally.

195+-}

183beside : Element -> Element -> Element

196beside : Element -> Element -> Element

184beside lft rht =

197beside lft rht =

185 newElement (widthOf lft + widthOf rht)

198 newElement (widthOf lft + widthOf rht)

186 (max (heightOf lft) (heightOf rht))

199 (max (heightOf lft) (heightOf rht))

187 (Flow right [lft,rht])

200 (Flow right [lft,rht])

188

201

189−-- Layer elements on top of each other, starting from the bottom.

202+{-| Layer elements on top of each other, starting from the bottom.

190−-- `(layers == flow outward)`

203+`(layers == flow outward)`

204+-}

191layers : [Element] -> Element

205layers : [Element] -> Element

192layers es =

206layers es =

193 let ws = List.map widthOf es

207 let ws = List.map widthOf es

libraries/Signal.elm+1−3

@@ -1,4 +1,4 @@

1−

1+module Signal where

2{-| The library for general signal manipulation. Includes lift functions up to

3`lift8` and infix lift operators `<~` and `~`, combinations, filters, and

4past-dependence.

@@ -28,7 +28,6 @@ the [`Time`](/docs/Signal/Time.elm) library.

28@docs lift3, lift4, lift5, lift6, lift7, lift8

30-}

31−module Signal where

33import Native.Signal

32import Native.Signal

34import List (foldr)

33import List (foldr)

@@ -161,7 +160,6 @@ The following expressions are equivalent:

161 scene <~ Window.dimensions ~ Mouse.position

160 scene <~ Window.dimensions ~ Mouse.position

162 lift2 scene Window.dimensions Mouse.position

161 lift2 scene Window.dimensions Mouse.position

163-}

162-}

164−

165(~) : Signal (a -> b) -> Signal a -> Signal b

163(~) : Signal (a -> b) -> Signal a -> Signal b

166sf ~ s = Native.Signal.lift2 (\f x -> f x) sf s

164sf ~ s = Native.Signal.lift2 (\f x -> f x) sf s

167

165

libraries/Transform2D.elm+34−27

@@ -1,44 +1,51 @@

1−

2module Transform2D where

1module Transform2D where

2+{-| A library for performing [2D matrix transformations](http://en.wikipedia.org/wiki/Transformation_matrix#Affine_transformations).

3+It is used primarily with the `groupTransform` function from `Graphics.Collage` and

4+allows you to do things like rotation, scaling, translation, shearing, and reflection.

5+-}

4import Native.Transform2D

7import Native.Transform2D

6data Transform2D = Transform2D

9data Transform2D = Transform2D

8−-- Create an identity transform. Transforming by the identity does

11+{-| Create an identity transform. Transforming by the identity does

9−-- not change anything, but it can come in handy as a default or

12+not change anything, but it can come in handy as a default or

10−-- base case.

13+base case.

11−--

14+

12−-- / 1 0 \\

15+ / 1 0 \\

13−-- \\ 0 1 /

16+ \\ 0 1 /

17+-}

14identity : Transform2D

18identity : Transform2D

15identity = Native.Transform2D.identity

19identity = Native.Transform2D.identity

17−-- Creates an arbitrary transformation matrix. This lets you create scales,

21+{-| Creates a transformation matrix. This lets you create transforms

18−-- shears, reflections, translations, or any other 2D transform.

22+such as scales, shears, reflections, and translations.

19−--

23+

20−-- matrix a b c d dx dy

24+ matrix a b c d dx dy

21−--

25+

22−-- / a b \\

26+ / a b \\

23−-- \\ c d /

27+ \\ c d /

24−--

28+

25−-- And `dx` and `dy` are the translation values.

29+And `dx` and `dy` are the translation values.

30+-}

26matrix : Float -> Float -> Float -> Float -> Float -> Float -> Transform2D

31matrix : Float -> Float -> Float -> Float -> Float -> Float -> Transform2D

27matrix = Native.Transform2D.matrix

32matrix = Native.Transform2D.matrix

29−-- Creates a [rotation matrix](http://en.wikipedia.org/wiki/Rotation_matrix).

34+{-| Creates a [rotation matrix](http://en.wikipedia.org/wiki/Rotation_matrix).

30−-- Given an angle t, it creates a counterclockwise rotation matrix:

35+Given an angle t, it creates a counterclockwise rotation matrix:

31−--

36+

32−-- / cos t -sin t \\

37+ / cos t -sin t \\

33−-- \\ sin t cos t /

38+ \\ sin t cos t /

39+-}

34rotation : Float -> Transform2D

40rotation : Float -> Transform2D

35rotation = Native.Transform2D.rotation

41rotation = Native.Transform2D.rotation

37−-- Multiplies two transforms together:

43+{-| Multiplies two transforms together:

38−--

44+

39−-- multiply a b

45+ multiply a b

40−--

46+

41−-- / a11 a12 \\ . / b11 b12 \\

47+ / a11 a12 \\ . / b11 b12 \\

42−-- \\ a21 a22 / \\ b21 b22 /

48+ \\ a21 a22 / \\ b21 b22 /

49+-}

43multiply : Transform2D -> Transform2D -> Transform2D

50multiply : Transform2D -> Transform2D -> Transform2D

44multiply = Native.Transform2D.multiply

51multiply = Native.Transform2D.multiply