I try to loop a complete header animation endlessly, but I just cannot get it to work:
https://codepen.io/Sixl/pen/jwXGqd
I tried to loop the master like this:
var master = new TimelineMax({repeat:-1});
Then I tried the same solution on the single scene I'm using:
function sceneOne() {
var tl = new TimelineMax({repeat:-1});
I also tried several solutions with oncomplete callbacks.
I finally had some experiments with
timeline.seek(0).pause();
timeline.pause(0); //shortcut for the line above
timeline.progress(0).pause();
timeline.totalProgress(0).pause();
timeline.restart(0).pause();
inside my scene. Didn't help.
Can somebody point me in the right direction? I cannot find any error in my code.
It is the entry_heroes section that is causing the problem as it has itself a repeat: -1 that means that the section never ends and so the whole timeline never finishes and thus does not repeat.
Related
I am new to Kotlin programming. I didn't have any problems in other layouts, but now I need to use relativeLayout. I will create hundreds of buttons and their positions will be relative to each other I have to do this programmatically. I was able to find java examples but I couldn't find many resources in Kotlin because addRule is not here. Can you give me a small example of this?
Thanks in advance.
Thanks for ansver. I solved the addRule problem. now i see only one button at start instead of 1000 button, i think i have problem assigning id. Here is my simple code. i just want programmatically add years at top line between 1000-2000. After that, I will add the beginning and end of an event in 1378 to a bottom line as button. so i can assign dates easily, i chose relativeLayout for this.
val buttonParam = LayoutParams( 100, 100 ) var counter:Int=1000 while (true) { var btnId:Int=counter val myButton = Button(this) myButton.id=btnId buttonParam.addRule(RelativeLayout.RIGHT_OF, btnId-1) myButton.text = btnId.toString() myButton.layoutParams = buttonParam binding.rl.addView(myButton) counter=counter +1 if(counter==2000) break }
Edit: İ solve my problem. the problem is i create 1 buttonParam. Now i am creating parameter for every buttons.
I used remove() method to delete a rectangle from the scene, how can i draw it back?
The documentation said: "remove a node from parent, but don't destroy. You can reuse the node later."
Link to documentation
I couldn't find any clue
Thanks
Thank you for the responses, i actually found a simple workaround.
I use .hide() and .show() methods because i want to keep intact the object for later use and when i do not need it anymore i'll just .destroy() the shapes.
The downside is you need more memory to keep all, but with few shapes on the scene is negligible.
Just keep a reference to the node via a variable. For example, in the code below I add a node to layer1, remove it, and add it to layer2.
var layer1 = new Konva.Layer();
stage.add(layer1);
Var node = new Konva.WhateverShape({....});
layer1.add(node);
layer1.draw();
...
...
var layer2 = new Konva.Layer();
stage.add(layer2);
node.remove(); // at this time the node exists but is not on the stage
layer2.add(node);
layer2.draw(); // now the node is visible again.
I'm using cytoscape.js and cytoscape.js-expand-collapse to create dynamic hierarchies in my graph structure. I would like to be able to dynamically create a collapsed(merged) node that could potentially be expanded out, removed or possibly re-merged with additional nodes. I am having trouble whenever I call nodes.move({parent:null}). They become detached from the graph and I cannot re-attach them to a new parentNode. If I call restore on them I will see errors saying they already exist in the graph.
merge and unmerge by itself works fine in a simple case of no existing collapsed nodes. However calling merge on something that already contains a compound collapsed node breaks things. I would get the resulting merged node without the children of the previously collapsed merge candidate
Update #1 I've realized my problem was returning the wrong moved nodes. Calling .move on a collection returns a new set of nodes. so the unmerge should return those instead.
Update #2 cytoscape-expand-collapse utility does some internal book-keeping during the parent node collapse/expand by tucking away node data in 'originalEnds' data prop on the meta edges. so, if I'm now altering the graph dynamically by moving nodes in/out of parents these originalEnds pointers get out of sync causing infinite loops. I am doing some additional node tracking of my own as a workaround.
function merge(nodes){
//if one of the nodes is a compound itself, first uncollapse, then merge
var collapsed = nodes.filter(function(c){return typeof c.data('collapsedChildren')!=='undefined';});
if (collapsed.length>0) {
// for now just assume collapsed is a length of 1
var unmerged = unmerge(collapsed); //unmerged should be now the former collapsed children
nodes = nodes.subtract(collapsed).union(unmerged.nodes());
}
var parentNode = cy.add({group:'nodes', data: {id: parentID}});
nodes.move({parent: parentID});
collapseApi.collapse(parentNode);
return parentNode;
}
function unmerge(parentNode){
collapseApi.expand(parentNode);
var children = parentNode.children();
var moved = children.move({parent:null});
//at this point children become "detached" from the graph
// .removed() returns true, however, calling restore() logs an error and they are still technically in the graph
parentNode.remove();
return moved;
}
ele.move() has a more convenient implementation in cytoscape>=3.4: The elements are modified in-place instead of creating replacement elements.
Old code that uses the returned collection from ele.move() will still work. New code can be simplified by not having to use the returned collections at all.
The code I am using is in my previous question (resolved)
The interaction works perfectly and my goal is to get an array of coordinates, also works perfectly. Although everything works, I am getting an error in console every time I move the mouse in the display area. It doesn't affect functioning, but obviously I need to solve it... any ideas?
Draw.js?ac29:579 Uncaught TypeError: Cannot read property 'getGeometry' of null
at Draw.modifyDrawing_ (Draw.js?ac29:579)
at Draw.handlePointerMove_ (Draw.js?ac29:479)
at Draw.handleEvent (Draw.js?ac29:871)
at Map.handleMapBrowserEvent (PluggableMap.js?fe37:924)
at MapBrowserEventHandler.boundListener (events.js?1e8d:41)
at MapBrowserEventHandler.dispatchEvent (Target.js?0ec0:101)
at MapBrowserEventHandler.handlePointerMove_ (MapBrowserEventHandler.js?2ad6:260)
at PointerEventHandler.boundListener (events.js?1e8d:41)
at PointerEventHandler.dispatchEvent (Target.js?0ec0:101)
at PointerEventHandler.fireNativeEvent (PointerEventHandler.js?b114:397)
I'm trying something quite random, but you maybe want to add some condition in you current code:
var modify = new Modify({source: source});
modify.on('modifyend',function(e){
if(e.features && e.features.getArray().length) { //add this line
console.log("feature id is",e.features.getArray()[0].getGeometry().getCoordinates()[0]);
}
});
I'm using Dojo dnd version 1.7.2 and it's generally working really well. I'm happy.
My app maintains many arrays of items, and as the user drags and drops items around, I need to ensure that my arrays are updated to reflect the contents the user is seeing.
In order to accomplish this, I think I need to run some code around the time of Source.onDndDrop
If I use dojo.connect to set up a handler on my Source for onDndDrop or onDrop, my code seems to get called too late. That is, the source that's passed to the handler doesn't actually have the item in it any more.
This is a problem because I want to call source.getItem(nodes[0].id) to get at the actual data that's being dragged around so I can find it in my arrays and update those arrays to reflect the change the user is making.
Perhaps I'm going about this wrong; and there's a better way?
Ok, I found a good way to do this. A hint was found in this answer to a different question:
https://stackoverflow.com/a/1635554/573110
My successful sequence of calls is basically:
var source = new dojo.dnd.Source( element, creationParams );
var dropHandler = function(source,nodes,copy){
var o = source.getItem(nodes[0].id); // 0 is cool here because singular:true.
// party on o.data ...
this.oldDrop(source,nodes,copy);
}
source.oldDrop = source.onDrop;
source.onDrop = dropHandler;
This ensures that the new implementation of onDrop (dropHandler) is called right before the previously installed one.
Kind'a shooting a blank i guess, there are a few different implementations of the dndSource. But there are a some things one needs to know about the events / checkfunctions that are called during the mouseover / dnddrop.
One approach would be to setup checkAcceptance(source, nodes) for any target you may have. Then keep a reference of the nodes currently dragged. Gets tricky though, with multiple containers that has dynamic contents.
Setup your Source, whilst overriding the checkAcceptance and use a known, (perhaps global) variable to keep track.
var lastReference = null;
var target = dojo.dnd.Source(node, {
checkAcceptance(source, nodes) : function() {
// this is called when 'nodes' are attempted dropped - on mouseover
lastReference = source.getItem(nodes[0].id)
// returning boolean here will either green-light or deny your drop
// use fallback (default) behavior like so:
return this.inhertied(arguments);
}
});
Best approach might just be like this - you get both target and source plus nodes at hand, however you need to find out which is the right stack to look for the node in. I believe it is published at same time as the event (onDrop) youre allready using:
dojo.subscribe("/dnd/drop", function(source, nodes, copy, target) {
// figure out your source container id and target dropzone id
// do stuff with nodes
var itemId = nodes[0].id
}
Available mechanics/topics through dojo.subscribe and events are listed here
http://dojotoolkit.org/reference-guide/1.7/dojo/dnd.html#manager