game-container.html

<link href="../game-b/game-b.html" rel="import">
<link href="../game-bbar/game-bbar.html" rel="import">
<link href="../game-pa/game-pa.html" rel="import">
<link href="../game-deck/game-deck.html" rel="import">
<link href="../game-setup/game-setup.html" rel="import">
<link href="../game-coinbar/game-coinbar.html" rel="import">
<link href="../core-overlay/core-overlay.html" rel="import">
<link href="../paper-toast/paper-toast.html" rel="import">

<polymer-element name="game-container">

  <template>
    <style>    
      #design_host {
        position: absolute;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
      }
      #game_setup {
        top: 20px;
        left: 20px;
        position: relative;
      }
      #game_game {
        left: 660px;
        top: 440px;
      }
      #paper_toast {
        top: 10px;
        bottom: auto;
      }
      #top_bar {
        height: 50px;
        width: 100%;
      }
      #game_bbar {
        position: relative;
      }
      #setup_overlay {
        height: auto;
        width: auto;
      }
      #dialog {
        background: white;
      }
    </style>
      <core-overlay id="core_overlay" fullbleed backdrop="true">
        <div id="dialog">
        <game-setup id="game_setup" hidden?="{{hideSetup}}"></game-setup>
          <h2>Dialog</h2>
          <input placeholder="say something..." autofocus>
          <div>I agree with this wholeheartedly.</div>
          <button core-overlay-toggle>OK</button>
        </div>
      </core-overlay>
    <div fullbleed layout center center-justified>
      <div id="top_bar"></div>
      <paper-toast id="paper_toast" class="core-transition-bottom core-transition" touch-action="none"></paper-toast>
      <div layout horizontal center center-justified>
        <game-coinbar id="game_coinbar" hidden?="{{hideGame}}" coinState="{{coinState}}" supply="{{coinSupply}}"></game-coinbar>
        <game-b id="game_b" boardState="{{activeBoard}}" hidden?="{{hideGame}}"></game-b>
      </div>
      <game-bbar id="game_bbar" hidden?="{{hideGame}}"></game-bbar>
      <game-pa id="game_pa" players="{{players}}" hidden?="{{hideGame}}"></game-pa>
      <game-deck id="game_deck"></game-deck>
    </div>
  </template>

  <script>

    Polymer({
      deck: [],
      hCount: 0,
      coinState: [
        false,
        false,
        false,
        false,
        false
        ],
      coinSupply: [0,0,0,0,0,0],
      activeBoard: [{
            "cid": 0,
            "tier": 5,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          },{
            "cid": 1,
            "tier": 6,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          },{
            "cid": 2,
            "tier": 7,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          },{
            "cid": 3,
            "tier": 8,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          }],
      online: true,
      hideGame: true,
      hideSetup: false,
      activepid: 0,
      noteQueue: [],
      turnState: 0,
      coinMin: 2,
      ready: function () {
        this.addEventListener('game-message', this.message);
        this.addEventListener('core-overlay-close-completed', this.queue);
        this.addEventListener('initgame', this.initGame);
        this.addEventListener('new-turn', this.newTurn);
        this.addEventListener('game-act-pcard', this.actPcard);
        this.addEventListener('game-act-rcard', this.actCancel);
        this.addEventListener('game-act-coin3', this.actCoin3);
        this.addEventListener('game-act-coin2', this.actCoin2);
        this.addEventListener('game-act-cancel', this.actCancel);
        this.addEventListener('coin-clicked', this.coinClick);
        this.addEventListener('card-clicked', this.cardClick);
        
        this.$.core_overlay.opened = true;
      },
      
      // Player Notification Messaging and Queue
      
      message: function (e) {
        if(this.$.paper_toast.opened) {
          this.noteQueue.push(e.detail.message);
          return;
        };
        this.$.paper_toast.text = e.detail.message;
        this.$.paper_toast.show();
      },
      queue: function (e) {
        if(this.$.paper_toast.opened) {
          return;
        };
        if(this.noteQueue.length > 0) {
          this.$.paper_toast.text = this.noteQueue[0];
          this.noteQueue.shift();
          this.$.paper_toast.show();
        };
      },
      
      //  Game Initialization
      
      initGame: function (e) {
        this.online = e.detail.online;
        if(!this.online) {
          console.log("Init Offline Mode");
          
          this.activeBoard = [{
            "cid": 0,
            "tier": 5,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          },{
            "cid": 1,
            "tier": 6,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          },{
            "cid": 2,
            "tier": 7,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          },{
            "cid": 3,
            "tier": 8,
            "white": 0,
            "blue": 0,
            "green": 0,
            "red": 0,
            "black": 0,
            "vp": 0,
            "supply": 0
          }];
          
          this.activepid = Math.floor((Math.random() * e.detail.players.length));
          this.players = e.detail.players;
          for(i=0;i<this.players.length;i++) {
            this.players[i].vp = 0;
            this.players[i].white = 0;
            this.players[i].white_p = 0;
            this.players[i].blue = 0;
            this.players[i].blue_p = 0;
            this.players[i].green = 0;
            this.players[i].green_p = 0;
            this.players[i].red = 0;
            this.players[i].red_p = 0;
            this.players[i].black = 0;
            this.players[i].black_p = 0;
          };
          this.deck = this.$.game_deck.deck;
          
          for(i=0;i<this.deck.length;i++) {
            this.activeBoard[this.deck[i].tier - 1].supply++
          };
          
          var startIdx = 0;
          for(i=0;i<4;i++){
            for(j=0;j<4;j++){
              var cardIdx = Math.floor(Math.random() * this.activeBoard[i].supply) + startIdx;
              this.activeBoard.push(this.deck[cardIdx]);
              this.activeBoard[this.activeBoard.length - 1].cid = this.activeBoard.length - 1;
              this.deck.splice(cardIdx, 1);
              this.activeBoard[i].supply--
            };  
            startIdx = startIdx + this.activeBoard[i].supply;
          };
          
          switch(this.players.length) {
            case 1:
              this.coinSupply = [6,6,6,6,6,6];
              this.coinMin = 2;
              break;
            case 2:
              this.coinSupply = [6,6,6,6,6,6];
              this.coinMin = 2;
              break;
            case 3:
              this.coinSupply = [6,6,6,6,6,6];
              this.coinMin = 2;
              break;
            case 4:
              this.coinSupply = [6,6,6,6,6,6];
              this.coinMin = 2;
              break;
          };
          
          this.coinState = [false, false, false, false, false];
          this.hCount = 0;
          this.turnState = 0;
          this.fire('new-turn');
          this.hideGame = false;
          this.hideSetup = true;
        };
        
      },
      newTurn: function (e) {
        this.activepid = (this.activepid + 1)%this.players.length;
        this.turnState = 0;
        var msg = this.players[this.activepid].name + " select an action.";
        btns = [false, false, false, false, true];
        this.$.game_bbar.buttonStates = btns;
        this.fire('game-message', { message : msg });
      },
      
      // Event Functions -> Set State for Action Resolution
      
      actCancel: function (e) {
        this.coinState = [false, false, false, false, false];
        this.$.game_bbar.buttonStates = [false, false, false, false, true];
        this.turnState = 0;
        var msg = this.players[this.activepid].name + " select an action.";
        this.fire('game-message', { message : msg });
      },
      actPcard: function (e) {
        this.turnState = 1;
        this.$.game_bbar.buttonStates = [true, true, true, true, false];
        var msg = this.players[this.activepid].name + " select a supply to purchase.";
        this.fire('game-message', { message : msg });
      },
      actCoin3: function (e) {
        this.turnState = 3;
        this.$.game_bbar.buttonStates = [true, true, true, true, false];
        var msg = this.players[this.activepid].name + " select 3 differant coins.";
        this.fire('game-message', { message : msg });
      },
      actCoin2: function (e) {
        this.turnState = 4;
        this.$.game_bbar.buttonStates = [true, true, true, true, false];
        var msg = this.players[this.activepid].name + " select a coin.";
        this.fire('game-message', { message : msg });
      },
      
      // Action Resolution functions
      
      cardClick: function (e) {
        if(this.online) {
          return;
        };
        
        // Resolve Pcard State
        if(this.turnState == 1) {
          var cid = e.detail.cid;
          var cost = [];
          var tSupply = [];
          cost[0] = this.activeBoard[cid].white - this.players[this.activepid].white_p;
          cost[1] = this.activeBoard[cid].blue - this.players[this.activepid].blue_p;
          cost[2] = this.activeBoard[cid].green - this.players[this.activepid].green_p;
          cost[3] = this.activeBoard[cid].red - this.players[this.activepid].red_p;
          cost[4] = this.activeBoard[cid].black - this.players[this.activepid].black_p;
          tSupply[0] = this.players[this.activepid].white;
          tSupply[1] = this.players[this.activepid].blue;
          tSupply[2] = this.players[this.activepid].green;
          tSupply[3] = this.players[this.activepid].red;
          tSupply[4] = this.players[this.activepid].black;
          for(i=0;i<cost.length;i++) {
            if(cost[i]>0) {
              // console.log("Cost Array["+i+"]: "+cost[i]+" tSupply Array["+i+"]: "+tSupply[i]);
              if(cost[i]>0) {
                tSupply[i] = tSupply[i] - cost[i];
              };
              if(tSupply[i]<0) {
                var msg = "Insufficient supply to purchase.";
                this.fire('game-message', { message : msg });
                return;
              }
            };
          };
          
          this.coinSupply[0] = this.coinSupply[0] + (this.players[this.activepid].white - tSupply[0]);
          this.coinSupply[1] = this.coinSupply[1] + (this.players[this.activepid].blue - tSupply[1]);
          this.coinSupply[2] = this.coinSupply[2] + (this.players[this.activepid].green - tSupply[2]);
          this.coinSupply[3] = this.coinSupply[3] + (this.players[this.activepid].red - tSupply[3]);
          this.coinSupply[4] = this.coinSupply[4] + (this.players[this.activepid].black - tSupply[4]);
          
          this.players[this.activepid].white = tSupply[0];
          this.players[this.activepid].blue = tSupply[1];
          this.players[this.activepid].green = tSupply[2];
          this.players[this.activepid].red = tSupply[3];
          this.players[this.activepid].black = tSupply[4];
          
          var tier = this.activeBoard[cid].tier;
          var sIndx = 0;
          if(tier > 1) {
            for(i=0;i < (tier - 2);i++) {
              sIndx = sIndx + this.activeBoard[i].supply;
            };
          };
          var eIndx = sIndx + this.activeBoard[tier - 1].supply
          
          this.players[this.activepid].vp = this.players[this.activepid].vp + this.activeBoard[cid].vp;
          console.log(this.activeBoard[cid]);
          switch(this.activeBoard[cid].supply) {
            case 1:
              console.log("Adding white_p")
              this.players[this.activepid].white_p = this.players[this.activepid].white_p+1;
              break;
            case 2:
              this.players[this.activepid].blue_p = this.players[this.activepid].blue_p+1;
              break;
            case 3:
              this.players[this.activepid].green_p = this.players[this.activepid].green_p+1;
              break;
            case 4:
              this.players[this.activepid].red_p = this.players[this.activepid].red_p+1;
              break;
            case 5:
              this.players[this.activepid].black_p = this.players[this.activepid].black_p+1;
              break;
          };
          
          if(sIndx != eIndx) {
            var cardIndx = Math.floor(Math.random() * (eIndx - sIndx)) + sIndx;
            this.activeBoard[cid] = this.deck[cardIndx]
            this.activeBoard[cid].cid = cid;
            this.deck.splice(cardIndx, 1);
            this.activeBoard[tier-1].supply--
          };
          this.fire('new-turn');
        };
        
      },
      
      coinClick: function (e) {
        if(this.online){
          return;
        };          
        var success = false;
        
        // Resolve Coin3 State
        
        if(this.turnState == 3) {
          var type = e.detail.type - 1;
          if(type >= 5) {
            return;
          };
          if(this.coinSupply[type] > 0) {
            if(!this.coinState[type]) {
              this.hCount++;
            }else{
              this.hCount--;
            };
            this.coinState[type] = !this.coinState[type];
            success = true;
          };
          if(this.hCount == 3) {
            for(i=0;i<this.coinState.length;i++) {
              if(this.coinState[i]) {
                this.coinSupply[i]--;
                switch(i) {
                  case 0:
                    this.players[this.activepid].white++;
                    break;
                  case 1:
                    this.players[this.activepid].blue++;
                    break;
                  case 2:
                    this.players[this.activepid].green++;
                    break;
                  case 3:
                    this.players[this.activepid].red++;
                    break;
                  case 4:
                    this.players[this.activepid].black++;
                    break;
                };
              };
            };
            this.hCount = 0;
            this.coinState = [false, false, false, false, false];
            this.fire('new-turn');
            return;
          };
          
          if(!success) {
            var msg = "Unable to pickup coin.";
            this.fire('game-message', { message : msg });
            return;
          };
          return;
        };
          
        // Resolve Coin2 State
        
        if(this.turnState == 4) {
          switch(e.detail.type) {
            case 1:
              if(this.coinSupply[0] > this.coinMin) {
                this.players[this.activepid].white++;
                this.players[this.activepid].white++;
                this.coinSupply[0]--
                this.coinSupply[0]--
                success = true;
              }
              break;
            case 2:
              if(this.coinSupply[1] > this.coinMin) {
                this.players[this.activepid].blue++;
                this.players[this.activepid].blue++;
                this.coinSupply[1]--;
                this.coinSupply[1]--;
                success = true;
              }
              break;
            case 3:
              if(this.coinSupply[2] > this.coinMin) {
                this.players[this.activepid].green++;
                this.players[this.activepid].green++;
                this.coinSupply[2]--;
                this.coinSupply[2]--;
                success = true;
              }
              break;
            case 4:
              if(this.coinSupply[3] > this.coinMin) {
                this.players[this.activepid].red++;
                this.players[this.activepid].red++;
                this.coinSupply[3]--;
                this.coinSupply[3]--;
                success = true;
              }
              break;
            case 5:
              if(this.coinSupply[4] > this.coinMin) {
                this.players[this.activepid].black++;
                this.players[this.activepid].black++;
                this.coinSupply[4]--;
                this.coinSupply[4]--;
                success = true;
              }
              break;
            case 6:
              break;
          };
          if(success == false) {
            var msg = "Unable to pickup coin.";
            this.fire('game-message', { message : msg });
            return;
          };
          this.fire('new-turn');
        };
      },
      
    });

  </script>

</polymer-element>