pastebin - collaborative debugging

function FirstAssistant(levelchoice) {
    /* this is the creator function for your scene assistant object. It will be passed all the
           additional parameters (after the scene name) that were passed to pushScene. The reference
           to the scene controller (this.controller) has not be established yet, so any initialization
           that needs the scene controller should be done in the setup function below. */
    this.levelchoice = levelchoice
}

FirstAssistant.prototype.setup = function (choice) {
    /* this function is for setup tasks that have to happen when the scene is first created */
    try{


        this.skinCookie = new Mojo.Model.Cookie("skinCookie");
    document.getElementById('bg').style.backgroundImage = 'url("images/' + this.skinCookie.get() + '/bg.png")'

    this.bricks = new Array(40); //set up for 5 rows of 8 bricks, don't all have to be used becuase arrays are dynamic
    this.bricksleft = 0;
    this.fieldwidth = 320; // if in the future landscape mode is enable, change.
    this.fieldheight  = 460; //how tall should the field be, probably will be changed
    //this.columns = 8; //fully adjustable, just change this value for columns and the rest will follow
    this.rows = 5;
    this.brickwidth = this.fieldwidth / this.columns; // bricks per row
    this.brickheight = 25; // experimental value, can be adjusted a later
    this.speedCookie = new Mojo.Model.Cookie("speedCookie");
    this.speed = this.speedCookie.get();
    this.speed = this.speed *3
    this.ballfunc = this.ball.bind(this);
    //this.drawballfunc = this.drawball.bind(this);

    this.radius = 8; //this will be used to account for javascript positioning the ball image according to the top left corner rather than center
    $('ball').style.width = this.radius*2 + "px";
    $('ball').style.height = this.radius*2 + "px";
    this.z = 0 //the "Z" variable is to hold the count of the ball interval


    this.paddlewidth = 80;
    this.paddleheight = 15;
    this.paddlex = 110;
    this.paddley       = 380; // where does the paddle live in the fieldheight?
    $('paddle').style.width = this.paddlewidth + "px";
    $('paddle').style.height = this.paddleheight + "px";
    $('paddle').style.left = this.paddlex + "px";
    $('paddle').style.top = (this.paddley) + "px";

    $('flickUp').style.left = 10 + "px";
    $('flickUp').style.top = (this.paddley - 40) + "px";
    this.score = 0;
    //$('lives').style.left = 10 + "px";
    //$('lives').style.top = (this.fieldheight / 2-25) + "px";
    $('lives').innerHTML = 'Lives: ' + (this.lives);
    //$('score').style.left = 145 + "px";
    //$('score').style.top = (this.fieldheight / 2-25) + "px";
    $('score').innerHTML = 'Score: ' + (this.score);

    if (this.skinCookie.get()=="fade" || this.skinCookie.get()=="beatles"){
        $('lives').style.color = "black"
        $('score').style.color = 'black'
        $('level').style.color = "black"
    }
    //$('level').style.left = 80 + "px";
    //$('level').style.top = (this.fieldheight / 2+10) + "px";
    this.dragStartHandler = this.dragStart.bindAsEventListener(this);
    this.draggingHandler = this.dragging.bindAsEventListener(this);
    this.dragEndHandler = this.dragEnd.bindAsEventListener(this);
    this.flickHandler = this.handleFlick.bindAsEventListener(this);
    if (this.levelchoice!== undefined){
        this.start(this.levelchoice)
    }
    else {
        this.level2Cookie = new Mojo.Model.Cookie("level2Cookie");
        this.start(this.level2Cookie.get())
    }

    /* use Mojo.View.render to render view templates and add them to the scene, if needed. */
    //window.setTimeout(this.start.bind(this), 1500); // in the future this will be tied to a button pree or some other even so the game doesnt start on load
    /* setup widgets here */
    /* add event handlers to listen to events from widgets */
    this.trackingArea = this.controller.get('tracking-area'); // if this is commented out the user cant hit anywhere on screen to begin moving the paddle
    this.trackingArea2 = this.controller.get('paddle');
    this.trackingArea3 = this.controller.get('info')

    Element.observe(this.trackingArea, Mojo.Event.flick, this.flickHandler)
   }catch(e){$('error').innerHTML = e}
};

