-
-
Save lipusz/0f9280029b303d469037 to your computer and use it in GitHub Desktop.
diff --git a/src/aui-tree/js/aui-tree-node.js b/src/aui-tree/js/aui-tree-node.js | |
index 494d1d7..1ee0f27 100644 | |
@@ -1205,8 +1210,9 @@ var TreeNodeIO = A.Component.create({ | |
* Expand the current TreeNodeIO. | |
* | |
* @method expand | |
+ * @param {function} fn callback Optional. | |
*/ | |
- expand: function() { | |
+ expand: function(fn) { | |
var instance = this; | |
var cache = instance.get(CACHE); | |
@@ -1231,6 +1237,10 @@ var TreeNodeIO = A.Component.create({ | |
else { | |
A.TreeNodeIO.superclass.expand.apply(this, arguments); | |
} | |
+ | |
+ if (fn) { | |
+ fn.call(); | |
+ } | |
}, | |
/** |
diff --git a/src/aui-tree/js/aui-tree-view.js b/src/aui-tree/js/aui-tree-view.js | |
index 00dc266..18fdf25 100644 | |
@@ -838,11 +838,11 @@ var TreeViewDD = A.Component.create({ | |
} | |
else if (dropAction === APPEND) { | |
if (dropTreeNode && !dropTreeNode.isLeaf()) { | |
- dropTreeNode.appendChild(dragTreeNode); | |
- | |
if (!dropTreeNode.get(EXPANDED)) { | |
// expand node when drop a child on it | |
- dropTreeNode.expand(); | |
+ dropTreeNode.expand(function() { | |
+ dropTreeNode.appendChild(dragTreeNode); | |
+ }); | |
} | |
instance.bubbleEvent('dropAppend', output); |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title></title> | |
<link href="http://cdn.alloyui.com/2.0.0pr7/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> | |
<script src="http://cdn.alloyui.com/2.0.0pr7/aui/aui-min.js"></script> | |
</head> | |
<body> | |
<h1>AlloyUI - Tree</h1> | |
<div class="container pull-left"> | |
<div class="row-fluid"> | |
<div class="span6"> | |
<h2>TreeView file with IO</h2> | |
<div id="treeio"></div> | |
</div> | |
</div> | |
</div> | |
<script> | |
YUI({ filter: 'raw' }).use('aui-tree', function(Y) { | |
var dragNode = new Y.TreeNodeTask({ | |
alwaysShowHitArea: true, | |
children: [], | |
draggable: true, | |
expanded: false, | |
label: 'Drag', | |
leaf: false | |
}); | |
var dropNode = new Y.TreeNodeTask({ | |
alwaysShowHitArea: true, | |
children: [], | |
draggable: true, | |
expanded: false, | |
io: 'assets/solar-system.html', | |
label: 'Drop', | |
leaf: false | |
}); | |
var treeViewDD = new Y.TreeViewDD({ | |
boundingBox: '#treeio', | |
children: [dragNode, dropNode], | |
type: 'file' | |
}).render(); | |
}); | |
</script> | |
</body> | |
</html> |
@marc, I added context to the diff.
Hey @blzaugg, @marclundgren
I will create the AUI ticket tomorrow & send a pull. I wanted to create a very simple example (based on the existing "tree" demo) to demonstrate the bug in "poor" alloy, without categories and other stuffs.
As we (almost) always add descriptions to LPS tickets (like, "do this and this in the portal), it would also be nice to have for example, a simple JS/CSS example on every AUI ticket as well.
Well, see my https://gist.github.com/lipusz/0f9280029b303d469037#file-index-html
"dragNode", "dropNode" and "Solar System" nodes are loaded correctly, but the child nodes of solar are not. I cannot see any outgoing IO requests on the Network tab of Firebug. Nothing happens when I try to expand "solar". But when I change the 'url' to 'http://alloyui.com/io/data/content.html', I get "HTTP 405 Not allowed" :), which is more than nothing.
Can AUI/YUI IO handle requests that point to a local (file) resource at all? Or am I missing anything from the code?
My aim is to define lazy-loaded child nodes for the "dropNode".
Changing the value for the 'io' param to 'file://assets/solar-system.html' does not help. :-(
Note: I use "/home/tibusz/git/liferay-portal/portal-web/docroot/html/js/aui/aui/aui-min.js" because right now I don't have every dependencies of alloy-ui (like nvm, grunt etc.) installed in order to build aui.
node, grunt, etc. are easy to get installed and building AUI yourself will help you as well as us: https://github.com/liferay/alloy-ui#setup
I'm not sure about the local file usage.
I think, if aui-io does not support local file-based requests, we should update our demos. Still hoping it does...
I'll try to find external YUI examples. Somebody might have already achieved this. ;-)
About the project dependencies: yep, half of the packages are set in my linux, others are in my TODO queue. :-)
Will send email to keep you updated.
Thanks, Byran for helping me! +1
Meanwhile (and this was the last for "today"... it's 00:45 AM here :)) I replaced 'assets/solar-system.html' with 'https://raw.github.com/liferay/alloy-ui/2.0.x/demos/tree/assets/solar-system.html'.
Now I can see an XHR in the network panel, and despite the status is "404 Not Found", the response contains the right content. Weird.
But I'm still unable to expand "solar".... :)
TBC
io-request can locate local storage: https://github.com/liferay/alloy-ui/blob/master/demos/io/index.html
Hey @marclundgren,
That demo does not work either. I suspect this is a YUI limitation. Only plain XmlHttpRequest seems to work. Could anybody update those demos? They are totally useless in the current state.
Or blame me if I was wrong.
Finally, I could manage to get it work:
- Copied demos/io under ${TOMCAT_HOME}/webapps
- Modified the links to aui-min.js & bootstrap.min.css to point to
- http://cdn.alloyui.com/2.0.0pr7/aui/aui-min.js &
- http://cdn.alloyui.com/2.0.0pr7/aui-css/css/bootstrap.min.css
Then, I navigated to http://localhost:6211/io/index.html (where 6211 represents 6.2.x :) )
Voila, it works! :-)
Maybe these steps are trivial for cores, shouldn't we update our docs to contain a step-by-step guide about how-to run demos?
Or at least add some "usage notes" into the affected index.html files.
Hi Tibor:
Can AUI/YUI IO handle requests that point to a local (file) resource at all?
This isn't an AUI/YUI thing, this is a browser security policy. In order to run any ajax call (even XMLHttpRequest), you cannot point to the file system.
I don't know if you're on a mac or linux, but if you are, and have python (macs do by default, though not sure about linux), you can easily make a quick server to test out a demo. Just navigate to the directory and run this command:
python -m SimpleHTTPServer 8000
Just navigate to http://localhost:8000 and you're good to go :)
If you're on Windows, you have my condolences ;) and you might find something like ampss to be useful.
Hi @blzaugg @lipusz
We have an opportunity to clean up and simplify some logic in aui-tree-view.js
_afterDropHit
will appenddragTreeNode
todropTreeNode
ifinstance.dropAction === "append"
Who sets
instance.dropAction
to "append"?answer:
_appendState
Who calls
_appendState
?answer:
_updateNodeState
notice how
instance._appendState(nodeContent)
is wrapped in the conditional checksdropTreeNode && !dropTreeNode.isLeaf()
if (dropTreeNode && !dropTreeNode.isLeaf()) {
let's remove this redundancy either in
_updateNodeState
or_afterDropHit
@blzaugg
in your comment above, which
if
statement would thiselse
block belong to?@lipusz by inspection I don't see any negative affects of replacing the order of
dropTreeNode.expand()
anddropTreeNode.appendChild(dragTreeNode)
. Can you make the change and send a pull request if you feel like this is the proper fix?