Omnimaga

General Discussion => Technology and Development => Web Programming and Design => Topic started by: Galandros on January 31, 2010, 09:46:02 am

Title: HTML Games with JavaScript
Post by: Galandros on January 31, 2010, 09:46:02 am
Any of you has seen games in HTML, CSS and JavaScript? Web browsers can run JavaScript and show HTML pretty fast.
Plus there is keyboard and mouse ways to get input. Even ways to save data.

But I have only seen simple games like Tic Tac Joe, avoid obstacles with mouse, tower of hanoi... The most complicated was chess.
If you have seen something more interesting, share the game.

But some ASCII RPG could be doable. I am not thinking in doing one but I will try to come some nifty scripts to get keyboard and mouse input, and other stuff. One objective is to be most cross browsers compatible possible.
What I want to discuss is the enormous possibilities.

I have some ideas:
- through AJAX, we can have multi player through the Internet and a Web Server running PHP, for instance. A RPG with single player and multiple player could be nice.
- ASCII mapper (BW and colours)
- Raycasting with ASCII and colours (Ben Ryves has actually done that already, see his gamedev or site journal)

I know some disadvantages:
- Cross browser problems
- With only JavaScript it is impossible to avoid cheating because the source code is a available. Cheating is always a possibility even if very hard, though.

Maybe later I can do some game like Hunt or runner. For now I will come with the scripts to see if it gains interest. I have started a PHP lib to save data on a file. Maybe I can add other useful stuff. With XAMPP is very easy to start a web server and play some game that requires it.

EDIT:
I searched a bit and found one interesting site:
http://www.javascriptgaming.com/
There is some JavaScript games libs like: http://gamequery.onaluf.org/

It could be interesting some JavaScript gaming in Omnimaga. :P What you think?

PS: I am not quitting calc stuff, although I am doing more web related things. It is question of time to get bored with web stuff.
Title: Re: HTML Games with JavaScript
Post by: {AP} on January 31, 2010, 11:14:05 am
It's definitely doable. Though, I'd do it in PHP or Flash first personally.
Javascript doesn't completely agree with me.

However, I'll keep tabs on this project and help where I can.
Title: Re: HTML Games with JavaScript
Post by: Galandros on January 31, 2010, 11:27:29 am
It's definitely doable. Though, I'd do it in PHP or Flash first personally.
Javascript doesn't completely agree with me.

However, I'll keep tabs on this project and help where I can.
JavaScript does have its quirks. But most time understanding JavaScript will make you realize it is not wrong.
My problem with Flash is you need a plugin installed. Also why not do things in the tricky and fun way?
The idea is to be able to play offline after download the page. Everyone has a web browser nowadays.

I have already found many sites with fun and very good JavaScript games. Here is a showcase of them: (warning: very addictive but inspiring)
http://www.protorpg.com/games/protorpg/?game=prologue
http://drakim.net/other/ff/
http://www.e-forum.ro/bomberman/dynagame.html
http://www.voximperium.com/game.php
http://blog.nihilogic.dk/2008/04/super-mario-in-14kb-javascript.html (Super Mario in 14kb of JavaScript!!! Even calcmaniac has hard time trying that in z80 assembly)
http://www.honeyblaster.com/ (Grayscale pixels, paralax scrolling and a shooter in JavaScript)

EDIT:
I have coded some JavaScript to suppress things like selecting text, left click context menus and such. This can be useful to immerse the player into the game and forget they are in a web browser.

I discovered many JavaScript games libs or general libs used into games. I will see them and think what I can do to complement those libs. I might do my own implementation of their features if I need to do my lib out stand among others.
Title: Re: HTML Games with JavaScript
Post by: Eeems on January 31, 2010, 12:34:19 pm
Hmm, I know that there are a few well don't JavaScript games out there for the iPhone/iPod touch, that use the jquery library of JavaScript. Don't actually have any links at the moment, but they are good examples.
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on January 31, 2010, 01:35:20 pm
I personally wouldn't code in JS because back then I had JS classes in college and it was way too incredibly hard for me. The teacher was always at my desk helping me debug and I would still don't get it. I failed the class and eventually dropped out

