NARasterizer 0.1

Rasterization Example in JS

by namar0x0309

HTML

<!DOCTYPE html>
<head>
    <title>NA::Rasterizer</title>
    <script type="text/javascript">
        function onLoad() {
            CanvasCreate(300, 300, 'canvas', 'renderContext');
            contextCanvas = new ContextCanvas('canvas');

            // Rotation code
            radian = 0;
            camDist = 10;

            // Primitive creation
            mesh = MeshLibrary.Cube();

            //grid = MeshGrid(10); 
            contextCanvas.state.point.size = 5;

            //setInterval('loop()', 16.6);
            setTimeout('loop()', 1);
        }

        /*--Program Functions----------------------------------------------------------*/
        function onMouseMove(e) {
            if (IE) {
                contextCanvas.mouse2d[0] = event.clientX + document.body.scrollLeft;
                contextCanvas.mouse2d[1] = event.clientY + document.body.scrollTop;
            } else {
                contextCanvas.mouse2d[0] = e.pageX;
                contextCanvas.mouse2d[1] = e.pageY;
            }

            // negative values in ns4
            if (contextCanvas.mouse2d[0] < 0) contextCanvas.mouse2d[0] = 0;
            if (contextCanvas.mouse2d[1] < 0) contextCanvas.mouse2d[1] = 0;

            return true;
        }

        function loop() {
            //contextCanvas.Clear();
            contextCanvas.DrawingSurfaceAlloc();


            contextCanvas.Print2D("Nassim Amar 2012", [0, 10]);
            contextCanvas.Print2D("NA::Rasterizer", [0, 20]);
            contextCanvas.Print2D("FPS: " + contextCanvas.getFPS().toFixed(1), [0, 30]);

            // Animation control
            radian += .025;

            if (radian > Math.PI * 2) radian = 0;

            var locMesh = [0, 0, 0]; //[ Math.sin( radian ) * 10, 0, 30 ];

            // Camera tranformation
            var theta = 2 * -Math.PI * contextCanvas.mouse2d[0] / GLOBAL.WIDTH;
            var phi = Math.PI * contextCanvas.mouse2d[1] / GLOBAL.HEIGHT;

           ...

JavaScript

/*!
	Copyright Nassim Amar 2012
	Free For Personal Use
	Contact Author for Commercial Usage
	Thanks!
*/
function SwapNumbers(a,b){a=b-a;b=b-a;a=b+a}Object.prototype.clone=function(){var newObj=this instanceof Array?[]:{};for(i in this){if(i=="clone")continue;if(this[i]&&typeof this[i]=="object")newObj[i]=this[i].clone();else newObj[i]=this[i]}return newObj};
function SourceCodeInclude(src){if(document.createElement&&document.getElementsByTagName){var head_tag=document.getElementsByTagName("head")[0];var script_tag=document.createElement("script");script_tag.setAttribute("type","text/javascript");script_tag.setAttribute("src",src);head_tag.appendChild(script_tag)}};function Color4(){return[0,0,0,1]}function Vec4(){return[0,0,0,0]}function Vec3(){return[0,0,0]}function Vec2(){return[0,0,0]}function Line3(){return[0,0,0]}
function Queue(){var _cnt=0;var _data=[];this.Enqueue=function(element){_data[_cnt]=element;_cnt++};this.Dequeue=function(){if(_cnt==0)return;_cnt--;var ret=_data[0];_data.splice(0,1);return ret};this.toString=function(){var str="";for(var i=0;i<_cnt;i++){str+=_data[i].toString();if(i<_cnt-1)str+=","}return str};this.isEmpty=function(){return _cnt==0}};Math.EPSILON=1.0E-6;
function SpaceMat4x4(){var mStack=[];var m=Mat4x4.Identity();var mInv=Mat4x4.Identity();this.push=function(mat4x4){mStack.push(m)};this.pop=function(){m=mStack.pop()};this.Translate=function(v3){m[0][3]+=v3[0];m[1][3]+=v3[1];m[2][3]+=v3[2]};this.Rotate=function(v3){m=Mat4x4.Multiply(m,Mat4x4.Rotate(v3))};this.Scale=function(v3){m=Mat4x4.Multiply(m,Mat4x4.Scale(v3))};this.IdentitySet=function(){m=Mat4x4.Identity()};this.DebugPrint=function(){console.log("Stack:");console.log(m.toString())};this.MatrixGet=
function(){return m.clone()};this.MatrixInversetGet=function(){mInv=Mat4x4.Inverse(m);return mInv.clone()};this.MatrixSet=function(mIn){m=mIn.clone()};this.MultiplyByMatrix=function(mIn){m=Mat4x4.Multiply(m,mIn)}}
function Transform3D(){var _isTransformBinded=false;var...