Diagonal screw tubes, laid by a 45° drag (t35)

- Tubes run in eight directions: a drag at about 45° lays a diagonal run, R cycles all eight.
- Diagonal runs carry grains at the straight rate (120 grains/s), join straight tubes and belts,
  keep grains in at the corners, pass water, and carry bars level.
- New part ids 11-14 (saved ids are never renumbered); tube checks use an IS_TUBE table.
- New test/t_diag_tubes.js (85 checks).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/render/overlays.js

@@ -39,7 +39,7 @@ function drawFlowArrows() {
     const b = by * BW + bx, code = blockP[b];
     if (code !== BP_BELT && code !== BP_TUBE && code !== BP_PUMP && code !== BP_OUTLET) continue;
     const vv = blockV[b];
-    const [dx, dy] = code === BP_BELT ? (vv ? [1, 0] : [-1, 0]) : code === BP_PUMP ? PUMP_V[vv & 3] : code === BP_OUTLET ? OUTLET_V[vv & 3] : [[0, -1], [1, 0], [0, 1], [-1, 0]][vv & 3];
+    const [dx, dy] = code === BP_BELT ? (vv ? [1, 0] : [-1, 0]) : code === BP_PUMP ? PUMP_V[vv & 3] : code === BP_OUTLET ? OUTLET_V[vv & 3] : TUBE_DIRS[vv & 7];
     const c = worldToScreenPx(bx * BS + BS / 2, by * BS + BS / 2);
     ctx.fillStyle = 'rgba(14,12,11,0.55)'; ctx.beginPath(); ctx.arc(c.x, c.y, r * 1.35, 0, Math.PI * 2); ctx.fill();
     ctx.strokeStyle = code === BP_TUBE ? '#ffc58a' : '#e7dccb'; ctx.lineWidth = Math.max(1.2, r * 0.32);

src/render/smooth-shaders.js

@@ -245,11 +245,16 @@ void main() {
       C = mix(C, bc, inside);
     }
   }
-  else if (nc >= 9 && nc <= 12) {
+  else if ((nc >= 9 && nc <= 12) || (nc >= 19 && nc <= 22)) {
     // screw tube: a copper pipe; what is inside shows through, and the screw's flights turn
     bool vert = nc == 9 || nc == 11;
     float sp2 = nc == 9 ? -1.0 : nc == 10 ? 1.0 : nc == 11 ? 1.0 : -1.0;
     float a = (vert ? fract(w.x * 0.25) : fract(w.y * 0.25)) * 4.0, along = vert ? w.y : w.x;
+    if (nc >= 19) {
+      vec2 d = nc == 19 ? vec2(1.0, -1.0) : nc == 20 ? vec2(1.0, 1.0) : nc == 21 ? vec2(-1.0, 1.0) : vec2(-1.0, -1.0);
+      a = fract(dot(w, vec2(-d.y, d.x)) * 0.25) * 4.0;
+      along = dot(w, d); sp2 = 1.0;
+    }
     float wall = 0.62;
     vec3 tc;
     if (a < wall || a > 4.0 - wall) {

src/render/world.js

@@ -3,7 +3,8 @@ function fogColor(c, k) { return (c & 0xff000000) | (((c >>> 16 & 255) * k) << 1
 // drawWorld: the per-grain pixel buffer (pixel look), also the input of the smooth look.
 // ---------- World pixels ----------
 // smooth-look class of a screw tube cell by direction: 9 up, 10 right, 11 down, 12 left
-const TUBE_CLASS = new Uint8Array(9); TUBE_CLASS[1] = 9; TUBE_CLASS[4] = 10; TUBE_CLASS[2] = 11; TUBE_CLASS[3] = 12;
+const TUBE_CLASS = new Uint8Array(15); TUBE_CLASS[1] = 9; TUBE_CLASS[4] = 10; TUBE_CLASS[2] = 11; TUBE_CLASS[3] = 12;
+for (let p = P_TUR; p <= P_TUL; p++) TUBE_CLASS[p] = 19 + p - P_TUR;
 function drawWorld() {
   const bw = R.bw, bh = R.bh, px = R.px;
   R.vx0 = Math.floor(R.camX); R.vy0 = Math.floor(R.camY);
@@ -155,13 +156,14 @@ function drawWorld() {
       }
       // field parts drawn over contents
       const p = part[i];
-      if (p && sm && (p <= P_TR || p === P_FILTER)) { if (m === EMPTY || PH[m] === PH_GAS) { r = 0; g = 0; b = 0; } else { r = Math.max(1, r); } }
+      if (p && sm && (IS_TUBE[p] || p === P_FILTER)) { if (m === EMPTY || PH[m] === PH_GAS) { r = 0; g = 0; b = 0; } else { r = Math.max(1, r); } }
       else if (p) {
-        if (p <= P_TR) {
+        if (IS_TUBE[p]) {
           const on = netSat(i) > 0;
-          const vert = p === P_TU || p === P_TD;
-          const axis = vert ? y : x, across = vert ? x & 3 : y & 3;
-          const dir = (p === P_TU || p === P_TL) ? 1 : -1;
+          const vert = p === P_TU || p === P_TD, diagonal = TDX[p] && TDY[p];
+          const axis = diagonal ? x * TDX[p] + y * TDY[p] : vert ? y : x;
+          const across = diagonal ? ((x * -TDY[p] + y * TDX[p]) & 3) : vert ? x & 3 : y & 3;
+          const dir = diagonal ? -1 : (p === P_TU || p === P_TL) ? 1 : -1;
           if (across === 0 || across === 3) { // copper casing on the two long sides; its load shows through
             if (m === EMPTY) { r = 150; g = 96; b = 64; } else { r = r * 0.72 + 44; g = g * 0.72 + 26; b = b * 0.72 + 14; }
             if ((axis & 3) === 0) { r -= 24; g -= 18; b -= 12; }
@@ -217,7 +219,7 @@ function drawWorld() {
         // 4 built piece (drawn crisp), 5 smoke and flame, 6 built wall block (drawn as a tile)
         let cl = 0;
         const pt = p === P_PIPE && !pipeBodyCell(x, y) ? 0 : p; // the open parts of a pipe block show what is in them
-        if (pt >= P_TU && pt <= P_TR) cl = TUBE_CLASS[pt];
+        if (IS_TUBE[pt]) cl = TUBE_CLASS[pt];
         else if (p === P_FILTER) {
           // filter: 13 carries left, 14 right; the tree buffer carries its colour tag (first material) and mode
           const fb = (y >> 2) * BW + (x >> 2), fc = filterCfg.get(fb), fm = fc && fc.m.length ? fc.m[0] : 0;