21st Century Smalltalk

August 26, 2006

Tic-Tac-Toe Internet Game

Filed under: Vista Smalltalk — pfisk @ 6:58 pm

This game is based on Google Instant Messaging and allows two players to engage in an online chat while they play a game of Tic-Tac-Toe over the Internet.

The mechanism for updated the remote player’s board is based on a special kind of text message. If a message is preceded with “@@@”, then the first three characters are discarded and the rest of the message is treated as a Smalltalk message. This technique could be used for collaborative work group applications as well as games.

Here is the Vista Smalltalk source code for the game:

Demos subclass: #TicTacToe
instanceVariableNames: 'canvas textin textout jabber user contact tileArray token'
classVariableNames: ''
buildBoardPanel
  | dockpanel tile block |
  tileArray := Array new: 9.
  canvas := Canvas new.
  1 to: 9 do: [:i |
    tile := self createButton: i with: token.
    tileArray at: i put: tile.
    canvas add: tile].
  canvas clipToBounds: true.
  Handler on: canvas event: 'SizeChanged' block: [self placeTiles].
  dockpanel := DockPanel new.
  dockpanel add: canvas.
  ^ dockpanel
buildChatPanel
  | button dockpanel grid |
  textin := TextBox new.
  textout := TextBox new.
  grid := Grid vsplit: 0.45 child1: textin child2: textout.
  grid background: Brushes gray.
  dockpanel := DockPanel new.
  button := Button new.
  button content: 'Send'.
  Handler on: button event: 'Click' block: [self sendMessage].
  dockpanel add: button.
  DockPanel setDock: button to: Dock bottom.
  dockpanel add: grid.
createButton: anIndex with: aString
   | tile |
   tile := Button new.
   Handler on: tile event: 'Click' block: [self markTiles: anIndex with: aString].
   ^ tile
evalMessage: aMessage
  | msg |
  msg := aMessage substring: 3.
  msg eval
login: aPasswd
  jabber := JabberConnect new.
  jabber user: user; passwd: aPasswd.
  jabber callback: [:m | self messageReceived: m].
  jabber connect
markLocalTile: index with: aString
  | tile |
  tile := tileArray at: index.
  tile content: aString
markRemoteTile: index with: aString
  | message |
  message := '@@@Proxy markLocalTile: ' + index + ' with: ' + '''' + aString + ''''.
  self sendMessage: message
markTiles: index with: aString
  self markLocalTile: index with: aString.
  self markRemoteTile: index with: aString
messageReceived: aMessage
  (aMessage startsWith: '@@@')
    ifTrue: [self evalMessage: aMessage]
    ifFalse: [self printMessage: aMessage]
placeTiles
  | tile row col x y size |
  1 to: 9 do:[:nr |
    size := 3.
    tile := tileArray at: nr.
    tile width: canvas actualWidth / size .
    tile height: canvas actualHeight / size .
    row := ((nr - 1) // size) + 1.
    col := ((nr - 1) \\ size) + 1.
    x := canvas actualWidth * (col - 1) / size .
    y := canvas actualHeight * (row - 1) / size .
    Canvas setLeft: tile to: x.
    Canvas setTop: tile to: y]
printMessage: aMessage
  textin println: aMessage
sendMessage
  self sendMessage: textout text trim.
  textout text: ''
sendMessage: aMessage
  jabber send: contact message: aMessage.
  textout text: ''
user: aUser passwd: aPasswd contact: aContact token: anXorO
  | w |
  Proxy := self.
  user := aUser.
  contact := aContact.
  token := anXorO.
  self login: aPasswd.
  w := self topWindowClass new.
  w title: 'Tic-Tac-Toe (' + user + ')'.
  w add: (Grid hsplit: 0.45
               child1: self buildBoardPanel
               child2: self buildChatPanel).
  w open

1 Comment »

  1. deiam-me o codigo

    Comment by ANTONIO — June 16, 2009 @ 11:20 am


RSS feed for comments on this post. TrackBack URI

Leave a comment

Blog at WordPress.com.