Update padding and fix wiring order

sim/visuals/controlView.ts

@@ -12,6 +12,7 @@ namespace pxsim.visuals {
 
         constructor(protected parent: SVGSVGElement, protected globalDefs: SVGDefsElement, protected state: T, protected port: number) {
             super(state);
+
         }
 
         getInnerWidth(): number {
@@ -57,7 +58,6 @@ namespace pxsim.visuals {
         }
 
         onComponentVisible() {
-
         }
     }
 }

sim/visuals/layoutView.ts

@@ -153,12 +153,6 @@ namespace pxsim.visuals {
             this.contentGroup = svg.elt("g") as SVGGElement;
             this.scrollGroup = svg.child(this.contentGroup, "g") as SVGGElement;
 
-            // Inject all view containers
-            for (let i = 0; i < 4; i++) {
-                this.inputContainers[i].inject(this.scrollGroup);
-                this.outputContainers[i].inject(this.scrollGroup);
-            }
-
             this.inputs = [];
             this.outputs = [];
             this.inputControls = [];
@@ -172,6 +166,12 @@ namespace pxsim.visuals {
                 this.inputWires[port].inject(this.scrollGroup);
             }
 
+            // Inject all view containers
+            for (let i = 0; i < 4; i++) {
+                this.inputContainers[i].inject(this.scrollGroup);
+                this.outputContainers[i].inject(this.scrollGroup);
+            }
+
             // Inject all ports
             this.setInput(0, new PortView(0, 'A'));
             this.setInput(1, new PortView(1, 'B'));
@@ -267,7 +267,7 @@ namespace pxsim.visuals {
             currentY = moduleHeight;
 
             const wireBrickSpacing = brickWidth / 5;
-            const wiringYPadding = 0;
+            const wiringYPadding = 5;
             let wireStartX = 0;
             let wireEndX = brickPadding + wireBrickSpacing;
             let wireEndY = currentY + this.getWiringHeight() + wiringYPadding;

sim/visuals/nodes/colorSensorView.ts

@@ -10,7 +10,7 @@ namespace pxsim.visuals {
         }
 
         public getPaddingRatio() {
-            return 1 / 6;
+            return 1 / 4;
         }
 
         public updateState() {

sim/visuals/nodes/gyroSensorView.ts

@@ -8,7 +8,7 @@ namespace pxsim.visuals {
         }
 
         public getPaddingRatio() {
-            return 1 / 4;
+            return 0.3;
         }
     }
 }

sim/visuals/nodes/touchSensorView.ts

@@ -17,7 +17,7 @@ namespace pxsim.visuals {
         }
 
         public getPaddingRatio() {
-            return 1 / 10;
+            return 1 / 4;
         }
 
         public hasClick() {