HTML 5 is rubbish ?

B5262118b588a5a420230bfbef4a2cdf
0
Stainless 151 Jan 26, 2014 at 13:25

I have to do a demo in a couple of weeks, and decided to put it together in HTML 5.

What a mistake.

Nothing works as you expect it to.

Lets start with setting a canvas size, first I tried …

 <canvas id="c" width="800" height="600"></canvas>

The canvas was full screen. So then I tried.

<canvas id="c" width="800" height="600" style='width:800px;height:600px'></canvas>

The canvas was full screen. So then I tried adding some javascript

var canvas = document.getElementsByTagName('canvas')[0];
canvas.width  = 800;
canvas.height = 600;

I get a null pointer exception. So next I tried ….

canvas = document.getElementById('c');
canvas.setAttribute('width', '800');
canvas.setAttribute('height', '600');

The canvas was full screen. After banging my head against the wall for ten minutes, I tried adding some css

body { 
       margin: 0; 
       padding: 0
     }
#c { 
     position: absolute; 
     width: 800; 
     height: 600; 
     overflow: hidden;
   }

Guess what, the canvas was full screen.

At this point I have given up and binned it

I will do my demo using c++ and opengl even though I will have to do a lot more work.

Anybody actually got HTML 5 to work as expected?

10 Replies

Please log in or register to post a reply.

7aeee6bdf472f8cc5d7853b2b5aae133
0
spolsh 101 Jan 26, 2014 at 14:02
<html>
<head>
</head>
<body>
   <canvas id="c" width="800" height="600" style="border-style:solid;"> </canvas>
</body>
</html>

Only added style to your first try so you can see the dimensions. Works for me. tested on chrome and firefox.

btw. How to fix code markup?

6837d514b487de395be51432d9cdd078
0
TheNut 179 Jan 26, 2014 at 17:04

I use JavaScript to get the dimensions of the browser page window and update the canvas accordingly. I plug this in the <body onresize=''> event so that it scales with the browser window. It looks like you’re also setting the body margins to 0px, which is a good thing to do as well.

HTML:

canvas id="MyCanvas"

JavaScript:

var canvas = document.getElementById("MyCanvas");
canvas.width = window.innerWidth
canvas.height = window.innerHeight

BTW, as spolsh mentioned, it would be nice to have a preview/syntax guide for markdown. I too have difficulty getting certain things to work. I use DokuWiki and Confluence all the time and this markdown stuff keeps messing me up :)

B5262118b588a5a420230bfbef4a2cdf
0
Stainless 151 Jan 26, 2014 at 20:38

instead of [code] you have to put four spaces on the front of each line of code, don’t know why. Maybe the code monkey eats spaces. Makes no sense to me.

I am using chrome (latest version, made sure of that), on windows xp.

None of the code I have tried, or any of the suggestions I have seen anywhere work.

A638aa42130293f319eda7fa4ba121f4
0
fireside 141 Jan 26, 2014 at 21:14

You have to use “pre” instead of “code”, with less than/greater than brackets.

A8433b04cb41dd57113740b779f61acb
0
Reedbeta 167 Jan 26, 2014 at 23:44

It’s because the new forums use Markdown. Four spaces indented is what signals code in Markdown. It’s a different syntax than the old BBCode, but it doesn’t take long to learn.

(I don’t know why inline code (text inside backticks) turns red, like this, though.)

B20d81438814b6ba7da7ff8eb502d039
0
Vilem_Otte 117 Jan 27, 2014 at 00:04

I’d like to note that following is not my own opinion, but rather opinion of few people I’ve talked with…

HTML5 is mainly an Apple propagated pseudo-standard that doesn’t have solid support across the browsers (there are still issues after few years), yet the companies that created it heavily propagate it. As opposing to Flash (yet this one works as plugin), it works differently across browsers and even in same browser in different operating systems.

My point of view is a bit different, I think that HTML5 is really step in good way, yet I think that whoever stands behind HTML5 standard must be crying now. The standard looks similar to what SQL standards are - different in each implementation, yet never actually implementing standard correctly, nor fully. It’s better than before, but still it is terribly bad.

A8433b04cb41dd57113740b779f61acb
0
Reedbeta 167 Jan 27, 2014 at 01:48

Isn’t this always the way with new web standards? Think how long it took for CSS and the DOM to work consistently across all browsers and platforms…those were bad old days in the late 90s and early 2000s. I don’t know why this seems to be the disease of the web particularly, but it’ll get ironed out.

B5262118b588a5a420230bfbef4a2cdf
0
Stainless 151 Jan 27, 2014 at 09:10

Having written a web browser, I know how hard it is to get this mess of a ‘standard’ to work consistently. Hell there are 20 different ways of doing anything, all of which are supposed to look the same over all browsers. It’s a mess.

I would much prefer a compiled system along the lines of LLVM, compiled byte code, much smaller than text files, easier to parse, et al ad nauseum. However of course in this I am in a minority of one.

Fd80f81596aa1cf809ceb1c2077e190b
0
rouncer 103 Jan 27, 2014 at 04:01

i tried to make a mud with ASP and i was dead in all directions. if u want to make a client server game, it ends paying not using ASP to do it, and just use c++. so i wonder if HTML5 is just as horrible to use.

B5262118b588a5a420230bfbef4a2cdf
1
Stainless 151 Jan 27, 2014 at 09:17

What I am finding is that HTML 5 works…… sometimes.

I found that changing a single line of code and turn an app running perfectly at 60 Hz, to a heap of brown and smelly running at 1 Hz

I am sure that if you use windows 8, internet explorer, and run Microsoft’s web server, everything works.

Change any one of those elements and bad things can happen.

Or maybe Chrome on Ubuntu Linux with Apache

Or IOS and Firefox……

Or a brick, a hand, and a head. Hand applies velocity to brick which applies force to head.