FirstAssistant.prototype.handleFlick = function (event) {
   //$('error').innerHTML = 'x:' + event.velocity.x + 'y:' + event.velocity.y
   if(event.velocity.y<0){
    var r = this.speed/Math.sqrt(event.velocity.x*event.velocity.x +event.velocity.y*event.velocity.y)
    this.speedx=event.velocity.x*r

    this.speedy = -Math.round(Math.sqrt(this.speed*this.speed - (this.speedx * this.speedx)))
    //$('error').innerHTML = Math.sqrt(this.speedx*this.speedx + this.speedy*this.speedy)
    //this.drawtimer = window.setInterval(this.drawballfunc, 35);
    this.balltimer = window.setInterval(this.ballfunc, 50);
    $('flickUp').style.visibility = "hidden";
   this.redeploy()
   Element.observe(this.trackingArea, Mojo.Event.dragStart, this.dragStartHandler);
   Element.observe(this.trackingArea2, Mojo.Event.dragStart, this.dragStartHandler);
   Element.observe(this.trackingArea3, Mojo.Event.dragStart, this.dragStartHandler);
   Element.stopObserving(this.trackingArea, Mojo.Event.flick, this.flickHandler)
    }

}
FirstAssistant.prototype.getLevel = function (level) {
        try {
        //var level = 0;
        this.levelLoad = new Levels()

        this.meta       = this.levelLoad.levelMeta[level]

            $('level').innerHTML = level;

        this.bricksleft = this.meta[2];

        this.level      = level;

        this.columns    = this.meta[0];
        this.rows       = this.meta[1];
        this.brickwidth = this.fieldwidth / this.columns;

        this.grid       = this.levelLoad.levelGrid[level];
        }catch (e){$('error').innerHTML=e;}
            for (n = 0; n <= (this.columns*this.rows); n++) {
                this.bricks[n] = this.grid[n];

            }
        $('level').innerHTML = 'Level: ' + (this.level+1);
        this.skinCookie = new Mojo.Model.Cookie("skinCookie");


};

FirstAssistant.prototype.drawLevel = function () {
    var rh = "";
    for (n = 0; n <= (this.rows - 1); n++) {
        for (i = 0; i <= (this.columns - 1); i++) {
            if (this.bricks[n * this.columns + i] !== 0) { //checks to see if brick should be drawn
                rh = rh + '<img ' + 'id=' + '"r' + n + 'c' + i + '"' +'src="images/'+this.skinCookie.get()+'/'+this.bricks[n*this.columns+i]+'.png"' + 'style="' + 'position:absolute;' + 'z-index:7;' + ' width:' + this.brickwidth + 'px;' + 'height:' + this.brickheight + 'px;' + ' top:' + (this.brickheight * n) + 'px;' + ' left:' + (this.brickwidth * i) + 'px;' + '"' + '/>';
            }

        }
    }
    $('bricks').innerHTML = rh;
};

FirstAssistant.prototype.start = function (level) {


    //$('error').innerHTML = "levelCookie set to:" + (this.levelCookie.get()+1);
    this.getLevel(level);
    this.drawLevel();

    this.ballx = 20;
    this.bally = this.paddley
    $('ball').style.left = this.ballx + "px";
    $('ball').style.top = this.bally + "px";

    this.lives = 3;


    $('lives').innerHTML = 'Lives: ' + (this.lives);
    $('score').innerHTML = 'Score: ' + (this.score);
};


