Changeset 43:d6288aa6ccea for source

Timestamp:

Jan 15, 2008, 7:19:03 PM (17 years ago)

Author:

fnevgeny

Branch:

default

Phase:

public

Message:

Added different (changeable) colors to the curves.

File:

• source/class/pf/Application.js (modified) (14 diffs)

source/class/pf/Application.js

@@ -517 +517 @@
     fav.entity  = leaf.getUserData("entity");
     fav.species = leaf.getUserData("species");
+    fav.color   = this.nextColor();
     this.favorites.push(fav);
     
@@ -523 +524 @@
     // ... and update the list of favorites
     this.updateFavoritesListView();
+    this.updateLegendListView();
 }
 
@@ -551 +553 @@
     // ... and update the list of favorites
     this.updateFavoritesListView();
+    this.updateLegendListView();
 }
 
@@ -642 +645 @@
             // Update the list of favorites
             this.updateFavoritesListView();
+            this.updateLegendListView();
         },
         
@@ -1031 +1035 @@
         },
 
+        updateLegendListView : function()
+        {
+            var lv = this.legendListView;
+            var rowData = lv.getData();
+            rowData.length = 0;
+            
+            var dimension = this.gui_compare_dim.getSelectedValue();
+            
+            for (var i = 0; i < this.favorites.length; i++) {
+                var fav = this.favorites[i];
+                var entity = fav.entity;
+                
+                if (entity.dimension != dimension) {
+                    continue;
+                }
+                
+                var species = fav.species;
+
+                var icon;
+                if (species) {
+                    icon = "pf/image/" + species.id + "_small.png";
+                } else {
+                    icon = "pf/image/all_small.png";
+                }
+                var name  = this.getEntityFullName(entity, species);
+                var color = fav.color;
+
+                rowData.push({ s_icon   : {icon       : icon,
+                                           iconWidth  : 16, 
+                                           iconHeight : 16    },
+                               name     : {text       : name  },
+                               color    : {text       : color,
+                                           textColor  : color },
+                               favorite : fav
+                             });
+            }
+            lv.update();
+        },
+
 
         renderTabPage : function(label, icon, checked)
@@ -1453 +1496 @@
                     this.gui_compare_units.update(dimension);
                     this.updateFavoritesListView();
+                    this.updateLegendListView();
                 }, this);
             rc.add(l, e);
@@ -1617 +1661 @@
                 set.y = ydata;
                 set.legend = vname;
+                set.color = fav.color;
                 sets.push(set);
             }
@@ -1678 +1723 @@
             
             // Draw sets
-            canvas.setColor("red");
             for (var i = 0; i < sets.length; i++) {
                 var set = sets[i];
+                canvas.setColor(set.color);
                 canvas.drawPolyLineW(set.x, set.y);
                 
@@ -1716 +1761 @@
 
             var canvas = new pf.ui.canvas.Plotter();
-            canvas.setBackgroundColor("white");
-            canvas.setWidth("100%");
-            canvas.setHeight("100%");
+            canvas.set(
+            {
+                height          : "100%",
+                width           : "100%",
+                border          : "inset-thin",
+                backgroundColor : "white"
+            });
             left_pane.add(canvas);
             this.canvas = canvas;
 
 
+            var vbl = new qx.ui.layout.VerticalBoxLayout("vertical");
+            vbl.set(
+            {
+                height          : "100%",
+                width           : "100%",
+                border          : "inset-thin",
+                padding         : 4,
+                spacing         : 10,
+                backgroundColor : "white"
+            });
+            right_pane.add(vbl);
+
             var gl = new qx.ui.layout.GridLayout;
-            gl.set(
-            {
-                left:   4,
-                right:  4,
-                top:    4
-            });
             
             gl.setVerticalSpacing(4);
@@ -1742 +1797 @@
             gl.setRowHeight(3, 30);
             gl.setRowHeight(4, 30);
-            right_pane.add(gl);
+            gl.setHeight("auto");
+            vbl.add(gl);
 
             var l, e;
@@ -1748 +1804 @@
             var btn = new qx.ui.form.Button("Redraw", "pf/image/tab-plot.png");
             btn.addEventListener("execute", this.drawCB, this);
-            btn.setTop(20);
-            btn.setLeft(20);
             gl.add(btn, 0, 0);
 
@@ -1782 +1836 @@
             gl.add(l, 0, 4);
             gl.add(e, 1, 4);
+
+
+            var lc =
+            {
+                s_icon   : { label      : "",
+                             width      : 24,
+                             type       : "iconHtml",
+                             align      : "center",                    
+                             sortable   : false                         },
+                name     : { label      : "Name",
+                             width      : 185,
+                             type       : "text",
+                             align      : "left",
+                             sortable   : true,
+                             sortProp   : "text"                        },
+                color    : { label      : "Color",
+                             width      : 55,
+                             type       : "text",
+                             align      : "left",
+                             sortable   : false                         }
+            };
+
+            var lv = new qx.ui.listview.ListView(new Array, lc);
+
+            lv.setWidth("100%");
+            lv.setHeight("2*");
+            // lv.setBackgroundColor("white");
+            lv.setBorder("dark-shadow");
+            
+            lv.addEventListener("dblclick", function(ev) {
+                    ev.setPropagationStopped(true);
+                    var pane = this.getPane();
+                    var item = pane.getSelectedItem();
+                    if (!item) {
+                        return;
+                    }
+                    var favorite = item.favorite;
+                    if (!favorite) {
+                        return;
+                    }
+                    mypop.setUserData("favorite", null); // avoid loop call
+                    mypop.setValue(favorite.color);
+                    mypop.setUserData("favorite", favorite);
+                    var el = this.getElement();
+                    mypop.setTop(qx.html.Location.getPageBoxTop(el));
+                    mypop.setLeft(qx.html.Location.getPageBoxLeft(el) -
+                        this.getWidthValue());
+                    mypop.show();
+                });
+
+            vbl.add(lv);
+            this.legendListView = lv;
+            
+            var mytables =
+            {
+              core : {
+                label : "Basic Colors",
+                values : this.colorMap
+              },
+
+              recent : {
+                label : "Recent Colors",
+                values : [ ]
+              }
+            }
+
+            var mypop = new qx.ui.component.ColorPopup(mytables);
+            // A hack
+            mypop._layout.remove(mypop._automaticBtn);
+
+            mypop.addToDocument();
+
+            mypop.addEventListener("changeValue", function(ev) {
+                var color = ev.getValue();
+                var mypop = ev.getTarget();
+                var favorite = mypop.getUserData("favorite");
+                if (!favorite || !color) {
+                    return;
+                }
+                favorite.color = color;
+                this.updateLegendListView();
+            }, this);
+    
         },
 
@@ -1924 +2061 @@
             menubar.add(btn);
         },
+        
+        nextColor : function()
+        {
+            var color = this.colorMap[this.ncolor];
+            this.ncolor++;
+            if (this.ncolor == this.colorMap.length) {
+                this.ncolor = 0;
+            }
+            
+            return color;
+        },
 
         /**
@@ -1961 +2109 @@
             // Favorites
             this.favorites = new Array;
+            
+            this.colorMap = new Array("red", "blue", "green", "orange",
+                "brown", "olive", "teal", "magenta", "grey", "black");
+            this.ncolor = 0;
 
             // Top-level container