[Zope3-checkins] CVS: Zope3/src/zope/app/browser/skins/rotterdam - template.pt:1.11 xmltree.js:1.9 zope3.css:1.10
Godefroid Chapelle
gotcha@swing.be
Tue, 14 Jan 2003 17:03:39 -0500
Update of /cvs-repository/Zope3/src/zope/app/browser/skins/rotterdam
In directory cvs.zope.org:/tmp/cvs-serv8188
Modified Files:
template.pt xmltree.js zope3.css
Log Message:
implemented asynchronous tree load
hoping it would remove double Mozilla request
but no luck
=== Zope3/src/zope/app/browser/skins/rotterdam/template.pt 1.10 => 1.11 ===
--- Zope3/src/zope/app/browser/skins/rotterdam/template.pt:1.10 Mon Jan 13 11:06:27 2003
+++ Zope3/src/zope/app/browser/skins/rotterdam/template.pt Tue Jan 14 17:03:36 2003
@@ -68,7 +68,7 @@
id="navtreecontents"
class="body"
onclick="treeclicked(event);"
- >
+ >Loading...
</div>
</div>
=== Zope3/src/zope/app/browser/skins/rotterdam/xmltree.js 1.8 => 1.9 ===
--- Zope3/src/zope/app/browser/skins/rotterdam/xmltree.js:1.8 Thu Jan 9 11:48:52 2003
+++ Zope3/src/zope/app/browser/skins/rotterdam/xmltree.js Tue Jan 14 17:03:36 2003
@@ -30,6 +30,7 @@
this.isEmpty = 1;
this.isCollapsed = 1;
this.domNode = domNode;
+ this.loadingNode = null;
this.path = '';
this.parentNode = null;
}
@@ -81,13 +82,22 @@
prettydump('toggleExpansion', LG_TRACE);
// If this collection is empty, load it from server
// todo xxx optimize for the case where collection has null length
- var elem = domNode;
if (isEmpty) {
+ loadingNode = createLoadingNode();
+ domNode.appendChild(loadingNode);
var url = baseurl + path + XML_CHILDREN_VIEW;
- var data = loadtreexml(url);
- addNavigationTreeNodes(data, this, 0);
- isEmpty = 0;
+ loadtreexml(url, this);
}
+ else
+ {
+ refreshExpansion();
+ }
+
+ }
+}
+
+navigationTreeNode.prototype.refreshExpansion = function() {
+with (this) {
if (isCollapsed) {
expand();
showChildren();
@@ -97,7 +107,8 @@
hideChildren();
}
}
-}
+}
+
navigationTreeNode.prototype.hideChildren = function() {
with (this) {
@@ -264,20 +275,24 @@
return;
};
-
-function loadHandler () {
- // process document with dom methods
- alert(this.documentElement.nodeName);
- }
-
-function loadtreexml (url) {
+function loadtreexml (url, node) {
var xmlHttp = XmlHttp.create();
if (xmlHttp) {
- xmlHttp.open('GET', url, false);
- xmlHttp.send(null);
- prettydump('Response XML ' + xmlHttp.responseText, LG_INFO);
- var data = xmlHttp.responseXML.documentElement;
- return data;
+ prettydump('URL ' + url, LG_INFO);
+ xmlHttp.open('GET', url, true);
+
+
+ xmlHttp.onreadystatechange = function () {
+ if (xmlHttp.readyState == 4) {
+ prettydump('Response XML ' + xmlHttp.responseText, LG_INFO);
+ parseXML(xmlHttp.responseXML, node);
+ }
+ };
+
+ // call in new thread to allow ui to update
+ window.setTimeout(function () {
+ xmlHttp.send(null);
+ }, 10);
}
else {
}
@@ -287,15 +302,39 @@
baseurl = rooturl; // Global baseurl
var url = thisbaseurl + SINGLE_BRANCH_TREE_VIEW;
- var data = loadtreexml(url);
- if (data) {
- var docNavTree = document.getElementById('navtreecontents');
- addNavigationTreeNodes(data, null, 1);
- docNavTree.appendChild(navigationTree.domNode);
+ loadtreexml(url, null);
+ }
+
+
+function removeChildren(node) {
+ var items = node.childNodes;
+ var numitems = items.length;
+ for (var i = 0; i < numitems; i++) {
+ node.removeChild(items[i]);
}
}
+function parseXML(responseXML, node) {
+ if (responseXML) {
+ var data = responseXML.documentElement;
+ if (node == null) {
+ //[top] node
+ var docNavTree = document.getElementById('navtreecontents');
+ removeChildren(docNavTree);
+ addNavigationTreeNodes(data, null, 1);
+ docNavTree.appendChild(navigationTree.domNode);
+ }
+ else {
+ //expanding nodes
+ addNavigationTreeNodes(data, node, 0);
+ node.isEmpty = 0;
+ node.refreshExpansion();
+ node.domNode.removeChild(node.loadingNode);
+ }
+ }
+ }
+
function addNavigationTreeNodes(sourceNode, targetNavTreeNode, deep) {
// create tree nodes from XML children nodes of sourceNode
// and add them to targetNode
@@ -323,7 +362,7 @@
var iconElem = document.createElement('icon');
expandElem.appendChild(iconElem);
iconElem.style.backgroundImage = 'url("' + icon_url + '")';
- // create title
+ // create link
var linkElem = document.createElement('a');
var titleTextNode = document.createTextNode(title);
@@ -334,6 +373,16 @@
iconElem.appendChild(linkElem);
return expandElem;
+ }
+
+function createLoadingNode() {
+ var loadingElem = document.createElement('loading');
+ //XXX should not hardcode loading string
+ var titleTextNode = document.createTextNode('Loading...');
+
+ loadingElem.appendChild(titleTextNode);
+
+ return loadingElem;
}
function createNavigationTreeNode(source, basePath, deep) {
=== Zope3/src/zope/app/browser/skins/rotterdam/zope3.css 1.9 => 1.10 ===
--- Zope3/src/zope/app/browser/skins/rotterdam/zope3.css:1.9 Thu Jan 9 11:48:52 2003
+++ Zope3/src/zope/app/browser/skins/rotterdam/zope3.css Tue Jan 14 17:03:36 2003
@@ -234,6 +234,12 @@
height: 18px;
}
+#navtreecontents loading {
+ display: block;
+ padding-left: 31px;
+ height: 18px;
+}
+
#navtreecontents expand {
background-repeat: no-repeat;
padding-left: 14px;