2module Graphics.Input where
4import Signal (lift,dropRepeats)
5import Native.Graphics.Input as N
10-- Create a group of buttons.
12-- * The first argument is the default value of the `events` signal.
13-- * The `events` signal represents all of the activity in this group
15-- * The `button` function creates a button
16-- with the given name, like “Submit” or “Cancel”.
17-- The `a` value is sent to `events` whenever the button is pressed.
18buttons : a -> { events : Signal a,
19 button : a -> String -> Element }
21-- Create a button with a given label. The result is an `Element` and
22-- a signal of units. This signal triggers whenever the button is pressed.
23button : String -> (Element, Signal ())
25 let pool = N.buttons ()
26 in (pool.button () txt, pool.events)
28-- Create a group of custom buttons.
30-- * The first argument is the default value of the `events` signal.
31-- * The `events` signal represents all of the activity in this group
33-- * The `customButton` function creates a button with three different visual
34-- states, one for up, hovering, and down. The resulting button has dimensions
35-- large enough to fit all three possible `Elements`.
36-- The `a` value is sent to `events` whenever the button is pressed.
37customButtons : a -> { events : Signal a,
38 customButton : a -> Element -> Element -> Element -> Element }
40-- Create a button with custom states for up, hovering, and down
41-- (given in that order). The result is an `Element` and
42-- a signal of units. This signal triggers whenever the button is pressed.
43customButton : Element -> Element -> Element -> (Element, Signal ())
44customButton up hover down =
45 let pool = N.customButtons ()
46 in (pool.customButton () up hover down, pool.events)
48-- Create a group of checkboxes.
50-- * The first argument is the default value of the `events` signal.
51-- * The `events` signal represents all of the activity in this group
53-- * The `checkbox` function creates a
54-- checkbox with a given state. The `(Bool -> a)` function is used
55-- when the checkbox is modified. It takes the new state and turns
56-- it into a value that can be sent to `events`. For example, this
57-- lets you add an ID to distinguish between checkboxes.
58checkboxes : a -> { events : Signal a,
59 checkbox : (Bool -> a) -> Bool -> Element }
61-- Create a checkbox with a given start state. Unlike `button`, this result
62-- is a *signal* of elements. That is because a checkbox has state that
63-- updates based on user input.
64-- The boolean signal represents the current state of the checkbox.
65checkbox : Bool -> (Signal Element, Signal Bool)
67 let cbs = N.checkboxes b
68 in (lift (cbs.box id) cbs.events, cbs.events)
70hoverables : a -> { events : Signal a,
71 hoverable : (Bool -> a) -> Element -> Element }
73hoverable : Element -> (Element, Signal Bool)
75 let pool = N.hoverables False
76 in (pool.hoverable id elem, pool.events)
78-- Represents the current state of a text field. The `string` represents the
79-- characters filling the text field. The `selectionStart` and `selectionEnd`
80-- values represent what the user has selected with their mouse or keyboard.
83-- { string="She sells sea shells", selectionStart=3, selectionEnd=0 }
85-- This means the user highlighted the substring `"She"` backwards.
86type FieldState = { string:String, selectionStart:Int, selectionEnd:Int }
88-- Create a group of text input fields.
90-- * The first argument is the default value of the `events` signal.
91-- * The `events` signal represents all of the activity in this group
93-- * The `field` function creates a
94-- field with the given ghost text and initial field state.
95-- When the field is modified, the `(FieldState -> a)` function
96-- takes the new state and turns
97-- it into a value that can be sent to `events`. For example, this
98-- lets you add an ID to distinguish between input fields.
99fields : a -> { events : Signal a,
100 field : (FieldState -> a) -> String -> FieldState -> Element }
102-- The empty field state:
104-- { string="", selectionStart=0, selectionEnd=0 }
105emptyFieldState : FieldState
106emptyFieldState = { string="", selectionStart=0, selectionEnd=0 }
108-- Create a field with the given default text. The output is an element that
109-- updates to match the user input and a signal of strings representing the
110-- content of the field.
111field : String -> (Signal Element, Signal String)
113 let tfs = N.fields emptyFieldState
114 changes = dropRepeats tfs.events
115 in (lift (tfs.field id placeHolder) changes,
116 dropRepeats (lift .string changes))
118-- Same as `field` but the UI element blocks out each characters.
119password : String -> (Signal Element, Signal String)
120password placeHolder =
121 let tfs = N.passwords emptyFieldState
122 changes = dropRepeats tfs.events
123 in (lift (tfs.field id placeHolder) changes,
124 dropRepeats (lift .string changes))
126-- Same as `field` but it adds an annotation that this field is for email
127-- addresses. This is helpful for auto-complete and for mobile users who may
128-- get a custom keyboard with an `@` and `.com` button.
129email : String -> (Signal Element, Signal String)
131 let tfs = N.emails emptyFieldState
132 changes = dropRepeats tfs.events
133 in (lift (tfs.field id placeHolder) changes,
134 dropRepeats (lift .string changes))
136-- Create a drop-down menu. When the user selects a string,
137-- the current state of the drop-down is set to the associated
138-- value. This lets you avoid manually mapping the string onto
139-- functions and values.
140dropDown : [(String,a)] -> (Signal Element, Signal a)
142-- Create a drop-down menu for selecting strings. The resulting
143-- signal of strings represents the string that is currently selected.
144stringDropDown : [String] -> (Signal Element, Signal String)
146 N.dropDown (List.map (\s -> (s,s)) strs)
keysesc to close
- j k
- move down, up
- enter
- open
- esc
- back, or up a level
- 1 2 3 4
- readme, files, commits, refs
- /
- filter
- y
- copy the clone command
- c
- compare the chosen commit with another (or shift-click both)
- ?
- show or hide this list