That said, some JS games might be cool, you just need to make sure it's not too easy to cheat. On the old Omnimaga forums, we had a RPG system Late 2005 and Early 2006, where your stats/save were stored in your signatures. However, people just disabled JS in their browser and hacked the stats through signature editing options to get ultimate weapons and stats and in some browsers, people were unable to edit their sig anymore.
Title: Re: HTML Games with JavaScript
Post by: Galandros on January 31, 2010, 02:12:15 pm
I personally wouldn't code in JS because back then I had JS classes in college and it was way too incredibly hard for me. The teacher was always at my desk helping me debug and I would still don't get it. I failed the class and eventually dropped out

That said, some JS games might be cool, you just need to make sure it's not too easy to cheat. On the old Omnimaga forums, we had a RPG system Late 2005 and Early 2006, where your stats/save were stored in your signatures. However, people just disabled JS in their browser and hacked the stats through signature editing options to get ultimate weapons and stats and in some browsers, people were unable to edit their sig anymore.
JavaScript can be a bitch in debugging. Especially because if there is some syntax error no code is executed. That is why I now use a custom error handler and pay attention to the Web Browser tools.

There are quick measures like JavaScript compressors and obfuscation. This turns things even harder than TI-BASIC cheating. But to work, I can't release the readable source code.
More advanced ways: encryption for the rescue. I saw in a paid HTML, PHP and JavaScript application. Their method was obfuscation of code and some wicked encrypt. I have to discover the method.
Title: Re: HTML Games with JavaScript
Post by: mapar007 on January 31, 2010, 02:51:31 pm
@DJ: no worries 'cause:

An influential Belgian computer scientist, who was involved in the founding of the Internet, stated: "JavaScript definitely is the worst programming language ever." (this is not literally quoted, fyi)


Galandros, couldn't you avoid cheating by having the "important" part of the code run on that webserver?
Title: Re: HTML Games with JavaScript
Post by: {AP} on January 31, 2010, 02:56:42 pm
Agreed. The Mario game that was linked destroyed my Firefox for a good 10 minutes. (even after ending the process and going back in)
Then the Honeyblaster game only spawned like 6 enemies then just sat there. I could move, but nothing really happened the whole time.

The FF game was nice but had graphical glitches.
Haven't touched anything else since the Mario game though.
JS scared the crap outta me.
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on January 31, 2010, 03:00:36 pm
On my side the Mario game sprites were garbled, though
Title: Re: HTML Games with JavaScript
Post by: {AP} on January 31, 2010, 03:07:27 pm
That's how it started... then all of a sudden, the screen was just blue with a timer.
Then... it like got rid of everything but the title bar and changed the title to french.
Then made multiple copies of it self all over my taskbar (including the process icons and start button) that all didn't work and it wouldn't close.
So, I had to end the process and start it back up.
Firefox, however, remembers tabs when it closes like that so it opened up again and repeated.

Worked itself out long enough for me to close the tab the 3rd time. =/

No idea what the issue was, but I don't want it to happen again.
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on January 31, 2010, 11:49:07 pm
Ouch, that sounds like Skynet *runs*
Title: Re: HTML Games with JavaScript
Post by: Galandros on February 01, 2010, 04:13:34 am
Galandros, couldn't you avoid cheating by having the "important" part of the code run on that webserver?
That is what needs to be done in the multi player one. Thanks. Still it isn't easy as it seems.
But for the stand alone html with game, I prefer avoid the overhead of installing an web server with php.

On my side the Mario game sprites were garbled, though
On mine too.

