just starting out in java/html

[ninogenio]

ahh thats good too know ck!,

i tryed too implement the not not drawing while the cam doesnt move but gl auomatically clears everything on frame complete so i was just ending up with a black screen.

so ill just move the players starting position.

that sounds excellent with the map builder.. its going too be getting plenty of use soon. now that we have a completed canvas version and an almost complete webgl version it's come time for game building

[combatking0]

It's great to see the progression from no textures, to 2D Canvas textures to full on WebGL.

I've put the latest WebGL version here:
http://fx.barcodebattler.co.uk/waveSphere/webglraycaster.htm

With a multi-file supporting Map Builder here:
http://fx.barcodebattler.co.uk/waveSphere/jsrMapBuilder.htm
There's also a mouse position debug so we can see what's happening with that bug you encountered.
The top coordinates are the mouse position while the lower coordinates are the top-left of the highlight square.

[ninogenio]

wow there is something pretty magical happening here ck!!!

i just for fun downloaded firefox onto my samsung galaxy s2 ( not a great phone by any stretch ) and tryed the webgl version. were getting 43 fps!!!....

and it only goes too stripwidth 3 i am absolutly gob smacked.

the canvas one runs at 5fps so it was defo worth our effort too port this too gl.

ohh and the mobile ff is rendering floor and ceiling so i suspect a bug in the desktop version when streaming vbo's.

next we need some buttons on the page for left right forward and back so mobile users have control.

i am going too get stuck into the map builder when i get home from work tomorrow and report where the little bug comes from. thank you for putting all this work into the map builder and supporting this mate! its coming along a treat. when it comes too building apps with gui's your work is excellent! much better than i could manage. cheers.

[Jim]

About 15-20fps on my Nexus7. Any chance you can add some tablet friendly controls? Maybe press and hold for forward, swipe to go left and right?
Great stuff!
Jim

[ninogenio]

excellent idea jim! yep ill try and add that in 

i take it the touch screen is linked too mouse events so it would be a simple case of using a mousedeltaX and mousedeltaY var for rotations and mousedown event for movement.

so that's 15-20fps for a nexus7 and 37-43 for my s2 that's really good going!.. tbh i never even expected it too work on mobile devices.

@ck would there be any chance in changing the character sprites on your server for the power of two ones in my last upload. megaman and ryu is just displaying all black in firefox. or alternitivly you can use this for non power of 2

Code Select Expand


///////////////////////////////////////////
///    Jim's Texture Load functions     ///
///////////////////////////////////////////
function loadTexture(filename,gl)
{
    var rv = gl.createTexture();
   
    gl.bindTexture(gl.TEXTURE_2D, rv);
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 2, 2, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array([255, 0, 0, 0, 255, 255, 255, 255, 255, 0, 0, 0, 255, 255, 255, 255]));
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

    rv.image = new Image();
    rv.image.crossOrigin = "anonymous";
    rv.image.onload = function () { imagesLoading-=1; bindTexture(rv,gl); }
    rv.image.src = filename;

    return rv;
}

function bindTexture(texture,gl)
{
    gl.bindTexture(gl.TEXTURE_2D, texture);
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.image);

    gl.bindTexture(gl.TEXTURE_2D, null);
}
///////////////////////////////////////////


this will load non power of 2. but i am pretty sure it will break compatibility on our mobile hardware... so much better too just stick too ^2 textures

[ninogenio]

here is a version with very basic mouse movement... this might not work how we want on a touch screen though the rotation swipes will be fine. however when touching the screen too make the swipe this will register a mousedown and move the player forward also. my knowledge of js event stuff is too limited atm too make the mouse handling work properly. we ideally need this to register the the mouse down but maybe wait a second or two too see if the user is still activating mouse down then we know for sure they actually want too move forward.

@ck i know whats causing the issue with the map builder in firefox for some reason its adding the double the width of the texture preview area onto the mouseX if i manually subtract 128 from the mouseX every thing lines up properly. i tried too fix this dynamically but with no luck but no big deal we can just subtract the width of the preview area manually.

i have tweeked our fps stuff in this webgl version with the mouse control added.

i have set the update intervals at 45fps but left stripwidth addition at <30 fps i have also set stripwidth thresh hold at 6 i think this is a nice balance for everyone.

oh and i think i fixed the low starting fps issue. i had a little think about it and rather than start at 0 fps and let it slowly warm up too our real fps. just start at our thresh hold 30fps and let it either settle down or increase from there.

just too be safe however i moved the player y pos forward too your suggested placement of 200

[combatking0]

I'll upload the power of 2 sprites and investigate the firefox issue with the map builder tonight.

Great to hear about the framereates on the mobile devices - stick some advertising space on the walls of the game and you've got a monetised adventure that everyone can enjoy with no intrusive pop-ups.

edit - the sprites have been updated along with the map builder, which now supports wall texture re-ordering.

The mouse control version of the raycaster itself is here:
http://fx.barcodebattler.co.uk/waveSphere/webglraycaster2.htm

The only problem I have with the mouse control is that the slightest movement of the mouse, even when it's not over the canvas, causes the camera to rotate. Still, it's proof that it works and between the 3 of us we can figure out how to make it better.

The new starting position has greatly improved the framerate at the beginning of the game. I can't offer an explanation as to why the old one was causing an issue, but sometimes things happen in programming that nobody can adequately explain

I'm wondering if a semi-transparent D-Pad displayed over the lower-left corner would be better than mouse control.
Pressing one of the virtual buttons would then cause the camera to move forwards, backwards or rotate accordingly.

[ninogenio]

