(http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-01.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example01.html) | (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-02.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example02.html) | (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-03.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example03.html) | (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-04.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example04.html) |
(http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-05.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example05.html) | (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-06.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example06.html) | (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/scr-ex-07.jpg) (http://www.dbfinteractive.com/adminteam/benny/TinyC5/examples/Example07.html) |
#INCLUDE "TINYPTC_EXT.BI"
OPTION STATIC
OPTION EXPLICIT
CONST XRES = 800
CONST YRES = 600
DIM BUFFER((XRES*YRES)+2000) AS INTEGER
PTC_ALLOWCLOSE(0)
PTC_SETDIALOG(1,"WWW.RETRO-REMAKES.NET"+CHR$(13)+"FULL SCREEN?",0,1)
IF (PTC_OPEN("REMADE BY SHOCKWAVE/CODIGOS",XRES,YRES)=0) THEN
END-1
END IF
SLEEP 5
DIM AS INTEGER Z,LP
FOR LP=0 TO ((XRES*YRES)+2000)
Z=INT(RND(1)*255)
BUFFER(LP)=RGB(Z,Z,Z)
NEXT
'-------------------------------------------------------------------------------
WHILE(GETASYNCKEYSTATE(VK_ESCAPE)<> -32767 and PTC_GETLEFTBUTTON=FALSE and PTC_GETRIGHTBUTTON=FALSE)
Z = INT(RND(1)*2000)
PTC_UPDATE@BUFFER(Z)
'Normally we'd want to clear the buffer here, but not in this case!
'ERASE BUFFER
WEND
var _loop = function() {
_stats();
if ( _isRunning ) {
self.update( _buffer );
_render();
// @todo Replace this with requestAnimFrame
setTimeout( _loop, 1000 / 60 );
}
};
The new examples run beautifully in Google Chrome!
I love it that you can click the window to expand the effect too :)
Nice work mate.
What Shockie said. I know what keftales are now too :)
Runs a lot faster in Chrome than FF, but I expect that's usual. Is it locked at 60fps? Seems faster than that in Chrome for me.
I think that this bit of code sets the refresh rate;Code: [Select]var _loop = function() {
_stats();
if ( _isRunning ) {
self.update( _buffer );
_render();
// @todo Replace this with requestAnimFrame
setTimeout( _loop, 1000 / 60 );
}
};
Wow, some excellent work there Benny!, cool examples and great presentation overall!
This really makes me want to dive into webdev again!
| Version 0.3 | Version 0.4 | |
| Chrome 15 | 45 fps | 60 fps |
| Internet Explorer 9 | 21 fps | 60 fps |
| Firefox 7 | 27 fps | 45 fps |
| Opera 11 (***) | 4 fps | 6 fps |
The screen updating looks even better now, the last effect of the rotating tunnel looks the best!
Really nice mate.
Here's something I knocked up that you can add to the samples if you like:
It's great in Chrome and OK in FF, Safari and Opera but poor in IE9.
Is there any way to accelerate clearing the pixel buffer to all black?
...
Thanks for putting it online.
<edit>2fps in Opera!
Jim
Maybe reallocating a new canvas is faster than clearing an old one?
...
Here's something I knocked up that you can add to the samples if you like:
...
It's really great that you linked this great project into DBF!
Thanks Benny, that's much appreciated :)
... but I will code something with it once the compo is out of the way. Hopefully get a couple of things for you to include as examples...
...
It will work great in the scanline code 'cos all the x values are positive.
It's not a direct replacement always:
>> ~~-5.9
-5
>> Math.floor(-5.9)
-6
The rasteriser part maybe doesn't care about that though, as long as the rounding's consistent :)
...
Works great here mate...
...even in overblown, clunky bloated firefox :)
...
All seem to work fine. I get a weird shaded grey triangle floating around with Jim's duck, but I get that on PC too, so probably supposed to be there?
I can test also on Ipad and Ipad2 later today if that information is helpful for you Benny?
Thanks Jim. Yeah, it is pretty weird looking in Opera. I'll see if I can figure it out and maybe speed it up at the same time.
Thanks Jim. Yeah, it is pretty weird looking in Opera. I'll see if I can figure it out and maybe speed it up at the same time.
I already fixed the opera bug. Seems like Opera does not clamp the color/alpha values by itself. I will add a new function to clamp color/alpha values (0-255) and will include the example with the next version.
Could you just give me some details on what I should write in the footer ?
Besides, I removed the backbuffer in order to save one copyPixel step (which is quite expensive in the current version). This should speed it up although your original version runs really fast already.
Again, thanks a lot and of course have some good K++, mate!
tinyC5.line=function(x0,y0,x1,y1,rd,gn,bu,a){
var xd,xda,xt,yd,yda,yt,g,tmp,pxl,w,h;
w=this.WIDTH;
h=this.HEIGHT;
xd=x1-x0;
yd=y1-y0;
xda=Math.abs(xd);
yda=Math.abs(yd);
if(xda>yda){
if(x0>x1){
tmp=x0;
x0=x1;
x1=tmp;
tmp=y0;
y0=y1;
y1=tmp;
}
g=yd/xd;
for(i=0;i<=xda;i++){
xt=x0+i;
yt=y0+Math.round(i*g);
pxl=(w*yt+xt)*4;
this.pixels[pxl]=rd;
this.pixels[pxl+1]=gn;
this.pixels[pxl+2]=bu;
this.pixels[pxl+3]=a;
}
}else{
if(y0>y1){
tmp=x0;
x0=x1;
x1=tmp;
tmp=y0;
y0=y1;
y1=tmp;
}
g=xd/yd;
for(i=0;i<=yda;i++){
yt=y0+i;
xt=x0+Math.round(i*g);
pxl=(w*yt+xt)*4;
this.pixels[pxl]=rd;
this.pixels[pxl+1]=gn;
this.pixels[pxl+2]=bu;
this.pixels[pxl+3]=a;
}
}
}
this.line(xx0,yy0,yy1,xx1,red,green,blue,alpha);
tinyC5.update = function() {
// Perform standard canvas operation
var ctx = tinyC5.getOrigCanvasContext();
// ctx.draw,moveTo,line...
// Loop over the pixels
// Peform post rendering on canvas
ctx = tinyC5.getOrigCanvasContext();
// ctx.draw,moveTo,line...
}
Yep canvas allows lot of effect wich can be used in the tinyC5.update() method! Really cool to add this one :D
I repeat : I love you work ;D
I just wanted to give access to the pixels array itself without adding functionalit of drawing lines, dots, squares etc. Hmmm ... I need to think about it.
Attached is a snapshot of an incomplete test of the line function used for a 3D wireframe with a motion blur effect:
Attached is a snapshot of an incomplete test of the line function used for a 3D wireframe with a motion blur effect:
hum... I think we have both the same ideas... got also this running here... :-\
...
And use of the alpha channel at 128 for the "motion blur effect"...
I just wanted to give access to the pixels array itself without adding functionalit of drawing lines, dots, squares etc. Hmmm ... I need to think about it.
That's understandable - my intention was to add the ability to draw lines which can be modified by other TinyC5 effects. Unless the pixels array can be used to modify the canvas behind it. I don't know if that's possible.
It's your project, and I'll respect your descision, which ever way it goes.
...