If I choose one preferred web browser is going to be Firefox because it is available on all platforms and AFAIK compliant with standards.
Still I have downloaded most used and up to date web browsers to test on them... I will test on Windows mostly. Probably Firefox for Linux, too.
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on December 01, 2010, 01:41:36 pm
You can prevent cheating by putting variables within the private scope.
That can be done using this:
Code: (JavaScript) [Select]
var GlobalScope = function () {
var PrivateString = "Hello";
return {
showstring: function () {
alert(PrivateString);
}
};
}();

Upon looking at the DOM using Firefox's Firebug, you can see that the private string is not accesible.
So this will not work:
Code: (JavaScript) [Select]
alert(GlobalScope.PrivateString);

But, this will, as it is called by the GlobalScope's own child.
Code: (JavaScript) [Select]
GlobalScope.showstring();
Title: Re: HTML Games with JavaScript
Post by: Galandros on December 19, 2010, 12:20:50 pm
You can prevent cheating by putting variables within the private scope.
That can be done using this:
Code: (JavaScript) [Select]
var GlobalScope = function () {
var PrivateString = "Hello";
return {
showstring: function () {
alert(PrivateString);
}
};
}();

Upon looking at the DOM using Firefox's Firebug, you can see that the private string is not accesible.
So this will not work:
Code: (JavaScript) [Select]
alert(GlobalScope.PrivateString);

But, this will, as it is called by the GlobalScope's own child.
Code: (JavaScript) [Select]
GlobalScope.showstring();
Interesting but you can always try to manipulate a browser to load a different JavaScript code. But that would prevent many easy attempts. And it is interesting JavaScript code, I have seen it being used in libraries, I think.
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on December 19, 2010, 12:39:10 pm
HOLY NECROPOST BATMAN! O.O
Title: Re: HTML Games with JavaScript
Post by: Snake X on December 19, 2010, 12:48:40 pm
lol ive seen worse (on this one forum I will not mention there was this 3 year old thread that someone had necroposted in )  ;D
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on December 19, 2010, 03:41:24 pm
Yeah, it was actually 2 years old, but 5 threads in total.
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on December 27, 2010, 09:24:22 am
...
Interesting but you can always try to manipulate a browser to load a different JavaScript code. But that would prevent many easy attempts. And it is interesting JavaScript code, I have seen it being used in libraries, I think.

Yes, this is a technique used in alot of librairies, but still:
the only way to edit these private vars is by finding the hex adress in the programs (for ex. using CheatEngine)
But even that can be prevented by encoding all vars (I'm a security freak :w00t:)

Edit: About the javascript source code being public, see this: http://www.javascriptobfuscator.com/default.aspx
Ofcourse, it doesn't completely hide the code, but sure makes it damn hard to find out :)
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on December 27, 2010, 06:22:28 pm
Interesting. I guess it can be converted back by someone who is very tech-savy, though.

One problem with JS is if you use it to block access to certain stuff on the site or to hide info, the person just have to disable JS in his browser to access the info fine.
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on December 29, 2010, 06:22:16 am
Interesting. I guess it can be converted back by someone who is very tech-savy, though.

One problem with JS is if you use it to block access to certain stuff on the site or to hide info, the person just have to disable JS in his browser to access the info fine.

Have a solution for that as well :)
What if the site layout on load is like this:
Code: (HTML) [Select]
<!DOCTYPE Notgivingashitaboutw3c>
<html>
<head>
<title>
My Website
</title>
<script type="text/javascript" src="./myjsfile.js"></script>
</head>
<body>
<div id="main">
Please enable JavaScript to load this site.
</div>
</body>
</html>
And then use javascript to load in the rest using ajax :P
Don't do anything unless the user enables javascript :)

And ofcourse, the obfuscation can be "de-coded", that's what the browser does in the first place to read it.
But then again, not everyone knows how to do such thing, it does add another grade of difficulty to it.

