up vote 0 down vote favorite

I'm trying to update the interval value x but not succeeding. I hope to eventually have different pawn objects with internal values I can update when keypress up/down/left/right to redraw the canvas.

Code Update: Able to update x, y values now, but not sure about creating seperate objects using modular JavaScript pattern.

JavaScript using jQuery 1.5.1:

//Constructors
    var pawn = (function() {        

        var x = 25;
        var y = 25;     
        var getX = function() {
            return x;
        };
        var getY = function() {
            return y;
        };

        function _drawPawn(x,y) {
            var x = x || 25;
            var y = y || 25;
            var canvas = document.getElementById("canvas");
            if (canvas.getContext) {
                var b = $('body');
                var winH = b.height();
                var winW = b.width();
                $(canvas).attr('height',winH).attr('width',winW);
                var ctx = canvas.getContext("2d");  
                ctx.beginPath();
                ctx.lineWidth="3";
                ctx.arc(x, y, 10, 0, Math.PI * 2, true); // circle              
                ctx.stroke();
            }
        }

        function left() {
            x = 100;
            y = 100;
        }

        return {
            getX:getX,
            getY:getY,
            draw: function drawPawn(x,y) {
                _drawPawn(x,y);
            },
            left:left
        }
    })();   

    //Init
    $(function() {      
        var b = pawn;
        b.left();
        alert(b.getX());

            var a = pawn;
    alert(a.getX());

        //b.draw();
    });

and the html:

<canvas id="canvas" height="800px" width="600px">
    Download a modern browser like Internet Explorer 9, Firefox, Safari or Chome to view this.
</canvas>
share|improve this question
97% accept rate
Pls read comments below Alnitak's answer before answering. – bcm Mar 21 '11 at 13:33
Answer posted by Alnitak here: jsfiddle.net/raybellis/WwV3G – bcm Mar 21 '11 at 14:29
feedback

2 Answers

up vote 3 down vote accepted

As it is currently written, your getX() function will be automatically invoked with the supplied (empty) parameter list, and return x, which is then equivalent to:

var getX = x;

which will give getX the value of x at the time it was declared.

To fix, removed the parentheses:

var getX = function() {
        return x;
};

You also need to fix this function in your returned object:

draw: function drawPawn(x, y) {
    _drawPawn(x, y);
}

Since the apparent intent is to call draw without parameters and use the currently bound x and y values, it should be:

draw: function drawPawn() {
    _drawPawn(x, y);
}
share|improve this answer
tested, doesn't work. and the way I declared var b = pawn is correct using this pattern? – bcm Mar 21 '11 at 13:07
please define "doesn't work". – Alnitak Mar 21 '11 at 13:08
return the function as a string it seems – bcm Mar 21 '11 at 13:09
yes, because you haven't called the function in b.getX, you've only obtained a reference to it. See jsfiddle.net/hqxy2 – Alnitak Mar 21 '11 at 13:11
BTW, your module pattern probably isn't right - you can only create one 'pawn' - indeed it's the one called pawn, and b is just another reference to the same object. I'm not sufficiently expert on JS to fix that, though. – Alnitak Mar 21 '11 at 13:21
show 13 more comments
feedback
up vote -1 down vote

First like alnitak said remove paranthese from getX, getY. If u want different pawn objects you should use var b = new pawn()

share|improve this answer
I don't think you can new a module, but you can new constructors. If unsure what I mean by module pattern, read this: addyosmani.com/resources/essentialjsdesignpatterns/book – bcm Mar 21 '11 at 13:33
i don't understandt what u mean, i thought u wanted different pawn objects; if u want just one u can use just the b = pawn assignment. And for draw u can use: draw: _drawPawn(x,y) – Ionut Popa Mar 21 '11 at 13:37
maybe u should just give it a try. – bcm Mar 21 '11 at 13:40
what do you mean? i don't understant bc u don't explain what you want to do clearly enough.What are "separate objects?" – Ionut Popa Mar 21 '11 at 15:32
feedback

Your Answer

 
or
required, but never shown
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.