Page 1

Web programming with Haskell

Page 2

What is Haste?

Page 3

More info

Page 4

WWW

WWW = HTML + URL

Page 5

HTML — T is for Text

Hello world in HTML

Page 6

HTML — bigger example

Page 7

Making web pages more dynamic

Page 8

JavaScript Example

Page 9

User interface elements

Page 10

Adding functionality

Adding an event handler for the button

Page 11

Haste

Page 12
Haste

Attributes, properties and styles

More functions from Haste.DOM

setAttr, setProp, setStyle
     :: Elem -> PropId -> String -> IO ()
    
with :: IO Elem -> [Attribute] -> IO Elem
Page 13
Haste
Page 14
Haste

Event handlers

Page 15
Haste

Event handing example

counterExample =
  do input <- newElem "input"
     button <- mkButton "Increment"
     appendChild documentBody input
     appendChild documentBody button
     let incr _ = do s <- getProp input "value"
                     let v = read s
                     setProp input "value" (show (v+1))
     onEvent button Click incr
Page 16

Web programming in a functional style?

Page 17

Web Fudgets

Page 18

What is a Fudget?

Page 19
What is a Fudget?
Page 20
What is a Fudget?
Page 21
What is a Fudget?
Page 22

Web Fudgets Demo

Live Demo