title: Cannot read property add() of undefined Phaser.js
body: <p>There is a problem with the <code>game.state.add()</code> function. For some reason <code>game</code> is undefined:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'add' of undefined at Object.init (main.js:51) at main.js:58</p>
  </blockquote>
  
  <p>This is my code:</p>
  
  <pre><code>var socket; // global bir socket değişkeni.
      socket = io.connect(); // server a bağlantı isteği gönderir.
                             //Server bağlantı isteğini dinler ve clientlara başarılı olursa geri "connect" mesajını emitler.
  
      //Oyunun ekrana oturması için boyutları ayarlıyoruz.Browserla ilgili.
      var canvas_width = window.innerWidth * window.devicePixelRatio;
      var canvas_height = window.innerHeight * window.devicePixelRatio;   
      //Oyunumuzu belirlediğimiz divin içinde yaratıyoruz.
      var game = new Phaser.Game(canvas_width,canvas_height,Phaser.CANVAS,'gameDiv');
  
      var gameProperties = {
        //oyunun gerçek boyutları.oyun dünyasının genişliği ve uzunluğu.
        gameWidth:4000,
        gameHeight:4000,
      }
  
      //Oyunun ana state i.
      var main = function(game){
  
      };
      main.prototype ={
      preload:function(){
  
      },
      create:function(){ // oyun yaratıldığında çağrılır.
      console.log("Client yaratıldı.")
      //serverdan connect mesajı gelince onSocketConnected fonksiyonunu çalıştır.
      socket.on("connect",onSocketConnected); //serverdan gelecek connect mesajı için dinler.Socket.io bir client
                                              // servera bağlandığında otomatik olarak connect mesajını client a gönderir.
                                              //serverın clientlara mesaj göndermesine "emit"  denir.
  
      },    
      }
      function onSocketConnected(){
        console.log("Sunucuya bağlanıldı.")    
      };
  
      var gameBootStrapper = {
           init:function(gameContainerId){
               game.state.add('main',main);   //error here
               game.state.start('main');
           }
      };    
      gameBootStrapper.init('gameDiv');
  </code></pre>
  
  <p>My index.html:</p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="gameDiv"&gt;
      &lt;/div&gt;    
  &lt;/body&gt;
  &lt;script src="client/lib/phaser.js"&gt;&lt;/script&gt;
  &lt;script src="/socket.io/socket.io.js"&gt;&lt;/script&gt;
  &lt;script src ="client/main.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Here there is a picture of <code>index.html</code>:
  ........................................................</p>
  
  <p><a href="https://i.stack.imgur.com/N6jU3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/N6jU3.png" alt="Image of console"></a></p>