several bugfixes and improvements

eclipse-cdt-cloud · Jan 21, 2019 · dafa50d · dafa50d
1 parent 08342b9
commit dafa50d
Show file tree

Hide file tree

Showing 6 changed files with 73 additions and 5,221 deletions.
diff --git a/timeline-chart/package.json b/timeline-chart/package.json
@@ -3,12 +3,15 @@
   "version": "0.0.2",
   "scripts": {
     "build": "tsc",
-    "watch": "tsc --watch"
+    "watch": "tsc --watch",
+    "prepare": "yarn run clean && yarn run build",
+    "clean": "rimraf lib"
   },
   "dependencies": {
     "@types/lodash.throttle": "^4.1.4",
     "@types/pixi.js": "^4.8.2",
     "lodash.throttle": "^4.1.1",
-    "pixi.js": "^4.8.2"
+    "pixi.js": "^4.8.2",
+    "rimraf": "latest"
   }
 }
diff --git a/timeline-chart/src/components/time-graph-axis-scale.ts b/timeline-chart/src/components/time-graph-axis-scale.ts
@@ -60,31 +60,33 @@ export class TimeGraphAxisScale extends TimeGraphComponent {
     }
 
     protected renderVerticalLines(lineHeight: number, lineColor: number) {
-        const stepLength = this.getStepLength();
-        const steps = Math.trunc(this.unitController.absoluteRange / stepLength) + 1;
-        for (let i = 0; i < steps; i++) {
-            const absolutePosition = stepLength * i;
-            const xpos = (absolutePosition - this.unitController.viewRange.start) * this.stateController.zoomFactor;
-            if (xpos >= 0 && xpos < this.stateController.canvasDisplayWidth) {
-                const position = {
-                    x: xpos,
-                    y: this._options.height
-                };
-                if (this.unitController.numberTranslator) {
-                    const label = this.unitController.numberTranslator(absolutePosition);
-                    const text = new PIXI.Text(label, {
-                        fontSize: 10
+        if (this.unitController.viewRangeLength > 0) {
+            const stepLength = this.getStepLength();
+            const steps = Math.trunc(this.unitController.absoluteRange / stepLength) + 1;
+            for (let i = 0; i < steps; i++) {
+                const absolutePosition = stepLength * i;
+                const xpos = (absolutePosition - this.unitController.viewRange.start) * this.stateController.zoomFactor;
+                if (xpos >= 0 && xpos < this.stateController.canvasDisplayWidth) {
+                    const position = {
+                        x: xpos,
+                        y: this._options.height
+                    };
+                    if (this.unitController.numberTranslator) {
+                        const label = this.unitController.numberTranslator(absolutePosition);
+                        const text = new PIXI.Text(label, {
+                            fontSize: 10
+                        });
+                        text.x = position.x + 5;
+                        text.y = this._options.height - (2 * lineHeight);
+                        this.labels.push(text);
+                        this._displayObject.addChild(text);
+                    }
+                    this.vline({
+                        position,
+                        height: lineHeight * (-1),
+                        color: lineColor
                     });
-                    text.x = position.x + 5;
-                    text.y = this._options.height - (2 * lineHeight);
-                    this.labels.push(text);
-                    this._displayObject.addChild(text);
                 }
-                this.vline({
-                    position,
-                    height: lineHeight * (-1),
-                    color: lineColor
-                });
             }
         }
     }

diff --git a/timeline-chart/src/layer/time-graph-chart.ts b/timeline-chart/src/layer/time-graph-chart.ts
@@ -102,12 +102,14 @@ export class TimeGraphChart extends TimeGraphChartLayer {
 
         this.unitController.onViewRangeChanged(() => {
             this.updateScaleAndPosition();
-            if (!this.fetching) {
+            if (!this.fetching && this.unitController.viewRangeLength !== 0) {
                 this.maybeFetchNewData();
             }
         });
-        this.updateScaleAndPosition();
-        this.maybeFetchNewData();
+        if (this.unitController.viewRangeLength) {
+            this.updateScaleAndPosition();
+            this.maybeFetchNewData();
+        }
     }
 
     update() { }

diff --git a/timeline-chart/src/layer/time-graph-vertical-scrollbar.ts b/timeline-chart/src/layer/time-graph-vertical-scrollbar.ts
@@ -16,10 +16,23 @@ export class TimeGraphVerticalScrollbar extends TimeGraphChartLayer {
     }
 
     protected afterAddToContainer() {
-        this.factor = this.stateController.canvasDisplayHeight / this.rowController.totalHeight;
+        this.updateFactor();
         this.navigatorHandle = new TimeGraphVerticalScrollbarHandle(this.rowController, this.stateController, this.factor);
         this.addChild(this.navigatorHandle);
         this.rowController.onVerticalOffsetChangedHandler(() => this.update());
+        this.rowController.onTotalHeightChangedHandler(() => {
+            this.updateFactor();
+            this.navigatorHandle.updateFactor(this.factor);
+            this.update()
+        });
+    }
+
+    protected updateFactor() {
+        if (this.rowController.totalHeight) {
+            this.factor = this.stateController.canvasDisplayHeight / this.rowController.totalHeight;
+        } else {
+            this.factor = 0;
+        }
     }
 
     update() {
@@ -49,7 +62,7 @@ export class TimeGraphVerticalScrollbarHandle extends TimeGraphComponent {
                 const delta = event.data.global.y - this.mouseStartY;
                 let ypos = this.oldVerticalOffset + delta;
                 if (ypos >= 0 && (ypos + this.height) <= this.stateController.canvasDisplayHeight) {
-                    this.rowController.verticalOffset = ypos/this.factor;
+                    this.rowController.verticalOffset = ypos / this.factor;
                 }
             }
         }, this._displayObject);
@@ -60,6 +73,10 @@ export class TimeGraphVerticalScrollbarHandle extends TimeGraphComponent {
         this.addEvent('mouseupoutside', moveEnd, this._displayObject);
     }
 
+    updateFactor(factor: number){
+        this.factor = factor;
+    }
+
     render(): void {
         this.position = { x: 0, y: this.rowController.verticalOffset * this.factor };
         this.height = this.stateController.canvasDisplayHeight * this.factor;

diff --git a/timeline-chart/src/time-graph-row-controller.ts b/timeline-chart/src/time-graph-row-controller.ts
@@ -5,8 +5,9 @@ export class TimeGraphRowController {
     private _verticalOffset: number;
     protected selectedRowChangedHandlers: ((row: TimelineChart.TimeGraphRowModel) => void)[] = [];
     protected verticalOffsetChangedHandlers: ((verticalOffset: number) => void)[] = [];
+    protected totalHeightChangedHandlers: ((totalHeight: number) => void)[] = [];
 
-    constructor(public rowHeight: number, public totalHeight: number) {
+    constructor(public rowHeight: number, private _totalHeight: number) {
         this._verticalOffset = 0;
     }
 
@@ -18,6 +19,10 @@ export class TimeGraphRowController {
         this.selectedRowChangedHandlers.forEach(h=>h(this._selectedRow));
     }
 
+    protected handleTotalHeightChanged(){
+        this.totalHeightChangedHandlers.forEach(h=>h(this._totalHeight));
+    }
+
     onSelectedRowChangedHandler(handler: (row: TimelineChart.TimeGraphRowModel) => void) {
         this.selectedRowChangedHandlers.push(handler);
     }
@@ -26,6 +31,19 @@ export class TimeGraphRowController {
         this.verticalOffsetChangedHandlers.push(handler);
     }
 
+    onTotalHeightChangedHandler(handler: (totalHeight: number) =>  void) {
+        this.totalHeightChangedHandlers.push(handler);
+    }
+
+    get totalHeight(): number {
+        return this._totalHeight;
+    }
+
+    set totalHeight(height: number) {
+        this._totalHeight = height;
+        this.handleTotalHeightChanged();
+    }
+
     get verticalOffset(): number {
         return this._verticalOffset;
     }