1 files changed, 18 insertions, 55 deletions

diff --git a/app/components/plan-node/plan-node.ts b/app/components/plan-node/plan-node.ts
index 8aaab2c..fc865b8 100644
--- a/app/components/plan-node/plan-node.ts
+++ b/app/components/plan-node/plan-node.ts
@@ -1,8 +1,12 @@
 import {IPlan} from '../../interfaces/iplan';
 import {Component, OnInit} from 'angular2/core';
 import {HighlightType, EstimateDirection} from '../../enums';
+
 import {PlanService} from '../../services/plan-service';
 import {SyntaxHighlightService} from '../../services/syntax-highlight-service';
+import {HelpService} from '../../services/help-service';
+import {ColorService} from '../../services/color-service';
+
 /// <reference path="lodash.d.ts" />
 
 @Component({
@@ -10,7 +14,7 @@ import {SyntaxHighlightService} from '../../services/syntax-highlight-service';
     inputs: ['plan', 'node', 'viewOptions'],
     templateUrl: './components/plan-node/plan-node.html',
     directives: [PlanNode],
-    providers: [PlanService, SyntaxHighlightService]
+    providers: [PlanService, SyntaxHighlightService, HelpService, ColorService]
 })
 
 export class PlanNode {
@@ -44,7 +48,11 @@ export class PlanNode {
     estimateDirections = EstimateDirection;
     highlightTypes = HighlightType;
 
-    constructor(private _planService: PlanService, private _syntaxHighlightService: SyntaxHighlightService) { }
+    constructor(private _planService: PlanService,
+      private _syntaxHighlightService: SyntaxHighlightService,
+      private _helpService: HelpService,
+      private _colorService: ColorService)
+      {}
 
     ngOnInit() {
         this.currentHighlightType = this.viewOptions.highlightType;
@@ -67,9 +75,9 @@ export class PlanNode {
 
     getFormattedQuery() {
       var keyItems: Array<string> = [];
-      keyItems.push(this.node['Schema'] + '.' + this.node['Relation Name']);
-      keyItems.push(' ' + this.node['Relation Name'] + ' ');
-      keyItems.push(' ' + this.node['Alias'] + ' ');
+      keyItems.push(this.node[this._planService.SCHEMA_PROP] + '.' + this.node[this._planService.RELATION_NAME_PROP]);
+      keyItems.push(' ' + this.node[this._planService.RELATION_NAME_PROP] + ' ');
+      keyItems.push(' ' + this.node[this._planService.ALIAS_PROP] + ' ');
       return this._syntaxHighlightService.highlightKeyItems(this.plan.formattedQuery, keyItems);
     }
 
@@ -90,7 +98,7 @@ export class PlanNode {
         }
 
         if (this.width < 1) { this.width = 1 }
-        this.backgroundColor = this.numberToColorHsl(1 - this.width / this.MAX_WIDTH);
+        this.backgroundColor = this._colorService.numberToColorHsl(1 - this.width / this.MAX_WIDTH);
     }
 
     calculateDuration() {
@@ -112,7 +120,7 @@ export class PlanNode {
     // create an array of node propeties so that they can be displayed in the view
     calculateProps() {
         this.props = _.chain(this.node)
-            .omit('Plans')
+            .omit(this._planService.PLANS_PROP)
             .map((value, key) => {
                 return { key: key, value: value };
             })
@@ -135,52 +143,7 @@ export class PlanNode {
         }
     }
 
-    /**
-     * http://stackoverflow.com/questions/2353211/hsl-to-rgb-color-conversion
-     *
-     * Converts an HSL color value to RGB. Conversion formula
-     * adapted from http://en.wikipedia.org/wiki/HSL_color_space.
-     * Assumes h, s, and l are contained in the set [0, 1] and
-     * returns r, g, and b in the set [0, 255].
-     *
-     * @param   Number  h       The hue
-     * @param   Number  s       The saturation
-     * @param   Number  l       The lightness
-     * @return  Array           The RGB representation
-     */
-    hslToRgb(h, s, l) {
-        var r, g, b;
-
-        if (s == 0) {
-            r = g = b = l; // achromatic
-        } else {
-            function hue2rgb(p, q, t) {
-                if (t < 0) t += 1;
-                if (t > 1) t -= 1;
-                if (t < 1 / 6) return p + (q - p) * 6 * t;
-                if (t < 1 / 2) return q;
-                if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
-                return p;
-            }
-
-            var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
-            var p = 2 * l - q;
-            r = hue2rgb(p, q, h + 1 / 3);
-            g = hue2rgb(p, q, h);
-            b = hue2rgb(p, q, h - 1 / 3);
-        }
-
-        return [Math.floor(r * 255), Math.floor(g * 255), Math.floor(b * 255)];
-    }
-
-    // convert a number to a color using hsl
-    numberToColorHsl(i) {
-        // as the function expects a value between 0 and 1, and red = 0° and green = 120°
-        // we convert the input to the appropriate hue value
-        var hue = i * 100 * 1.2 / 360;
-        // we convert hsl to rgb (saturation 100%, lightness 50%)
-        var rgb = this.hslToRgb(hue, .9, .4);
-        // we format to css value and return
-        return 'rgb(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ')';
-    }
+    getNodeTypeDescription() {
+      return this._helpService.getNodeTypeDescription(this.node[this._planService.NODE_TYPE_PROP]);
+   }
 }