A few questions on HTML5

w/e

Boaroceraptorasaurus-Rex
Reaction score
275
Ever since hearing about flash dying to HTML5, I've been kind of curious as to how well HTML5 can replace it.
I have some questions about the language that I'm hoping people could kind of shed some light on.

How are objects drawn and animated in HTML5 as opposed to flash/actionscript?
What languages should I know or have a good understanding of before learning HTML5?
What are some good resources to learn HTML5? Where should I start?

Thanks
 

UndeadDragon

Super Moderator
Reaction score
447
One good link I can give you to the power of HTML is http://www.ro.me/ There is also a "behind the scenes" part of the site, which may be of use to you. http://www.ro.me/tech/

Another good compilation site is http://www.canvasdemos.com/ (They also have a tutorial section).

As for learning it, it's not so much the actual HTML that will be replacing Flash. The thing that HTML5 offers is the <canvas> element. This can be very heavily modified using JavaScript, which runs as any other programming languages would, by drawing the graphics frame by frame. Having an existing knowledge of JavaScript can accelerate your learning quickly, as you can obviously skip the step of getting used to the API and structure of it.

A good tutorial which I found on Canvas games can be found here: http://www.felinesoft.com/blog/index.php/2010/09/accelerated-game-programming-with-html5-and-canvas/

Hope some of those links were of use to you.
 

GooS

Azrael
Reaction score
154
Object in the canvas, as UndeadDragon said, are rendered using a syntax very similar to OpenGL now existing in JavaScript by most modern browsers.
When they are drawn and how they are drawn however does not have to be frame by frame, and only mozilla and webkit, as far as I know, have implemented
functions for doing just that (requestAnimationFrame) which take the draw function as its callback.

That's about what I had to add, the rest have been answered.
 

w/e

Boaroceraptorasaurus-Rex
Reaction score
275
So I have to learn JavaScript in order to animate stuff or draw stuff?
There's no software or anything to help me out with it like in Flash?
 

Artificial

Without Intelligence
Reaction score
326
Depending on what kind of animations and image manipulations you want, you might not need to. CSS3 transforms and transitions (especially these) can help you out quite a bit, though they might not be perfectly supported by all browsers.

But for a game, for example, yes you would need to learn JavaScript. And if you're gonna be using JS, I recommend learning the language instead of just using it and just learning to manipulate the websites using it (if you don't, you'll end up hitting your head against the wall after encountering something like what's in my signature). For example listening to talks by Douglas Crockford (not necessarily the first one of those, though it can be interesting) can teach you a lot. And as ActionScript is a superset of JavaScript, you can likely carry quite a bit of what you learn to Flash if you decide to go back.
 

Darthfett

Aerospace/Cybersecurity Software Engineer
Reaction score
615
http://www.youtube.com/watch?v=_RRnyChxijA

This was a very interesting video to watch on the topic of graphics (Specifically games) on javascript (and html5).

There is WebGL, Canvas, CSS Transforms, to start with.

EDIT: In response to learning javascript: Native games have a much larger (as much as 20 years) head start on web-based games. There is a similar comparison for graphics in general, and thus many of the tools that would make the new features easy to use don't yet exist. Right now, you're very limited.
 

markasoftware

New Member
Reaction score
0
I would recommend learning canvas, which allows you to draw things and will probably be the dominant way to have graphics in HTML5. If you want 3d, learn WebGL. This a quite complex and low-level API, so you might want to check out three.js which is a popular library that makes WebGL much easier to use. Some languages you should know if you want to make a game with HTML5 are JavaScript, for the actual game (and you need it anyway for canvas and WebGL) and CSS3. Another thing you might want to look into is the Application Cache, which allows web applications to be stored in the user's browser, so they could use your website offline as well.
 
General chit-chat
Help Users
  • No one is chatting at the moment.
  • Ghan Ghan:
    Howdy
  • Ghan Ghan:
    Still lurking
    +3
  • The Helper The Helper:
    I am great and it is fantastic to see you my friend!
    +1
  • The Helper The Helper:
    If you are new to the site please check out the Recipe and Food Forum https://www.thehelper.net/forums/recipes-and-food.220/
  • Monovertex Monovertex:
    How come you're so into recipes lately? Never saw this much interest in this topic in the old days of TH.net
  • Monovertex Monovertex:
    Hmm, how do I change my signature?
  • tom_mai78101 tom_mai78101:
    Signatures can be edit in your account profile. As for the old stuffs, I'm thinking it's because Blizzard is now under Microsoft, and because of Microsoft Xbox going the way it is, it's dreadful.
  • The Helper The Helper:
    I am not big on the recipes I am just promoting them - I use the site as a practice place promoting stuff
    +2
  • Monovertex Monovertex:
    @tom_mai78101 I must be blind. If I go on my profile I don't see any area to edit the signature; If I go to account details (settings) I don't see any signature area either.
  • The Helper The Helper:
    You can get there if you click the bell icon (alerts) and choose preferences from the bottom, signature will be in the menu on the left there https://www.thehelper.net/account/preferences
  • The Helper The Helper:
    I think I need to split the Sci/Tech news forum into 2 one for Science and one for Tech but I am hating all the moving of posts I would have to do
  • The Helper The Helper:
    What is up Old Mountain Shadow?
  • The Helper The Helper:
    Happy Thursday!
    +1
  • Varine Varine:
    Crazy how much 3d printing has come in the last few years. Sad that it's not as easily modifiable though
  • Varine Varine:
    I bought an Ender 3 during the pandemic and tinkered with it all the time. Just bought a Sovol, not as easy. I'm trying to make it use a different nozzle because I have a fuck ton of Volcanos, and they use what is basically a modified volcano that is just a smidge longer, and almost every part on this thing needs to be redone to make it work
  • Varine Varine:
    Luckily I have a 3d printer for that, I guess. But it's ridiculous. The regular volcanos are 21mm, these Sovol versions are about 23.5mm
  • Varine Varine:
    So, 2.5mm longer. But the thing that measures the bed is about 1.5mm above the nozzle, so if I swap it with a volcano then I'm 1mm behind it. So cool, new bracket to swap that, but THEN the fan shroud to direct air at the part is ALSO going to be .5mm to low, and so I need to redo that, but by doing that it is a little bit off where it should be blowing and it's throwing it at the heating block instead of the part, and fuck man
  • Varine Varine:
    I didn't realize they designed this entire thing to NOT be modded. I would have just got a fucking Bambu if I knew that, the whole point was I could fuck with this. And no one else makes shit for Sovol so I have to go through them, and they have... interesting pricing models. So I have a new extruder altogether that I'm taking apart and going to just design a whole new one to use my nozzles. Dumb design.
  • Varine Varine:
    Can't just buy a new heatblock, you need to get a whole hotend - so block, heater cartridge, thermistor, heatbreak, and nozzle. And they put this fucking paste in there so I can't take the thermistor or cartridge out with any ease, that's 30 dollars. Or you can get the whole extrudor with the direct driver AND that heatblock for like 50, but you still can't get any of it to come apart
  • Varine Varine:
    Partsbuilt has individual parts I found but they're expensive. I think I can get bits swapped around and make this work with generic shit though
  • Ghan Ghan:
    Heard Houston got hit pretty bad by storms last night. Hope all is well with TH.
  • The Helper The Helper:
    Power back on finally - all is good here no damage
    +2
  • V-SNES V-SNES:
    Happy Friday!
    +1

      The Helper Discord

      Members online

      Affiliates

      Hive Workshop NUON Dome World Editor Tutorials

      Network Sponsors

      Apex Steel Pipe - Buys and sells Steel Pipe.
      Top