Merge pull request #241 from battlecode/blockchainclient

arvid220u · web-flow · commit 8d601ad67e53 · 2020-01-09T18:08:58.000-05:00
Show blockchain in client
diff --git a/client/playback/out/index.d.ts b/client/playback/out/index.d.ts
@@ -5,7 +5,7 @@ import * as metadata from './metadata';
 import StructOfArrays from './soa';
 import * as soa from './soa';
 import Match from './match';
-import { Log } from './match';
+import { Log, Block, Transaction } from './match';
 import Game from './game';
 import { flatbuffers, schema } from 'battlecode-schema';
-export { Game, Log, Match, GameWorld, gameworld, Metadata, metadata, StructOfArrays, soa, flatbuffers, schema };
+export { Game, Log, Block, Transaction, Match, GameWorld, gameworld, Metadata, metadata, StructOfArrays, soa, flatbuffers, schema };
diff --git a/client/playback/out/match.d.ts b/client/playback/out/match.d.ts
@@ -8,6 +8,14 @@ export declare type Log = {
     round: number;
     text: string;
 };
+export declare type Transaction = {
+    cost: number;
+    message: Array<number>;
+};
+export declare type Block = {
+    messages: Array<Transaction>;
+    round: number;
+};
 /**
  * A timeline of a match. Allows you to see what the state of the match was,
  * at any particular time.
@@ -46,6 +54,10 @@ export default class Match {
      * The logs of this match, bucketed by round.
      */
     readonly logs: Array<Array<Log>>;
+    /**
+     * The blockchain, an array of blocks per round.
+     */
+    readonly blockchain: Array<Block>;
     /**
      * The current game world.
      * DO NOT CACHE this reference between calls to seek() and compute(), it may
@@ -93,6 +105,10 @@ export default class Match {
      * Store a schema.Round and the logs contained in it.
      */
     applyDelta(delta: schema.Round): void;
+    /**
+     * parses blockchain broadcasts
+     */
+    parseBlockchain(delta: schema.Round): void;
     /**
      * Parse logs for a round.
      */