FirstAssistant.prototype.ball = function () {
    this.ballx = this.ballx + this.speedx;
    this.bally = this.bally + this.speedy;
    //if (this.bally>(this.rows+1)* this.brickheight){
        this.checkcollision();
    //}
    if (this.bally <= 0) {
        if (this.bally<0){
            this.bally=-this.bally
        }
        this.speedy = -this.speedy;
    }
    if ((this.bally >= (this.paddley - this.radius * 2))
        && (this.bally <= (this.paddley + this.brickwidth))
        && (this.ballx >= (this.paddlex - this.radius * 2)
        && this.ballx <= (this.paddlex + this.paddlewidth)) ) { //bounce if touching paddle.
            this.bally = this.paddley-this.radius*2
            this.speedx = 1.5*this.speed * ((this.ballx+ this.radius) - (this.paddlex + this.paddlewidth / 2 )) / (this.radius * 2 + this.paddlewidth); //
            this.speedy = -Math.sqrt(this.speed * this.speed - this.speedx * this.speedx);
    }
    if (this.bally >= (this.paddley + (this.radius * 14))) {  // lose ball if 8 ball heights below paddle. used basically as a timeout
            //this.speedx = 0;
            //this.speedy = 0;
            //this.bally = this.bally - 3;
            try{
                $('ball').style.left = this.ballx + "px";
                $('ball').style.top = this.bally + "px";
                this.ballx = 20;
                this.bally = this.paddley
                $('flickUp').style.visibility = 'visible';
                $('ball').style.left = this.ballx + "px";
                $('ball').style.top = this.bally + "px";
                this.lives--
                $('lives').innerHTML = 'Lives: ' + (this.lives);
                window.clearInterval(this.balltimer)
                window.clearInterval(this.drawtimer)
                Element.stopObserving(this.trackingArea, Mojo.Event.dragStart, this.dragStartHandler);
                Element.stopObserving(this.trackingArea2, Mojo.Event.dragStart, this.dragStartHandler);
                Element.stopObserving(this.trackingArea3, Mojo.Event.dragStart, this.dragStartHandler);

                Element.observe(this.trackingArea, Mojo.Event.flick, this.flickHandler)
                if (this.lives <= 0) {
                this.gameover();
                //break;
                } else {
                //lost ball, play bzzzzt sound, and redeploy.
                    this.controller.serviceRequest('palm://com.palm.audio/systemsounds', {
                            method:"playFeedback",
                            parameters:{name: 'error_03'},
                            onSuccess:{},
                            onFailure:{}
                    });
                }
            }catch(e){$('error').innerHTML = e}
    }
    if (this.ballx <= 0 || this.ballx >= (this.fieldwidth - (this.radius * 2))) {
        this.speedx = -this.speedx;
        if (this.ballx < 0) {
            this.ballx = -this.ballx;
        }
        else if (this.ballx > (this.fieldwidth - (this.radius * 2))) {
            this.ballx = (this.fieldwidth - (this.radius * 2)) - (this.ballx - (this.fieldwidth - (this.radius * 2)));
        }
    }
    //this.z++
    //if (this.z == 2){
        //this.z = 0;
    $('ball').style.top = this.bally + "px";
    $('ball').style.left = this.ballx + "px";
    $('paddle').style.left = this.paddlex + "px";
    /*this.x++
    this.currentTime= new Date()
    $('error').innerHTML =(this.x/(this.currentTime-this.startTime)*1000);*/
};
FirstAssistant.prototype.redeploy = function () {
   //this.x=0
   //this.startTime = new Date ()


    //JRB as written if you don't move the paddle, the game is always exactly the same.
    // that's at a minimum boring. so, replace the 1 in speedx with a random number from 0 to 5
   // this.speedx = -Math.floor(Math.random() * this.speed); //this.speedx = 1; //how many pixels the ball will move in the x direction each time it's position is calculate
    //JRB which of course requires a more complex definition for y...
   // this.speedy = -Math.round(Math.sqrt(this.speed*this.speed - (this.speedx * this.speedx))); //
};

