I just have a query on deleting displayobject instance. Let me elaborate on this:
I had created a custom component called ‘PanelItem’ (which basically contains a Text Area and a close button in a Panel container)
Then in the main.mxml, I had utilized the above custom component as follows:
var tempPanel: PanelItem = new PanelItem();
Subsequently assigned values for its attributes such as x,y, width, height and id for tempPanel and then added child instances as below
addChild(tempPanel);
The above code displays one instance of the custom displayobject. My problem is that when the ‘close’ button on the panel is clicked, I want the displayobject instance to be removed from the memory.
To do the ‘close’ action, I had added the following to the code
tempPanel.removAllChildren();
tempPanel.visible = false;
But the above only removes the children of displayobject and the doesnot removes the displayobject instance completely from memory. I read somewhere I need to ‘delete’ the displayobject, but could not find any reference to the same in the help file
Any thoughts on how do I go about removing the displayobject completely from memory?
Anther question I have is, if I had invoked multiple instances of tempPanel, how do I get a count of the number of instances.
TempPanel.numChildren() only returns the number of child instance (which got invoked thru addChild method) and not the actual numbers of displayobjects floating around.
Any help on the above will be much appreciated.
Thanks
Srinivasan S
you could extend from CasaSprite (http://as3.casalib.org/docs/org_casalib_display_CasaSprite.html) which has a destroy function.
Related
I want to check the list of event listeners that are added. For example, I used the code cy.on('pan zoom resize', update); and added function called update in for loop. I do this many times. I also call cy.off('pan zoom resize', update); to remove the event listeners but I want to be sure about it.
The only think I can think of is using console.log but this method might not be helpful.
I also think that in some places people forgot to remove the event listeners and just always added. With too many repetitions this might cause problems.
There is a data field in the private cytoscape object called listeners. You can see that if you:
console.log() the cy object,
navigate to _private,
then open the emitter object
and lastly go to listeners
This is the array listing all the default and user defined event listeners with some metadata like the event, type and scope of the listener.
You can access this in your code by simply calling
cy.emitter().listeners
The question now is, why do you need this information in the first place? Normally, you should be just fine if you call cy.off('eventXY', ...) before using any cy.on('eventXY', ...). Are you sure you need this for your application to work? Maybe elaborate more on the core problem (why you want these information in the first place).
Thanks and have a great day!
I have a leaflet map (using Vue and vue2-leaflet) with many predefined nodes and connections between them (stored in a neo4j database). When the user clicks on a node (#mouseup, actually), all its connections are shown as a polyline. I want to be able to click on any of these connections on the map (the lines) and do stuff with it, like delete for example (there would be a popup or something with actions, but that's not important here).
The problem I'm having is that the click event doesn't record the connection ID (or anything that would identify which connection was in fact clicked). I could of course create one polyline for each connection, but I suspect the problem would persist, and it's not a really solution in my case, as I don't know how many connections each node has, and v-for doesn't seem to work with polylines (at least I wasn't able to make it work).
This is the nodes markers code:
<l-marker v-for="mapNode in MapStore.mapNodes"
#mouseup="nodeClick($event, mapNode.index)"
:lat-lng="[mapNode.latLng.lat, mapNode.latLng.lng]"
:key="mapNode.index"
</l-marker>
... and this is the polyline code:
<l-polyline
#mouseup="connectionClick($event)"
:lat-lngs="MapStore.selectedConnections.latlngs"
/>
The nodeClick function populates the MapStore.selectedConnections correctly as the polylines are shown as expected.
The problem is that I don't see anything being passed to the connectionClick function that would identify which connection was clicked, so that I could work with it.
Is that even possible?
Ok, so it turns out I was wrong and v-for works (there was something wrong with my code, I think, but I'm not sure what).
My solution is:
<l-polyline v-for="connection in MapStore.selectedConnections.latlngs"
#mouseup="connectionClick($event, connection)"
:lat-lngs="connection" />
This way it iterates through the connections, generates a separate polyline for each and passes to the connectionClick function the latlngs of the clicked connection.
I'm trying to debug a rather weird problem I've run into with a Vue.js application. Unfortunately it's way too complex to be able to isolate some code showing the problem, so I'm hoping that a clear description might be enough to enable people to give me some pointers as to where to look.
I have a component called ItemSelector, which has a 'targetList' prop of type Array. On a form, I use this component 3 times, passing a different array for each instance. Each array consists of sale item objects, and the ItemSelector component displays these items and allows the user to add, edit and delete them. All works just fine, except for one thing. The objects contain a property called 'subtotal'. If in one instance of my ItemSelector component I edit one of the item objects and clear the value of the 'subtotal' property, the item with the same index in the other instances of ItemSelector also has the 'subtotal' property cleared! That is, if I edit the second item in one of the ItemSelector instances, clearing the subtotal property, the second item, if present, in the other ItemSelector instances is also cleared. However, if I instead change the value to a different number, this has no effect on other instances of the component. It's only clearing the value which does it.
Does this make any sense at all to anyone? I cannot see how a change in one array could affect other arrays at all.
I got a question to which I have no answer after a couple of hours of trying and googling :(
I've created three dojo.dnd.Source components. It is used to couple a user to a project so to the left I've got projects and to the right I've got my users and in the center I got a canvas. I set up the relevant creators and checkacceptance functions and all is well.
Onto the center canvas a user can drop a project which is shown as a div containing all related users as div elements. The other dndtype that can be dropped is the user type, in that case I want to empty the canvas and show all projects to which te dropped user is related. As soon as I drop a project or user on the canvas the creator function is called. The problem is that the creator function returns 1 element that should be dropped, if I drop a user I need to draw several elements onto the canvas so the creator method isn't fully covering this since it returns only one element.
To cope with the default behaviour I tried to manually add projects to the canvas and returning only one, I know it ain't pretty :S It's working but I'm confronted with strange behaviour, if I move a project on the canvas it is treated as a user in stead of a project.
Bottom line, is there a way that you guys know of to drop one item and create multiple. I was searching to trigger the drop event myself but to no avail.
Thanks!
The event you are looking for is Source's onDrop event. Check the API docs for some more events you could use: there is a onDropExternal and onDropInternal for use inside and between Stores.
require(["dojo/dnd/Source"], function(Source){
var source = new Source({
onDrop = function(source, nodes, copy) {
//called only on the current target, when drop is performed
this.inherited(arguments); //execute the default onDrop function
//now add the node(s) to the other stores here
//you might be able to just do something like:
source2.insertNodes(nodes);//but this is untested ;)
}
});
});
In our application, there is a tabpanel in which we are adding/removing the panel dynamically.
The panels get added at the click of a menu item by the following code in menu handler:
Ext.getCmp('mainTabPanelId').add(getPanel());
Here getPanel() method returns the panel after creating it.
Assuming that the id of main tab panel is mainTabPanelId and that of the child panel is panelId, in this context, could someone guide at the following:
Is it necessary to call doLayout() on mainTabPanel after the add method?
Should the doLayout() be called on the mainTabPanel or on the newly added child panel, that is, Ext.getCmp('mainTabId').doLayout() or Ext.getCmp('panelId').doLayout()?
Will a call to doLayout() take care of all the issues related to rendering, like scrollbars esp.?
The method getPanel() should return an already created panel (using Ext.create) or should it return a config object (having xtype:'panel')? Which one should be preferred for better performance keeping time in mind?
AbstractContainer::add()
<...> If the Container was configured with a size-managing layout manager, the Container will recalculate its internal layout at this time too.
So you don't have to do 1 — 3 because:
AbstractContainer::doLayout()
<...> The framework uses this internally to refresh layouts form most cases.
AbstractContainer::defaults
For defaults to work, the child items must be added using {xtype: ......} NOT using Ext.create("widget.type",{}) © roger.spall
So I'd prefer return configuration object instead of components itself.