fixed move & rotate tweens + mapping to child OK

app/assets/json/agents/basic3D.json

@@ -6,7 +6,7 @@
         "children": [
             {
                 "type": "Mesh",
-                "idSuffix": "head",
+                "childSuffix": "head",
                 "geometry": { "type": "SphereGeometry", "args": [0.3, 16, 16] },
                 "material": { "type": "MeshStandardMaterial", "color": "blue" },
                 "position": [0, 0.5, 0]

app/assets/json/arena/arenaConfig1.json

@@ -0,0 +1,7 @@
+{
+    "arenaSize": {
+        "x": 100,
+        "y": 100,
+        "z": 100
+    }
+}

app/assets/json/threetobus/eventsMapping.example.json

@@ -0,0 +1,56 @@
+[
+    {
+        "chan": "gps:agents",
+        "events": [
+            {
+                "eventName": "move",
+                "mappings": [
+                    {
+                        "id": "aid",
+                        "assign": {
+                            "position.x": "coords.x",
+                            "position.z": "coords.y",
+                            "position.y": "coords.z"
+                        },
+                        "tween": true,
+                        "tweenDelay": 1000
+                    }
+                ]
+            }
+        ]
+    },
+    {
+        "chan": "agent:*",
+        "events": [
+            {
+                "eventName": "age",
+                "mappings": [
+                    {
+                        "id": "aid",
+                        "assign": {
+                            "fill": {
+                                "arguments": ["age"],
+                                "transformer": "rgb(${Math.round(255 * age / 10)},0,${Math.round(255 * (1 - age / 10))})"                                
+                            }
+                        }
+                    }
+                ]
+            },
+            {
+                "eventName": "rotate",
+                "mappings": [
+                    {
+                        "id": "aid",
+                        "assign": {
+                            "rotation.x": "facing.x",
+                            "rotation.y": "facing.y",
+                            "rotation.z": "facing.z"
+                        },
+                        "tween": true,
+                        "tweenDelay": 500
+                    }
+                ]
+            }
+        ]
+    }
+]

app/assets/json/threetobus/eventsMapping.json

@@ -3,7 +3,7 @@
         "chan": "gps:agents",
         "events": [
             {
-                "eventName": "moving",
+                "eventName": "move",
                 "mappings": [
                     {
                         "id": "aid",
@@ -16,35 +16,46 @@
                         "tweenDelay": 1000
                     }
                 ]
-            },
+            }
+        ]
+    },
+    {
+        "chan": "agents:*",
+        "events": [
             {
-                "eventName": "rotating",
+                "eventName": "age",
                 "mappings": [
                     {
                         "id": "aid",
                         "assign": {
-                            "r": "rotangle"
+                            "material.color": "color"
+                        }
+                    }
+                ]
+            },
+            {
+                "eventName": "rotate",
+                "mappings": [
+                    {
+                        "id": "aid",
+                        "assign": {
+                            "rotation.x": "facing.x",
+                            "rotation.y": "facing.y",
+                            "rotation.z": "facing.z"
                         },
                         "tween": true,
                         "tweenDelay": 500
                     }
                 ]
-            }
-        ]
-    },
-    {
-        "chan": "agent:*",
-        "events": [
+            },
             {
-                "eventName": "aging",
+                "eventName": "polarize",
                 "mappings": [
                     {
                         "id": "aid",
+                        "child": "head",
                         "assign": {
-                            "fill": {
-                                "arguments": ["age"],
-                                "transformer": "rgb(${Math.round(255 * age / 10)},0,${Math.round(255 * (1 - age / 10))})"
-                            }
+                            "material.color": "color"
                         }
                     }
                 ]

app/assets/styles/app.css

@@ -87,7 +87,7 @@ body[eicapp] {
 }
 [eicapp] .app-workspace .window {
     position: fixed;
-    padding: 3px;
+    padding: 5px;
     background: var(--app-color-secondary);
     box-shadow: 0 0 13px rgba(147, 255, 255, 0.55);
     right: auto;
@@ -107,6 +107,7 @@ body[eicapp] {
 }
 [eicapp] .app-workspace .window > header { 
     flex: 0 0 auto;
+    width: 100%;
 }
 [eicapp] .app-workspace .window > header h1 {
     padding: var(--eicui-base-spacing-xs);
@@ -127,13 +128,11 @@ body[eicapp] {
 [eicapp] .app-workspace .window > header .controls button.expand { display: inline-flex; }
 [eicapp] .app-workspace .window > header .controls button.shrink { display: none; }
 [eicapp] .app-workspace .window > section {
-    padding:  var(--eicui-base-spacing-2xs) var(--eicui-base-spacing-2xs);
     cursor: default;
-    margin: 0;
     overflow: hidden;
     transition: all 0.5s;
     flex: 1 1 auto;    
-
+    width: 100%;
 }
 [eicapp]  .app-workspace .window[device="tablet"] > section {
     padding: 0;
@@ -189,35 +188,35 @@ body[eicapp] {
   z-index: 2;
 }
 [eicapp] .app-workspace .window .handle[data-side="n"] {
-  top: -5px; left: 5px; right: 5px; height: 10px;
+  top: 0; left: 6px; right: 6px; height: 5px;
   cursor: n-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="e"] {
-  top: 5px; right: -5px; bottom: 5px; width: 10px;
+  top: 6px; right: 0; bottom: 6px; width: 5px;
   cursor: e-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="w"] {
-  top: 5px; left: -5px; bottom: 5px; width: 10px;
+  top: 6px; left: 0; bottom: 6px; width: 5px;
   cursor: w-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="nw"] {
-  top: -5px; left: -5px; width: 10px; height: 10px;
-  cursor: nw-resize;
+    top: 0px; left: 0px; width: 6px; height: 6px;
+    cursor: nw-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="ne"] {
-  top: -5px; right: -5px; width: 10px; height: 10px;
+  top: 0; right: 0; width: 6px; height: 6px;
   cursor: ne-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="s"] {
-  bottom: -5px; left: 5px; right: 5px; height: 10px;
+  bottom: 0; left: 6px; right: 6px; height: 5px;
   cursor: s-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="sw"] {
-  bottom: -5px; left: -5px; width: 10px; height: 10px;
+  bottom: -0; left: 0; width: 6px; height: 6px;
   cursor: sw-resize;
 }
 [eicapp] .app-workspace .window .handle[data-side="se"] {
-  bottom: -5px; right: -5px; width: 10px; height: 10px;
+  bottom: 0; right: 0; width: 6px; height: 6px;
   cursor: se-resize;
 }