Share your repls and programming experiences

← Back to all posts
Presenting... 🟠 Rolling Forests! 🌳 | Awesome 3D Infinite Runner
h
RayhanADev (2608)

Warning: You will experience infinite fun times ahead!!!

Hiya! This is an awesome little 3D runner game I made, drawing some inspiration from games like Rolling Sky and Subway Surfers. Now, without any further delay:

Presenting... Rolling Forests

Play It On Fullscreen

CLICK THIS LINK

How to Play?

Just avoid the trees and keep rolling to get new high scores! But watch out, the game gets progressively harder the longer you roll.

Controls:

KeyAction
Left Arrow/Swipe or ASwitch to Left Lane
Right Arrow/Swipe or DSwitch to Right Lane
Up Arrow/Swipe or W or SpaceJump Up
P/Q Key or Down SwipePause the Game

Good luck, I can't wait to see your scores!

* Note, this will probably be my last ThreeJS game for a while :)

Comments
hotnewtop
Baconman321 (1104)
let stop = false;
let time = 0;
let betweenlanes = () => {
	let left = false;
	const iter = () => {
		const evt = new KeyboardEvent("keydown", {keyCode: left ? 37 : 39});
		document.dispatchEvent(evt);
		left = !left;
		if(!stop){
			window.setTimeout(iter, time);
		}
	};
	iter();
};
betweenlanes();

This will go between the lanes, where it's safe because the trees only spawn in each lane. It is a bit flawed though - it oftentimes goes too close to the actual lane in which it hits a tree, but clicking the up arrow and with a few tries, I got this high score with the "hack":

I really would like to make a machine learning program for this, but I haven't even done ML yet lol.

RayhanADev (2608)

@Baconman321 oooOooOh
you figured that bit out didn't you :)
Yeah I noticed you could slip through the lanes between trees and I kinda thought that was fine, you know one of those really weird speedrun glitchs so i'll let it slide ;D

if you manage to make a silver bullet out of that code I might make a patch for it though...

Baconman321 (1104)

@RayhanADev Not necessarily possible (at least with what I thought out).

I could fork the game and edit it so the positions are globally exposed, then make a program to dodge the trees, but I'm not that good at game design :/

RayhanADev (2608)

@Baconman321 ah, well then I guess I could (not that I have any reason to make the game easier for hacking xD)

you tried I certainly give you credit for that xD

Baconman321 (1104)

@RayhanADev IDK how you're going to fix this (unless you make the ball "teleport" - which would then look weird.

Oh wait, there is a way, but I ain't tellin :)

Dont0click0here (3)

Don't click on my profile

Baconman321 (1104)

@Dont0click0here I did it lol.

Don't post if you don't want people looking at your profile (it decreases the chances of someone knowing you exist dramatically).

Dont0click0here (3)

@Baconman321

Never gonna let you down,

Never gonna give you up,

Baconman321 (1104)

@Dont0click0here Ah, so that's what the tiny.cc url is.

I was cautious since url shorteners often lead to trouble >:(

[deleted]

I clicked on it anyway and looked at your repl.

[deleted]

@RayhanADev I think he used inspect element like I did:

Baconman321 (1104)

@RoboRobert Uhh, nope :)

It was primarily luck tho, I only got 167 as a high after that :/

dragonslayor (5)

I got 268, but I couldn't get a screenshot as it just continues to roll after dying, and restarts really quickly. But I like the game. Good Job!

RayhanADev (2608)

@dragonslayor nice score, and thanks!
Also quick tip, you don't die you run forever and it shows your high score right below your current score ;D

dragonslayor (5)

HOW DID I NOT NOTICE THAT!!! I am actually really bad at looking, sorry didn't see that. @RayhanADev

RayhanADev (2608)

@dragonslayor nah it's kewl, glad I could help xD

Flazer27 (1)

@Baconman321 teleport the hit box but not the ball? is that the way you arent telling or is it to expand the tree hit box or have I not guessed it

