working version

4 files changed, 69 insertions, 87 deletions

diff --git a/qooxdoo/source/class/Smokeping/Application.js b/qooxdoo/source/class/Smokeping/Application.js
index 6578393..29bb685 100644
--- a/qooxdoo/source/class/Smokeping/Application.js
+++ b/qooxdoo/source/class/Smokeping/Application.js
@@ -17,6 +17,10 @@ qx.Class.define(
             var self=this;
             this.base(arguments);
 
+	        qx.io.Alias.getInstance().add(
+    	       'SP', qx.core.Setting.get('Smokeping.resourceUri')
+        	);
+
   			// this will provide access to the server side of this app
 			var rpc = new Smokeping.io.Rpc('http://localhost/~oetiker/smq/');
             
@@ -47,12 +51,6 @@ qx.Class.define(
  		    var tree = new Smokeping.ui.TargetTree(rpc);
 	        splitpane.addLeft(tree);
 
-			tree.getManager().addEventListener("changeSelection", function(e) {
-				if (e.getData().length > 0) {
-		            this.debug(e.getData()[0].getUserData('id'));
-				}
-			},this);
-
 			var graphs = new Smokeping.ui.Graphs(rpc.getBaseUrl());
 			splitpane.addRight(graphs);
 
@@ -68,23 +66,12 @@ qx.Class.define(
 			
 		terminate : function(e) {
 			this.base(arguments);
-		},
+		}
 
         /********************************************************************
          * Functional Block Methods
          ********************************************************************/
 
-        /**
-        * Get the base url of this page
-        *
-        * @return {String} the base url of the page
-        */
-
-        __getBaseUrl: function() {
-            var our_href = new String(document.location.href);
-            var last_slash = our_href.lastIndexOf("/");
-            return our_href.substring(0,last_slash+1);   
-        }
     },
 		
 
diff --git a/qooxdoo/source/class/Smokeping/ui/Graphs.js b/qooxdoo/source/class/Smokeping/ui/Graphs.js
index 9508eee..7a9fb83 100644
--- a/qooxdoo/source/class/Smokeping/ui/Graphs.js
+++ b/qooxdoo/source/class/Smokeping/ui/Graphs.js
@@ -32,56 +32,39 @@ qx.Class.define('Smokeping.ui.Graphs',
             setHeight('100%');
             setVerticalSpacing(10);
             setHorizontalSpacing(10);
+			setPadding(10);
         };
-        for(var i=0;i<2000;i++){
-            var button = new qx.ui.basic.Atom(i.toString());
-            this.add(button);
-        }
-    },
-
-    /*
-    *****************************************************************************
-     Statics
-    *****************************************************************************
-    */
-
-    statics :
-    {
-
-		/*
-        ---------------------------------------------------------------------------
-        CORE METHODS
-        ---------------------------------------------------------------------------
-        */
-
-        /**
-         * Create the tree based on input from the Server
-         *
-         * @type member
-		 *
-         * @param {void}
-         *
-		 * @return BaseUrl {Strings}
-		 */
 
+		var load_graphs = function(m){
+			var files = m.getData()
+			this.removeAll();
+			for(var i=0;i<files.length;i++){
+				this.debug('adding '+files[i])
+   			   	var button = new qx.ui.form.Button(null,qx.io.Alias.getInstance().resolve('SP/image/ajax-loader.gif'));
+				this.add(button);
+				var image = button.getIconObject();
+				var preloader = qx.io.image.PreloaderManager.getInstance().create(url + 'grapher.cgi?g=' + files[i]);
+				preloader.setUserData('image',image); // it seems javascript does not do closures
+				preloader.addEventListener('load', function(e) {
+					var image = this.getUserData('image');	/// so we use this to whisk the image into the event			
+					// image.setWidth(preloader.getWidth()-10);
+					this.debug('load image event: '+preloader.getSource());
+					image.setPreloader(this);
+					qx.io.image.PreloaderManager.getInstance().remove(this);
+		    		//if (image.isLoaded()) {
+					//	this.debug('outer '+image.getOuterHeight());
+					//	this.debug('inner '+image.getInnerHeight());
+					//	this.debug('box '+image.getBoxHeight());
+				    //	this.debug('prefinner '+image.getPreferredInnerHeight());
+					//	this.debug('prefbox '+image.getPreferredBoxHeight());
+				},preloader);
+			}
+		};
+                    
+		qx.event.message.Bus.subscribe('sp.menu.folder',load_graphs,this);
+    }
 
-        __fill_folder: function(node,data){
-			// in data[0] we have the id of the folder
-			var folder = new qx.ui.tree.TreeFolder(data[1]);
-			node.add(folder);
-			var length = data.length;
-			for (var i=2;i<length;i++){
-				if(qx.util.Validation.isValidArray(data[i])){
-					Smokeping.ui.TargetTree.__fill_folder(folder,data[i]);
-				} else {
-					i++; // skip the node id for now
-					var file = new qx.ui.tree.TreeFile(data[i]);		
-					folder.add(file);
-				}
-			}			
-		}
 