FirstAssistant.prototype.checkcollision = function () {
    var c = Math.floor((this.ballx + this.radius) / this.brickwidth); //what column the ball is in
    var r = Math.floor((this.bally + this.radius) / this.brickheight); //what row the ball is in
    for (n = 0; n <= (this.rows - 1); n++) {
        var b = n * this.columns + c; //which brick is being tested
        if (this.bally <= ((n + 1) * this.brickheight) && this.bally >= (n * this.brickheight) && this.bricks[b] !== 0 || this.bally+this.radius*2<=((n+1)*this.brickheight) && this.bally+this.radius*2 >= (n*this.brickheight) && this.bricks[b]!==0){
        this.collisionOccured('y',b,c);
        }

        else if (this.ballx<=this.brickwidth*(c-1) && this.ballx>=this.brickwidth*(c) && this.bricks[b-1]!==0 && r==(b-c)/this.columns){
            this.collisionOccured('x',b-1,c-1);
        }
        else if ((this.ballx+this.radius*2)<=this.brickwidth*(c+2) && (this.ballx+this.radius*2)>=this.brickwidth*(c+1) && this.bricks[b+1]!==0 && r==(b-c)/this.columns){
            this.collisionOccured('x',b+1,c+1);
        }
    }
};
FirstAssistant.prototype.collisionOccured = function (axis,brick, column){
    this.r = (brick-column)/this.columns // what row
    if (axis=='y'){
        if (this.speedy>0){
            this.bally =  this.brickheight*(this.r)-this.radius*2
        }
        else {
            this.bally =  this.brickheight*(this.r +1)
        }
        this.speedy=-this.speedy;
    }
    else {
        if (this.speedx>0){
                    this.ballx = this.brickwidth * column -this.radius*2

        }
        else {
                    this.ballx = this.brickwidth * (column+1)

        }
        this.speedx=-this.speedx;

    }

    this.bricks[brick]= this.bricks[brick]-1; //takes away one hit

    if (this.bricks[brick]>0){

        $('r'+this.r+'c'+column).src='"images/'+this.skinCookie.get()+'/' + this.bricks[brick] + '.png"';
    }
    if (this.bricks[brick] === 0) {
        $('r' + n + 'c' + column).style.visibility = 'hidden';
        this.bricksleft--;
        this.score = this.score + 10;
        $('score').innerHTML = 'Score: ' + (this.score);
            if (this.bricksleft === 0) {
                if (this.levelLoad.levelMeta[this.level2Cookie.get()+1]===undefined){
                   this.beatGame()
                }
                this.winner();
            }
    }
};

FirstAssistant.prototype.dragStart = function (event) {
    this.paddlex = Event.pointerX(event.down) - (this.paddlewidth / 2);
    $('paddle').style.left = this.paddlex + "px";
    Element.observe(this.trackingArea, Mojo.Event.dragging, this.draggingHandler);
    Element.observe(this.trackingArea, Mojo.Event.dragEnd, this.dragEndHandler);
    Element.observe(this.trackingArea2, Mojo.Event.dragging, this.draggingHandler);
    Element.observe(this.trackingArea2, Mojo.Event.dragEnd, this.dragEndHandler);
    Element.observe(this.trackingArea3, Mojo.Event.dragging, this.draggingHandler);
    Element.observe(this.trackingArea3, Mojo.Event.dragEnd, this.dragEndHandler);
    Event.stop(event);
};
FirstAssistant.prototype.dragging = function (event) {
    this.paddlex = Event.pointerX(event.move) - (this.paddlewidth / 2);
    if (parseInt(this.paddlex) < 0) {
        this.paddlex = 0
    };
    if (parseInt(this.paddlex) > (this.fieldwidth - this.paddlewidth)) {
        this.paddlex = this.fieldwidth - this.paddlewidth;

    }

    Event.stop(event);
};
FirstAssistant.prototype.dragEnd = function (event) {
    Element.stopObserving(this.trackingArea, Mojo.Event.dragging, this.draggingHandler);
    Element.stopObserving(this.trackingArea2, Mojo.Event.dragEnd, this.dragEndHandler);
    Element.stopObserving(this.trackingArea3, Mojo.Event.dragEnd, this.dragEndHandler);

    Event.stop(event);
};


FirstAssistant.prototype.activate = function (event) {
    /* put in event handlers here that should only be in effect when this scene is active. For
           example, key handlers that are observing the document */
;
};
FirstAssistant.prototype.deactivate = function (event) {
    /* remove any event handlers you added in activate and do any other cleanup that should happen before
           this scene is popped or another scene is pushed on top */
    window.clearInterval(this.balltimer);
};
FirstAssistant.prototype.cleanup = function (event) {
    /* this function should do any cleanup needed before the scene is destroyed as
           a result of being popped off the scene stack */
};

//JRB this is a very very very ugly tool, but it's the only one I know of that
// will do this.
function pausecomp(millis)
{
    var date = new Date();
    var curDate = null;
    do { curDate = new Date(); }
    while(curDate-date < millis);
}