Baconman321 (1104)

@Flazer27 No I'm basically having the program rapidly move between the lanes so that the trees won't hit it.

SulaimanAhmed1 (10)

@Baconman321 there is a user on github called The Code bullet who has a Neat algorithm repository which can be implemented in any game you want. you should go check it out! https://github.com/Code-Bullet/NEAT-Template-JavaScript

CyberHacker101 (136)

me whos been trying to find a good hac: (╯°□°)╯︵ ┻━┻ @RayhanADev

RyanWright212 (0)

@RayhanADev i now have 137 as new highscore

220723j (4)

@dragonslayor dude, it shows high score under your current score

Bookie0 (6373)

This just proves that the earth is..

Round!

Edit: yes actually more like a sphere
RayhanADev (2608)

@Bookie0 hahahahhahahaha, good one
from what I can see, the Earth seems to actually be a semi-almost-sphere though :>?

FlaminHotValdez (715)

@Bookie0 EXCUSE ME?!?!?!

THE EARTH IS FLAT!!!

RayhanADev (2608)

@FlaminHotValdez the Earth is a pentagonal dodecahedron what's up with ya'll xD

FlaminHotValdez (715)

@RayhanADev

Let's compromise.

It's a triangular icosahedron.

sweetmango88 (16)

liar the earth is a cylinder! how didn't you know?

dragonslayor (5)

Nah more like a million-ahedron

Flazer27 (1)

no the earth is in the shape of a chicken leg

CyberHacker101 (136)

i dont get why ppl think the earth is flat, i mean since covid 19 started the 6ft rule would make someone fall of the edge if the earth was flat xDDDDDDDDDddd @Bookie0

CyberHacker101 (136)

@FlaminHotValdez
I DECLARE PEACE!!!
ITS BASIC EVIDENCE WE EVEN WENT TO SPAVE BRUV!!!

AhsenKhan (0)

@FlaminHotValdez An icosahedron that's subdivided and smoothed a lot with noise applied for the height map

Myztiq (22)

@Bookie0 checkmate flat earthers!

Myztiq (22)

@Bookie0 yall are so dumb dont you know? the earth is.......... SHREK

tussiez (1676)

Three.js?


pogger
This is great!
However, try not to use var and maybe less function(?)s.
Threejs also recommends importing the library as a module.

RayhanADev (2608)

@tussiez lol thanks xD
i did get that bit from the tutorial seemed pretty senseless to me, but I did it anyways; will fix :D
I always use use the actual file if possible on smaller projects, doesn't make sense to use the cdn :)

tussiez (1676)

@RayhanADev Which CDN? https://threejs.org/build/three.module.js - not minified

RayhanADev (2608)

@tussiez yeah, but why use the cdn when you can host your own copy?

RayhanADev (2608)

@tussiez yep :). I'd rather use a cdn when there is a lot more going on in the project and it's taking up file space but that's just me imo

FlaminHotValdez (715)

I just realized.

Jump OP, it slows your speed while you're midair

RayhanADev (2608)

@FlaminHotValdez hahahaha
try jumping and switching a lane and then immediately pause as soon as you press

FlaminHotValdez (715)

@RayhanADev Ah noice...definitely gonna help lol

NotMrMan (119)

This is great!

It would be cool if the game had audio.

If you want to add it, but need samples, I can help!

RayhanADev (2608)

@NotMrMan thanks! I suppose I could add audio why not :)
If you have any samples just point me to them and I'll take a listen :D

NotMrMan (119)

@RayhanADev here is the zip file: https://host.notmrman.repl.co/sounds.zip

The rock sound didn't come out very good. it sounds weird, since i used SFXR for the rest of the sounds.

I included menu sounds, just in case you wanted to add a menu. There is a hit sound, a jump sound, a menu cursor move sound, a menu select sound, a rock rolling sound, and a pause sound.

i'm not sure if the sounds will fit the game, but it's worth a try.

RayhanADev (2608)

