JS error only when instance has a name

[philipo56490068]

Hi,

can't figure out this one, hope someone can help me.

Canvas document with an instance of a Movie Clip on a separate layer. On the MC some script (like a console.log, doesn't matter). There is also a camera with some script in the scene.

When I assign a name to the MC and publish, I get

Uncaught TypeError: Cannot read properties of undefined (reading 'resetButton')

 in DevTools. When the MC has no instance name, there is no error. When I delete the camera or completely delete the script on the MC intance, there is also no error.

Am I missing something fundamental about instances? My understanding is that every instance needs to have a name in order to be adressed by scripts.

thank you

Philip

[kglad]

what's the script?

[philipo56490068]

This is the camera script. I deleted any other scripts in the scene.

var root = this;
createjs.Touch.enable(stage);
var dpr = window.devicePixelRatio;
CameraObject = AdobeAn.VirtualCamera.getCamera(exportRoot);

// Custom
var scaleZoomedOut = 2.5;
var scaleZoomedIn = 0.8;


// Cache initial values
var env = {
	camInitX: CameraObject.camera.x,
	camInitY: CameraObject.camera.y
};



//root.bg.on("pressmove", drag);

function drag(event) {
	//root.removeEventListener("click", zoomIn);
	CameraObject.camera.x = event.stageX / dpr;
	CameraObject.camera.y = event.stageY / dpr;
}


root.bg.on("click", newCenter);

function newCenter(event){
	console.log(event.stageX/dpr);
	if(!zoomed){
		CameraObject.setZoom(250);
		createjs.Tween.get(CameraObject.camera, {
			override: true
		}).to({
			x: event.stageX / dpr,
			y: event.stageY / dpr
		}, 800, createjs.Ease.sineOut);
		//CameraObject.camera.x = event.stageX / dpr;
		//CameraObject.camera.y = event.stageY / dpr;
	}
}


// old, for reference
function zoom(event) {

	// zoom in
	if (!zoomed) {
		createjs.Tween.get(CameraObject.camera, {
			override: true
		}).to({
			x: event.stageX / dpr,
			y: event.stageY / dpr,
			scaleX: scaleZoomedIn,
			scaleY: scaleZoomedIn
		}, 800, createjs.Ease.sineOut);
		zoomed = true;
	}

	//zoom out
	else {
		createjs.Tween.get(CameraObject.camera, {
			override: true
		}).to({
			x: env.camInitX / dpr,
			y: env.camInitY / dpr/*,
			scaleX: scaleZoomedOut,
			scaleY: scaleZoomedOut*/
		}, 800, createjs.Ease.sineOut);
		zoomed = false;
	}
}

[kglad]

i don't see a problem as long as you define bg and zoomed.

[philipo56490068]

Thank you for looking at it. Both variables are defined globally. There is no problem with that specific script, I think. The MC (yellow square) in the upper right corner has an instance name and it

throws an error. Only when I delete the whole camera or when not giving an instance name, the error disappears. 

Here is a link to the file, uploading here was not possible

https://www.dropbox.com/s/7i5w30dk7wtf31x/instance_name.fla?dl=0

[kglad]

where's bg defined?

[philipo56490068]

It wasn't. Replaced the original bg with a placeholder for uploading and forgot to name it, sorry. Still the same error, though.

https://www.dropbox.com/s/7i5w30dk7wtf31x/instance_name2.fla?dl=0

[philipo56490068]

sorry, link is dead. This works:

https://www.dropbox.com/s/z3ihmass812rgk3/instance_name2.fla?dl=0

[kglad]

i generally don't download and correct files unless i'm hired or there's something of particular interest to me.

in your  case i thought there might be something interesting so i downloaded and debugged your fla.  your error was pointed out in my first message and confirmed with that first download.

if you want me to continue to help and download another version of your fla, you'll need to hire me.

[philipo56490068]

I totally understand and appreciate your effort! Thank you for looking at it anyway.

Since bg is defined as an instance name and zoomed is a globally defined variable, I don't quite understand your first post. But as I said, I still need to really get behind the core principles of Animate, which I am apparently not. 

[kglad]

well, there's actually a third way i'll download and check files; if you're really nice about it.  and you were really nice about it. 

so, i downloaded instance_name2 and tested (in edge) and saw no problems.  here's a dev console ss:

[kglad · Accepted solution]

addendum: i took another look and noted you had not assigned an instance name to the yellow square in instance_name2.  so, i did that and saw the error, but i also noticed the yellow square is in the camera layer and that's suspicious.

after moving the yellow square to its own layer, everything worked. again:

bottomline: put nothing in the camera layer after adding it.  lock it and leave it locked.

[philipo56490068]

Thanks again! By "in the camera layer" you mean attatched to it? My plan is to use the element as part of a menu interface. So it needs to stick to the camera. Could that be problematic?

[kglad]

don't add anything to the camera layer.  you can:

Locking a layer with camera

As an animator or a game designer, you want to make some objects of the animation to stick to the view of the camera. For example, an action button, a heads up display in a game displaying the time meter, or a gun. In such cases, you have to keep the asset locked with the camera movement. The Attach To Camera feature in Animate enables you to achieve this effect.

Locking a layer with camera

When you attach a layer to the camera, objects in that layer are pinned to the camera and always move along with the camera. So, they appear to be unaffected by camera movements in the output.

You can attach a single layer to camera by clicking the dot in the attach camera icon's column. If the layer is attached to camera, a representative icon appears next to that layer name.  

[philipo56490068]

Thank you very much!

[kglad]

you're welcome.