Any way to draw spaceship on top of terrain?


The screenshot above comes from the code below.

It’s a hodgepodge I made out of some code from @dave1707 and some code from @tnlogy.

Dave’s code is the spaceship and tnlogy’s code is the terrain.

It’s kind of complicated but all that really matters is this:


function draw()
    update(DeltaTime)
    scene:draw()
    updateCameraPos()
    drawTerrain()
end

Since 2D drawing has to happen after Craft drawing, I have to call drawTerrain() last, and I can’t figure out any way to get the spaceship to then draw in front of the terrain. Is there a way?

Full code:


viewer.mode = OVERLAY

function setup()
    assert(craft, "Please include Craft as a dependency")
    createStartConditions()
    createScene()
    createShip()
    createTerrain()
end

function draw()
    update(DeltaTime)
    scene:draw()
    updateCameraPos()
    drawTerrain()
end

function createStartConditions()
    maxSpeed = 0.5
    speed, ex, ey, ang = 0, 0, 45, 0
    cameraX, cameraZ = -205, -205
    hgx = Gravity.x
    hgy = Gravity.y
end

function createScene()
    scene = craft.scene()
    scene.camera.position = vec3(cameraX, 0, cameraZ)
    -- Adjust camera's initial rotation if needed
    scene.camera.eulerAngles = vec3(0, ey, 0)
end

function createShip()
    ship = scene:entity()
    ship.model = craft.model(asset.builtin.SpaceKit.spaceCraft6_obj)
    ship.scale = vec3(1, 1, 1) * 0.018
    ship.parent = scene.camera
    -- Adjust ship's position if needed
    ship.position = ship.position + vec3(0, -HEIGHT * 0.0003, HEIGHT * 0.0015)
    -- Correct the ship's rotation to face away from the camera initially
    ship.eulerAngles = vec3(0, 180, 0) -- This line makes the ship face away
end

--createTerrain() and mult(m, v) are from tnology Terrain
function createTerrain()
    forward, right, up = vec3(0, 0, 1), vec3(-1, 0, 0), vec3(0, 1, 0)
    pos = vec3(0, 100, 0)
    t = Terrain()
end

function update(dt)
    scene:update(dt)
    scene.camera.position = vec3(cameraX, 1, cameraZ)
    scene.camera.eulerAngles = vec3(0, ey, 0)
    checkTilt()
end

function drawTerrain()
    -- tnology Terrain:
    pushMatrix()
    perspective(45, WIDTH / HEIGHT, 0.1, 500000)
    local m = matrix()
    forward, right, up = mult(m, forward), mult(m, right), mult(m, up)
    local f = pos + forward
    camera(pos.x, pos.y, pos.z, f.x, f.y, f.z, up.x, up.y, up.z)
    translate(0, -30000, 0)
    rotate(-92, 1, 0, 0)
    t:draw(pos)
    local v = 30000 * DeltaTime
    pos.x, pos.z = pos.x + forward.x * v, pos.z + forward.z * v
    popMatrix()
end

function updateCameraPos()
    ey = ey - ang
    x = speed * math.sin(math.rad(ey))
    z = speed * math.cos(math.rad(ey))
    cameraX = cameraX + x
    cameraZ = cameraZ + z
end

function checkTilt()
    local tiltX = Gravity.x
    local tiltY = Gravity.y
    
    -- Adjust ship's tilt based on x-axis tilt
    ship.eulerAngles = vec3(0, 180, -tiltX * 50) -- Adjust multiplier for sensitivity
    
    -- Rotate terrain by modifying the camera's angle based on the tilt
    -- This simulates the terrain rotation underneath the ship
    local terrainTiltFactor = 30 -- Adjust for sensitivity
    ey = ey + (tiltX - hgx) * terrainTiltFactor
    ex = ex + (tiltY - hgy) * terrainTiltFactor
    
    -- Update previous tilt values for next calculation
    hgx = tiltX
    hgy = tiltY
end


--from tnology Terrain:

Terrain = class()

function Terrain:init(x)
    local d,s = 2000,20
    self.d, self.s = d,s
    self.m = mesh()
    for y=-s,s do
        for x=-s,s do
            self.m:addRect(x*d,y*d,d,d)
        end
    end
    self.m.texture = readImage("Cargo Bot:Crate Yellow 1")
    self.m.shader = S
    self.m:setColors(
    color(119, 60, 49, 61))
end

function Terrain:draw(pos)
    self.m.shader.light = vec3(math.cos(ElapsedTime),
    math.sin(ElapsedTime),1):normalize()
    pos =vec2(pos.x, pos.z)
    local step = self.d*(self.s+.5)*2
    local o = vec2(math.floor(pos.x/step+.5),
    -math.floor(pos.y/step+.5))
    
    -- drawing a 3x3 grid centered at camera position
    -- for y=-1,1 do --tnology's original values
    --  for x=-1,1 do
    for y=-5, 5 do --boosting these to 5 makes it go much farther in the distance
        for x=-5, 5 do
            pushMatrix()
            local u,v = (o.x+x)*step,(o.y+y)*step
            translate(u,v,0)
            self.m.shader.offset = vec2(u,v)
            self.m:draw()
            popMatrix()
        end
    end
end

