I am trying to create an replay button in my Adobe Animate CC HTML5 project. I've set the instance name in the property panel to "ReplayBtn". In a frame on my JS layer, I'm trying this :
this.ReplayBtn.addEventListener("click", (function () { this.gotoAndPlay(0); }).bind(this));
But I get an error of "Cannot read property 'addEventListener' of undefined". By inspecting "this", I can see that the instance name is not what I specified but "instance_3" instead. Updating the code to this works fine :
this.instance_3.addEventListener("click", (function () { this.gotoAndPlay(0); }).bind(this));
Why can't I use the instance name I've specified in the property panel ?
Comment #7 on this forum thread pointed me to a solution :
https://forums.adobe.com/thread/2349302
I removed the button from the timeline and re-added it. Bibbity boppity, it works as expected. A bug I guess ?
EDIT: Lesson of the day, add the instance name before you screw around with the instance on the timeline.
Related
I am working on a next js project , copied some coe on code pen , it is used for a product design of an e commerce website . However i am having this problem.
TypeError: Cannot set properties of undefined (setting 'className'). What is an equalvalent of
getElementsByClassName or how can i override this eror
here is a glimse of the code
var slider = document.getElementsByClassName("sliderBlock_items");
var slides = document.getElementsByClassName("sliderBlock_items__itemPhoto");
var next = document.getElementsByClassName("sliderBlock_controls__arrowForward")[0];
var previous = document.getElementsByClassName("sliderBlock_controls__arrowBackward")[0];
var items = document.getElementsByClassName("sliderBlock_positionControls")[0];
You can use:
document.querySelector(".your_class_name").value
querySelector() can be used to select elements on a page, just pass in a CSS like selector...
Cannot set value of undefined would mean that you are trying to select HTML elements that are not on the page. This could mean your code gets run before the components get rendered
Share your full code, or add that code inside a useEffect()
I am trying to follow the JSFiddle example on the link :
http://jsfiddle.net/BeniBoy/aeas62mh/1/
But I keep getting on error :
Uncaught TypeError: map._getNewTopLeftPoint is not a function
when I hover the sidebar or click onto the marker.
I am using pug and loading my script as
script(src='https://unpkg.com/leaflet#1.0.1/dist/leaflet.js')
on the header file.
This method was available until 0.7: https://github.com/Leaflet/Leaflet/blob/0.7/src/map/Map.js#L740
It has been removed in 1.0 (which is the version you are using).
Note that, because it starts with an underscore, it was considered as private and should not have been used in the first place.
I am trying to translate this js code into ruby code
document.ontouchstart ? 'touchstart' : 'click';
I am using opal-browser to get browser functionality. My current attempt is this:
touch = Browser::Event::Touch.new
puts touch.start?
However this returns the error:
Uncaught TypeError: Cannot read property 'type' of undefined
When I checked the error trace the error seems to be coming from a missing name property in the Touch class.
Hoping Opal community can help me out here
If you want to check if touch is supported you need to call Event::Touch.supported?.
For the error, it's happening because .new expects the event object as parameter, if you want to create a new event object you need to call .construct.
In retrospect it would have probably been better to have .construct be .new, and .new be .wrap or something on that line.
According to the Cesium API, to toggle the visibility of an asset's billboard (or label) you can simply assign the billboard.show property to false. When I attempted to do this, Cesium would error with
An error occurred while rendering. Rendering has stopped.
TypeError: undefined is not a function
...
This discussion from the cesium-dev google group includes some example code to toggle billboard visibility on/off. The same code does not work if you attempt show = false on an entity from CZML (this example does not use CZML).
Here is what I tried
var asset = loadedCZML.entities.getById(id);
asset.billboard.show = false; //Error!
(loadedCZML is a Cesium.CzmlDataSource)
The API doc's don't mention that the show property of your entity might not always be a simple boolean property (as the API describes).
When working with a CzmlDataSource's entity, the show property is considered a TimeIntervalCollectionProperty (at least it was with my CZML).
All properties in Cesium must implement a getValue function, and when you go to set your show = false, the setter for the property is unable to apply false to a TimeIntervalCollectionProperty and instead replaces the entire property with a simple value of false.
The error undefined is not a function is a result of the cesium render call attempting to call getValue() on our show property. Regardless, the fix is simple:
Instead of this:
asset.billboard.show = false; //error
Do this:
asset.billboard.show = new Cesium.ConstantProperty(false);
PS: This applies for other Cesium properties, see the following example:
entity.billboard.image = pinBuilder.fromColor(Cesium.Color.CRIMSON, 48); //error
//do this instead
entity.billboard.image = new Cesium.ConstantProperty(pinBuilder.fromColor(Cesium.Color.CRIMSON, 48).toDataURL());
I'm trying to a menu to the control bar of a video.js player via a plugin. Here's a demo of my end goal. The problem is that the demo is adding a menu to the control bar in video.js itself whereas I want a plugin that adds a menu.
So far I have been able to create a plugin that adds a MenuButton to the control bar, but I'm unable to populate the menu with any menu items.
Here's a demo of where I'm at now.
The problem is when I try to create a new PlaybackRateMenuItem object with new videojs.PlaybackRateMenuItem(this, {rate: rates[i] + 'x'}). The JS console throws the following error on line 805 of video.dev.js:
Uncaught TypeError: Cannot read property 'guid' of undefined
This corresponds to the following function in the unminified version:
vjs.bind = function(context, fn, uid) {
// Make sure the function has a unique ID
if (!fn.guid) {
fn.guid = vjs.guid++;
}
... omitted ...
};
Or more specifically, this line: if (!fn.guid) {.
From stepping through in a debugger, I see that fn is being passed in as undefined and the caller of the function is:
vjs.bind(this.player(), this.player().reportUserActivity);
When this function is being called, this.player() returns a defined value, but once vjs.bind is called, both arguments become undefined and I have no idea why. Any ideas or a point in the right direction? Thanks!
Turns out I had two major problems here.
Overriding the createMenu method instead of the createItems method for my class that extended the videojs.MenuButton class.
The this argument to the constructor of the videojs.MenuItem class must be the videojs player object, not just this. Problem is that the name of this object is mangled in the minified version of video.js. For this situation, I found that using this.c was the player object, but overall, I found it easier to just use the unminified version, video.dev.js, and not have to deal with the name mangling. In that case, using this.player_ was correct.