Slide 1

Slide 1 text

State & Monsters

Slide 2

Slide 2 text

if( !!!( user == undefined ) ){

Slide 3

Slide 3 text

1 var months = { 2 '2012': [ 'jan', 'feb', 'mar', 'apr', 3 'may', 'jun', 'jul', 'aug', 4 'sep', 'oct', 'nov', 'dec' ], 5 6 '2011': [ 'jan', 'feb', 'mar', 'apr', 7 'may', 'jun', 'jul', 'aug', 8 'sep', 'oct', 'nov', 'dec' ], 9 10 '2010': [ 'jan', 'feb', 'mar', 'apr', 11 'may', 'jun', 'jul', 'aug', 12 'sep', 'oct', 'nov', 'dec' ], 13 14 '2009': [ 'jan', 'feb', 'mar', 'apr', 15 'may', 'jun', 'jul', 'aug', 16 'sep', 'oct', 'nov', 'dec' ] 17 18 // (...)

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

what’s big ball of mud?

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

1 $(document).ready( function(){ 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 });

Slide 8

Slide 8 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 8 9 10 11 12 13 14 15 16 17 18 19 });

Slide 9

Slide 9 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 12 13 14 15 16 17 18 19 });

Slide 10

Slide 10 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 12 13 $('.board-element').click(function(){ 14 15 16 17 18 }); 19 });

Slide 11

Slide 11 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 12 13 $('.board-element').click(function(){ 14 var x = $(this).attr('data-x'); 15 var y = $(this).attr('data-y'); 16 17 18 }); 19 });

Slide 12

Slide 12 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 12 13 $('.board-element').click(function(){ 14 var x = $(this).attr('data-x'); 15 var y = $(this).attr('data-y'); 16 placeMark(x,y, 17 18 }); 19 });

Slide 13

Slide 13 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 var currentMark = 'X'; 12 13 $('.board-element').click(function(){ 14 var x = $(this).attr('data-x'); 15 var y = $(this).attr('data-y'); 16 placeMark(x,y, 17 18 }); 19 });

Slide 14

Slide 14 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 var currentMark = 'X'; 12 13 $('.board-element').click(function(){ 14 var x = $(this).attr('data-x'); 15 var y = $(this).attr('data-y'); 16 placeMark(x,y,currentMark); 17 18 }); 19 });

Slide 15

Slide 15 text

1 $(document).ready( function(){ 2 3 var board = [ ['_','_','_'], 4 ['_','_','_'], 5 ['_','_','_'] ]; 6 7 var placeMark = function(x,y,mark){ 8 board[x][y] = mark; 9 } 10 11 var currentMark = 'X'; 12 13 $('.board-element').click(function(){ 14 var x = $(this).attr('data-x'); 15 var y = $(this).attr('data-y'); 16 placeMark(x,y,currentMark); 17 swapCurrentMark(); 18 }); 19 });

Slide 16

Slide 16 text

getting muddy.

Slide 17

Slide 17 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 10 }); 11 12 13 14 15 16 17 18 19 20

Slide 18

Slide 18 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 10 }); 11 12 13 14 $('#resign').click(function(){ 15 16 17 18 19 20 });

Slide 19

Slide 19 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 10 }); 11 12 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 18 19 20 });

Slide 20

Slide 20 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 18 19 20 });

Slide 21

Slide 21 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 22

Slide 22 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 23

Slide 23 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 24

Slide 24 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 25

Slide 25 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 26

Slide 26 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 27

Slide 27 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 28

Slide 28 text

1 var currentMark = 'X'; 2 3 $('.board-element').click(function(){ 4 if (!winner){ 5 var x = $(this).attr('data-x'); 6 var y = $(this).attr('data-y'); 7 placeMark(x,y,currentMark); 8 swapCurrentMark(); 9 } 10 }); 11 12 var winner = null; 13 14 $('#resign').click(function(){ 15 if (currentMark = 'X'){ 16 winner = 'O'; 17 } else { 18 winner = 'X'; 19 } 20 });

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

tight coupling

Slide 31

Slide 31 text

no architecture tight coupling

Slide 32

Slide 32 text

no architecture tight coupling poor state management

Slide 33

Slide 33 text

working with mud.

Slide 34

Slide 34 text

“A large fraction of the flaws in software development are due to programmers not fully understanding all the possible states their code may execute in.” John Carmack, “Functional programming in C++”, 2012

Slide 35

Slide 35 text

1 var board = [ ['_','_','_'], 2 ['_','_','_'], 3 ['_','_','_'] ]; 4 5 var currentMark = 'X'; 6 7 var winner = null; 8 9 var turn = 0; 10 11 //...

Slide 36

Slide 36 text

1 var board = [ ['_','_','_'], 2 ['_','_','_'], 3 ['_','_','_'] ]; 4 5 var currentMark = 'X'; 6 7 var winner = null; 8 9 var turn = 0; 10 11 //...

Slide 37

Slide 37 text

