function makeModalWin() {
  var modalWin = document.createElement('div');
  modalWin.className = 'modal-window';
  modalWin.style.display = 'none';

  var modalWinBg = document.createElement('div');
  modalWinBg.className = 'modal-window-bg';
  modalWin.appendChild(modalWinBg);

  var modalWinInner = document.createElement('div');
  modalWinInner.className = 'modal-window-inner';
  modalWin.appendChild(modalWinInner);

  var modalWinHeader = document.createElement('div');
  modalWinHeader.className = 'modal-window-header';
  modalWinHeader.innerHTML = 'Header';
  modalWinInner.appendChild(modalWinHeader);

  var modalWinContent = document.createElement('div');
  modalWinContent.className = 'modal-window-content';
  modalWinInner.appendChild(modalWinContent);

  var modalWinFooter = document.createElement('div');
  modalWinFooter.className = 'modal-window-footer';

  var modalWinClose = document.createElement('a');
  modalWinClose.innerHTML = 'Close window';
  modalWinClose.href = '#';
  modalWinClose.onclick = function() {
    modalWin.close();
    return false;
  };

  modalWinFooter.appendChild(modalWinClose);
  modalWinInner.appendChild(modalWinFooter);

  var onscroll = function() {
    var modalWinSize = {width: 500, height: 580};
    var bodySize = my.dom.winSize();
    var bodyScroll = my.dom.bodyScroll();

    var left = bodyScroll.x + Math.round(bodySize.width / 2) - Math.round(modalWinSize.width / 2);
    var top = bodyScroll.y + Math.round(bodySize.height / 2) - Math.round(modalWinSize.height / 2);

    modalWinInner.style.left = left + 'px';
    modalWinInner.style.top = top + 'px';
  };

  var onresize = function() {
    modalWinBg.style.display = 'none';
    onscroll();

    var bodySize = my.dom.bodySize();
    modalWinBg.style.width = bodySize.width + 'px';
    modalWinBg.style.height = bodySize.height + 'px';

    modalWinBg.style.display = 'block';
  };

  modalWin.open = function() {
    var bodySize = my.dom.bodySize();
    modalWinBg.style.width = bodySize.width + 'px';
    modalWinBg.style.height = bodySize.height + 'px';

    modalWin.style.display = 'block';

    onscroll();

    addEvent(window, 'scroll', onscroll);
    addEvent(window, 'resize', onresize);
    modalWinBg.onclick = function() {
      modalWin.close();
    };
  };

  modalWin.close = function() {
    modalWin.style.display = 'none';
    removeEvent(window, 'scroll', onscroll);
    removeEvent(window, 'resize', onresize);
  };

  modalWin.clear = function() {
    if (modalWinContent.hasChildNodes())
      modalWinContent.removeChild(modalWinContent.childNodes[0]);
  };

  modalWin.getContentDiv = function() {
    return modalWinContent;
  };

  modalWin.setHeader = function(header) {
    modalWinHeader.innerHTML = header.toString();
  };

  $tag('body')[0].appendChild(modalWin);

  return modalWin;
}