@NotMrMan dude these are great! also I use sfxr too
I think I'll add these :)

NotMrMan (119)

@RayhanADev thanks! glad you like them :)

ZacCode0 (3)

173 score im beatin this lmao
u could make this into an app, and put it in google play honestly, it's so addicting

RayhanADev (2608)

@ZacCode0 hahahahah I have gotten that recommendation
you know what, i'll look into it ;D

GhostKing007 (142)

Got 51. There's always two trees together that are impossible to get out of lmao

GhostKing007 (142)

Great game btw! (I finally have something to kill time during online class)

RayhanADev (2608)

@GhostKing007 thanks!
also did you know you can jump and go through that small space between the trees :>?

GhostKing007 (142)

My god that is a fast reply! Yeah, I discovered the jump thing after 2-3 mins of playing, I didn't read the post lol

TariqAlBayer (1)

@RayhanADev you can also just jump over them

gearDev (48)

You should make the particles fade out and not just disappear. Would make it feel more polished. Otherwise, this is soo cool!

RayhanADev (2608)

@gearDev good suggestion, and thanks!

tussiez (1676)

@RayhanADev

Make sure to set transparent:true or changing the opacity won't work. When you move the particles, just reduce the opacity like this:

someParticleMaterial.opacity -= 0.05; // speed
RayhanADev (2608)

@tussiez oh wow I completely forgot to work on that thanks 😅

Edit: done!

JWZ6 (714)

so so so so pog poggity pog pog o wow! me high score: 67 gud job

haha0201 (12)

Purposely died at 420. I am satisfied with life now.

haha0201 (12)

@RayhanADev yes god gamer has tryharded forest game for an hour

RayhanADev (2608)

@haha0201 you played this for an hour and only got to 420 :thonk: xD

haha0201 (12)

@RayhanADev what do you expect, it gets impossible to dodge and you just have to hope for good rng

AstrumDeorum (162)

Handy trick:
You can switch lanes while in the air.
So I invented a "fake-out" technique, which is to jump to another lane, and while in the air, switch back to the lane you started in.

RayhanADev (2608)

@AstrumDeorum hahahha yep! I don't think many people realize that but it's very useful :)

AstrumDeorum (162)

@RayhanADev Indeed.

Oh btw, no intent to plug, but I did want to inform you, that I found S4ND to be hilarious enough that I gave it something of a shoutout in a Headline for the News Ticker of my Cookie Clicker:
"Scientist Rayhan Creates Water That Acts Like Sand, Scientists Perplexed!"

I like what you've been making, keep going!

Edit: Now there's also
Scientist Rayhan Creates Ball That Doesn't Collide With Trees, Scientists Flabbergasted!

TSelden (15)

Really great game!
Maybe you could store the player's high score as a browser cookie.

RayhanADev (2608)

@TSelden wow great idea!

I just added it :)

KookiesandBerris (6)

This is such a fun little game! This is really impressive. Nic ework @RayhanADev
I got to a high score of 99!

CactusDev (15)

OMG this is really good.

CookieSnowOwl (41)

well...


i got a good gaming chair
either that or i cheated
by making a program that spams w every like 1/60 second...
LOL
hmmm
i might make an AI

RayhanADev (2608)

@CookieSnowOwl LMAO
good luck with that AI xD

CookieSnowOwl (41)

I may or may not have made the fork 50% easier
by jumping
now i will improve... >:)@RayhanADev

CookieSnowOwl (41)

Continuous jumping no matter what.
Except when you are in the air or you're paused @CookieSnowOwl

CookieSnowOwl (41)

Because I guess an AI can spam [email protected]

CookieSnowOwl (41)

@RayhanADev

