[{"name":"WebGL.Shape2d","comment":"\n\n\n# Application\n\n@docs view, update, Model\n\n\n# Move Shapes\n\n@docs move, setZ\n\n\n# Customize Shapes\n\n@docs rotate, fade, scale\n\n\n# Texture Manager\n\n@docs TextureManager, textureManager\n\n\n# Computer\n\n@docs Computer\n\n\n## Time\n\n@docs Time, tick\n\n\n## Mouse\n\n@docs Mouse, initMouse, mouseSubscription\n\n\n## Screen\n\n@docs Screen, toScreen, resize, requestScreen\n\n\n## Keyboard\n\n@docs Keyboard, initKeyboard, keyboardSubscription, toX, toY, toXY\n\n\n# Colors\n\n@docs Color, rgb\n\n","unions":[],"aliases":[{"name":"Color","comment":" Represents a color.\n\nThe colors below, like `red` and `green`, come from the [Tango palette][tango].\nIt provides a bunch of aesthetically reasonable colors. Each color comes with a\nlight and dark version, so you always get a set like `lightYellow`, `yellow`,\nand `darkYellow`.\n\n[tango]: https://en.wikipedia.org/wiki/Tango_Desktop_Project\n\n","args":[],"type":"Math.Vector3.Vec3"},{"name":"Computer","comment":" When writing a [`game`](#game), you can look up all sorts of information\nabout your computer:\n\n  - [`Mouse`](#Mouse) - Where is the mouse right now?\n  - [`Keyboard`](#Keyboard) - Are the arrow keys down?\n  - [`Screen`](#Screen) - How wide is the screen?\n  - [`Time`](#Time) - What time is it right now?\n\nSo you can use expressions like `computer.mouse.x` and `computer.keyboard.enter`\nin games where you want some mouse or keyboard interaction.\n\n","args":[],"type":"{ mouse : WebGL.Shape2d.Mouse, keyboard : WebGL.Shape2d.Keyboard, screen : WebGL.Shape2d.Screen, time : WebGL.Shape2d.Time }"},{"name":"Keyboard","comment":" Figure out what is going on with the keyboard.\n\nIf someone is pressing the UP and RIGHT arrows, you will see a value like this:\n\n    { up = True\n    , down = False\n    , left = False\n    , right = True\n    , space = False\n    , enter = False\n    , shift = False\n    , backspace = False\n    , keys = Set.fromList [ \"ArrowUp\", \"ArrowRight\" ]\n    }\n\nSo if you want to move a character based on arrows, you could write an update\nlike this:\n\n    update computer y =\n        if computer.keyboard.up then\n            y + 1\n\n        else\n            y\n\nCheck out [`toX`](#toX) and [`toY`](#toY) which make this even easier!\n\n**Note:** The `keys` set will be filled with the `code` of all keys which are\ndown right now. So you will see things like `\"KeyA\"`, `\"KeyB\"`, `\"KeyC\"`, `\"Digit1\"`, `\"Digit2\"`,\n`\"Space\"`, and `\"ControlLeft\"` in there.\nFor example, the code is `\"KeyQ\"` for the `Q` key on a QWERTY layout keyboard,\nbut the same code value also represents the `'` key on Dvorak keyboards and the `A` key on AZERTY keyboards.\n\nCheck out [this list][list] to see the\nnames used for all the different keys! From there, you can use\n[`Set.member`][member] to check for whichever key you want. E.g.\n`Set.member \"Control\" computer.keyboard.keys`.\n\n[list]: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code/code_values\n[member]: /packages/elm/core/latest/Set#member\n\n","args":[],"type":"{ up : Basics.Bool, down : Basics.Bool, left : Basics.Bool, right : Basics.Bool, space : Basics.Bool, enter : Basics.Bool, shift : Basics.Bool, backspace : Basics.Bool, keys : Set.Set String.String }"},{"name":"Model","comment":" ","args":["screen","a"],"type":"{ a | screen : { screen | width : WebGL.Shape2d.Render.Width, height : WebGL.Shape2d.Render.Height }, textures : WebGL.Shape2d.TextureManager, entities : List.List WebGL.Entity }"},{"name":"Mouse","comment":" Figure out what is going on with the mouse.\n\nYou could draw a circle around the mouse with a program like this:\n\n    import Playground exposing (..)\n\n    main =\n        game view update 0\n\n    view computer memory =\n        [ circle yellow 40\n            |> moveX computer.mouse.x\n            |> moveY computer.mouse.y\n        ]\n\n    update computer memory =\n        memory\n\nYou could also use `computer.mouse.down` to change the color of the circle\nwhile the mouse button is down.\n\n","args":[],"type":"{ x : Basics.Float, y : Basics.Float, down : Basics.Bool }"},{"name":"Screen","comment":" Get the dimensions of the screen. If the screen is 800 by 600, you will see\na value like this:\n\n    { width = 800\n    , height = 600\n    , top = 300\n    , left = -400\n    , right = 400\n    , bottom = -300\n    }\n\nThis can be nice when used with [`moveY`](#moveY) if you want to put something\non the bottom of the screen, no matter the dimensions.\n\n","args":[],"type":"{ width : Basics.Float, height : Basics.Float, top : Basics.Float, left : Basics.Float, right : Basics.Float, bottom : Basics.Float }"},{"name":"TextureManager","comment":" ","args":[],"type":"WebGL.Shape2d.TexturedShape.TextureLoader String.String"},{"name":"Time","comment":" The current time.\n\nHelpful when making an [`animation`](#animation) with functions like\n[`spin`](#spin), [`wave`](#wave), and [`zigzag`](#zigzag).\n\n`Time` is defined as:\n\n    type alias Time =\n        { now : Int\n        , delta : Int\n        }\n\nWhere `now` is the number of milliseconds since 1970 January 1 at 00:00:00 UTC,\nand `delta` is the number of milliseconds since the previous animation frame.\n\n","args":[],"type":"{ now : Basics.Int, delta : Basics.Int }"}],"values":[{"name":"fade","comment":" Fade a shape. This lets you make shapes see-through or even completely\ninvisible. Here is a shape that fades in and out:\n\n    import Playground exposing (..)\n\n    main =\n        animation view\n\n    view time =\n        [ square orange 30\n        , square blue 200\n            |> fade (zigzag 0 1 3 time)\n        ]\n\nThe Float has to be between `0` and `1`, where `0` is totally transparent\nand `1` is completely solid.\n\n","type":"Basics.Float -> WebGL.Shape2d.Shape.Shape a -> WebGL.Shape2d.Shape.Shape a"},{"name":"initKeyboard","comment":" ","type":"WebGL.Shape2d.Keyboard"},{"name":"initMouse","comment":" ","type":"WebGL.Shape2d.Mouse"},{"name":"keyboardSubscription","comment":" ","type":"Platform.Sub.Sub (WebGL.Shape2d.Keyboard -> WebGL.Shape2d.Keyboard)"},{"name":"mouseSubscription","comment":" ","type":"Platform.Sub.Sub (WebGL.Shape2d.Mouse -> WebGL.Shape2d.Mouse)"},{"name":"move","comment":" Move a shape by some Float of pixels:\n\n    import Playground exposing (..)\n\n    main =\n        picture\n            [ square red 100\n                |> move -60 60\n            , square yellow 100\n                |> move 60 60\n            , square green 100\n                |> move 60 -60\n            , square blue 100\n                |> move -60 -60\n            ]\n\n","type":"Basics.Float -> Basics.Float -> WebGL.Shape2d.Shape.Shape a -> WebGL.Shape2d.Shape.Shape a"},{"name":"requestScreen","comment":" ","type":"Platform.Cmd.Cmd ({ b | screen : WebGL.Shape2d.Screen } -> { b | screen : WebGL.Shape2d.Screen })"},{"name":"resize","comment":" ","type":"Platform.Sub.Sub WebGL.Shape2d.Screen"},{"name":"rgb","comment":" RGB stands for Red-Green-Blue. With these three parts, you can create any\ncolor you want. For example:\n\n    brightBlue =\n        rgb 18 147 216\n\n    brightGreen =\n        rgb 119 244 8\n\n    brightPurple =\n        rgb 94 28 221\n\nEach Float needs to be between 0 and 255.\n\nIt can be hard to figure out what Floats to pick, so try using a color picker\nlike [paletton] to find colors that look nice together. Once you find nice\ncolors, click on the color previews to get their RGB values.\n\n[paletton]: http://paletton.com/\n\n","type":"Basics.Float -> Basics.Float -> Basics.Float -> WebGL.Shape2d.Color"},{"name":"rotate","comment":" Rotate shapes in degrees.\n\n    import Playground exposing (..)\n\n    main =\n        picture\n            [ words black \"These words are tilted!\"\n                |> rotate 10\n            ]\n\nThe degrees go _counter-clockwise_ to match the direction of the\n[unit circle](https://en.wikipedia.org/wiki/Unit_circle).\n\n","type":"Basics.Float -> WebGL.Shape2d.Shape.Shape a -> WebGL.Shape2d.Shape.Shape a"},{"name":"scale","comment":" Make a shape bigger or smaller. So if you wanted some [`words`](#words) to\nbe larger, you could say:\n\n    import Playground exposing (..)\n\n    main =\n        picture\n            [ words black \"Hello, nice to see you!\"\n                |> scale 3 3\n            ]\n\n","type":"Basics.Float -> Basics.Float -> WebGL.Shape2d.Shape.Shape a -> WebGL.Shape2d.Shape.Shape a"},{"name":"setZ","comment":" The `setZ` specifies the stack order of a shapes.\n\nA shape with greater stack order is always in front of an element with a lower stack order.\n\n**Note:** be aware z-indexing will mess up semi-transparent shapes,\nif you need both (z ordering and semi-transparency) better sort shapes.\n\n","type":"Basics.Int -> WebGL.Shape2d.Shape.Shape a -> WebGL.Shape2d.Shape.Shape a"},{"name":"textureManager","comment":" ","type":"WebGL.Shape2d.TextureManager"},{"name":"tick","comment":" ","type":"Platform.Sub.Sub (WebGL.Shape2d.Time -> WebGL.Shape2d.Time)"},{"name":"toScreen","comment":" ","type":"Basics.Float -> Basics.Float -> WebGL.Shape2d.Screen"},{"name":"toX","comment":" Turn the LEFT and RIGHT arrows into a Float.\n\n    toX { left = False, right = False, ... } == 0\n    toX { left = True , right = False, ... } == -1\n    toX { left = False, right = True , ... } == 1\n    toX { left = True , right = True , ... } == 0\n\nSo to make a square move left and right based on the arrow keys, we could say:\n\n    import Playground exposing (..)\n\n    main =\n        game view update 0\n\n    view computer x =\n        [ square green 40\n            |> moveX x\n        ]\n\n    update computer x =\n        x + toX computer.keyboard\n\n","type":"WebGL.Shape2d.Keyboard -> Basics.Float"},{"name":"toXY","comment":" If you just use `toX` and `toY`, you will move diagonal too fast. You will go\nright at 1 pixel per update, but you will go up/right at 1.41421 pixels per\nupdate.\n\nSo `toXY` turns the arrow keys into an `(x,y)` pair such that the distance is\nnormalized:\n\n    toXY { up = True , down = False, left = False, right = False, ... } == (1, 0)\n    toXY { up = True , down = False, left = False, right = True , ... } == (0.707, 0.707)\n    toXY { up = False, down = False, left = False, right = True , ... } == (0, 1)\n\nNow when you go up/right, you are still going 1 pixel per update.\n\n    import Playground exposing (..)\n\n    main =\n        game view update ( 0, 0 )\n\n    view computer ( x, y ) =\n        [ square green 40\n            |> move x y\n        ]\n\n    update computer ( x, y ) =\n        let\n            ( dx, dy ) =\n                toXY computer.keyboard\n        in\n        ( x + dx, y + dy )\n\n","type":"WebGL.Shape2d.Keyboard -> ( Basics.Float, Basics.Float )"},{"name":"toY","comment":" Turn the UP and DOWN arrows into a Float.\n\n    toY { up = False, down = False, ... } == 0\n    toY { up = True , down = False, ... } == 1\n    toY { up = False, down = True , ... } == -1\n    toY { up = True , down = True , ... } == 0\n\nThis can be used to move characters around in games just like [`toX`](#toX):\n\n    import Playground exposing (..)\n\n    main =\n        game view update ( 0, 0 )\n\n    view computer ( x, y ) =\n        [ square blue 40\n            |> move x y\n        ]\n\n    update computer ( x, y ) =\n        ( x + toX computer.keyboard\n        , y + toY computer.keyboard\n        )\n\n","type":"WebGL.Shape2d.Keyboard -> Basics.Float"},{"name":"update","comment":" ","type":"(WebGL.Shape2d.Model screen a -> List.List (WebGL.Shape2d.TexturedShape.TexturedShape String.String)) -> WebGL.Shape2d.Message screen a -> WebGL.Shape2d.Model screen a -> ( WebGL.Shape2d.Model screen a, Platform.Cmd.Cmd (WebGL.Shape2d.Message screen a) )"},{"name":"view","comment":" Create WebGL canvas\n","type":"{ a | screen : { screen | width : WebGL.Shape2d.Render.Width, height : WebGL.Shape2d.Render.Height }, entities : List.List WebGL.Entity } -> Html.Html msg"}],"binops":[]},{"name":"WebGL.Shape2d.Render","comment":"\n\n\n# Basic Shapes\n\n@docs circle, image, ngon, rect, triangle\n\n\n# With Textures\n\n@docs tile, glyph, msdf, sprite, tilemap\n\n\n# Types\n\n@docs Opacity, Render, ScaleRotateSkew, Translate, Z, Height, Width\n\n\n# Settings\n\n@docs defaultEntitySettings\n\n","unions":[],"aliases":[{"name":"Height","comment":" Alias to Height property\n","args":[],"type":"Basics.Float"},{"name":"Opacity","comment":" Alias to Opacity property\n","args":[],"type":"Basics.Float"},{"name":"Render","comment":" Render is part of `Shape` that converts `Shape` into `Entity`\n\n    rect : Vec3 -> Render\n    rect color uP uT z opacity =\n        WebGL.entityWith\n            entitySettings\n            Shader.vertNone\n            Shader.fragFill\n            Shader.mesh\n            { color = setAlpha color opacity\n            , uP = uP\n            , uT = uT\n            , z = z\n            }\n\n","args":[],"type":"WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"ScaleRotateSkew","comment":" Vec4 representing part of transform matrix\n\n    | x y 0 |\n    | z w 0 |\n    | 0 0 1 |\n\n","args":[],"type":"Math.Vector4.Vec4"},{"name":"Translate","comment":" Vec2 representing part of transform matrix\n\n    | 1 0 x |\n    | 0 1 y |\n    | 0 0 1 |\n\n","args":[],"type":"Math.Vector2.Vec2"},{"name":"Width","comment":" Alias to Width property\n","args":[],"type":"Basics.Float"},{"name":"Z","comment":" Css line `z-index` that is passed to the Render\n","args":[],"type":"Basics.Float"}],"values":[{"name":"circle","comment":" Render circle or ellipse\n\n    circle : Vec3 -> Float -> SolidShape\n    circle color r =\n        Render.circle color\n            |> SolidShape.shape (r * 2) (r * 2)\n\n    shape =\n        circle (rgb 255 0 0) 50\n\n","type":"Math.Vector3.Vec3 -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"defaultEntitySettings","comment":" Make me optional and pass it to the each `Render` function\n","type":"List.List WebGL.Settings.Setting"},{"name":"glyph","comment":" Render tile from symmetrical tileset.\n\nSame as [`tile`](#tile), but with color blending.\n\nUsed to draw text (font glyph)\n\n","type":"WebGL.Texture.Texture -> Math.Vector2.Vec2 -> Math.Vector2.Vec2 -> Math.Vector3.Vec3 -> Basics.Int -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"image","comment":" Render an image\n\n    image : Float -> Float -> key -> TexturedShape key\n    image width height =\n        AutoTextures.textured\n            (\\t ->\n                t\n                    |> Texture.size\n                    |> (\\( w, h ) -> Math.Vector2.vec2 (toFloat w) (toFloat h))\n                    |> Render.image t\n                    |> AutoTextures.shape width height\n            )\n\n    shape =\n        image 200 200 \"image.png\"\n\n","type":"WebGL.Texture.Texture -> Math.Vector2.Vec2 -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"msdf","comment":" This is a utility for generating signed distance fields from vector shapes and font glyphs,\nwhich serve as a texture representation that can be used in real-time graphics to efficiently reproduce said shapes.\nAlthough it can also be used to generate conventional signed distance fields\nbest known from this Valve paper and pseudo-distance fields,\nits primary purpose is to generate multi-channel distance fields, using a method I have developed.\nUnlike monochrome distance fields,\nthey have the ability to reproduce sharp corners almost perfectly by utilizing all three color channels.\n","type":"Basics.Float -> WebGL.Texture.Texture -> Math.Vector2.Vec2 -> Math.Vector3.Vec3 -> Math.Vector4.Vec4 -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"ngon","comment":" Render regular polygon\n\n    hexagon : Vec3 -> Float -> SolidShape\n    hexagon color r =\n        Render.ngon 6 color\n            |> SolidShape.shape (r * 2) (r * 2)\n\n    shape =\n        hexagon (rgb 255 0 0) 50\n\n","type":"Basics.Float -> Math.Vector3.Vec3 -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"rect","comment":" Rectangle render\n\n    rectangle : Vec3 -> Float -> Float -> SolidShape\n    rectangle color w h =\n        Render.rect color\n            |> SolidShape.shape w h\n\n    shape =\n        rectangle (rgb 255 0 0) 20 40\n\n","type":"Math.Vector3.Vec3 -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"sprite","comment":" Show sprite from a sprite sheet.\n\nSprites can be placed anywhere in the sprite sheet and each can have different sizes.\n\nExample: this draws a sprite of 16x24 pixels taking it from a sprite sheet,\nstarting at position `16,0` up to _including_ pixels at `31,23`\n\n    sprite \"sprites.png\" { xmin = 16, xmax = 31, ymin = 0, ymax = 23 }\n\n","type":"WebGL.Texture.Texture -> Math.Vector2.Vec2 -> Math.Vector4.Vec4 -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"tile","comment":" Show tile from a tileset.\n\nAll tiles are fixed size and placed into a grid, where the _first tile has a 0 index_\nincreasing left to right and top to bottom.\n\nExample: having a 3x3 tileset with each tile of 16x24 pixels\n\n    | 0 1 2 |\n    | 3 4 5 |\n    | 6 7 8 |\n\nthis draws the first tile of the second row\n\n    tile : Float -> Float -> key -> Int -> TexturedShape key\n    tile tileW tileH tileset index =\n        tileset\n            |> AutoTextures.textured\n                (\\t ->\n                    Render.tile t (vec2 tileW tileH) (Util.size t) index\n                        |> AutoTextures.shape tileW tileH\n                )\n\n    shape =\n        tile 16 24 \"sprites.png\" 3\n\n","type":"WebGL.Texture.Texture -> Math.Vector2.Vec2 -> Math.Vector2.Vec2 -> Basics.Int -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"tilemap","comment":" Show tilemap from a tileset and a corresponding lookup table stored as a texture.\n\n    tilemap : Float -> Float -> key -> key -> TexturedShape key\n    tilemap tileW tileH tileset lut =\n        AutoTextures.textured2\n            (\\t1 t2 ->\n                let\n                    ( w2, h2 ) =\n                        Texture.size t2\n                            |> Tuple.mapBoth (toFloat >> (*) tileW) (toFloat >> (*) tileH)\n                in\n                Render.tilemap tileW tileH t1 t2\n                    |> AutoTextures.shape w2 h2\n            )\n            tileset\n            lut\n\n","type":"Basics.Float -> Basics.Float -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"},{"name":"triangle","comment":" Render triangle with free defined vertexes\n\n    triangle : Vec3 -> ( Vec2, Vec2, Vec2 ) -> SolidShape\n    triangle color data =\n        Render.triangle color data\n            |> SolidShape.shape 1 1\n\n    shape =\n        triangle (rgb 41 239 41)\n            ( vec2 -100 0, vec2 0 100, vec2 100 0 )\n\n","type":"Math.Vector3.Vec3 -> ( Math.Vector2.Vec2, Math.Vector2.Vec2, Math.Vector2.Vec2 ) -> WebGL.Shape2d.Render.Translate -> WebGL.Shape2d.Render.ScaleRotateSkew -> WebGL.Shape2d.Render.Z -> WebGL.Shape2d.Render.Opacity -> WebGL.Entity"}],"binops":[]},{"name":"WebGL.Shape2d.Shader","comment":"\n\n\n# Vertex Shaders\n\n@docs vertNone, vertRect, vertImage, vertTriangle, vertTile, vertSprite\n\n\n# Fragment Shaders\n\n@docs fragFill, fragCircle, fragNgon, fragImage, fragTilemap, fragGlyph, fragMSDF\n\n\n# Mesh\n\n@docs mesh, meshTriangle\n\n","unions":[],"aliases":[],"values":[{"name":"fragCircle","comment":" ","type":"WebGL.Shader a { b | color : Math.Vector4.Vec4 } { uv : Math.Vector2.Vec2 }"},{"name":"fragFill","comment":" ","type":"WebGL.Shader a { b | color : Math.Vector4.Vec4 } {}"},{"name":"fragGlyph","comment":" ","type":"WebGL.Shader a { b | color : Math.Vector4.Vec4, uImg : WebGL.Texture.Texture, uImgSize : Math.Vector2.Vec2 } { uv : Math.Vector2.Vec2 }"},{"name":"fragImage","comment":" ","type":"WebGL.Shader a { b | uImg : WebGL.Texture.Texture, uImgSize : Math.Vector2.Vec2, uA : Basics.Float } { uv : Math.Vector2.Vec2 }"},{"name":"fragMSDF","comment":" ","type":"WebGL.Shader a { b | aa : Basics.Float, color : Math.Vector4.Vec4, uImg : WebGL.Texture.Texture } { uv : Math.Vector2.Vec2 }"},{"name":"fragNgon","comment":" ","type":"WebGL.Shader a { b | color : Math.Vector4.Vec4, n : Basics.Float } { uv : Math.Vector2.Vec2 }"},{"name":"fragTilemap","comment":" ","type":"WebGL.Shader a { b | uA : Basics.Float, uAtlas : WebGL.Texture.Texture, uAtlasSize : Math.Vector2.Vec2, uLut : WebGL.Texture.Texture, uLutSize : Math.Vector2.Vec2, uTileSize : Math.Vector2.Vec2 } { uv : Math.Vector2.Vec2 }"},{"name":"mesh","comment":" ","type":"WebGL.Mesh { aP : Math.Vector2.Vec2 }"},{"name":"meshTriangle","comment":" ","type":"WebGL.Mesh { i : Basics.Float }"},{"name":"vertImage","comment":" ","type":"WebGL.Shader { a | aP : Math.Vector2.Vec2 } { b | uP : Math.Vector2.Vec2, uT : Math.Vector4.Vec4, z : Basics.Float } { uv : Math.Vector2.Vec2 }"},{"name":"vertNone","comment":" ","type":"WebGL.Shader { a | aP : Math.Vector2.Vec2 } { b | uP : Math.Vector2.Vec2, uT : Math.Vector4.Vec4, z : Basics.Float } {}"},{"name":"vertRect","comment":" ","type":"WebGL.Shader { a | aP : Math.Vector2.Vec2 } { b | uP : Math.Vector2.Vec2, uT : Math.Vector4.Vec4, z : Basics.Float } { uv : Math.Vector2.Vec2 }"},{"name":"vertSprite","comment":" ","type":"WebGL.Shader { a | aP : Math.Vector2.Vec2 } { b | uP : Math.Vector2.Vec2, uT : Math.Vector4.Vec4, uUV : Math.Vector4.Vec4, z : Basics.Float } { uv : Math.Vector2.Vec2 }"},{"name":"vertTile","comment":" ","type":"WebGL.Shader { a | aP : Math.Vector2.Vec2 } { b | uImgSize : Math.Vector2.Vec2, uI : Basics.Int, spriteSize : Math.Vector2.Vec2, uP : Math.Vector2.Vec2, uT : Math.Vector4.Vec4, z : Basics.Float } { uv : Math.Vector2.Vec2 }"},{"name":"vertTriangle","comment":" ","type":"WebGL.Shader { a | i : Basics.Float } { b | uP : Math.Vector2.Vec2, uT : Math.Vector4.Vec4, z : Basics.Float, vert0 : Math.Vector2.Vec2, vert1 : Math.Vector2.Vec2, vert2 : Math.Vector2.Vec2 } {}"}],"binops":[]},{"name":"WebGL.Shape2d.Shape","comment":"\n\n\n# Shape\n\n@docs Shape, create, ShapeData, GroupData, TexturedData\n\n","unions":[],"aliases":[{"name":"GroupData","comment":" ","args":["shape"],"type":"List.List shape"},{"name":"Shape","comment":" Shapes help you make a game elements.\n\nRead on to see examples of [`circle`](#circle), [`rectangle`](#rectangle),\n[`words`](#words), [`image`](#image), and many more!\n\n","args":["a"],"type":"{ x : Basics.Float, y : Basics.Float, z : Basics.Float, a : Basics.Float, sx : Basics.Float, sy : Basics.Float, o : Basics.Float, data : a }"},{"name":"ShapeData","comment":" ","args":["render"],"type":"{ width : Basics.Float, height : Basics.Float, render : render }"},{"name":"TexturedData","comment":" ","args":["key","shape"],"type":"{ src : key, fn : WebGL.Texture.Texture -> shape }"}],"values":[{"name":"create","comment":" Helper function to create [`Shape`](#Shape) from render\n","type":"a -> WebGL.Shape2d.Shape.Shape a"}],"binops":[]},{"name":"WebGL.Shape2d.SolidShape","comment":"\n\n\n# Texture-less converter\n\n@docs toEntities\n@docs shape, group, SolidShape, Form\n\n","unions":[{"name":"Form","comment":" ","args":[],"cases":[["Form",["WebGL.Shape2d.Shape.ShapeData WebGL.Shape2d.Render.Render"]],["Group",["WebGL.Shape2d.Shape.GroupData (WebGL.Shape2d.Shape.Shape WebGL.Shape2d.SolidShape.Form)"]]]}],"aliases":[{"name":"SolidShape","comment":" ","args":[],"type":"WebGL.Shape2d.Shape.Shape WebGL.Shape2d.SolidShape.Form"}],"values":[{"name":"group","comment":" Put shapes together so you can [`move`](WebGL-Game2d#move) and [`rotate`](WebGL-Game2d#rotate)\nthem as a group. Maybe you want to put a bunch of stars in the sky:\n\n    shapes =\n        [ star\n            |> move 100 100\n            |> rotate 5\n        , star\n            |> move -120 40\n            |> rotate 20\n        , star\n            |> move 80 -150\n            |> rotate 32\n        , star\n            |> move -90 -30\n            |> rotate -16\n        ]\n\n    star =\n        group\n            [ triangle yellow 20\n            , triangle yellow 20\n                |> rotate 180\n            ]\n\n","type":"List.List WebGL.Shape2d.SolidShape.SolidShape -> WebGL.Shape2d.SolidShape.SolidShape"},{"name":"shape","comment":" Create [`SolidShape`](#SolidShape) from [`Render`](WebGL-Game2d-Render#Render)\n\n    rectangle : Color -> Width -> Height -> SolidShape\n    rectangle color w h =\n        Render.rect color |> SolidShape.shape w h\n\n","type":"WebGL.Shape2d.Render.Width -> WebGL.Shape2d.Render.Height -> WebGL.Shape2d.Render.Render -> WebGL.Shape2d.SolidShape.SolidShape"},{"name":"toEntities","comment":" Converts [`List SolidShape`](#SolidShape) to WebGL entities\n\n    main : Program () () a\n    main =\n        Browser.sandbox\n            { init = ()\n            , view = view\n            , update = \\_ model -> model\n            }\n\n    view : model -> Html msg\n    view _ =\n        let\n            screen =\n                Game2d.toScreen 100 100\n        in\n        { entities =\n            [ rectangle (rgb 239 41 41) 20 20 ]\n                |> SolidShape.toEntities screen\n        , screen = screen\n        }\n            |> Game2d.view\n\n","type":"{ a | width : WebGL.Shape2d.Render.Width, height : WebGL.Shape2d.Render.Height } -> List.List WebGL.Shape2d.SolidShape.SolidShape -> List.List WebGL.Entity"}],"binops":[]},{"name":"WebGL.Shape2d.TexturedShape","comment":"\n\n\n# Shapes with textures\n\nSame as `ShapeSolid` but also can render shapes that needs textures\n\n@docs toEntities, shape, group, textured, textured2, textured3, textured4, textured5, TexturedShape, Form\n\n\n# Textures\n\n@docs TextureLoader\n\n","unions":[{"name":"Form","comment":" ","args":["key"],"cases":[["Form",["WebGL.Shape2d.Shape.ShapeData WebGL.Shape2d.Render.Render"]],["Group",["WebGL.Shape2d.Shape.GroupData (WebGL.Shape2d.Shape.Shape (WebGL.Shape2d.TexturedShape.Form key))"]],["Textured",["WebGL.Shape2d.Shape.TexturedData key (WebGL.Shape2d.TexturedShape.TexturedShape key)"]]]},{"name":"TextureLoader","comment":" ","args":["key"],"cases":[["TextureLoader",["{ get : key -> Maybe.Maybe WebGL.Texture.Texture, missing : key -> WebGL.Shape2d.TexturedShape.TextureLoader key, extract : () -> ( WebGL.Shape2d.TexturedShape.TextureLoader key, List.List key ), insert : key -> WebGL.Texture.Texture -> WebGL.Shape2d.TexturedShape.TextureLoader key }"]]]}],"aliases":[{"name":"TexturedShape","comment":" ","args":["key"],"type":"WebGL.Shape2d.Shape.Shape (WebGL.Shape2d.TexturedShape.Form key)"}],"values":[{"name":"group","comment":" Put shapes together so you can [`move`](WebGL-Game2d#move) and [`rotate`](WebGL-Game2d#rotate)\nthem as a group. Maybe you want to put a bunch of stars in the sky:\n\n    shapes =\n        [ star\n            |> move 100 100\n            |> rotate 5\n        , star\n            |> move -120 40\n            |> rotate 20\n        , star\n            |> move 80 -150\n            |> rotate 32\n        , star\n            |> move -90 -30\n            |> rotate -16\n        ]\n\n    star =\n        group\n            [ triangle yellow 20\n            , triangle yellow 20\n                |> rotate 180\n            ]\n\n","type":"List.List (WebGL.Shape2d.TexturedShape.TexturedShape key) -> WebGL.Shape2d.TexturedShape.TexturedShape key"},{"name":"shape","comment":" Create [`TexturedShape`](#TexturedShape) from [`Render`](WebGL-Game2d-Render#Render)\n\n    rectangle : Color -> Width -> Height -> TexturedShape\n    rectangle color w h =\n        Render.rect color |> TexturedShape.shape w h\n\n","type":"WebGL.Shape2d.Render.Width -> WebGL.Shape2d.Render.Height -> WebGL.Shape2d.Render.Render -> WebGL.Shape2d.TexturedShape.TexturedShape texture"},{"name":"textured","comment":" Create [`TexturedShape`](#TexturedShape) that depend on `texture`.\n","type":"(WebGL.Texture.Texture -> WebGL.Shape2d.TexturedShape.TexturedShape texture) -> texture -> WebGL.Shape2d.TexturedShape.TexturedShape texture"},{"name":"textured2","comment":" ","type":"(WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Shape2d.TexturedShape.TexturedShape key) -> key -> key -> WebGL.Shape2d.TexturedShape.TexturedShape key"},{"name":"textured3","comment":" ","type":"(WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Shape2d.TexturedShape.TexturedShape key) -> key -> key -> key -> WebGL.Shape2d.TexturedShape.TexturedShape key"},{"name":"textured4","comment":" ","type":"(WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Shape2d.TexturedShape.TexturedShape key) -> key -> key -> key -> key -> WebGL.Shape2d.TexturedShape.TexturedShape key"},{"name":"textured5","comment":" ","type":"(WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Texture.Texture -> WebGL.Shape2d.TexturedShape.TexturedShape key) -> key -> key -> key -> key -> key -> WebGL.Shape2d.TexturedShape.TexturedShape key"},{"name":"toEntities","comment":" Converts [`List Shape`](#Shape) to WebGL entities\n\n    import WebGL\n    import WebGL.Game2d.TexturedShape exposing (toEntities)\n\n    rectangle =\n        ...\n\n    textures =\n        ...\n\n    screen =\n        { width = 100, height = 100 }\n\n    main =\n        toEntities screen textures [ rectangle red 30 30 ]\n            |> Webgl.toHtml [ width 100, height 100 ]\n\n","type":"{ a | width : WebGL.Shape2d.Render.Width, height : WebGL.Shape2d.Render.Height } -> WebGL.Shape2d.TexturedShape.TextureLoader key -> List.List (WebGL.Shape2d.TexturedShape.TexturedShape key) -> ( List.List WebGL.Entity, WebGL.Shape2d.TexturedShape.TextureLoader key )"}],"binops":[]},{"name":"WebGL.Shape2d.Util","comment":"\n\n@docs size\n\n\n# Text printing\n\n@docs tileFont, msdfFont\n\n","unions":[],"aliases":[],"values":[{"name":"msdfFont","comment":" Multi-channel signed distance field atlas generator\n\n<https://github.com/Chlumsky/msdf-atlas-gen>\n\n","type":"Basics.Float -> { src : key, getIndex : Char.Char -> Maybe.Maybe { c | uv : Math.Vector4.Vec4, w : WebGL.Shape2d.Render.Width, h : WebGL.Shape2d.Render.Height, x : Basics.Float, y : Basics.Float } } -> Math.Vector3.Vec3 -> String.String -> WebGL.Shape2d.TexturedShape.TexturedShape key"},{"name":"size","comment":" Get texture size as Math.Vec2\n","type":"WebGL.Texture.Texture -> Math.Vector2.Vec2"},{"name":"tileFont","comment":" Create text from individual tiles\n","type":"{ charW : Basics.Float, charH : Basics.Float, src : key, getIndex : Char.Char -> Basics.Int } -> Math.Vector3.Vec3 -> String.String -> WebGL.Shape2d.TexturedShape.TexturedShape key"}],"binops":[]}]