tweaks and opt

code/draw.js

@@ -395,7 +395,7 @@ class Mesh
 function pushGradient(pos, size, color, color2)
 {
     const mesh = quadMesh;
-    const points = mesh.points.map(p=>p.multiply(size).add(pos));
+    const points = mesh.points.map(p=>p.multiply(size).addSelf(pos));
     const colors = [color, color, color2, color2];
     glPushColoredVerts(points, colors);
 }

code/game.js

@@ -31,7 +31,7 @@ const drawDistance = 1e3;          // how many track segments to draw
 const cameraPlayerOffset = vec3(0,680,1050);
 const checkpointTrackSegments = testQuick?1e3:4500;
 const checkpointDistance = checkpointTrackSegments*trackSegmentLength;
-const startCheckpointTime = 50;
+const startCheckpointTime = 45;
 const extraCheckpointTime = 40;
 const levelLerpRange = .1;
 const levelGoal = 10;
@@ -129,13 +129,6 @@ function gameStart()
 
 function gameUpdateInternal()
 {
-    if (document.hasFocus())
-    {
-        if (autoFullscreen && !isFullscreen())
-            toggleFullscreen();
-        autoFullscreen = 0;
-    }
-
     if (titleScreenMode)
     {
         // update title screen
@@ -242,7 +235,6 @@ function gameUpdateInternal()
 
 function gameUpdate(frameTimeMS=0)
 {
-    requestAnimationFrame(gameUpdate);
     if (!clampAspectRatios)
         mainCanvasSize = vec3(mainCanvas.width=innerWidth, mainCanvas.height=innerHeight);
     else
@@ -361,14 +353,22 @@ function gameUpdate(frameTimeMS=0)
     touchGamepadRender();
     drawHUD();
     debugDraw();
+    requestAnimationFrame(gameUpdate);
 }
 
 function enhancedModeUpdate()
 {
     if (!enhancedMode)
         return;
 
-    if (autoPause && !document.hasFocus() && !titleScreenMode && !isTouchDevice)
+    if (document.hasFocus())
+    {
+        if (autoFullscreen && !isFullscreen())
+            toggleFullscreen();
+        autoFullscreen = 0;
+    }
+
+    if (!titleScreenMode && !isTouchDevice && autoPause && !document.hasFocus())
         paused = 1; // pause when losing focus
 
     if (keyWasPressed('Home')) // dev mode

code/generative.js

@@ -437,7 +437,7 @@ function generateTetures()
         // road signs
         setupContext(0,5); // turn left
         {
-            drawSignBackground(.5,.5,WHITE,BLACK,.04,GRAY,.3,.3,1);
+            drawSignBackground(.5,.5,WHITE,BLACK,.05,GRAY,.3,.3,1);
             color(BLACK);
             triangle(.42,.5,.12,-PI/2)
             context.lineWidth=.09;

code/input.js

@@ -15,7 +15,7 @@ const keyWasPressed  = (key) => inputData[key] & 2 ? 1 : 0;
 const keyWasReleased = (key) => inputData[key] & 4 ? 1 : 0;
 const clearInput = () => inputData = [];
 
-let mousePos;
+let mousePos = vec3();
 const mouseIsDown      = keyIsDown;
 const mouseWasPressed  = keyWasPressed;
 const mouseWasReleased = keyWasReleased;
@@ -35,9 +35,6 @@ let inputData = []; // track what keys are down
 
 function inputInit()
 {
-    if (!js13kBuildLevel2)
-        mousePos = vec3();
-
     if (gamepadsEnable)
     {
         gamepadData = [];

code/levels.js

@@ -17,7 +17,7 @@ function initLevelInfos()
     LI.horizonSpriteSize = .5;
     //LI.tunnel = spriteList.tunnel2; // test tunnel
     LI.billboardChance = .3 // more billboards at start
-    LI.trafficDensity = .7; // less traffic start
+    //LI.trafficDensity = .7; // less traffic start
 
     // mostly straight with few well defined turns or bumps
     LI.turnChance = .6;
@@ -117,7 +117,7 @@ function initLevelInfos()
     LI.sunHeight = .7;
     LI.hazardType = spriteList.hazard_rocks;
     LI.hazardChance = .002;
-    LI.trafficDensity = js13kBuildLevel2 ? 1.5 : 1.2; // extra traffic through snow
+    LI.trafficDensity = 1.2; // extra traffic through snow
 
     // snowy mountains
     //LI.turnChance = .5;

code/scene.js

@@ -30,7 +30,7 @@ function drawSky()
         // top/bottom gradient
         const skyColorTop = levelInfoLast.skyColorTop.lerp(levelInfo.skyColorTop, levelLerpPercent);
         const skyColorBottom = levelInfoLast.skyColorBottom.lerp(levelInfo.skyColorBottom, levelLerpPercent);
-        pushGradient(cameraPos.add(vec3(0,skyH,skyZ)), vec3(skyW,skyH), skyColorTop,  skyColorBottom);
+        pushGradient(vec3(0,skyH,skyZ).addSelf(cameraPos), vec3(skyW,skyH), skyColorTop,  skyColorBottom);
 
         // light settings from sky
         glLightDirection = vec3(0,1,1).rotateY(worldHeading).normalize();
@@ -51,7 +51,7 @@ function drawSky()
         for(let i=0;i<1;i+=.05)
         {
             sunColor.a = i?(1-i)**7:1;
-            pushSprite(cameraPos.add(vec3( x*headingScale, sunHeight, skyZ)), vec3(sunSize*(1+i*30)), sunColor, i?dotSpriteTile:circleSpriteTile);
+            pushSprite(vec3( x*headingScale, sunHeight, skyZ).addSelf(cameraPos), vec3(sunSize*(1+i*30)), sunColor, i?dotSpriteTile:circleSpriteTile);
         }
     }
 
@@ -68,7 +68,7 @@ function drawSky()
         x = mod(x,range) - range/2;
         const y = random.float(skyTop);
         const s = random.float(3e2,8e2);
-        pushSprite(cameraPos.add(vec3( x, y, skyZ)), vec3(s*cloudWidth,s*cloudHeight), cloudColor, dotSpriteTile)
+        pushSprite(vec3( x, y, skyZ).addSelf(cameraPos), vec3(s*cloudWidth,s*cloudHeight), cloudColor, dotSpriteTile)
     }
 
     // parallax
@@ -83,7 +83,7 @@ function drawSky()
         const levelTransition = levelFloat<.5 || levelFloat > levelGoal-.5 ? 1 : levelPercent < ltt ? (levelPercent/ltt)**ltp : 
                 levelPercent > 1-ltt ? 1-((levelPercent-1)/ltt+1)**ltp : 1;
 
-        const parallax = lerp(p, 1.01, 1.07);
+        const parallax = lerp(p, 1.01, 1.1);
         const s = random.float(1e2,2e2)*horizonSpriteSize;
         const size = vec3(random.float(1,2)*(horizonSprite.canMirror ? s*random.sign() : s),s,s);
         const x = mod(worldHeading*headingScale/parallax + random.float(range),range) - range/2;
@@ -97,7 +97,7 @@ function drawSky()
         }
         const y = lerp(levelTransition, -yMax*1.5, yMax);
         const c = horizonSprite.getRandomSpriteColor();
-        pushSprite(cameraPos.add(vec3( x, y, skyZ)), size, c, horizonSpriteTile);
+        pushSprite(vec3( x, y, skyZ).addSelf(cameraPos), size, c, horizonSpriteTile);
     }
 
     {
@@ -111,7 +111,7 @@ function drawSky()
 
         // horizon bottom
         const groundColor = levelInfoLast.groundColor.lerp(levelInfo.groundColor, levelLerpPercent).brighten(.1);
-        pushSprite(cameraPos.add(vec3(0,-skyH,skyZ)), vec3(skyW,skyH), groundColor);
+        pushSprite(vec3(0,-skyH,skyZ).addSelf(cameraPos), vec3(skyW,skyH), groundColor);
     }
 
     glRender();

code/sounds.js

@@ -1,7 +1,7 @@
 'use strict';
 
 const sound_beep = new Sound([,0,220,.01,.08,.05,,.5,,,,,,,,,.3,.9,.01,,-99]); // beep
-const sound_engine = new Sound([,,40,.2,.4,.2,,,,,,,,300,,,,,,,-80]); // engine
+const sound_engine = new Sound([,,40,.2,.5,.5,,,,,,,,300,,,,,,,-80]); // engine
 const sound_hit = new Sound([,.3,90,,,.2,,3,,,,,,9,,.3,,.3,.01]); // crash
 const sound_bump = new Sound([4,.2,400,.01,.01,.01,,.8,-60,-70,,,.03,.1,,,.1,.5,.01,.4,400]); // bump
 const sound_checkpoint = new Sound([.3,0,980,,,,,3,,,,,,,,.03,,,,,500]); // checkpoint

code/track.js

@@ -131,20 +131,20 @@ function drawTrackScenery()
         if (!trackSegment.sideStreet) // no sprites on side streets
         for(let k=3;k--;)
         {
-            const spriteListide = (segmentIndex+k)%2 ? 1 : -1;
-            if (spriteListide == levelInfo.waterSide)
+            const spriteSide = (segmentIndex+k)%2 ? 1 : -1;
+            if (spriteSide == levelInfo.waterSide)
             {
                 // water
                 const sprite = spriteList.water;
                 const s = sprite.size*sprite.getRandomSpriteScale();
                 const o2 = w+random.float(12e3,8e4);
-                const o = spriteListide * o2;
+                const o = spriteSide * o2;
                 // get taller in distance to cover horizon
                 const h = .4;
                 const wave = time-segmentIndex/70;
-                const p = trackSegment.pos.add(vec3(o+2e3*Math.sin(wave),0));
+                const p = vec3(o+2e3*Math.sin(wave),0).addSelf(trackSegment.pos);
                 const waveWind = 9*Math.cos(wave); // fake wind to make wave seam more alive
-                pushTrackObject(p, vec3(spriteListide*s,s*h,s), WHITE, sprite, waveWind);
+                pushTrackObject(p, vec3(spriteSide*s,s*h,s), WHITE, sprite, waveWind);
             }
             else
             {
@@ -164,8 +164,8 @@ function drawTrackScenery()
 
                     // push farther away if big collision
                     const xm = w+sprite.size+6*sprite.collideScale*s; 
-                    const o = spriteListide * random.float(xm,3e4);
-                    const p = trackSegment.pos.add(vec3(o,0));
+                    const o = spriteSide * random.float(xm,3e4);
+                    const p = vec3(o,0).addSelf(trackSegment.pos);
                     const wind = trackSegment.getWind();
                     const color = sprite.getRandomSpriteColor();
                     const scale = vec3(s);
@@ -239,7 +239,7 @@ function pushTrackObject(pos, scale, color, sprite, trackWind)
         const w = segment1.width;
         const o =(segmentIndex%2?1:-1)*(random.float(5e4,1e5))
         const r = vec3(0,-heading,0);
-        const p = segment1.pos.add(vec3(-o,0));
+        const p = vec3(-o,0).addSelf(segment1.pos);
 
         const s = vec3(random.float(500,1e3),random.float(1e3,4e3),random.float(500,1e3));
         //const s = vec3(500,random.float(2e3,2e4),500);
@@ -248,4 +248,170 @@ function pushTrackObject(pos, scale, color, sprite, trackWind)
         cubeMesh.render(m4, c);
     }
 }
-*/
+*/
+
+///////////////////////////////////////////////////////////////////////////////
+
+// an instance of a sprite
+class TrackObject
+{
+    constructor(trackSegment, sprite, offset, color=WHITE, sizeScale=1)
+    {
+        this.trackSegment = trackSegment;
+        this.sprite = sprite;
+        this.offset = offset;
+        this.color = color;
+
+        const scale = sprite.size * sizeScale;
+        this.scale = vec3(scale);
+        const trackWidth = trackSegment.width;
+        const trackside = offset.x < trackWidth*2 && offset.x > -trackWidth*2;
+        if (trackside && sprite.trackFace)
+            this.scale.x *= sign(offset.x);
+        else if (sprite.canMirror && random.bool())
+            this.scale.x *= -1;
+        this.collideSize = sprite.collideScale*abs(scale);
+    }
+
+    draw()
+    {
+        const trackSegment = this.trackSegment;
+        const pos = trackSegment.pos.add(this.offset);
+        const wind = trackSegment.getWind();
+        pushTrackObject(pos, this.scale, this.color, this.sprite, wind);
+    }
+}
+
+class TrackSegment
+{
+    constructor(segmentIndex,offset,width)
+    {
+        if (segmentIndex >= levelGoal*checkpointTrackSegments)
+            width = 0; // no track after end
+
+        this.offset = offset;
+        this.width = width;
+        this.pitch = 0;
+        this.normal = vec3();
+
+        this.trackObjects = [];
+        const levelFloat = segmentIndex/checkpointTrackSegments;
+        const level = this.level = testLevelInfo ? testLevelInfo.level : levelFloat|0;
+        const levelInfo = getLevelInfo(level);
+        const levelInfoNext = getLevelInfo(levelFloat+1);
+        const levelLerpPercent = percent(levelFloat%1, 1-levelLerpRange, 1);
+
+        const checkpointLine = segmentIndex > 25 && segmentIndex < 30
+            || segmentIndex%checkpointTrackSegments > checkpointTrackSegments-10;
+        const recordPoint = bestDistance/trackSegmentLength;
+        const recordPointLine = segmentIndex>>3 == recordPoint>>3;
+        this.sideStreet = levelInfo.sideStreets && ((segmentIndex%checkpointTrackSegments)%495<36);
+
+        {
+            // setup colors
+            const groundColor = levelInfo.groundColor.lerp(levelInfoNext.groundColor,levelLerpPercent);
+            const lineColor = levelInfo.lineColor.lerp(levelInfoNext.lineColor,levelLerpPercent);
+            const roadColor = levelInfo.roadColor.lerp(levelInfoNext.roadColor,levelLerpPercent);
+
+            const largeSegmentIndex = segmentIndex/9|0;
+            const stripe = largeSegmentIndex% 2 ? .1: 0;
+            this.colorGround = groundColor.brighten(Math.cos(segmentIndex*2/PI)/20);
+            this.colorRoad = roadColor.brighten(stripe&&.05);
+            if (recordPointLine)
+                this.colorRoad = hsl(0,.8,.5);
+            else if (checkpointLine)
+                this.colorRoad = WHITE; // starting line
+            this.colorLine = lineColor;
+            if (stripe)
+                this.colorLine.a = 0;
+            if (this.sideStreet)
+                this.colorLine = this.colorGround = this.colorRoad;
+        }
+
+        // spawn track objects
+        if (debug && testGameSprite)
+        {
+            // test sprite
+            this.addSprite(testGameSprite,random.floatSign(width/2,1e4));
+        }
+        else if (debug && testTrackBillboards)
+        {
+            // test billboard
+            const billboardSprite = random.fromList(spriteList.billboards);
+            this.addSprite(billboardSprite,random.floatSign(width/2,1e4));
+        }
+        else if (segmentIndex == levelGoal*checkpointTrackSegments)
+        {
+            // goal!
+            this.addSprite(spriteList.sign_goal);
+        }
+        else if (segmentIndex%checkpointTrackSegments == 0)
+        {
+            // checkpoint
+            if (segmentIndex < levelGoal*checkpointTrackSegments)
+            {
+                this.addSprite(spriteList.sign_checkpoint1,-width+500);
+                this.addSprite(spriteList.sign_checkpoint2, width-500);
+            }
+        }
+
+        if (segmentIndex == 30)
+        {
+            // starting area
+            this.addSprite(spriteList.sign_start);
+
+            // left
+            const ol = -(width+100);
+            this.addSprite(spriteList.sign_opGames,ol,1450);
+            this.addSprite(spriteList.sign_zzfx,ol,850);
+            this.addSprite(spriteList.sign_avalanche,ol);
+
+            // right
+            const or = width+100;
+            this.addSprite(spriteList.sign_frankForce,or,1500);
+            this.addSprite(spriteList.sign_github,or,350);
+            this.addSprite(spriteList.sign_js13k,or);
+            if (js13kBuild)
+                random.seed = 1055752394; // hack, reset seed for js13k
+        }
+    }
+
+    getWind()
+    {
+        const offset = this.offset;
+        const noiseScale = .001;
+        return Math.sin(time+(offset.x+offset.z)*noiseScale)/2;
+    }
+
+    addSprite(sprite,x=0,y=0,extraScale=1)
+    {
+        // add a sprite to the track as a new track object 
+        const offset = vec3(x,y);
+        const sizeScale = extraScale*sprite.getRandomSpriteScale();
+        const color = sprite.getRandomSpriteColor();
+        const trackObject = new TrackObject(this, sprite, offset, color, sizeScale);
+        this.trackObjects.push(trackObject);
+    }
+}
+
+// get lerped info about a track segment
+class TrackSegmentInfo
+{
+    constructor(z)
+    {
+        const segment = this.segmentIndex = z/trackSegmentLength|0;
+        const percent = this.percent = z/trackSegmentLength%1;
+        if (track[segment] && track[segment+1])
+        {
+            if (track[segment].pos && track[segment+1].pos)
+                this.pos = track[segment].pos.lerp(track[segment+1].pos, percent);
+            else
+                this.pos = vec3(0,0,z);
+            this.pitch = lerp(percent, track[segment].pitch, track[segment+1].pitch);
+            this.offset = track[segment].offset.lerp(track[segment+1].offset, percent);
+            this.width = lerp(percent, track[segment].width,track[segment+1].width);
+        }
+        else
+            this.offset = this.pos = vec3(this.pitch = this.width = 0,0,z);
+    }
+}