Skip to content
Sign upLog in
← Back to Community

TheHouse | threejs horror game

Profile icon
[deleted]

The House - horror adventure game
How my friends describe it "The House – You're in a strange house. Can you find the way out? Is there any?"

Introduction
I've wanted to create a horror game since a long time. You know - one of those cool things you'd like try. :) When I started working on this project I had only basic knowledge about JS. Very basic. I didn't even know how to define an array and JS objects and methods were some kind of mystery. Thanks to this game my skills have developed tremendously. I'm still far from calling myself "pro JS dev" but I've got siginficantly closer.

house_5

Gameplay Images
You can play it right here.
https://thehouse.repl.co

house_3


thumb-1570181618761

Introduction
I've wanted to create a horror game since a long time. You know - one of those cool things you'd like try. :) When I started working on this project I had only basic knowledge about JS. Very basic. I didn't even know how to define an array and JS objects and methods were some kind of mystery. Thanks to this game my skills have developed tremendously. I'm still far from calling myself "pro JS dev" but I've got siginficantly closer.

You can play it right here. Please mind that:

it's my first horror game ever. :)
How does it work?
The game is made using HTML, CSS (Less) and JS (depends strongly on jQuery). Every room, roughly speaking, has simple markup in HTML which defines items (such as table, window, etc.) and click areas. CSS is responsible for graphic and JS for all the rest (DOM animations, interactions, saving game state). Since I had some experience with developing and designing websites I decided that HTML would be the right technology to start with.

A little bit more about scripts:
js/audio.js - all sounds are defined here,
js/data.js - responsible for saving game state,
js/dialogue_box.js - responsible for various popups,
js/game.js - sits on the top of all scripts and uses them to genrate game,
js/items.js - manages items found by a player,
js/npcs.js - non playable charcters,
old_browser.js - fires when not supported browser is detected,
js/room.js - generates rooms, responsible for interaction of the main character wit the game world the A (A-Star) algorithm here is by Andrea Giammarchi*,
js/scenes.js - cutscenes are stored here,
js/settings.js - game settings, at the time this file is responsible for reseting the game only :P,
js/text_cloud.js - speech balloons for the main character,
js/tooltip.js - tooltips :),
js/utility.js - super simple tool: I use it to define hit-areas for that game grid,
js/view.js - generates outside views (when you look throught a window).
Credits
It's about time to mention resources (and people behind them) that helped me (A LOT) to create my game.

Sound
All sounds come from Freesound.org. Full list below:

"Distant Shot" by ERH
"Electric Wooshes" by Glaneur de sons
"Sad Pattern Drone" by patchen
"Sad Pattern Drone" by suonho
"Swell Pad" by ERH
"Horror Drone 001" by DJ Chronos
"Creepy Phone" by FreqMan
"Adrift On A Glassy Sea loop" by troutstrangler
"Buzz 001" by futureprobe
"Light 1" by TicTacShutUp
"Creak 9" by HerbertBoland
"18 Close Door" by adegenerate
"Open and Close Wooden Door" by fresco
"Buzzer Variants#3" by Timbre
"btn402" by junggle
"Shower Curtain" by samplecat
"SFX(12)" by Nimbyc
"Crash" by Sagetyrtle
"Button Click" by KorgMS2000B
"Fire Forest Inferno" by Dynamicell
"BC Speaky Compactor" by cmusounddesign
Graphic
"Bust Basemesh" by Christian Rambow
Textures from CG Textures
JavaScript
Modernizr
SoundManager 2
jQuery
jQuery Colors by Edwin Martin
jQuery Preload CSS Images by filament group
jStorage by Andris Reinman
Spritely by Artlogic
jQuerty UI
jQuerty Transit by Rico Sta. Cruz
A* (A-Star) algorithm function by Andrea Giammarchi
Licenses
The House code:
MIT License

Copyright (c) 2019 Artur Kot

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

The House artwork:
Creative Commons Attribution 3.0 License

Voters
Profile icon
ColtRed
Profile icon
EmmanuelVillace
Profile icon
parkerslv
Profile icon
IroncladDev
Profile icon
ThePhoenixfish
Profile icon
RegyRegular
Profile icon
AdamGomez
Profile icon
wiki3d
Profile icon
Shigetorum
Profile icon
lyricme
Comments
hotnewtop
Profile icon
amasad

@vvc
did you build it or did you at least fork it from someone and modified/improved it?

Profile icon
MatthewDoan1

@amasad
Pretty sure it was taken from here:
https://the-house.arturkot.pl/

Since he put
image

in his post.

Profile icon
MatthewDoan1

@amasad
In fact, most of this is actually taken from here. (I don't want to say plagiarized since that's a bit strong)

Profile icon
[deleted]

@amasad
i did modify a little bit and experimented like Matthew said most of it was by artukot - https://the-house.arturkot.pl

Profile icon
CodeOfCayde6

@MatthewDoan1
Wait does his name mean that the acount has been deleted or is that just profile name?

Profile icon
VulcanWM

their account's not clickable so it's been deleted

@CodeOfCayde6

Profile icon
CodeOfCayde6

@VulcanWM
ok thank you

Profile icon
VulcanWM

np

@CodeOfCayde6

Profile icon
CodeOfCayde6

This is a hidden gem!

Profile icon
wessonel

what do i do next

Profile icon
[deleted]

eyyyy guys this project was mostly made by arturkot i just modifies a bit. A new project is something called http://wiki3d.repl.co ThAT is 100% deved by me and my friend

@goldTree

Profile icon
MatthewDoan1

@vvc
I think you should have mentioned this and said that you modified Artur Kot's project a little bit before I told the community that you did. Just sayin', you should be giving credit where credit is due.

Profile icon
[deleted]

@MatthewDoan1
true, but I did mention copyright of Artur Kot in the post

Profile icon
MatthewDoan1

@vvc
Actually you copied the entire description from the Github repo.

Profile icon
[deleted]

@MatthewDoan1
I did but if I wanted to plagerize I would be more smart and I would remove

Profile icon
Andi_Chin

dat's insane

Profile icon
Navinor

pretty cool game

Profile icon
Highwayman

Oh what I would do just to see that source code... it sounds so awesome.

Profile icon
EthanCulp

You can, go to the website and press CTRL+i on chrome and CTRL+u on Microsoft Edge

@Highwayman

Profile icon
[deleted]

@Highwayman
MMM, the S A U C E

Profile icon
Highwayman

@EthanCulp
hm yes except for the fact that I only have this ****** Safari browser and that probably wouldn’t look very good / be super hard to read and learn from.

Edit: sorry those are two different statements: you can’t do inspection mode on safari on my device and the messy code statement.