1 var board = [ ['_','_','_'], 2 ['_','_','_'], 3 ['_','_','_'] ]; 4 5 var currentMark = 'X'; 6 7 var winner = null; 8 9 var turn = 0; 10 11 //...

Slide 38

Slide 38 text

1 var board = [ ['_','_','_'], 2 ['_','_','_'], 3 ['_','_','_'] ]; 4 5 var currentMark = 'X'; 6 7 var winner = null; 8 9 var turn = 0; 10 11 //...

Slide 39

Slide 39 text

imperative | declarative

Slide 40

Slide 40 text

Haskell declarative; immutable.

Slide 41

Slide 41 text

No content

Slide 42

Slide 42 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

Slide 43

Slide 43 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

Slide 44

Slide 44 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

Slide 45

Slide 45 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 15 16 17 18 19 20 21 22 23 24 25

Slide 46

Slide 46 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 17 18 19 20 21 22 23 24 25

Slide 47

Slide 47 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 17 18 19 20 21 22 winner board 23 24 25

Slide 48

Slide 48 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 17 18 19 20 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 25

Slide 49

Slide 49 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 17 18 19 20 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 50

Slide 50 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 17 18 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 51

Slide 51 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 52

Slide 52 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 53

Slide 53 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 54

Slide 54 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 55

Slide 55 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 56

Slide 56 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 57

Slide 57 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 58

Slide 58 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 59

Slide 59 text

4 board = [[Nothing, Nothing, Nothing], 5 [Nothing, Nothing, Nothing], 6 [Nothing, Nothing, Nothing]] 7 8 replace index element list = 9 (take index list) ++ [element] ++ (drop (index+1) list) 10 11 replace' x y element matrix = 12 replace x (replace y element (matrix !! x)) matrix 13 14 data Mark = O | X deriving (Eq) 15 16 diagonals [[a,_,b], 17 [_,c,_], 18 [d,_,e]] = [[a,c,e],[b,c,d]] 19 20 patterns board = board ++ (transpose board) ++ (diagonals board) 21 22 winner board 23 | any (== [Just O, Just O, Just O]) (patterns board) = Just O 24 | any (== [Just X, Just X, Just X]) (patterns board) = Just X 25 | otherwise = Nothing

Slide 60

Slide 60 text

GitHub: nbartlomiej/takefive

Slide 61

Slide 61 text

in practice?

Slide 62

Slide 62 text

no state: the good parts

Slide 63

Slide 63 text

•Easier to test no state: the good parts

Slide 64

Slide 64 text

•Easier to test •Asynchronousabilityness no state: the good parts

Slide 65

Slide 65 text

•Easier to test •Asynchronousabilityness •Easy to maintain no state: the good parts

Slide 66

Slide 66 text

1 2 // var winner = null; 3 4 5 6 7 8 9 10 11 12

Slide 67

Slide 67 text

1 2 // var winner = null; 3 4 Board.prototype.winner = function(){ 5 if ( this.winnerX() ) { 6 return 'X'; 7 } else if ( this.winnerO() } { 8 return 'O'; 9 } else { 10 return null; 11 } 12 }

Slide 68

Slide 68 text

1 // var currentMark = 'X'; 2 3 4 5 6

Slide 69

Slide 69 text

1 // var currentMark = 'X'; 2 3 Board.prototype.place = function(x,y,mark){ 4 this.board[x][y] = mark; 5 } 6

Slide 70

Slide 70 text

1 // $('.board-element').click(function(){ 2 // if (!winner){ 3 // var x = $(this).attr('data-x'); 4 // var y = $(this).attr('data-y'); 5 // placeMark(x,y,currentMark); 6 // swapCurrentMark(); 7 // } 8 // }); 9 10 11 12 13 14 15 16 17 18 19

Slide 71

Slide 71 text

1 // $('.board-element').click(function(){ 2 // if (!winner){ 3 // var x = $(this).attr('data-x'); 4 // var y = $(this).attr('data-y'); 5 // placeMark(x,y,currentMark); 6 // swapCurrentMark(); 7 // } 8 // }); 9 10 $('*[data-board-element]').click(function(){ 11 board.moveIntent( 12 $(this).attr('data-x'), 13 $(this).attr('data-y') 14 ); 15 } 16 17 18 19

Slide 72

Slide 72 text

1 // $('.board-element').click(function(){ 2 // if (!winner){ 3 // var x = $(this).attr('data-x'); 4 // var y = $(this).attr('data-y'); 5 // placeMark(x,y,currentMark); 6 // swapCurrentMark(); 7 // } 8 // }); 9 10 $('*[data-board-element]').click(function(){ 11 board.moveIntent( 12 $(this).attr('data-x'), 13 $(this).attr('data-y') 14 ); 15 } 16 17 $('*[data-board-element]').click(function(){ 18 new BoardInput(this); 19 }

Slide 73

Slide 73 text

summary

Slide 74

Slide 74 text

@nbartlomiej twitter, github: