How to control touch event using common javascript code?

cocos2d-x JavaScript
#1

Hi,

I have common javascript code.

This code have common click event value(X,Y).

I want to control some layer(cocos2d) touch event using this javascript code.

How value can be passed in the event layer?

For example.

  1. cocos2d-html5 layer create.

  2. Common javascript code have event value(X,Y) (not cocos2d code)

  3. This code can to trigger layer’s(cocos2d) touch event (begin,move,end).

Thank you for your answer.

#2

not sure what you are trying todo, but the usual mouse event coordinate starts from top left, going downwards increases the Y value. Cocos2d employs the openGL Coordinate system, where 0,0 starts at bottom left, going upwards increases the Y value

#3

Thank you for your answer.

I knew this Y value issue. This issue is no problem.

I want to know …

# test.js
var canvasW = 800;
var canvasH = 480;

function test(event){
    var x = event.x;
    var y = canvasH - event.y;

    how to control touch event ItemAlayer?
    (As if they actually touch this layer.
     I want to action  layer's menu item or sprite touch and move)
    I cannot use mouse and real touch.
    Only this function can use. This function get event(X,Y);

}

# itemA.js
var ItemALayer = cc.Layer.extend({
    homeBtn:null,
    init:function () {
        this._super();
        var size = cc.Director.getInstance().getWinSize();
    this.setTouchEnabled(true);
    this.homeBtn = cc.MenuItemImage.create(
            "images/img_button_home.png",
            "images/img_button_home.png",
            function () {
                var scene = cc. TransitionFade.create(2, new MyScene());
                cc.Director.getInstance().replaceScene(scene);
            },this);
        this.homeBtn.setAnchorPoint(cc.p(0.5, 0.5));
        this.homeBtn.setPosition();
        var menu = cc.Menu.create(this.homeBtn);
        menu.setPosition(50,400);

        this.addChild(menu, 1);

        var lazyLayer = new cc.LazyLayer();
        this.addChild(lazyLayer);

        this.sprite = cc.Sprite.create(mBackImg);
        this.sprite.setAnchorPoint(cc.p(0.0, 0.0));
        this.sprite.setScaleY(10);
        this.sprite.setPosition(0,0);

        lazyLayer.addChild(this.sprite, 0);
        return true;
    },
    update:function(dt){

    },
    onTouchesMoved:function(touch, event){
        console.log("touch move!");
    },
    onTouchesBegan:function(touch, event){
        var endPos = touch[0].getLocation();

        console.log("touch begin!" + touch[0].getLocation().x + " / " + touch[0].getLocation().y);
    },
    onTouchesCancelled:function(touch, event){
        console.log("touch cancel!");
    },
    onTouchesEnded:function(touch, event){
        console.log("touch end!");
    }
});

Thank you for your help.

Hao Wu wrote:

not sure what you are trying todo, but the usual mouse event coordinate starts from top left, going downwards increases the Y value. Cocos2d employs the openGL Coordinate system, where 0,0 starts at bottom left, going upwards increases the Y value

#4

you want to fire an mouse event, but you cannot physically touch or click the canvas.

you can do it like this

#5

I am beginner to cocos2d html5,I have an image of front view of home in that i placed a image as sprite (may be menuitemimage also) in that how to trigger onclick event for MenuItemImage or for Sprite.On clicking that i should be able to zoom in and move to another layer image or another scene image. Can anyone please help me to solve this problem. Waiting for all of your replies.

#6

@Sharmil S, You may find sample code that you need in test case. Enjoy it.

#7

Hi Shun lin, can u please say me some link tat have same code to control the mouse event