ah the mouse move stuff isn't working properly on that webgl version on my phone all I get is rotations but even then Its not smooth I have too keep letting go and pressing again.

excellent idea with the dpad ck! yep that would work. ill see what I can do..

actually thinking.about it. is there a special handler for mouse held down as even with a d pad the way it is atm we would have too keep tapping the dpad too keep the player moving/rotating. when holding down nothing happens.

I have built quite a few levels for my game from the editor tonight. its a dream too work with! it takes roughly five mins too build a level from ground up. brilliant stuff!

[combatking0]

We can detect if the mouse is down and when it is released. To follow the psuedo-code:

Code Select Expand

var mouseHeld = false;

onMousedown = function(){
mouseHeld = true;
}

onMouseup = function(){
mouseHeld = false;
}

if(mouseHeld){
//code that does stuff, detects coordinates, etc
}

Just a rough starting point.

I'll add scrolling to the map builder over the next few days.

[ninogenio]

ahh yes i see,

i have coded a transparent dpad. i will add something similar too what you posted cheers ck.

one thing i just noticed with the map builder is that you have added a while loop in setup for firefox when getting the context, and lots of different checks too make sure the canvas position is always correct.

should i add that into our engine too make sure mouse move works correctly for firefox too? cheers.

[Jim]

So far as I know, mousemove events don't work on mobile. On my tablet the latest version runs forward when I tap and then only after random tapping might it turn a bit.
Hopefully this weekend I'll be able to grab the code and make the controls work on tablets.
Jim

[combatking0]

one thing i just noticed with the map builder is that you have added a while loop in setup for firefox so when getting the context, the pogram will not move on unless fully loaded. thus making sure the program always gets the correct canvas position.

should i add that into our engine too make sure mouse move works correctly for firefox too? cheers.

That's a good idea. There's a few lines in the engine setup function which is supposed to do the same thing but fails. I googled the working version and adapted it to our needs.

[ninogenio]

well here is a dpad version.

i had too add an on resize event as firefox on resize was messing up the canvas position. it actually works quite well. and i added your code for finding canvas position cheers ck.

So far as I know, mousemove events don't work on mobile.

i think you are right jim it was all kinds of messed up on my phone and tablet too. i coded the dpad version just in the hope it might work.

Hopefully this weekend I'll be able to grab the code and make the controls work on tablets.

that would be awesome!. i would love too get this working on as many platforms as possible. cheers mate

[ninogenio]

i have been looking at getting my own server space too be able too host my stuff and try test's etc out. but its all a little confusing and was wondering if you guys could point me in the right directions. so i don't end up renting a dud.

so far easy-space looks quite interesting... for 7.99 a month they give you unlimited hosting space and free domain name and they let you choose from linux or windows servers.

whats the main differences from windows and linux hosting and what steps are involved in actually uploading my stuff once i get my own space. so it can go live.

i am a complete noob when it comes too all this stuff so just treat me as one for any explanations  . cheers guys.

[combatking0]

I recommend Xilo - these boards are hosted with them, and so are my websites.

There's very little downtime and the customer service is excellent with prices starting from as little as £24.99 per year (about £2.09 per month) for 1GB of space and 2 SQL databases and PHP 5 functionality.

Which reminds me, I've got to pay my hosting bill.

http://www.xilo.net/shared_web_hosting/

I've tried EZ Space before, but their customer service was shockingly poor.

The map builder "scrolling" should be finished tonight.

edit - Sorry, this will run into tomorrow, but it's nearly there.

[ninogenio]

excellent thanks mate.

xilo it is then!

scrolling maps will be cool. I have got an idea for these in my next game after this one is finished.

I want too make a retro raycasted zelda type game with a *huge* map that buffers and scrolls I plan on having lots of sub maps as temples with portal points on the main map too these.

as for my pacman clone I now am almost finished so I have began porting the whole engine and game too the android sdk. what an experience that has been! but I am now in a position too develop stuff that can be taken anywhere

[Gore Motel]

For testing stuff online and hosting small websites on Linux, I recommend NearlyFreeSpeech, as it offers a pay for what you use service. You can read about how it all works and how much it costs here. They also offer domain registration, but I'd go with a dedicated service such as Namecheap for that.

When it comes to choosing between Windows and Linux hosting, it usually boils down to the following: do you need to use Microsoft's technologies, like ASP, .NET, MS SQL? If the answer is yes, then you have to go for Windows hosting. If you don't need them, go for Linux, it's going to be cheaper.

Uploading files to the server is easy, once you purchase a hosting package you'll receive info on how to connect through FTP to their servers. They'll probably also going to give you access to a control panel, and those usually have some sort of HTML upload interface if you don't want to use FTP.

[combatking0]

Nice host - they're good for small sites with low storage requirements, but larger multi-project sites such as mine would rack up huge charges on such a pay-as-you-go system, estimated at $250 dollars without taking bandwidth into account.

With Xilo I can host up to 2GB without defined bandwidth restrictions for less than £45 per year including my domain name registration.

When it comes to choosing the right host, I'd have to say you would have to go with NearlyFreeSpeech if your site is small and has minimal PHP / SQL requirements. For larger projects you might want Xilo.

The map builder scrolling is ready - I'll link it to the arrow keys for a more intuitive interface in the next update.

[ninogenio]

excellent info guys cheers!

i have properly looked into everything and i think i might go with Xilo even though i might never need everything it offers its nice too know i can expand without worrying too much.

the map builder is coming along wonderfully ck! what plans do you have for it next maybe sprites??..

[combatking0]

Sprites are next on the list, but may take a whole week to get right.