Search...
FAQs
Subscribe
Pie
FAQs
Recent topics
Flagged topics
Hot topics
Best topics
Search...
Search within Frameworks
Search Coderanch
Advance search
Google search
Register / Login
Post Reply
Bookmark Topic
Watch Topic
New Topic
programming forums
Java
Mobile
Certification
Databases
Caching
Books
Engineering
Micro Controllers
OS
Languages
Paradigms
IDEs
Build Tools
Frameworks
Application Servers
Open Source
This Site
Careers
Other
Pie Elite
all forums
this forum made possible by our volunteer staff, including ...
Marshals:
Campbell Ritchie
Jeanne Boyarsky
Ron McLeod
Paul Clapham
Liutauras Vilda
Sheriffs:
paul wheaton
Rob Spoor
Devaka Cooray
Saloon Keepers:
Stephan van Hulst
Tim Holloway
Carey Brown
Frits Walraven
Tim Moores
Bartenders:
Mikalai Zaikin
Forum:
Other Application Frameworks
PIXIjs
Charles gomes
Greenhorn
Posts: 1
posted 5 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
In my html:
<div class="pixiTestBox"> <!-- here i will append one app view (canvas) --> </div> <div class="pixiTestBox2"> <!-- here i will append another app view (canvas) --> </div>
In my js:
//NOTE: When document is loaded, calls automatically `pixiSetup()` and `pixiSetup2()` pixiSetup() { //creates and append the "app.view" to div.pixiTestBox var ctx = document.querySelector(".pixiTestBox"); var app = new PIXI.Application(800, 600, { backgroundColor: 0x1099bb }); ctx.appendChild(app.view); // create a new Sprite from an image path var bunny = PIXI.Sprite.fromImage('images/user.png'); // center the sprite's anchor point bunny.anchor.set(0.5); app.stage.addChild(bunny); // Pointers normalize touch and mouse app.renderer.plugins.interaction.on('pointerup', canvasOnClickHandler); //Set element react on click bunny.interactive = true; bunny.on('pointerdown', drawedElementClicked); } pixiSetup2() { //creates and append the "app.view" to div.pixiTestBox2 var ctx = document.querySelector(".pixiTestBox2"); var app = new PIXI.Application(800, 600, { backgroundColor: 0x1099bb }); ctx.appendChild(app.view); // create a new Sprite from an image path var bunny = PIXI.Sprite.fromImage('images/user.png'); // center the sprite's anchor point bunny.anchor.set(0.5); app.stage.addChild(bunny); // Pointers normalize touch and mouse app.renderer.plugins.interaction.on('pointerup', canvasOnClickHandler); //Set element react on click bunny.interactive = true; bunny.on('pointerdown', drawedElementClicked); } function canvasOnClickHandler(event) { [color=red]//How can i get here if the canvas that was clicked was the one inside of div class="pixiTestBox" or div class="pixiTestBox2"?[/color] } //canvasOnClickHandler function drawedElementClicked(event) { [color=red]//How can i get here wich sprite was clicked? (is it possible to add an "id" when declaring a sprite?)[/color] } //drawedElementClicked
How can i accomplish what is in canvasOnClickHandler() and drawedElementClicked()?
reply
reply
Bookmark Topic
Watch Topic
New Topic
Boost this thread!
Similar Threads
curves and the html5 canvas
Issues with image slider done using plain jQuery
Doing a POST in jsp without leaving the page and displaying a success text
jQuery - Adding Image to DIV all Dynamic, Odd Behavior or Sleep Deprivation?
Turn Rectangle Transparent Color
More...