Perlin = [[
//
// Description : Array and textureless GLSL 2D simplex noise function.
    //      Author : Ian McEwan, Ashima Arts.
    //  Maintainer : ijm
    //     Lastmod : 20110822 (ijm)
    //     License : Copyright (C) 2011 Ashima Arts. All rights reserved.
    //               Distributed under the MIT License. See LICENSE file.
    //               https://github.com/ashima/webgl-noise
    // 
    vec3 mod289(vec3 x) {
        return x - floor(x * (1.0 / 289.0)) * 289.0;
    }
    vec2 mod289(vec2 x) {
        return x - floor(x * (1.0 / 289.0)) * 289.0;
    }
    vec3 permute(vec3 x) {
        return mod289(((x*34.0)+1.0)*x);
    }
    float snoise(vec2 v)
    {
        const vec4 C = vec4(0.211324865405187,  // (3.0-sqrt(3.0))/6.0
        0.366025403784439,  // 0.5*(sqrt(3.0)-1.0)
        -0.577350269189626,  // -1.0 + 2.0 * C.x
        0.024390243902439); // 1.0 / 41.0
        // First corner
        vec2 i  = floor(v + dot(v, C.yy) );
        vec2 x0 = v -   i + dot(i, C.xx);
        // Other corners
        vec2 i1;
        //i1.x = step( x0.y, x0.x ); // x0.x > x0.y ? 1.0 : 0.0
        //i1.y = 1.0 - i1.x;
        i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);
        // x0 = x0 - 0.0 + 0.0 * C.xx ;
        // x1 = x0 - i1 + 1.0 * C.xx ;
        // x2 = x0 - 1.0 + 2.0 * C.xx ;
        vec4 x12 = x0.xyxy + C.xxzz;
        x12.xy -= i1;
        // Permutations
        i = mod289(i); // Avoid truncation effects in permutation
        vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0 ))
        + i.x + vec3(0.0, i1.x, 1.0 ));
        vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy), dot(x12.zw,x12.zw)), 0.0);
        m = m*m ;
        m = m*m ;
        // Gradients: 41 points uniformly over a line, mapped onto a diamond.
        // The ring size 17*17 = 289 is close to a multiple of 41 (41*7 = 287)
        vec3 x = 2.0 * fract(p * C.www) - 1.0;
        vec3 h = abs(x) - 0.5;
        vec3 ox = floor(x + 0.5);
        vec3 a0 = x - ox;
        // Normalise gradients implicitly by scaling m
        // Approximation of: m *= inversesqrt( a0*a0 + h*h );
        m *= 1.79284291400159 - 0.85373472095314 * ( a0*a0 + h*h );
        // Compute final noise value at P
        vec3 g;
        g.x  = a0.x  * x0.x  + h.x  * x0.y;
        g.yz = a0.yz * x12.xz + h.yz * x12.yw;
        return 130.0 * dot(m, g);
    }
]]


S = shader(Perlin .. [[
uniform mat4 modelViewProjection;
attribute vec4 position;
attribute vec4 color;
attribute vec2 texCoord;
uniform vec3 light;
uniform vec3 pos;
uniform vec2 offset;
varying lowp vec4 vColor;
varying highp vec2 vTexCoord;
varying lowp float vShade;

float h(vec2 p) {
p = p + offset;
return snoise(p*.001)*20. +
snoise((p-vec2(1.,1.))*.0001)*1000. +
snoise((p-vec2(1.,1.))*.00002)*5000.;
}

vec3 cnormal(vec2 p) {
float d = .01;
float h1 = h(p-vec2(d,0.)) - h(p+vec2(d,0.));
float h2 = h(p-vec2(0.,d)) - h(p+vec2(0.,d));
vec3 v = cross(vec3(d*2.,0.,h1),
vec3(0.,d*2.,h2));
return normalize(v);
}

void main() {
vColor = color;
vTexCoord = texCoord;
vec4 p = position;
p.z = p.z + h(p.xy);

if (light != vec3(0.,0.,0.)) {
    lowp vec4 nor = vec4(cnormal(p.xy),0);
    vShade = (dot(nor.xyz,light)+0.2)/1.2;
    if (vShade >1.0) {vShade=1.0;}
    if (vShade <0.2) {vShade=0.2;}
} else {
    vShade = 1.;
}
gl_Position = modelViewProjection * p;
}
]], [[
uniform lowp sampler2D texture;
varying lowp vec4 vColor;
varying highp vec2 vTexCoord;
varying lowp float vShade;

void main() {
lowp vec4 res = texture2D(texture, vTexCoord);
lowp vec4 c = vColor;
c.rgb = c.rgb * vShade;
gl_FragColor = c;
}
]])

You should be able to do something like this:

But there seems to be something buggy with setContext in Codea, so it’s not possible. It works if I only draw the sprites every 2th frame and the actual context every 2th frame. Maybe the depth buffer get trashed when drawing in the setContext, I don’t know.

@tnology - loaded your code up which uses the shader but won’t run fires up an error to mult() several times. I have set the camera dependencies on but no other. Any ideas why ?

It seems like @UberGoober forgot to include it in the pasted code. Add this:


function mult(m, v) -- matrix multiplication
    return vec3(
    m[1]*v.x+m[2]*v.y+m[3]*v.z,
    m[5]*v.x+m[6]*v.y+m[7]*v.z,
    m[9]*v.x+m[10]*v.y+m[11]*v.z
    )
end

1 Like

@tnology - thanks for finding and posting the lost function. Pasted in and all seems to be functioning well now. It’s a great demo but pre many iOS updates which result in complications when trying to access the command buttons on the screen limits.

I’ll have a play with this to see if I can modify the control systems but don’t hold your breath, there’s a lot of code to digest.