function createLobby(game, container) {

  if (!games[game])
    return null;

  var remoteServer = games[game].server.connection;

  var lobby = {};

  var lobbyState = {
    'gameName': games[game].name,
    'gameRules': games[game].rules,
    'gameId': games[game].game_id,
    'gameMod': games[game].mod_game,
    'player': {
      'eur': 0,
      'fun': 0
    }
  };

  var lobbyDiv = document.createElement('div');

  lobby.start = function() {
    container.clear();
    container.setHeader(lobbyState.gameName);
    container.getContentDiv().appendChild(lobbyDiv);
    container.open();
    init();
  };

  function init() {

    if ( !userInfo.sid || userInfo.sid == 0 ) {
      renderState('unauthorized');
      return;
    }

    renderState('check_balance');

    remoteServer.sendRequest('get_balances', {'sid': userInfo.sid}, function(response) {
      if (response.status != 'ok') {
        userInfo.sid = '0';
        userInfo.account.eur = '0';
        userInfo.account.fun = '0';
        userInfo.account.bns = '0';
        renderState('unauthorized');
        authBar.update();
        return;
      }
      userInfo.account.eur = lobbyState.player.eur = parseFloat(response.eur);
      userInfo.account.fun = lobbyState.player.fun = parseFloat(response.fun);
      userInfo.account.bns = lobbyState.player.bns = parseFloat(response.bns);
      renderState('check_tables');
      authBar.update();
    });

    lobbyState.tables = {};
    lobbyState.activeTables = {};
    lobbyState.totalServers = 0;
    lobbyState.respondedServers = 0;
    lobbyState.tablesOnServer = {};

    for( var game_server in games[game].serverlist ){

      lobbyState.totalServers++;
      (function() {

          var serverConnection = games[game][game_server].connection;   
          
          serverConnection.sendRequest('get_tables', {'game_name': game, 'game_id': games[game].game_id, 'mod_game': games[game].mod_game, 'sid': userInfo.sid}, function(response) {
          lobbyState.respondedServers++;
          if (response.status === 'ok') {
            updateTablesState(response.tables, serverConnection);
          }
          if (lobbyState.respondedServers === lobbyState.totalServers) {
            renderState('complete');
          }
        });
      })();
      
    }
    
  }

  function renderState(state) {

    switch (state) {
    case 'unauthorized':
      beforeUpdateInfoHtml();
      lobbyDiv.innerHTML = infoHtml + unauthHtml;
      afterUpdateInfoHtml();
      afterUpdateUnauthHtml();
      break;
    case 'check_balance':
      beforeUpdateInfoHtml();
      lobbyDiv.innerHTML = infoHtml + waitHtml;
      afterUpdateInfoHtml();
      break;
    case 'check_tables':
      beforeUpdateInfoHtml();
      updatePlayerHtml();
      lobbyDiv.innerHTML = infoHtml + playerHtml + waitHtml;
      afterUpdateInfoHtml();
      break;
    case 'complete':
      beforeUpdateInfoHtml();
      beforeUpdateTablesHtml();
      lobbyDiv.innerHTML = infoHtml + playerHtml + tablesHtml;
      afterUpdateInfoHtml();
      afterUpdateTablesHtml();
      break;
    default:
      break;
    };
  }

  var waitHtml = [
    '<p class="waiting">Please wait...</p>'
  ].join('');

  var infoHtml = '';

  function beforeUpdateInfoHtml() {
    infoHtml = [
      '<p class="screenshot"><img src="/i/screens/' + (games[game].screenshot ? games[game].screenshot : game) + '.jpg"></p>',
      '<p class="rules-demo">Read the <a href="' + games[game].rules + '">game rules</a> or try <a href="/games/demo/' + game + '/" target="_blank">demo version</a>.</p>'
    ].join('');
  }

  function afterUpdateInfoHtml() {
    var demoLink = $tag('a', $class('rules-demo', lobbyDiv)[0])[1];

    demoLink.onclick = function() {
      openWin(demoLink.href, DECOR.NO, 850, 600);
      container.close();
      return false;
    };
  }

  var unauthHtml = [
    '<form id="lobby-signin" action="/signin/" method="post"><p>Please <a href="/signin/">sign in</a> to play.<input type="hidden" name="f_url" value="' + window.location.pathname + '"></p></form>',
    '<p><a href="/signup/">Click here</a> to register.</p>'
  ].join('');

  function afterUpdateUnauthHtml() {
    try {
      var signinForm = $id('lobby-signin', lobbyDiv);
      var backUrlInput = signinForm['f_url'];
      var signinLink = $tag('a', signinForm)[0];
    } catch(e) {
      return;
    }
    backUrlInput.value = window.location.pathname;
    signinLink.onclick = function() {
      signinForm.submit();
      return false;
    };

    /*
     try {
     var formFromUrl = $tag('form', lobbyDiv)[0]['f_url'];
     var form = $tag('form', lobbyDiv)[0];
     } catch(e) {
     return;
     }
     formFromUrl.value = window.location.pathname;
     form.onsubmit = signinHook;
     */
  }

  var playerHtml = '';

  function updatePlayerHtml() {
    playerHtml = ['<p class="player">Welcome <b>' + userInfo.nickname + '</b>. Your balance: <b>&euro;</b> ' + userInfo.account.eur];
    if (userInfo.show_fun) {
      playerHtml.push(' &bull; <b>FUN</b> ' + userInfo.account.fun);
    }
    if (!isNaN(userInfo.account.bns)) {
      playerHtml.push(' &bull; <b>BONUS</b> ' + userInfo.account.bns);
    }
    playerHtml.push('</p>');
    playerHtml = playerHtml.join('');
  }

  var tablesHtml = '';


  function updateTablesState(tables, serverConnection) {
    
    for (var i in tables) {
        
        var table = tables[i];
        
        if (  ! ( (table['GameID']==games[game].game_id && table['ModGame']==games[game].mod_game ) || table['ModGame']==game  ) ) {
            continue;
        }
        
        if (serverConnection === games[game][table['currency'] + '_server'].connection) {
            lobbyState.tables[table['currency']] = {
              'currencyName': table['currency'],
              'id': table['TableID']
            };
        }
        
        if (table['InUse'] == 'Y') {
            if( lobbyState.activeTables[ table['currency'] ] ){
                if( serverConnection.priorityRestore < lobbyState.activeTables[ table['currency'] ]['serverConnection'].priorityRestore  ) {
                    lobbyState.activeTables[ table['currency'] ] = {
                          'restoreGid'       : table['OpenGID']
                        , 'serverConnection' : serverConnection
                    };
                } 
            } else {
                lobbyState.activeTables[ table['currency'] ] = {
                      'restoreGid'       : table['OpenGID']
                    , 'serverConnection' : serverConnection
                };
            }
        }

        if( lobbyState.activeTables[ table['currency'] ] ){
            delete lobbyState.tables[ table['currency'] ];
        }
        
    } // for(tables)

  } // function updateTablesState

  function beforeUpdateTablesHtml() {
    tablesHtml = "";
    tablesHtml += '<form style="display: block; margin: 0; padding: 0;">';
    
    if (lobbyState.activeTables != {}) {
      for (var curr in ['eur', 'fun', 'bns']) {
        var currName = ['eur', 'fun', 'bns'][curr];
        if (!lobbyState.activeTables[currName]) continue;
        if (!userInfo.show_fun && currName == 'fun') continue;
        var table = lobbyState.activeTables[currName];
        var currHumanName = '';
        switch (currName) {
          case 'eur': currHumanName = 'EURO'; break;
          case 'fun': currHumanName = 'FUN'; break;
          case 'bns': currHumanName = 'BONUS'; break;
        }
        tablesHtml += '<p class="restore-' + currName + '">You have already opened a <b>' + currHumanName + '</b> game. <a href="#">Click here</a> to restore it.</p>';
      }
    }

    if (lobbyState.tables && (lobbyState.tables.eur || (lobbyState.tables.fun && userInfo.show_fun) || lobbyState.tables.bns)) {
      tablesHtml += '<p class="currencies">';

      var first = true;
      var amountValue = 0;
      for (var curr in ['eur', 'fun', 'bns']) {
        var currName = ['eur', 'fun', 'bns'][curr];
        if (!userInfo.show_fun && currName == 'fun') continue;
        if (!lobbyState.tables[currName]) continue;
        var currHumanName = '';
        switch (currName) {
          case 'eur': currHumanName = 'EURO'; break;
          case 'fun': currHumanName = 'FUN'; break;
          case 'bns': currHumanName = 'BONUS'; break;
        }
        var tableNum = currName;
        var table = lobbyState.tables[tableNum];
        if (first) {
          lobbyState.selectedCurrency = tableNum;
          lobbyState.selectedTable = table.id;
        }
        if (userInfo.show_fun) {
          tablesHtml += '<span class="' + tableNum + '"><input type="radio" name="currency" value="' + tableNum + '" ' + (first ? ' checked' : '') + '> <b>' + currHumanName + '</b></span>';
        }
        if (first) {
          amountValue = lobbyState.player[tableNum];
        }
        first = false;
      }
      tablesHtml += '</p>';
      if (lobbyState.tables.eur || (lobbyState.tables.fun && userInfo.show_fun) || lobbyState.tables.bns) {
        tablesHtml += '<p class="amount">';
        tablesHtml += '<input type="text" value="' + amountValue + '"> <input id="submit" type="submit" value="Start">';
        tablesHtml += '</p>';
      }
    }
    else {
      tablesHtml += '<p>';
      tablesHtml += 'No available tables to start new game.';
      if (lobbyState.activeTables.eur || (lobbyState.activeTables.fun && userInfo.show_fun)) {

      }
      tablesHtml += '</p>';
    }

    tablesHtml += '</form>';
  }

  function afterUpdateTablesHtml() {
    var form = $tag('form', lobbyDiv)[0];
    form.onsubmit = submitHook;

    if (lobbyState.activeTables && (lobbyState.activeTables.eur || lobbyState.activeTables.fun || lobbyState.activeTables.bns)) {
      for (var tableNum in lobbyState.activeTables) {
        (function () {
           var table = lobbyState.activeTables[tableNum];
           var restoreCurrency = tableNum;
           var restoreGid = table.restoreGid;
           var restoreLink = $tag('a', $class('restore-' + restoreCurrency, lobbyDiv)[0])[0];
           restoreLink.onclick = function() {
             var win = openGameWindow(games[game], table.serverConnection);
             win.redirect(restoreGid);
             container.close();
             return false;
           };
         })();
      }
    }

    if (lobbyState.tables && (lobbyState.tables.eur || lobbyState.tables.fun || lobbyState.tables.bns)) {
      var currencyAmount = $tag('input', $class('amount', lobbyDiv)[0])[0];
      if (!currencyAmount) return;
      for (var tableNum in lobbyState.tables) {
        (function () {
           if (!userInfo.show_fun && tableNum == 'fun') return;
           var table = lobbyState.tables[tableNum];
           var currency = tableNum;
           var span = $class(tableNum, $class('currencies', lobbyDiv)[0])[0] || {};
           var radio = $tag('input', span)[0] || {};
           span.onclick = function() {
             lobbyState.selectedCurrency = currency;
             lobbyState.selectedTable = table.id;
             radio.checked = true;
             currencyAmount.value = lobbyState.player[currency];
             currencyAmount.select();
             currencyAmount.focus();
           };
         })();
      }
      currencyAmount.focus();
      currencyAmount.select();
    }
  }

  function submitHook() {

    var params = {};
    params.sid = userInfo.sid;
    params.game_name = game;
    params.table = lobbyState.selectedTable;
    params.amount = $class('amount', lobbyDiv)[0].firstChild.value;
    params.currency = lobbyState.selectedCurrency;

    var parsedAmount = parseFloat(params.amount);

    if (isNaN(parsedAmount) || parsedAmount == 0) {
      alert('Incorrect amount');
      return false;
    }

    if (parsedAmount > lobbyState.player[lobbyState.selectedCurrency]) {
      alert('Insufficient funds');
      return false;
    }

    params.amount = parsedAmount;

    var remoteServer = games[game][lobbyState.selectedCurrency + '_server'].connection;

    var win = openGameWindow(games[game], remoteServer);

    remoteServer.sendRequest('create_game', params, function(response) {
                               if (response.status != 'ok') {
                                 win.close();
                                 alert('Error creating new game\n' + response.error_message);
                                 return;
                               }
                               container.close();
                               win.redirect(response.game);
                             });

    return false;
  }

  function signinHook() {

    var form = $tag('form', lobbyDiv)[0];

    var params = {};
    params.login = form['f_login'].value;
    params.password = form['f_passwd'].value;

    remoteServer.sendRequest('authorize', params, function(response) {
      if (response.status != 'ok') {
        alert('Incorrect username or password');
        return;
      }
      userInfo = {
        'nickname': params.login,
        'sid': response['SID'],
        'account': {
          'eur': '0',
          'fun': '0'
        }
      };
      document.cookie = 'my_sess' + '=' + encodeURIComponent(response['SID']) + '; path=/';

      if (window.location.protocol == 'https:') {
        init();
      }
      else {
        document.cookie = 'startup_game=' + game + '; path=/';
        var redirectTo = 'https://' + window.location.hostname + window.location.pathname + '#' + game;
        window.location.href = redirectTo;
      }
    });

    return false;
  }

  return lobby;
}; // function createLobby



var buildLobbies = (function() {

  var mw = makeModalWin();
  var gameBlocks = [];

  var buildLobbies = function(){
    gameBlocks = $class('game-block');
    if (gameBlocks.length == 0)
      return;

    for (var i = 0; i < gameBlocks.length; i++) {
      (function() {
         var gameId = gameBlocks[i].id;
         var gameLobby = createLobby(gameId, mw);
         if (!gameLobby)
           return;
         var logoLink = $tag('a', gameBlocks[i])[0];
         var textLink = $tag('a', gameBlocks[i])[4];
         if (logoLink) {
           logoLink.onclick = function() {
             gameLobby.start();
             return false;
           };
         }
         if (textLink) {
           textLink.onclick = function() {
             gameLobby.start();
             return false;
           };
         }
       })();
    }
  };
  return buildLobbies;
})();



(function() {
   var preOnload = function() {};
   if (window.onload && typeof window.onload == 'function') {
     preOnload = window.onload;
   }

   my.dom.onReadyDo(function() {
     preOnload();
     authBar.init();
     buildLobbies();
   });
 })();