And yes, I know javascript isn't the most secure, but you can still go quite far with some imagination :)
As I always say: The code isn't limited, the programmer's imagination is :)
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on December 30, 2010, 03:46:01 am
Yeah I agree. I guess we just need to be careful to not use it for things that absolutely requires high security, like a forum RPG system. On Invisionfree, you just changed your RPG stats in your signature while JS was disabled and you were done: LV 255, ultimate sword, etc. :P
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on March 09, 2011, 01:26:44 pm
(Yay, I seem to be very good at necroposting LOL)
Anyway, I have some progress on this subject...
A friend of mine has currently managed to get his JavaScript based MMORPG in the closed béta phase.
As I am invited to the closed béta atm (I'm the only one except staff that has access), I was allowed to post some things on the forums.
You can check them out here:
http://forums.vanthia.com/viewtopic.php?id=389
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on March 09, 2011, 01:37:49 pm
yeah, I agree with that belgium programmer, it's the worst language ever.  blah.  screw JS.
He only quoted something, but people saying so don't bother trying to get it to its full potential.
And what arguments do you have for saying its the worst language ever?
I can easily outdo effects created using flash or java using it.
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on March 09, 2011, 01:41:54 pm
Ashbad, please do not start a language war here (unless you were just quoting an old post). Although it's a major PITA to get to work, it looks like here we got an example of what kind of stuff can be done in it.
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on March 09, 2011, 01:43:32 pm
Ashbad, please do not start a language war here (unless you were just quoting an old post). Although it's a major PITA to get to work, it looks like here we got an example of what kind of stuff can be done in it.
Which are quite amazing though.
I have been given the right to invite some people as well.
Well, not immediatly, but soon ^^
Title: Re: HTML Games with JavaScript
Post by: Ashbad on March 09, 2011, 01:43:50 pm
personally, I forgot many of my arguments (I used JS a loooong time ago) but I do remember it's form of OOP was somewhat weird and weak, and it's syntax is weird.  that's all I remember personally.

also, I was referring to that earlier post on page one about how a belgium programmer said that JS is the worst programming language ever.

EDIT: also, where's the language war?  can't I say I don't like JS?
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on March 09, 2011, 01:46:41 pm
personally, I forgot many of my arguments (I used JS a loooong time ago) but I do remember it's form of OOP was somewhat weird and weak, and it's syntax is weird.  that's all I remember personally.

also, I was referring to that earlier post on page one about how a belgium programmer said that JS is the worst programming language ever.

EDIT: also, where's the language war?  can't I say I don't like JS?
By default, javascript isn't meant to be OO, but it depends on the programmer on how to implement it.
I do agree with the fact that it has a weird syntax, but it has ALMOST the exact same syntax as php, so you're calling PHP weird as well? I know thousands of people who would hate you for saying that ^^
Title: Re: HTML Games with JavaScript
Post by: Ashbad on March 09, 2011, 01:48:09 pm
oh.  in that case, tons of PHP people will hate me then.
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on March 09, 2011, 01:48:57 pm
Ashbad, please do not start a language war here (unless you were just quoting an old post). Although it's a major PITA to get to work, it looks like here we got an example of what kind of stuff can be done in it.
Which are quite amazing though.
I have been given the right to invite some people as well.
Well, not immediatly, but soon ^^
Ah cool, try to not advertise another forum, though, especially not via PM, because that would be against the rules. Game is fine, though.

As for JS personally the thing I disliked was how one single tiny mistake like forgetting a ; could screw the code up, how sometimes we got errors for absolute no reason and how other times when we should be getting one, we don't get any, plus the fact it's so hard to get a JS code to work properly in all browsers. That said I had the ; issue occur in CSS styling too, so maybe it's something with web dev. :P Otherwise, my argument like with TI-BASIC stands: It's not the language used that matters the most, but the end result. I personally dislike judging a game solely based on its file size or language.

And the language wars is when you say something such as "X language is crap" or "screw X language" like if it was a fact instead of personal opinion. You can dislike/hate Javascript, but do not bash people JS projects. And I am considering disabling the ability to delete posts, since it seems abused now.
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on March 09, 2011, 01:52:02 pm
Ah cool, try to not advertise another forum, though, especially not via PM, because that would be against the rules. Game is fine, though.
Oh, ok... Well, I'm linking to the other forum because they didn't give me the rights to post it elsewhere, but I thought it was worthy to at least notify the people here that it exists ;)

