[html5] html5 novice seeking guidance

Shwetank Dixit shwetankd at opera.com
Thu Sep 22 12:01:28 PDT 2011


On Thu, 22 Sep 2011 19:43:36 +0530, Jochen Wiedmann  
<jochen.wiedmann at gmail.com> wrote:

> Hi,
>
> I've got some 15 years of experience with elder versions of HTML,
> JavaScript, and CSS. Now I'd like to approsch a new project and hope,
> that this could be done with HTML5. However, as I imagine that there
> is a real lot of new technology to learn, I'd like to ask for
> guidance, if only to find thAe right documentation and samples as
> quick as possible.b
>
> What 'I'd like to do is a little fame, WHich works as folllows:
> - The screen is initially empty. When the game starts, the screen is
> filled with random numbers, on random positions (preferrably no grid,
> or the like, but truly random), in random sizes, colors, and styles
> (inverted or not, bold, or not, italic, or not).
> - The users task is to remove those numbers by left clicking on the
> odd numbers and right clicking on the even numbers (or vice versa).
> - When some numbers have been removed, the empty portions of the
> screen are again randomly refilled.
>
> Trying to rephrase the above in  a set of questions:
>
> - Can I do filling the screen in  HTML5. If so, are there any samples
> or docs availabLE that show me how to randomly place pictures or text
> in a predefined area of the HTML page?
I guess the best way would be to just use canvas, and place text on random  
places within the canvas, and use transforms to rotate them too if you  
like. You can style them too.

There are plenty of Canvas tutorials out there on the net.

Introductory:
http://dev.opera.com/articles/view/html-5-canvas-the-basics/
http://dev.opera.com/articles/view/html5-canvas-painting/
https://developer.mozilla.org/en/Canvas_tutorial

More from a game programming perspective:
http://dev.opera.com/articles/view/creating-pseudo-3d-games-with-html-5-can-1/
http://labs.skookum.com/demos/barcampclt_physics/index.html
http://html5.litten.com/make-a-maze-game-on-an-html5-canvas/


> - How do i detect, if the user clicks on those numbers, distinguished
> by left and right click? Again, any samples or docs?
> - Can I start some thread or background task that cares for the
> refilling (that thread would also declare the game over after some
> time.)
You can use Web Workers for that.
Spec: http://dev.w3.org/html5/workers/

Tutorials:
http://dev.opera.com/articles/view/web-workers-rise-up/
http://www.html5rocks.com/en/tutorials/workers/basics/
http://diveintohtml5.org/workers.html

>
> Thanks , and sorry for stealing your time,in advance,
>
> Jochen
> _______________________________________________
> Help mailing list
> Help at lists.whatwg.org
> http://lists.whatwg.org/listinfo.cgi/help-whatwg.org


-- 
Shwetank Dixit
Web Evangelist,
Site Compatibility / Developer Relations / Core Engineering Group
Member - W3C Mobile Web for Social Development (MW4D) Group
Member - W3C Web Education Community Group
Member - Web Standards Project (WaSP) - International Liaison Group
Opera Software - www.opera.com

Using Opera's revolutionary email client: http://www.opera.com/mail/



More information about the Help mailing list