Actor SetAsButton Touch not working on CocoonJS 1.3 ?

[takhimi]

Hi Ive tested some of your sample but it does not work with cocoonjs ? when I touch the button , cocoonjs will return error touchstart node.ownerdocument [undefined].

This is my codes. (basically I just use ur demo and mixed it up with actor as button). When click with mouse it is working but when I zip it and put into cocoonjs it wont work....

window.addEventListener('load', function(){
CAAT.Module.Initialization.Template.init(800,500,"_c1",
[ {id:"botones",url:"images/botones.png"}
],_scene1
);

}, false);

function createNumber(director, n, color) {
var actor = new CAAT.Foundation.UI.TextActor().
setFont("140px Lucida-sans").
setText("Scene " + n).
calcTextSize(director).
setAlign("center").
setTextFillStyle(color).
setOutline(true).
cacheAsBitmap().
enableEvents(false).
addBehavior(
new CAAT.Behavior.RotateBehavior().
setFrameTime(0, 20000).
setValues(0, 2 * Math.PI).
setCycle(true));

actor.centerAt(director.width / 2, director.height / 2);
return actor;

}

function createButton(director, rotated) {
var actor = new CAAT.Foundation.Actor().
setSize(60, 60).
centerAt(director.width - 40, director.height - 40);

actor.paint = function (director, time) {

    var ctx = director.ctx;
    ctx.save();
    if (rotated) {
        ctx.translate(this.width, 0);
        ctx.scale(-1, 1);
    }

    ctx.fillStyle = this.pointed ? 'orange' : '#f3f';
    ctx.fillRect(0, 0, this.width, this.height);

    ctx.strokeStyle = this.pointed ? 'red' : 'black';
    ctx.strokeRect(0, 0, this.width, this.height);

    ctx.strokeStyle = 'white';
    ctx.beginPath();
    ctx.moveTo(5, 10);
    ctx.lineTo(20, 10);
    ctx.lineTo(15, 5);

    ctx.moveTo(20, 10);
    ctx.lineTo(15, 15);

    ctx.lineWidth = 2;
    ctx.lineJoin = 'round';
    ctx.lineCap = 'round';
    ctx.stroke();
    ctx.restore();

    ctx.font = '10px sans-serif';
    ctx.fillStyle = 'black';
    ctx.fillText(
        rotated ? 'Prev Scene' : 'Next Scene',
        3,
        45);
};

return actor;

}

function createPattern(director, color) {
var actor = new CAAT.Foundation.Actor().
setSize(director.width, director.height).
enableEvents(false);
actor.paint = function (director, time) {

    var i, j, ctx;

    ctx = director.ctx;
    ctx.beginPath();

    for (j = 0.5; j < director.width; j += 20) {
        ctx.moveTo(j, 0);
        ctx.lineTo(j, director.height);
    }

    for (i = 0.5; i < director.height; i += 20) {
        ctx.moveTo(0, i);
        ctx.lineTo(director.width, i);
    }

    ctx.strokeStyle = color;
    ctx.stroke();
};

return actor;

}

function _scene1(director) {
var ci= new CAAT.Foundation.SpriteImage().initialize(
director.getImage('botones'), 7, 3 );

var scene1 = director.createScene();    
scene1.addChild(createPattern(director, '#33f'));
scene1.addChild(createNumber(director, 1, '#33f'));
var button = createButton(director, false);

button.mouseClick = function (e) {
    director.switchToNextScene(
            2000,
            false,
            true
    )
}

var b1 = new CAAT.Foundation.Actor().setAsButton(ci.getRef(), 0, 1, 2, 0, function (button) {
    director.switchToNextScene(
             2000,
             false,
             true
     )


}).setLocation(0, 30);
var container1 = new CAAT.ActorContainer().setBounds(0, 0, director.width, director.height);
container1.addChild(b1);
container1.addChild(button);
scene1.addChild(container1);



var scene2 = director.createScene();
scene2.addChild(createPattern(director, '#f33'));
scene2.addChild(createNumber(director, 2, '#f33'));
var button2 = createButton(director, true);
button2.mouseClick = function (e) {

    director.switchToPrevScene(
            2000,
            false,
            true
    )
}

var b2 = new CAAT.Foundation.Actor().setAsButton(ci.getRef(), 0, 1, 2, 0, function (button) {
    director.switchToPrevScene(
         2000,
         false,
         true
 )

}).setLocation(0, 30);

var container2 = new CAAT.ActorContainer().setBounds(0, 0, director.width, director.height);
container2.addChild(b2);
container2.addChild(button2);
scene2.addChild(container2);

CAAT.loop(60);

}

[jdponomarev]

same for me.
did you manage to solve the problem?

[hyperandroid]

wilk do this afternoon.
a byg must have been introduced.
sorry about that.

• i
  On May 19, 2013 8:45 AM, "jdponomarev" notifications@github.com wrote:

same for me.
did you manage to solve the problem?

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/144#issuecomment-18119624
.

[arnuschky]

I don't know if this is related, but when using touch input the button reacts (executes the associated function) but does not get depressed. I mean, there's no visual feedback on a button click. I know that using touch a "hover" functionality like when using a mouse is not possible, but at least a feedback on a successful "click" would be nice.

Was this functionality present before and is the absence of it related to this bug, or should we add this functionality ourselves?