lol :( the new AI with the left right can't even beat me... welp i'll go fix it

CodingCactus (4331)

hahahah yes

but now my fingers hurt :(

RayhanADev (2608)

@CodingCactus lmao nice score! xD
any suggestions to make fingers not hurt (or is that just good ;D)?

CodingCactus (4331)

@RayhanADev the problem is that it changes lanes so slowly so you have to end up spam switching and jumping to stay between lanes rather than changing to the lane with no trees in

RayhanADev (2608)

@CodingCactus hmm, gotcha
I changed the amount of time it takes switch lanes, if you get the chance let me know how it feels now :D

CodingCactus (4331)

@RayhanADev wow yeah it's much better now

[deleted]

WOW

THIS IS AMAZING POG HOWWWWWW

I LOVE ITTTTT

High Score: 32 :)

[deleted]

@RayhanADev (^ヮ^)

Trex10 (7)

Wow this is a really cool project. I wish I was as good at HTMl, CSS, JS as you.
(P.S. I upvoted )

RayhanADev (2608)

@Trex10 lol thank you xD, and trust me you can be good at web dev just put in effort and you'll be rewarded ;D

Trex10 (7)

@RayhanADev
Ok! I really just want to know how you can change the screen easily without going to the blank white screen that the js remove screen thingy does.

Trex10 (7)

@RayhanADev
How do you make an HTML, CSS, JS repl that's interactive and can change the screen when a user does something?

RayhanADev (2608)

@Trex10 probably you should learn HTML, CSS, JS (I recommend w3schools)? Then create an html, css, and js repl!

Trex10 (7)

@RayhanADev
I do know some html, I can make a webpage pretty easily, but in order to make games I need to learn how to change screens so its not just a background with text and pictures and stuff that cant change.

RayhanADev (2608)

@Trex10 learn the <canvas> element! That's how most games are made.

BuddyRaider (24)


Let's goooooooooooooooooo!
High Score of 1764!

BuddyRaider (24)

lol yeah, look at my bio XD @PyCoder01

BuddyRaider (24)

@RayhanADev are ya gonna put up a WR list lol XD

dat would be cool lol
BuddyRaider (24)

@PyCoder01 @RayhanADev (sorry for the pings, but um... yeeeeaaaahhh...)

That run took a whole half hour to complete (I definitely paused a few times lol)

BuddyRaider (24)

@PyCoder01 chill, you did not ask for a ping, but you dont have to bite my head off lol

RayhanADev (2608)

@BuddyRaider @PyCoder01 woah chillax you two xD
this is a nice place just go your separate ways lol

BuddyRaider (24)

@RayhanADev lol yes XD

I am not complaining with that :P
coding1001 (15)

Add to your css file to prevent it from moving when you press the up arrow key

html,body{
overflow:hidden;
}
RayhanADev (2608)

@coding1001 done, thanks for the tip :D

Bunnytoes (165)

after like 5 minutes 147!

IntellectualGuy (849)

This looks like a game from the app store.

IntellectualGuy (849)

@RayhanADev I mean this game is probably like 3-5 times better than a few games I've played on the app store. What might be hard about that though is like making it in swift instead.

IntellectualGuy (849)

@RayhanADev
Also I had a stroke of ingenuity, and I got a few ideas

  • A pause menu instead of simply just stopping the game, consisting of
    • Score
    • High Score
    • Resume
    • Restart
  • Pause and Arrow Key Buttons
  • When you die instead of just resuming with a zero score, maybe you go to the pause menu?
  • Background Music, and a sound when someone destroys a tree
  • As you go farther more types of obstacles
  • Powerups
  • Unrelated, but maybe a Favicon
RayhanADev (2608)

@IntellectualGuy okay, I've done a few of these!
pause and arrows (and swiping for mobile 🎉)
o wait that's actually it... let me work on some more 😅

RayhanADev (2608)

@IntellectualGuy well you either use a keyboard or swiping (see the post). Are buttons necessary?

aarav170109 (8)

I love this game so much that I even opened the output in a new tab and bookmarked it. It's only that the ball takes to long to go from side to side.

RayhanADev (2608)

@aarav170109 :) yeah I'm working on side to side movement because to me it feels jut right but I guess I didn't take into account different processing powers.