Noggin - Socoder

-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0\|631\|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
Socoder -> In-Development -> Noggin
Mon, 24 Mar 2025, 10:28
spinal	Noggin OK, I'll start by saying a couple of you may have played this game in the past, It's a basic tile flipping game, but a little different from what you might have played in the past. Here is a Pokitto version (with emulator) from 2019 Pokitto Emulator With Noggin (.7z) You can read about that here - https://talk.pokitto.com/t/game-noggin/1640 I had a go at making this in SmileBasic for the switch, gave up, so I'll be giving it a go on PC. This is roughly how far I got on the Switch SmileBasic version... View on YouTube \|edit\| There will be random code snippets etc. throughout, I work best by dumping out my current thought process in public. First example of which... Trying to figure out 'simple' things in blitz3d. Const screenWidth = 1280 Const screenHeight = 720 Graphics3D screenWidth, screenHeight, 32, 2 Global screenBuffer = CreateImage(screenWidth, screenHeight) Global iconSize# = 76.0 Global iconScale# = iconSize / screenWidth Const tex_color = 1 ; Color texture Const tex_alpha = 2 ; Alpha texture (Include alpha channel data) Const tex_mask = 4 ; Masked texture (black is transparent) Const tex_mipmap = 8 ; Create texture mipmaps Const tex_clampu = 16 ; Restrict U texture coords from "bleeding over" Const tex_clampv = 32 ; Restrict V texture coords from "bleeding over" Const tex_envshpere = 64 ; Load texture as a spherical environment map Const tex_vram = 256 ; Force texture graphics to vram Const tex_highcolor = 512 ; Forces texture graphics to be 32-bits per pixel Const tex_mipmap_OFF = 1024 ; Turn mipmap OFF ; Calculate aspect ratio Global aspectRatio# = Float(screenWidth) / Float(screenHeight) ; Create camera camera = CreateCamera() MoveEntity camera, 0, 0, -1 ; Move camera back along the Z-axis CameraProjMode camera, 2 ; Set camera to orthogonal projection mode ; Load icon texture iconImage = LoadTexture("icon2.png", tex_color Or tex_mipmap_OFF Or tex_mask) ; Create 15 sprites for icons and arrange them in a grid Global iconSprites[52] Global gridRows = 7 Global gridCols = 7 Global spacingX# = 96.0 / screenWidth * 2.0 ; Horizontal spacing in normalized screen space Global spacingY# = 96.0 / screenHeight * 2.0 / aspectRatio# ; Vertical spacing in normalized screen space Global startTime = MilliSecs() Global frameCount = 0 Global fps = 0 ; Load the background image ;ackgroundImage = LoadTexture("background.png") ; Create a background sprite ;ackgroundSprite = CreateSprite(0) ;ntityTexture backgroundSprite, backgroundImage ; Scale the sprite to fill the screen (assuming your background image matches screen aspect ratio) ;caleSprite backgroundSprite, 1.0, 1.0 / aspectRatio# ; Normalize to the screen size ; Position the background sprite at the origin ;ositionEntity backgroundSprite, 0, 0, 0 ; Slightly behind other elements For i = 0 To 48 ; Calculate position in the grid row = i / gridCols col = i Mod gridCols x# = (col - (gridCols - 1) / 2.0) * spacingX y# = ((gridRows - 1) / 2.0 - row) * spacingY ; Call MakeSprite() to create and initialize the sprite iconSprites[i] = MakeSprite(iconImage, iconScale, x, y) Next ; Load mouse pointer image mouseImage = LoadTexture("mouse_pointer.png", tex_mask) ; Make sure your image has an alpha channel and is saved as PNG ;mouseSprite = CreateSprite(0) mouseSprite = MakeSprite(mouseImage, 128.0 / screenWidth, 0, 0) bg1 = LoadImage("bg1.png") While Not KeyHit(1) ; Increment the frame count frameCount = frameCount + 1 ; Calculate FPS every second If MilliSecs() - startTime >= 1000 Then fps = frameCount frameCount = 0 startTime = MilliSecs() EndIf ; Update mouse pointer position PX = MouseX() PY = MouseY() tempX# = 2.0 / Float(screenWidth) mx# = (PX * tempX) - 1 tempY# = 2.0 / (Float(screenHeight) * aspectRatio#) my# = ((PY + ((screenWidth - screenHeight) / 2)) * tempY) - 1 For i = 0 To 48 ; Calculate position in the grid row = i / gridCols col = i Mod gridCols x# = (col - (gridCols - 1) / 2.0) * spacingX y# = ((gridRows - 1) / 2.0 - row) * spacingY PositionEntity iconSprites[i], x, y, 0 Next PositionEntity mouseSprite, mx#, -my#, z# ; Render the world RenderWorld ; trick to render 2D stuff BEHIND the 3D stuff CopyRect 0,0,screenWidth,screenHeight,0,0,BackBuffer(),ImageBuffer(screenBuffer) ; Copy the screen to a buffer ; Put any 2D stuff here ;Cls ; Draw the 2D background image tempX = screenWidth/128 tempY = screenHeight/128 For x1 = 0 To tempX For y1 = 0 To tempY DrawBlock bg1,x1128,y1128 Next Next ; Draw the copied buffer DrawImage screenBuffer,0,0 ; Display the FPS Text 10, 10, "FPS: " + fps Flip Wend cleanup() End Function MakeSprite(texture, scale#, x#, y#) sprite = CreateSprite(0) ; Create the sprite EntityTexture sprite, texture ; Set the texture of the sprite ScaleSprite sprite, scale, scale ; Scale the sprite PositionEntity sprite, x, y, 0 ; Position the sprite Return sprite ; Return the created sprite End Function Function cleanup() ; Free the resources For i = 0 To 14 FreeEntity(iconSprites[i]) Next FreeEntity(mouseSprite) ; Free a specific sprite FreeTexture(iconImage) ; Free a texture FreeTexture(mouseImage) ; Free a texture End Function --v -=-=- Check out my excellent homepage!
Mon, 24 Mar 2025, 10:53
spinal	First attempt to generate all of the card sprites resulted in some semi random artifacts, so I guess I'll be hand drawing every card, it'll probably look better that way anyway. -=-=- Check out my excellent homepage!
Mon, 24 Mar 2025, 12:36
Jayenkai	Are these to be a pre-rendered spritesheet? If so, might I suggest trying to generate them incredibly oversized, then letting a proper art program do a fancy scale-down on them? -=-=- ''Load, Next List!''
Mon, 24 Mar 2025, 13:59
spinal	Nah, that was trying to draw them instead of loading them. I have no idea how textures work. -=-=- Check out my excellent homepage!
Mon, 24 Mar 2025, 14:53
Jayenkai	OK
Mon, 24 Mar 2025, 16:45
spinal	It seems that blitz3d sprites don't allow flipping or rolling, they are strictly 2d. Looks like I have to learn a little real 3d... Graphics3D 1280, 720, 32, 2 SetBuffer BackBuffer() ; Load textures for front and back frontTexture = LoadTexture("cards\\ha.png", 1) ; Front texture backTexture = LoadTexture("cards\\back_blue.png", 1) ; Back texture ; Create front mesh frontQuad = CreateMesh() frontSurface = CreateSurface(frontQuad) AddVertex frontSurface, -0.5, -0.5, 0, 0, 1 AddVertex frontSurface, 0.5, -0.5, 0, 1, 1 AddVertex frontSurface, 0.5, 0.5, 0, 1, 0 AddVertex frontSurface, -0.5, 0.5, 0, 0, 0 AddTriangle frontSurface, 0, 1, 2 AddTriangle frontSurface, 0, 2, 3 EntityTexture frontQuad, frontTexture EntityFX frontQuad, 1 ; Disable backface culling to make both sides visible ; Create back mesh backQuad = CreateMesh() backSurface = CreateSurface(backQuad) AddVertex backSurface, -0.5, -0.5, 0, 0, 1 AddVertex backSurface, 0.5, -0.5, 0, 1, 1 AddVertex backSurface, 0.5, 0.5, 0, 1, 0 AddVertex backSurface, -0.5, 0.5, 0, 0, 0 AddTriangle backSurface, 2, 1, 0 ; Reverse winding order for the back face AddTriangle backSurface, 3, 2, 0 EntityTexture backQuad, backTexture EntityFX backQuad, 1 ; Disable backface culling to make both sides visible ; Position both meshes at the same location PositionEntity frontQuad, 0, 0, 0 PositionEntity backQuad, 0, 0, 0 ; Create a camera camera = CreateCamera() MoveEntity camera, 0, 0, -5 angleX# = 0 angleY# = 0 While Not KeyDown(1) ; Rotate both meshes simultaneously If KeyDown(203) Then angleY# = angleY# - .5 ; Left arrow If KeyDown(205) Then angleY# = angleY# + .5 ; Right arrow If KeyDown(200) Then angleX# = angleX# - .5 ; Up arrow If KeyDown(208) Then angleX# = angleX# + .5 ; Down arrow RotateEntity frontQuad, angleX#, angleY#, 0 RotateEntity backQuad, angleX#, angleY#, 0 ; Render the scene RenderWorld Text 10, 10, "Use arrow keys to rotate the quad" Flip Wend End --v With a little AI help, I got this far... Graphics3D 1280, 720, 32, 2 SetBuffer BackBuffer() Dim glyphname$(60) t = 0 folder$ = folder$ + "cards\" glyphname$(t) = folder$ + "c1.png" : t = t + 1 glyphname$(t) = folder$ + "c2.png" : t = t + 1 glyphname$(t) = folder$ + "c3.png" : t = t + 1 glyphname$(t) = folder$ + "c4.png" : t = t + 1 glyphname$(t) = folder$ + "c5.png" : t = t + 1 glyphname$(t) = folder$ + "c6.png" : t = t + 1 glyphname$(t) = folder$ + "c7.png" : t = t + 1 glyphname$(t) = folder$ + "c8.png" : t = t + 1 glyphname$(t) = folder$ + "c9.png" : t = t + 1 glyphname$(t) = folder$ + "c10.png" : t = t + 1 glyphname$(t) = folder$ + "ca.png" : t = t + 1 glyphname$(t) = folder$ + "cc.png" : t = t + 1 glyphname$(t) = folder$ + "cj.png" : t = t + 1 glyphname$(t) = folder$ + "ck.png" : t = t + 1 glyphname$(t) = folder$ + "cq.png" : t = t + 1 glyphname$(t) = folder$ + "d1.png" : t = t + 1 glyphname$(t) = folder$ + "d2.png" : t = t + 1 glyphname$(t) = folder$ + "d3.png" : t = t + 1 glyphname$(t) = folder$ + "d4.png" : t = t + 1 glyphname$(t) = folder$ + "d5.png" : t = t + 1 glyphname$(t) = folder$ + "d6.png" : t = t + 1 glyphname$(t) = folder$ + "d7.png" : t = t + 1 glyphname$(t) = folder$ + "d8.png" : t = t + 1 glyphname$(t) = folder$ + "d9.png" : t = t + 1 glyphname$(t) = folder$ + "d10.png" : t = t + 1 glyphname$(t) = folder$ + "da.png" : t = t + 1 glyphname$(t) = folder$ + "dc.png" : t = t + 1 glyphname$(t) = folder$ + "dj.png" : t = t + 1 glyphname$(t) = folder$ + "dk.png" : t = t + 1 glyphname$(t) = folder$ + "dq.png" : t = t + 1 glyphname$(t) = folder$ + "h1.png" : t = t + 1 glyphname$(t) = folder$ + "h2.png" : t = t + 1 glyphname$(t) = folder$ + "h3.png" : t = t + 1 glyphname$(t) = folder$ + "h4.png" : t = t + 1 glyphname$(t) = folder$ + "h5.png" : t = t + 1 glyphname$(t) = folder$ + "h6.png" : t = t + 1 glyphname$(t) = folder$ + "h7.png" : t = t + 1 glyphname$(t) = folder$ + "h8.png" : t = t + 1 glyphname$(t) = folder$ + "h9.png" : t = t + 1 glyphname$(t) = folder$ + "h10.png" : t = t + 1 glyphname$(t) = folder$ + "ha.png" : t = t + 1 glyphname$(t) = folder$ + "hc.png" : t = t + 1 glyphname$(t) = folder$ + "hj.png" : t = t + 1 glyphname$(t) = folder$ + "hk.png" : t = t + 1 glyphname$(t) = folder$ + "hq.png" : t = t + 1 glyphname$(t) = folder$ + "s1.png" : t = t + 1 glyphname$(t) = folder$ + "s2.png" : t = t + 1 glyphname$(t) = folder$ + "s3.png" : t = t + 1 glyphname$(t) = folder$ + "s4.png" : t = t + 1 glyphname$(t) = folder$ + "s5.png" : t = t + 1 glyphname$(t) = folder$ + "s6.png" : t = t + 1 glyphname$(t) = folder$ + "s7.png" : t = t + 1 glyphname$(t) = folder$ + "s8.png" : t = t + 1 glyphname$(t) = folder$ + "s9.png" : t = t + 1 glyphname$(t) = folder$ + "s10.png" : t = t + 1 glyphname$(t) = folder$ + "sa.png" : t = t + 1 glyphname$(t) = folder$ + "sc.png" : t = t + 1 glyphname$(t) = folder$ + "sj.png" : t = t + 1 glyphname$(t) = folder$ + "sk.png" : t = t + 1 glyphname$(t) = folder$ + "sq.png" : t = t + 1 Dim quads(60) Dim backs(60) backTexture = LoadTexture("cards\back_blue.png", 1) ; Back texture For i = 0 To t - 1 frontTexture = LoadTexture(glyphname$(i), 1) quads(i) = CreateMesh() frontSurface = CreateSurface(quads(i)) AddVertex frontSurface, -0.5, -0.5, 0, 1, 1 AddVertex frontSurface, 0.5, -0.5, 0, 0, 1 AddVertex frontSurface, 0.5, 0.5, 0, 0, 0 AddVertex frontSurface, -0.5, 0.5, 0, 1, 0 AddTriangle frontSurface, 0, 1, 2 AddTriangle frontSurface, 0, 2, 3 EntityTexture quads(i), frontTexture EntityFX quads(i), 1 backs(i) = CreateMesh() backSurface = CreateSurface(backs(i)) AddVertex backSurface, -0.5, -0.5, 0, 1, 1 AddVertex backSurface, 0.5, -0.5, 0, 0, 1 AddVertex backSurface, 0.5, 0.5, 0, 0, 0 AddVertex backSurface, -0.5, 0.5, 0, 1, 0 AddTriangle backSurface, 2, 1, 0 ; Reverse winding order for the back face AddTriangle backSurface, 3, 2, 0 EntityTexture backs(i), backTexture EntityFX backs(i), 1 Next rows = 7 cols = 7 spacing# = 1.125 ; Adjust for spacing between quads ; 7x7 grid For i = 0 To (77)-1 ;t - 1 x# = ((i Mod cols) spacing) - (spacing * 3.5) ; Calculate the X position y# = ((i / cols) * spacing) - (spacing * 3.5) ; Calculate the Y position (integer division) z# = 8.24 ; Keep Z constant PositionEntity quads(i), x#, y#, z# PositionEntity backs(i), x#, y#, z# Next ; Create a camera camera = CreateCamera() CameraProjMode camera, 1 ; Set camera to orthogonal projection mode MoveEntity camera, 0, 0, 0 angleX# = 0 angleY# = 0 While Not KeyDown(1) Delay(1) ; Rotate both meshes simultaneously ;If KeyDown(203) Then angleY# = angleY# - 1 ; Left arrow ;If KeyDown(205) Then angleY# = angleY# + 1 ; Right arrow ;If KeyDown(200) Then angleX# = angleX# - 1 ; Up arrow ;If KeyDown(208) Then angleX# = angleX# + 1 ; Down arrow angleY# = angleY# + 2 For i = 0 To t - 1 RotateEntity quads(i), angleX#, angleY#, 0 RotateEntity backs(i), angleX#, angleY#, 0 Next ; Render the scene RenderWorld ;Text 10, 10, "Use arrow keys to rotate the quad" Flip Wend End --v -=-=- Check out my excellent homepage!
Tue, 25 Mar 2025, 05:27
spinal	Genuinely no ide how scaling works in 3d, just guessing random numbers... -=-=- Check out my excellent homepage!