diff --git a/client/playback/out/match.js b/client/playback/out/match.js
@@ -32,6 +32,7 @@ class Match {
         this.snapshots.push(this._current.copy());
         this.deltas = new Array(1);
         this.logs = new Array(1);
+        this.blockchain = new Array(1);
         this.maxTurn = header.maxRounds();
         this._lastTurn = null;
         this._seekTo = 0;
@@ -76,6 +77,88 @@ class Match {
         if (delta.logs()) {
             this.parseLogs(delta.roundID(), delta.logs(battlecode_schema_1.flatbuffers.Encoding.UTF16_STRING));
         }
+        this.parseBlockchain(delta);
+    }
+    /**
+     * parses blockchain broadcasts
+     */
+    parseBlockchain(delta) {
+        let blockMessages = new Array();
+        // lol the schema format for this is real weird
+        // THIS IS THE HACKIEST SOLUTION MANKIND HAS EVER SEEN
+        // another option is actually changing the schema, but we can't remove parts of it
+        // so then we would need to add a new thing
+        // which would (1) break old replays and (2) have twice as big new replays
+        // sorry this is probably the best solution
+        // DO NOT COPY THIS CODE FOR FUTURE USE. MODIFY!!!
+        let j = 0;
+        let messageStringLen = delta.broadcastedMessagesLength();
+        for (let i = 0; i < delta.broadcastedMessagesCostsLength(); i++) {
+            let messageCost = delta.broadcastedMessagesCosts(i);
+            // console.log(messageCost);
+            // let x = delta.broadcastedMessages(j, flatbuffers.Encoding.UTF16_STRING);
+            // var offset = delta.bb!.__offset(delta.bb_pos, 42);
+            // var h = delta.bb!.__vector(delta.bb_pos + offset)
+            // console.log(h);
+            // var k = delta.bb!.readInt32(h);
+            // console.log(k);
+            // console.log(delta.bb!.readInt32(h+4));
+            // console.log(delta.bb!.readInt32(h+8));
+            // console.log(delta.bb!.readInt32(h+12));
+            // console.log(delta.bb!.readInt32(h+16));
+            let thisTransaction = "";
+            let offset = delta.bb.__offset(delta.bb_pos, 42);
+            let startPointer = delta.bb.__vector(delta.bb_pos + offset);
+            if (offset) {
+                // this is ascii
+                let x = String.fromCharCode(delta.bb.readInt32(startPointer + 4 * j));
+                while (x !== ' ') {
+                    // console.log(x);
+                    // this will be 
+                    thisTransaction += x;
+                    j += 1;
+                    if (j >= messageStringLen) {
+                        console.log("BLOCKCHAIN ERROR SHOULD NEVER HAPPEN");
+                        break;
+                    }
+                    x = String.fromCharCode(delta.bb.readInt32(startPointer + 4 * j));
+                }
+                j += 1;
+                // now split this transaction on _
+                let splitMessage = thisTransaction.split("_");
+                let messageArr = new Array();
+                for (let j = 0; j < splitMessage.length; j++) {
+                    messageArr.push(parseInt(splitMessage[j]));
+                }
+                blockMessages.push({
+                    cost: messageCost,
+                    message: messageArr
+                });
+            }
+            else {
+                console.log("couldn't display blockchain");
+            }
+        }
+        // console.log(blockMessages);
+        // for (let i = 0; i < delta.broadcastedMessagesCostsLength(); i++) {
+        // let messageString = delta.broadcastedMessages(i);
+        // let messageCost = delta.broadcastedMessagesCosts(i);
+        // console.log(messageString);
+        // // string is formatted as int_int_int
+        // let splitMessage = messageString.split("_");
+        // let messageArr = new Array<number>();
+        // for (let j = 0; j < splitMessage.length; j++) {
+        //   messageArr.push(parseInt(splitMessage[j]));
+        // }
+        // blockMessages.push({
+        //   cost: messageCost,
+        //   message: messageArr
+        // });
+        // }
+        this.blockchain.push({
+            messages: blockMessages,
+            round: delta.roundID()
+        });
     }
     /**
      * Parse logs for a round.
diff --git a/client/playback/src/index.ts b/client/playback/src/index.ts
@@ -5,10 +5,10 @@ import * as metadata from './metadata';
 import StructOfArrays from './soa';
 import * as soa from './soa';
 import Match from './match';
-import {Log} from './match';
+import {Log,Block,Transaction} from './match';
 import Game from './game';
 import { flatbuffers, schema } from 'battlecode-schema';
 
-export {Game, Log, Match, GameWorld, gameworld, Metadata, metadata, StructOfArrays, soa, flatbuffers, schema};
+export {Game, Log, Block, Transaction, Match, GameWorld, gameworld, Metadata, metadata, StructOfArrays, soa, flatbuffers, schema};
 
 // TODO provide ergonomic main export
diff --git a/client/playback/src/match.ts b/client/playback/src/match.ts
@@ -10,6 +10,16 @@ export type Log = {
   text: string
 };
 
+export type Transaction = {
+  cost: number,
+  message: Array<number>
+}
+
+export type Block = {
+  messages: Array<Transaction>,
+  round: number
+}
+
 // Return a timestamp representing the _current time in ms, not necessarily from
 // any particular epoch.
 const timeMS: () => number = typeof window !== 'undefined' && window.performance && window.performance.now?
@@ -57,6 +67,11 @@ export default class Match {
    */
   readonly logs: Array<Array<Log>>;
 
+  /**
+   * The blockchain, an array of blocks per round.
+   */
+  readonly blockchain: Array<Block>;
+
   /**
    * The current game world.
    * DO NOT CACHE this reference between calls to seek() and compute(), it may
@@ -118,6 +133,7 @@ export default class Match {
     this.snapshots.push(this._current.copy());
     this.deltas = new Array(1);
     this.logs = new Array(1);
+    this.blockchain = new Array(1);
     this.maxTurn = header.maxRounds();
     this._lastTurn = null;
     this._seekTo = 0;
@@ -136,6 +152,93 @@ export default class Match {
     if(delta.logs()){
       this.parseLogs(delta.roundID(), <string> delta.logs(flatbuffers.Encoding.UTF16_STRING));
     }
+    this.parseBlockchain(delta);
+  }
+
+  /**
+   * parses blockchain broadcasts
+   */
+  parseBlockchain(delta: schema.Round) {
+    let blockMessages = new Array<Transaction>();
+
+    // lol the schema format for this is real weird
+    // THIS IS THE HACKIEST SOLUTION MANKIND HAS EVER SEEN
+    // another option is actually changing the schema, but we can't remove parts of it
+    // so then we would need to add a new thing
+    // which would (1) break old replays and (2) have twice as big new replays
+    // sorry this is probably the best solution
+    // DO NOT COPY THIS CODE FOR FUTURE USE. MODIFY!!!
+
+    let j = 0;
+    let messageStringLen = delta.broadcastedMessagesLength();
+    for (let i = 0; i < delta.broadcastedMessagesCostsLength(); i++) {
+      let messageCost = delta.broadcastedMessagesCosts(i);
+      // console.log(messageCost);
+      // let x = delta.broadcastedMessages(j, flatbuffers.Encoding.UTF16_STRING);
+      // var offset = delta.bb!.__offset(delta.bb_pos, 42);
+      // var h = delta.bb!.__vector(delta.bb_pos + offset)
+      // console.log(h);
+      // var k = delta.bb!.readInt32(h);
+      // console.log(k);
+      // console.log(delta.bb!.readInt32(h+4));
+      // console.log(delta.bb!.readInt32(h+8));
+      // console.log(delta.bb!.readInt32(h+12));
+      // console.log(delta.bb!.readInt32(h+16));
+      let thisTransaction = "";
+      let offset = delta.bb!.__offset(delta.bb_pos, 42);
+      let startPointer = delta.bb!.__vector(delta.bb_pos + offset);
+      if (offset) {
+        // this is ascii
+        let x = String.fromCharCode(delta.bb!.readInt32(startPointer + 4*j));
+        while (x !== ' ') {
+          // console.log(x);
+          // this will be 
+          thisTransaction += x;
+          j += 1;
+          if (j >= messageStringLen) {
+            console.log("BLOCKCHAIN ERROR SHOULD NEVER HAPPEN");
+            break;
+          }
+          x = String.fromCharCode(delta.bb!.readInt32(startPointer + 4*j));
+        }
+        j += 1;
+        // now split this transaction on _
+        let splitMessage = thisTransaction.split("_");
+        let messageArr = new Array<number>();
+        for (let j = 0; j < splitMessage.length; j++) {
+          messageArr.push(parseInt(splitMessage[j]));
+        }
+        blockMessages.push({
+          cost: messageCost,
+          message: messageArr
+        });
+      } else {
+        console.log("couldn't display blockchain");
+      }
+    }
+
+    // console.log(blockMessages);
+
+    // for (let i = 0; i < delta.broadcastedMessagesCostsLength(); i++) {
+      // let messageString = delta.broadcastedMessages(i);
+      // let messageCost = delta.broadcastedMessagesCosts(i);
+      // console.log(messageString);
+      // // string is formatted as int_int_int
+      // let splitMessage = messageString.split("_");
+      // let messageArr = new Array<number>();
+      // for (let j = 0; j < splitMessage.length; j++) {
+      //   messageArr.push(parseInt(splitMessage[j]));
+      // }
+      // blockMessages.push({
+      //   cost: messageCost,
+      //   message: messageArr
+      // });
+    // }
+
+    this.blockchain.push({
+      messages: blockMessages,
+      round: delta.roundID()
+    });
   }
 
   /**
diff --git a/client/visualizer/src/app.ts b/client/visualizer/src/app.ts
@@ -672,6 +672,7 @@ export default class Client {
       // @ts-ignore
       renderer.render(match.current, match.current.minCorner, match.current.maxCorner);
 
+      this.stats.showBlock(match.blockchain[match.current.turn]);
       this.updateStats(match.current, meta);
       this.loopID = window.requestAnimationFrame(loop);
 
diff --git a/client/visualizer/src/game/sidebar/stats.ts b/client/visualizer/src/game/sidebar/stats.ts
@@ -1,6 +1,7 @@
 import {Config} from '../../config';
 import * as cst from '../../constants';
 import {AllImages} from '../../imageloader';
+import {Block,Transaction} from 'battlecode-playback';
 
 import {schema} from 'battlecode-playback';
 
@@ -34,6 +35,8 @@ export default class Stats {
 
   private robotConsole: HTMLDivElement;
 
+  private blockchain: HTMLDivElement;
+
   private conf: Config;
 
   // Note: robot types and number of teams are currently fixed regardless of
@@ -233,7 +236,42 @@ export default class Stats {
     this.statsTableElement = this.statsTable(teamIDs);
     this.div.appendChild(this.statsTableElement);
     
-    this.div.appendChild(this.images.soup);
+    this.div.appendChild(document.createElement('br'));
+
+    const bl = document.createElement("span");
+    bl.innerText = "Blockchain";
+    this.div.appendChild(bl);
+    this.div.appendChild(document.createElement('br'));
+    this.div.appendChild(this.blockchainViewer());
+  }
+
+  blockchainViewer(): HTMLDivElement {
+    // create a blockchain
+    this.blockchain = document.createElement('div');
+
+    // make it a console
+    this.blockchain.id = "blockchain";
+    this.blockchain.className = "console";
+
+    return this.blockchain;
+  }
+
+  public showBlock(block: Block): void {
+    if (block !== undefined) {
+      const div = document.createElement("div");
+      // Replace \n with <br>
+      const span = document.createElement("span");
+      let text = "Block #" + String(block.round) + ":<br><br>";
+      block.messages.forEach(t => {
+          text += "cost: " + t.cost + "<br>message: " + t.message.join(', ') + "<br><br>";
+      });
+      span.innerHTML = text;
+      div.appendChild(span);
+      while (this.blockchain.firstChild) {
+        this.blockchain.removeChild(this.blockchain.firstChild);
+      }
+      this.blockchain.appendChild(div);
+    }
   }
 
   addViewOptions(){
