0

I made a simple game yesterday in javascript using coffeescript. The bulk of the game runs through a game object which is instantiated after the user submits a form on the page. The form contains variables and options for the game they want to play.

Everything works fine during the game, but when the game is over I have the form appear again and if the user submits the form a second time its supposed to call the same function and overwrite the old game variable with a new instance of the game object, but what I've noticed is that its not resetting all the existing variables and paramaters set by the original game object.

Is there any way to fully remove the old object and its parameter when a new one is instantiated?

Here is My object being declared as a 'class' in coffeescript.

window.Game   = class Game

  constructor: (options) ->
    players  = options[0] ? '1'
    p1 =  p2 = false
    @player1 = new Player(options[1] ? 'X', p1 )
    @player2 = new Player(options[2] ? 'O', p2 )
    @cells   = ($ "section#board .cell")
    @cells.each ->
      $(@).text(" ")
      $(@).removeClass('score')
    @currentPlayer = @player1
    @availableMoves = 9
    ($ 'section#board div.cell').bind
      click:      @.makeMove
      mouseleave: @.resetCell

    setTimeout(@.computerMove(@currentPlayer), 1000) if parseInt(players) is 0

I'm calling this after form submit through this function.

($ '#gameOptions').submit (event) ->
  event.target.checkValidity()
  event.preventDefault()
  game = new Game [($ '#player-count') .val(), 
                   ($ '#player-1-type').val(),
                   ($ '#player-2-type').val()]

Even when adding a call do delete game before re-instantiating the game object. The ghost variables persist. I posted in coffeescipt for brevity and to increase readability.

Aaron Dufour
  • 17,288
  • 1
  • 47
  • 69
Justin Herrick
  • 2,981
  • 17
  • 18
  • possible duplicate of [How to quickly clear a Javascript Object?](http://stackoverflow.com/questions/684575/how-to-quickly-clear-a-javascript-object) – maxedison Mar 05 '12 at 22:52
  • possible dup http://stackoverflow.com/questions/742623/deleting-objects-in-javascript – elclanrs Mar 05 '12 at 22:52
  • this has been asked plenty of times here. just search fro delete object javascript. – maxedison Mar 05 '12 at 22:52
  • 2
    Sounds like you're not doing your construction/instantiation properly. Whatever variables you're leaving out, just override them on the form submission. – davin Mar 05 '12 at 22:53
  • I've read all those posts and searched delete objects in javascript. They dont touch on exactly what I'm getting at here. I'll add some code to try and clear up the question a little bit. – Justin Herrick Mar 05 '12 at 22:57
  • 1
    If the form submission you are talking about was a non-Ajax request then the entire page would be refreshed and that would automatically clear _everything_ from the previous run. – nnnnnn Mar 05 '12 at 22:59
  • @nnnnnn Oh, thats a good idea. I may just try that. I could just move the highscores to browser cache. (No server side for this) – Justin Herrick Mar 05 '12 at 23:05

1 Answers1

1

The delete game will not remove the object, only the reference. The problem is that references to the old variable are persisting somewhere. There might be others, but at the very least this part of the constructor is giving you problems:

  ($ 'section#board div.cell').bind
    click:      @.makeMove
    mouseleave: @.resetCell

JQuery is allowing you to bind multiple functions to the same event; in this case, both the old and new functions, and the old ones are holding the reference to the old object. In order to fix this, you should unbind in the form submission function:

($ 'section#board div.cell').unbind()
Aaron Dufour
  • 17,288
  • 1
  • 47
  • 69
  • That actually did help with a parameter relating to player movement. Thank you for the answer. – Justin Herrick Mar 06 '12 at 03:39
  • @JustinHerrick Are there still problems? If so, we'll probably need more info. – Aaron Dufour Mar 06 '12 at 04:38
  • The two issues I'm having is that after the first game is finished (and every game afterwords) the starting player is not set to player 1, its almost consistently set to player2 and the existing player variables seem to be holding on to the old variables that they are human.... I'm starting to think that I may need to manually delete (dereference) those objects when the game ends – Justin Herrick Mar 06 '12 at 04:42
  • @JustinHerrick The only way that would happen is if the `Game` object was actually the old one. How are you distributing the `Game` object among various functions? – Aaron Dufour Mar 06 '12 at 04:52
  • Its fairly self contained. You can view all the source on here https://github.com/jah2488/tic-tac-coffee/blob/master/js/script.coffee After what you see above. I simply call object methods under game to validate user moves and handle the active player. etc. – Justin Herrick Mar 06 '12 at 05:06
  • 1
    @JustinHerrick From your github, the line `($ 'section#board div.cells').off()` isn't working because the selector should be `section#board div.cell`. – Aaron Dufour Mar 06 '12 at 05:13
  • let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/8565/discussion-between-aaron-dufour-and-justin-herrick) – Aaron Dufour Mar 06 '12 at 05:16
  • That fixed it Actually. Thanks so much for your help Aaron. – Justin Herrick Mar 06 '12 at 05:22