Toninio78 Posted December 20, 2015 Share Posted December 20, 2015 Hello all, I need some help.MY GOAL : I want to drag & drop all the numbers over their own dropzone (in blue with the same number).I can't find the way to identify each dropzones... Thanks in advance<html><head><script src='https://cdnjs.cloudflare.com/ajax/libs/phaser/2.4.4/phaser.min.js'></script></head><style>body {padding: 0; margin: 0;}#phaser-example {position: absolute;margin:0; padding:0;}#phaser-example {z-index: 1; left: 0; top: 0;}</style><body><div id="phaser-game"></div><script>var window_W = window.innerWidth;var window_H = window.innerHeight;var n_n = 3;var n_e = Math.floor((window_W * 0.1)/(n_n+1));var n_w = Math.floor((window_W-(n_e*(n_n+1))) / n_n); //var game = new Phaser.Game(window_W, window_H, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create});var dropZone;var dragPosition;var music;var button;var tab_n_1 = [ {name:"1", x:100, y:100}, {name:"2", x:200, y:140}, {name:"3", x:300, y:180}, {name:"4", x:400, y:220}, {name:"5", x:500, y:260}, {name:"6", x:600, y:320}, {name:"7", x:700, y:380}, {name:"8", x:100, y:40}, {name:"9", x:200, y:50}, {name:"10", x:300, y:80}, {name:"11", x:400, y:380}, {name:"12", x:500, y:320}, {name:"13", x:600, y:220} ];var tab_n_2 = [];for( var i = 0; i < n_n; i++ ) { var rand = Math.floor(Math.random() * tab_n_1.length); tab_n_2.push(tab_n_1[rand]); tab_n_1.splice(rand, 1);}console.log(tab_n_2);function preload() { game.stage.backgroundColor = '#71c5cf'; // Couleur du background}function create() { for( var i = 0; i < tab_n_2.length; i++ ) { for( var ii = 0; ii < 2; ii++ ) { makeButton(tab_n_2[i].name, tab_n_2[i].x, tab_n_2[i].y); } var bmd = game.add.bitmapData(n_w, window_H/3); bmd.boundsPadding = 0; bmd.ctx.beginPath(); bmd.ctx.rect(0, 0, n_w, window_H/3); bmd.ctx.fillStyle = '#000ff0'; bmd.ctx.fill(); dropZone = game.add.sprite(((n_e*(i+1))+(n_w*i)), window_H*2/3, bmd); dropZone.name = tab_n_2[i].name; dropZone.anchor.set(0); var text = game.add.text(0, 0, tab_n_2[i].name); text.x += (button.width / 2) - (text.textWidth / 2); text.bringToTop() game.physics.enable(dropZone, Phaser.Physics.ARCADE); }}function makeButton(name, x, y) { button = game.add.text(x + Math.floor(Math.random()*100)+1, y + Math.floor(Math.random()*100)+1, name); button.name = name; button.anchor.set(0); button.inputEnabled = true; button.input.enableDrag(); button.events.onDragStart.add(onDragStart, this); button.events.onDragStop.add(onDragStop, this); dragPosition = new Phaser.Point(button.x, button.y);}function onDragStart(sprite, pointer) { dragPosition.set(sprite.x, sprite.y);}function onDragStop(sprite, pointer) { if (sprite.overlap(dropZone)) { sprite.x = dropZone.x+ + Math.floor(Math.random()*n_w)+1; sprite.y = dragPosition.y; } else { sprite.x = dragPosition.x; sprite.y = dragPosition.y; }}function click(button) { console.log('dropZone.name : '+dropZone.name);}</script></body></html> Link to comment Share on other sites More sharing options...
Toninio78 Posted December 21, 2015 Author Share Posted December 21, 2015 In brief, I need to check overlap with sprite.names.Do you think if it's possible ? Link to comment Share on other sites More sharing options...
Toninio78 Posted December 21, 2015 Author Share Posted December 21, 2015 An exemple here : http://stackoverflow.com/questions/34391975/phaser-i-cant-find-the-way-to-identify-each-dropzones-overlap Link to comment Share on other sites More sharing options...
Recommended Posts