-    }
 });
  
  
diff --git a/qooxdoo/source/class/Smokeping/ui/TargetTree.js b/qooxdoo/source/class/Smokeping/ui/TargetTree.js
index 6d72ad1..d335361 100644
--- a/qooxdoo/source/class/Smokeping/ui/TargetTree.js
+++ b/qooxdoo/source/class/Smokeping/ui/TargetTree.js
@@ -29,7 +29,7 @@ qx.Class.define('Smokeping.ui.TargetTree',
 			base(arguments,'root node');
             setBackgroundColor('white');
             setBorder('inset');
-//			setOverflow('scrollY');
+			setOverflow('scrollY');
             setWidth('100%'); 
             setHeight('100%');
             setPadding(5);
@@ -50,6 +50,14 @@ qx.Class.define('Smokeping.ui.TargetTree',
 			}				
         };
 
+        this.getManager().addEventListener('changeSelection', function(e) {
+            if (e.getData().length > 0) {
+				if ( e.getData()[0].basename == 'TreeFolder' ){
+					qx.event.message.Bus.dispatch('sp.menu.folder',e.getData()[0].getUserData('ids'));
+				}
+            }
+        },this);
+
         rpc.callAsync(fill_tree,'get_tree');		
     },
 
@@ -82,8 +90,8 @@ qx.Class.define('Smokeping.ui.TargetTree',
         __fill_folder: function(node,data){
 			// in data[0] we have the id of the folder
 			var folder = new qx.ui.tree.TreeFolder(data[1]);
-			folder.setUserData('id',data[0]);
 			node.add(folder);
+			var files = new Array();
 			var length = data.length;
 			for (var i=2;i<length;i++){
 				if(qx.util.Validation.isValidArray(data[i])){
@@ -91,10 +99,11 @@ qx.Class.define('Smokeping.ui.TargetTree',
 				} else {
 					i++; // skip the node id for now
 					var file = new qx.ui.tree.TreeFile(data[i]);		
-					file.setUserData('id',data[i-1]);
+					files[files.length] = data[i-1];
 					folder.add(file);
 				}
 			}			
+			folder.setUserData('ids',files);
 		}
 
     }
diff --git a/qooxdoo/source/script/Smokeping.js b/qooxdoo/source/script/Smokeping.js
index 35d0cad..f462541 100644
--- a/qooxdoo/source/script/Smokeping.js
+++ b/qooxdoo/source/script/Smokeping.js
@@ -106,26 +106,6 @@ if(!window.qxvariants)qxvariants={};\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/io/image/PreloaderManager.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/io/image/Preloader.js"></script>\
 <script type="text/javascript" src="./class/Smokeping/Application.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/BoxLayout.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/impl/VerticalBoxLayoutImpl.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/util/Validation.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/impl/HorizontalBoxLayoutImpl.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/AbstractTreeElement.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/TreeRowStructure.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/embed/HtmlEmbed.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/basic/Image.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/basic/Label.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/Manager.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/LocalizedString.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/dom/Element.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/TreeFile.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/TreeFolder.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/Tree.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/selection/SelectionManager.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/selection/Selection.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/SelectionManager.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/HorizontalBoxLayout.js"></script>\
-<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/VerticalBoxLayout.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/io/remote/Rpc.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/net/Http.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/util/Mime.js"></script>\
@@ -141,7 +121,17 @@ if(!window.qxvariants)qxvariants={};\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/html/Iframe.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/io/remote/ScriptTransport.js"></script>\
 <script type="text/javascript" src="./class/Smokeping/io/Rpc.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/BoxLayout.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/impl/VerticalBoxLayoutImpl.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/util/Validation.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/impl/HorizontalBoxLayoutImpl.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/VerticalBoxLayout.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/basic/Atom.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/basic/Label.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/Manager.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/LocalizedString.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/dom/Element.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/basic/Image.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/splitpane/SplitPane.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/splitpane/SplitPaneSlider.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/splitpane/SplitPaneSplitter.js"></script>\
@@ -151,10 +141,23 @@ if(!window.qxvariants)qxvariants={};\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/bom/element/Dimension.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/bom/Document.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/splitpane/HorizontalSplitPane.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/AbstractTreeElement.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/TreeRowStructure.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/embed/HtmlEmbed.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/TreeFolder.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/Tree.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/selection/SelectionManager.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/selection/Selection.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/SelectionManager.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/tree/TreeFile.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/HorizontalBoxLayout.js"></script>\
 <script type="text/javascript" src="./class/Smokeping/ui/TargetTree.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/event/message/Bus.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/event/message/Message.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/FlowLayout.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/layout/impl/FlowLayoutImpl.js"></script>\
 <script type="text/javascript" src="./class/Smokeping/ui/Graphs.js"></script>\
+<script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/ui/form/Button.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/Locale.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/data/C.js"></script>\
 <script type="text/javascript" src="../qooxdoolink/frontend/framework/source/class/qx/locale/data/en.js"></script>\