Add 256 model, show when evaluation fails

frontend/public/models/256-shallow-autoencoder/model.json

@@ -0,0 +1 @@
+{"format": "layers-model", "generatedBy": "keras v2.12.0", "convertedBy": "TensorFlow.js Converter v4.11.0", "modelTopology": {"keras_version": "2.12.0", "backend": "tensorflow", "model_config": {"class_name": "Sequential", "config": {"name": "sequential", "layers": [{"class_name": "InputLayer", "config": {"batch_input_shape": [null, 833], "dtype": "float32", "sparse": false, "ragged": false, "name": "dense_input"}}, {"class_name": "Dense", "config": {"name": "dense", "trainable": true, "dtype": "float32", "batch_input_shape": [null, 833], "units": 256, "activation": "relu", "use_bias": true, "kernel_initializer": {"class_name": "GlorotUniform", "config": {"seed": null}}, "bias_initializer": {"class_name": "Zeros", "config": {}}, "kernel_regularizer": null, "bias_regularizer": null, "activity_regularizer": null, "kernel_constraint": null, "bias_constraint": null}}, {"class_name": "Dense", "config": {"name": "dense_1", "trainable": true, "dtype": "float32", "units": 833, "activation": "relu", "use_bias": true, "kernel_initializer": {"class_name": "GlorotUniform", "config": {"seed": null}}, "bias_initializer": {"class_name": "Zeros", "config": {}}, "kernel_regularizer": null, "bias_regularizer": null, "activity_regularizer": null, "kernel_constraint": null, "bias_constraint": null}}]}}, "training_config": {"loss": "mse", "metrics": null, "weighted_metrics": null, "loss_weights": null, "optimizer_config": {"class_name": "Custom>Adam", "config": {"name": "Adam", "weight_decay": null, "clipnorm": null, "global_clipnorm": null, "clipvalue": null, "use_ema": false, "ema_momentum": 0.99, "ema_overwrite_frequency": null, "jit_compile": false, "is_legacy_optimizer": false, "learning_rate": 0.0010000000474974513, "beta_1": 0.9, "beta_2": 0.999, "epsilon": 1e-07, "amsgrad": false}}}}, "weightsManifest": [{"paths": ["group1-shard1of1.bin"], "weights": [{"name": "dense/kernel", "shape": [833, 256], "dtype": "float32"}, {"name": "dense/bias", "shape": [256], "dtype": "float32"}, {"name": "dense_1/kernel", "shape": [256, 833], "dtype": "float32"}, {"name": "dense_1/bias", "shape": [833], "dtype": "float32"}]}]}

frontend/src/components/Evaluation.vue

@@ -1,16 +1,17 @@
 <template>
   <v-tooltip location="bottom">
-    <p class="text-h4">{{ display(evaluation) }}</p>
+    <p class="text-h4">{{ error ? error : display(evaluation) }}</p>
     <template v-slot:activator="{ props }">
       <v-progress-linear
         v-model="displayEvaluation"
         :max="1.0"
         :min="0.0"
-        color="white"
-        background-color="black"
+        :color="error ? 'red' : 'white'"
+        :background-color="error ? '#ddd' : 'black'"
         :reverse="blackLeft"
         height="20"
         :indeterminate="model === null"
+        :striped="!!error"
         class="rounded-xl mt-4"
         v-bind="props"
         >
@@ -31,6 +32,7 @@ export default {
     model: null as Model<StandardPositionalInput, Evaluation> | null,
     evaluation: 0.5,
     blackLeft: loadSetting("orientation") === "black",
+    error: null as null | string,
   }),
   props: {
     fen: {
@@ -62,7 +64,14 @@ export default {
       if (!this.model) {
         return;
       }
-      const positionalInput = fenToStandardPositionalInput(this.fen);
+      this.error = null;
+      let positionalInput;
+      try {
+        positionalInput = fenToStandardPositionalInput(this.fen); // TODO: make this not use chess.js to allow invalid
+      } catch(e) {
+        this.error = e + "";
+        return;
+      }
       const evaluation = this.model.predict(positionalInput);
       this.evaluation = evaluationOutputToEvaluation(evaluation);
     },

frontend/src/components/Main.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <v-row>
+    <v-row class="main-grid">
       <v-col cols="12" sm="8" md="6" lg="4">
         <div ref="board" id="chessground-main"></div>
         <Evaluation :fen="fen" v-if="show.evaluation && !gameOver" class="mt-4"/>
@@ -392,4 +392,8 @@ export default {
 cg-board {
   background-color: #bfcfdd;
 }
+
+.main-grid {
+  transition: all 0.5s ease;
+}
 </style>

frontend/src/neural-models/model.ts

@@ -57,6 +57,7 @@ export const autoencoderModelNames = [
   "256-64-autoencoder",
   "256-128-autoencoder",
   "128-shallow-autoencoder",
+  "256-shallow-autoencoder",
 ] as const;
 
 export type AutoencoderModelName = typeof autoencoderModelNames[number];