As for JS personally the thing I disliked was how one single tiny mistake like forgetting a ; could screw the code up, how sometimes we got errors for absolute no reason and how other times when we should be getting one, we don't get any, plus the fact it's so hard to get a JS code to work properly in all browsers. That said I had the ; issue occur in CSS styling too, so maybe it's something with web dev. :P Otherwise, my argument like with TI-BASIC stands: It's not the language used that matters the most, but the end result. I personally dislike judging a game solely based on its file size or language.

Completely agree with that ^^
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on March 09, 2011, 01:55:11 pm
Yeah I'm fine with that. I just meant no stuff such as PM invites telling people to register and post on a forum.
Title: Re: HTML Games with JavaScript
Post by: Ashbad on March 09, 2011, 01:55:45 pm
I don't like to judge games based on file size or language either, but I do criticise games which have a decent output but had very little work put into them.  I personally can't stand most games made with the RPG toolkit: all the person does is rip some final fantasy sprites and write a cliche'd story like evil wizard darth vader is gonna blow the world up with a dark hole thing spell crap and has about 50 lines of code to say something like "enemies are bad beat the evil wizard to win good luck" or "it's dangerous to go along take this [sword]" (zelda ripoff) and such.  this is about 60% of the toolkit's output games, and another 30% are clones of either pokemon, zelda, chrono trigger, or final fantasy.  I look upon this 90% margin of toolkit games as crap.

however, 10% are amazing, (slow and laggy, due to the nature of the toolkit's programming language) but they are amazing nonetheless and probably have 100 hours of work put into them.

as you can see, I don't upon easier languages, but I do hate upon noobish work with these languages.

EDITS: DJ, I wasn't bashing the games, they're awesome, but I personally think it's a PITA to code with Javascript -- the most I made before I got sick of it was pong.

also, I had to delete the post:  whenever there's a -1 on a post, about 6 people will jump on the bandwagon and downrate it too.  while I still stand with the opinion in my old post, I don't feel like losing 5 more respect since the downrating system is also really abused as well.  And no offense DJ, whenever you downrate a post, downrate abuse is most evident.  you have a magic touch on people's consciences ;) (and you eat their souls -- jk :P) :)
Title: Re: HTML Games with JavaScript
Post by: Ikkerens on March 09, 2011, 01:58:26 pm
as you can see, I don't upon easier languages, but I do hate upon noobish work with these languages.
That's the nice thing about this game, all he used is MooTools (http://mootools.net/)
Which is getting oudated though, jQuery has almost completely replaced it, but still, he did an awesome job ;)
(He didn't do it alone though, he has some RL friends which did most of the content/graphics)
If you want a slight introduction, there's one on http://www.vanthia.com/
Title: Re: HTML Games with JavaScript
Post by: DJ Omnimaga on March 09, 2011, 02:02:10 pm
Yeah, likewise with TI-BASIC and to a lesser extent RPG Maker games. I think the latter might be because sites only accepts high quality ones. I don't mind if they use sprites from other games, but I dislike when there's barely any difference. I don't mind presets graphics either as long as the game content is rather good. In my RPG Maker game it's simple since it was my first, but nobody made a MCOG-related game or sequel before so I thought I would make one and adapt it to the RPG world. The problem with high quality RM games, however, is that almost none are finished.

Note about Javascript, personally I don't find JS easy, though. Hence my comments about the debugging process. I learned JS in College and eventually dropped out after seeing that's what we were gonna do most of the time. O.O

EDIT: I kinda disagree about post rating, though, because at least 90% of the posts I rated down were rated back up. I think it gets rated down more only in the other 10% case. But what I don't like about post deletion is that the convo makes no sense afterward :P

Anyway just be careful because lately we've been more strict on rules. (Someone got banned for starting a software war with video editing tools last night, although the ban was short)