new classes

4 files changed, 203 insertions, 82 deletions

diff --git a/qooxdoo/source/class/Smokeping/ui/Graph.js b/qooxdoo/source/class/Smokeping/ui/Graph.js
new file mode 100644
index 0000000..c1b8032
--- /dev/null
+++ b/qooxdoo/source/class/Smokeping/ui/Graph.js
@@ -0,0 +1,111 @@
+/* ************************************************************************
+#module(Smokeping)
+************************************************************************ */
+
+/**
+ * a widget showing the smokeping graph overview
+ */
+
+var default_width = null;
+var default_height = null;
+
+qx.Class.define('Smokeping.ui.Graph', 
+{
+    extend: qx.ui.layout.BoxLayout,        
+
+    /*
+    *****************************************************************************
+       CONSTRUCTOR
+    *****************************************************************************
+    */
+
+    /**
+     * @param base_url   {String}   Path to the location of the image generator
+     *
+     */
+
+    construct: function (src) {
+        with(this){
+			base(arguments);
+			if (default_width){
+				setWidth(default_width)
+			} 
+			else {
+	            setWidth('auto');
+			}
+			if (default_height){
+				setHeight(default_height);
+			}
+			else {
+				setHeight('auto');
+			};
+			setBorder(new qx.ui.core.Border(1));
+		    setHorizontalChildrenAlign('center');
+	        setVerticalChildrenAlign('middle');
+			_highlight();
+			var loader = new qx.ui.basic.Image(qx.io.Alias.getInstance().resolve('SP/image/ajax-loader.gif'));	
+    	    add(loader);
+			_preloader = qx.io.image.PreloaderManager.getInstance().create(src);
+			if (_preloader.isLoaded()){
+				qx.client.Timer.once(_image_loader,this,0);
+			} else {
+				_preloader.addEventListener('load', _image_loader, this);
+			}
+			addEventListener('mouseover',_highlight,this);
+			addEventListener('mouseout',_unhighlight,this);
+		}
+	},
+
+	members: {
+		_image_loader: function(e) {					
+			with(this){
+				default_width = _preloader.getWidth();
+				default_height = _preloader.getHeight();
+				_image = new qx.ui.basic.Image(_preloader.getSource());
+				_unhighlight();
+				removeAll()
+				add(_image);
+				addEventListener('click',_open_navigator,this);
+			}
+		},
+		_open_navigator: function(e){
+			with(this){
+				setEnabled(false);
+				_unhighlight();
+				_window = new Smokeping.ui.Navigator(_image);
+				_window.addToDocument();
+				_window.positionRelativeTo(getElement(),2,-4);
+				addEventListener('beforeDisappear',_kill_window,this);
+				_window.open();
+				_window.addEventListener('beforeDisappear',_close_window,this);
+			}
+		},
+		_close_window: function(e){
+			this.setEnabled(true);
+		},
+		_kill_window: function(e){
+			with(this){
+				_window.close();
+				_window.dispose();
+			}
+		},
+		_highlight: function(e){
+			this.setBackgroundColor('#f8f8f8');
+			with(this.getBorder()){
+				setStyle('dotted');
+				setColor('#808080');
+			}
+		},
+		_unhighlight: function(e){
+			this.setBackgroundColor('transparent');
+			with(this.getBorder()){
+				setStyle('solid');
+				setColor('transparent');
+			}			
+		},
+	}
+	
+
+});
+ 
+ 
diff --git a/qooxdoo/source/class/Smokeping/ui/GraphList.js b/qooxdoo/source/class/Smokeping/ui/GraphList.js
new file mode 100644
index 0000000..a7419dc
--- /dev/null
+++ b/qooxdoo/source/class/Smokeping/ui/GraphList.js
@@ -0,0 +1,55 @@
+/* ************************************************************************
+#module(Smokeping)
+************************************************************************ */
+
+/**
+ * a widget showing the smokeping graph overview
+ */
+
+qx.Class.define('Smokeping.ui.GraphList', 
+{
+    extend: qx.ui.layout.FlowLayout,        
+
+    /*
+    *****************************************************************************
+       CONSTRUCTOR
+    *****************************************************************************
+    */
+
+    /**
+     * @param base_url   {String}   Path to the location of the image generator
+     *
+     */
+
+    construct: function (url) {
+
+        with(this){
+			base(arguments);
+            setOverflow('scrollY');
+            setBackgroundColor('white');
+		    setBorder(new qx.ui.core.Border(1,'solid','#a0a0a0'));
+            setWidth('100%');
+            setHeight('100%');
+            setVerticalSpacing(10);
+            setHorizontalSpacing(10);
+			setPadding(10);
+        };
+		this._url = url;
+   		qx.event.message.Bus.subscribe('sp.menu.folder',this._load_graphs,this);
+    },
+
+	members: {
+		_load_graphs: function(m){
+			var files = m.getData()
+			this.removeAll();
+			for(var i=0;i<files.length;i++){
+   			   	var button = new Smokeping.ui.Graph(this._url + 'grapher.cgi?g=' + files[i]);
+				this.add(button);
+			}
+		}
+	}
+	
+
+});
+ 
+ 
diff --git a/qooxdoo/source/class/Smokeping/ui/Graphs.js b/qooxdoo/source/class/Smokeping/ui/Graphs.js
deleted file mode 100644
index 8a2502a..0000000
--- a/qooxdoo/source/class/Smokeping/ui/Graphs.js
+++ /dev/null
@@ -1,82 +0,0 @@
-/* ************************************************************************
-#module(Smokeping)
-************************************************************************ */
-
-/**
- * a widget showing the smokeping graph overview
- */
-
-qx.Class.define('Smokeping.ui.Graphs', 
-{
-    extend: qx.ui.layout.FlowLayout,        
-
-    /*
-    *****************************************************************************
-       CONSTRUCTOR
-    *****************************************************************************
-    */
-
-    /**
-     * @param base_url   {String}   Path to the location of the image generator
-     *
-     */
-
-    construct: function (url) {
-
-        with(this){
-			base(arguments,'root node');
-            setOverflow('scrollY');
-            setBackgroundColor('white');
-            setBorder('inset');
-            setWidth('100%');
-            setHeight('100%');
-            setVerticalSpacing(10);
-            setHorizontalSpacing(10);
-			setPadding(10);
-        };
-		var load_graphs = function(m){
-			var files = m.getData()
-			this.removeAll();
-			for(var i=0;i<files.length;i++){
-   			   	var button = new qx.ui.form.Button(null,qx.io.Alias.getInstance().resolve('SP/image/ajax-loader.gif'));
-				this.add(button);
-				button.addEventListener('execute',function(e){					
-					this.setEnabled(false);
-					var window = this.getUserData('window');					
-					window.positionRelativeTo(this.getElement(),2,-4);
-					window.open();
-				},button);
-
-				var preloader = qx.io.image.PreloaderManager.getInstance().create(url + 'grapher.cgi?g=' + files[i]);
-				preloader.setUserData('button',button); // it seems javascript does not do closures
-				preloader.addEventListener('load', function(e) {					
-					var button = this.getUserData('button');	/// so we use this to whisk the image into the event			
-					var image = button.getIconObject();
-					image.setSource(this.getSource());
-					qx.io.image.PreloaderManager.getInstance().remove(this);
-
-					var window = new Smokeping.ui.Navigator(image);
-					window.addToDocument();
-					window.addEventListener('beforeDisappear',function (e){
-						this.setEnabled(true);
-					},button);
-					button.setUserData('window',window);
-
-					// image.setWidth(preloader.getWidth()-10);
-		    		//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);
-    }
-
-
-});
- 
- 
diff --git a/qooxdoo/source/class/Smokeping/ui/Navigator.js b/qooxdoo/source/class/Smokeping/ui/Navigator.js
new file mode 100644
index 0000000..6247930
--- /dev/null
+++ b/qooxdoo/source/class/Smokeping/ui/Navigator.js
@@ -0,0 +1,37 @@
+/* ************************************************************************
+#module(Smokeping)
+************************************************************************ */
+
+/**
+ * The widget showing a detail graph
+ */
+
+qx.Class.define('Smokeping.ui.Navigator',
+{
+    extend: qx.ui.window.Window,        
+
+    /*
+    *****************************************************************************
+       CONSTRUCTOR
+    *****************************************************************************
+    */
+
+    /**
+     * @param graph_url   {String}   Url to the explorable graph
+     *
+     */
+
+    construct: function (image) {
+		with(this){
+			base(arguments,this.tr("Smokeping Graph Navigator"));
+			var plot = new qx.ui.basic.Image(image.getSource());			
+			setZIndex(100000);
+			add(plot);
+		}
+		
+    }
+
+
+});
+ 
+