WebGL Code Snippets missing??

Forum|Forum|6 years ago
November 28, 2019
3 replies
880 views

In the Code Snippets panel, there are only two folders: One for Actionscript and one for HTML5 Canvas. However, there is no WebGL Folder to be found? I've also never seen this folder since using Animate.
I tried the "reset to default XML" and still, nothing appeared.

I also never use this panel (and I only recently jumped back into the program to see what's been updated after being away from it for a few years). So, as far as I know, I wouldn't have made any settings modifications to wipe it out.

Up-to-date and running version 20.0.

Any idea how I get this folder and the WebGL snippets?

(Attached Screenshot of what I currently have)

This topic has been closed for replies.

Correct answer JoãoCésar17023019

Hi.

Even when they were available in the previous releases, they were outdated. The WebGL API changed drastically since it was introduced.

For example: previously you would need this huge amount of code to add a click event to a Movie Clip instance called 'rec'.

this.rec = this.getChildByName("rec");

canvas.onclick = function(e)
{
    var boundingRect = this.rec.getBounds(this);
	
    if(isMouseOverSymbol(e.offsetX, e.offsetY, boundingRect))
	{
        console.log("click");
    }
}.bind(this);

function isMouseOverSymbol(pointX, pointY, rect)
{
    if(rect.left <= pointX && pointX <= rect.left + rect.width)
        if(rect.top <= pointY && pointY <= rect.top + rect.height)
            return true;

    return false;
}

Now you only need this:

{
	var _this = this;

	_this.rec.addEventListener(AnEvent.CLICK, function ()
	{

		console.log("click");
	});
}

Currently what you can do is to use the wizard in the Actions Panel. The code added from the wizard is correct. You can also inspect the exported files and the browser console to find out more about the API while there isn't a official API documentation.

Regards,

JC

W

wellingsomeAuthor

Known Participant

a

JoãoCésar17023019

Correct answer

Community Expert

Hi.

Even when they were available in the previous releases, they were outdated. The WebGL API changed drastically since it was introduced.

For example: previously you would need this huge amount of code to add a click event to a Movie Clip instance called 'rec'.

this.rec = this.getChildByName("rec");

canvas.onclick = function(e)
{
    var boundingRect = this.rec.getBounds(this);
	
    if(isMouseOverSymbol(e.offsetX, e.offsetY, boundingRect))
	{
        console.log("click");
    }
}.bind(this);

function isMouseOverSymbol(pointX, pointY, rect)
{
    if(rect.left <= pointX && pointX <= rect.left + rect.width)
        if(rect.top <= pointY && pointY <= rect.top + rect.height)
            return true;

    return false;
}

Now you only need this:

{
	var _this = this;

	_this.rec.addEventListener(AnEvent.CLICK, function ()
	{

		console.log("click");
	});
}

Currently what you can do is to use the wizard in the Actions Panel. The code added from the wizard is correct. You can also inspect the exported files and the browser console to find out more about the API while there isn't a official API documentation.

Regards,

JC