Merge branch 'master' into set-width-hideallcolumns-master

Author: kdinev

package-lock.json

@@ -45,14 +45,14 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^9.0.0-rc.5",
-    "@angular/common": "^9.0.0-rc.5",
-    "@angular/compiler": "^9.0.0-rc.5",
-    "@angular/core": "^9.0.0-rc.5",
-    "@angular/forms": "^9.0.0-rc.5",
-    "@angular/platform-browser": "^9.0.0-rc.5",
-    "@angular/platform-browser-dynamic": "^9.0.0-rc.5",
-    "@angular/router": "^9.0.0-rc.5",
+    "@angular/animations": "^9.0.0-rc.7",
+    "@angular/common": "^9.0.0-rc.7",
+    "@angular/compiler": "^9.0.0-rc.7",
+    "@angular/core": "^9.0.0-rc.7",
+    "@angular/forms": "^9.0.0-rc.7",
+    "@angular/platform-browser": "^9.0.0-rc.7",
+    "@angular/platform-browser-dynamic": "^9.0.0-rc.7",
+    "@angular/router": "^9.0.0-rc.7",
     "@types/hammerjs": "^2.0.36",
     "@types/source-map": "0.5.2",
     "classlist.js": "^1.1.20150312",
@@ -66,12 +66,12 @@
     "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.900.0-rc.5",
-    "@angular-devkit/build-ng-packagr": "~0.900.0-rc.5",
+    "@angular-devkit/build-angular": "~0.900.0-rc.7",
+    "@angular-devkit/build-ng-packagr": "~0.900.0-rc.7",
     "@angular-devkit/schematics": "^7.2.1",
-    "@angular/cli": "~9.0.0-rc.5",
-    "@angular/compiler-cli": "^9.0.0-rc.5",
-    "@angular/language-service": "^9.0.0-rc.5",
+    "@angular/cli": "~9.0.0-rc.7",
+    "@angular/compiler-cli": "^9.0.0-rc.7",
+    "@angular/language-service": "^9.0.0-rc.7",
     "@angularclass/hmr": "^2.1.3",
     "@types/jasmine": "~3.3.5",
     "@types/jasminewd2": "~2.0.6",

package.json

@@ -211,6 +211,14 @@ export class DataUtil {
         return data;
     }
 
+    public static parseValue(dataType: DataType, value: any): any {
+        if (dataType === DataType.Number) {
+            value = parseFloat(value);
+        }
+
+        return value;
+    }
+
     private static findParentFromPath(data: any[], primaryKey: any, childDataKey: any, path: any[]): any {
         let collection: any[] = data;
         let result: any;

projects/igniteui-angular/src/lib/data-operations/data-util.ts

@@ -563,33 +563,25 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
     }
 
     protected set ghostLeft(pageX: number) {
-        // To Do: Remove requestAnimationFrame when deprecated animations inputs are removed as well.
-        // We use requestAnimationFrame for the old drop animations in combination with updateDragRelativePos.
-        requestAnimationFrame(() => {
-            if (this.ghostElement) {
-                // We need to take into account marginLeft, since top style does not include margin, but pageX includes the margin.
-                const ghostMarginLeft = parseInt(document.defaultView.getComputedStyle(this.ghostElement)['margin-left'], 10);
-                // If ghost host is defined it needs to be taken into account.
-                this.ghostElement.style.left = (pageX - ghostMarginLeft - this._ghostHostX) + 'px';
-            }
-        });
+        if (this.ghostElement) {
+            // We need to take into account marginLeft, since top style does not include margin, but pageX includes the margin.
+            const ghostMarginLeft = parseInt(document.defaultView.getComputedStyle(this.ghostElement)['margin-left'], 10);
+            // If ghost host is defined it needs to be taken into account.
+            this.ghostElement.style.left = (pageX - ghostMarginLeft - this._ghostHostX) + 'px';
+        }
     }
 
     protected get ghostLeft() {
         return parseInt(this.ghostElement.style.left, 10) + this._ghostHostX;
     }
 
     protected set ghostTop(pageY: number) {
-        // To Do: Remove requestAnimationFrame when deprecated animations inputs are removed as well.
-        // We use requestAnimationFrame for the old drop animations in combination with updateDragRelativePos.
-        requestAnimationFrame(() => {
-            if (this.ghostElement) {
-                // We need to take into account marginTop, since top style does not include margin, but pageY includes the margin.
-                const ghostMarginTop = parseInt(document.defaultView.getComputedStyle(this.ghostElement)['margin-top'], 10);
-                // If ghost host is defined it needs to be taken into account.
-                this.ghostElement.style.top = (pageY - ghostMarginTop - this._ghostHostY) + 'px';
-            }
-        });
+        if (this.ghostElement) {
+            // We need to take into account marginTop, since top style does not include margin, but pageY includes the margin.
+            const ghostMarginTop = parseInt(document.defaultView.getComputedStyle(this.ghostElement)['margin-top'], 10);
+            // If ghost host is defined it needs to be taken into account.
+            this.ghostElement.style.top = (pageY - ghostMarginTop - this._ghostHostY) + 'px';
+        }
     }
 
     protected get ghostTop() {
@@ -611,10 +603,6 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
      */
     public animInProgress = false;
 
-    protected _baseMarginLeft = 0;
-    protected _baseMarginTop = 0;
-    protected _baseOriginX;
-    protected _baseOriginY;
     protected _startX = 0;
     protected _startY = 0;
     protected _lastX = 0;
@@ -712,12 +700,6 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
             });
         });
 
-        this._baseMarginLeft = parseInt(document.defaultView.getComputedStyle(this.element.nativeElement)['margin-left'], 10);
-        this._baseMarginTop = parseInt(document.defaultView.getComputedStyle(this.element.nativeElement)['margin-top'], 10);
-        this._baseOriginX = this.baseLeft;
-        this._baseOriginY = this.baseTop;
-        this._ghostStartX = this.baseLeft;
-        this._ghostStartY = this.baseTop;
         // Set transition duration to 0s. This also helps with setting `visibility: hidden` to the base to not lag.
         this.element.nativeElement.style.transitionDuration = '0.0s';
     }
@@ -877,11 +859,6 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
             event.preventDefault();
         }
 
-        if (!this._baseOriginX && !this._baseOriginY) {
-            this._baseOriginX = this.baseLeft;
-            this._baseOriginY = this.baseTop;
-        }
-
         if (this.pointerEventsEnabled || !this.touchEventsEnabled) {
             // Check first for pointer events or non touch, because we can have pointer events and touch events at once.
             this._startX = event.pageX;
@@ -1239,57 +1216,6 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
         this._lastDropArea = null;
     }
 
-    /**
-     * @hidden
-     * Update relative positions
-     */
-    public updateDragRelativePos() {
-        let newPosX, newPosY;
-        if (this.ghost && this.ghostElement) {
-            // Calculate the new ghostElement position to remain where the mouse is, so it doesn't jump
-            const totalDraggedX = this.ghostLeft - this._ghostStartX;
-            const totalDraggedY = this.ghostTop - this._ghostStartY;
-            newPosX = this.baseLeft;
-            newPosY = this.baseTop;
-            const diffStartX = this._ghostStartX - newPosX;
-            const diffStartY = this._ghostStartY - newPosY;
-            this.ghostTop = newPosX + totalDraggedX - diffStartX;
-            this.ghostLeft = newPosY + totalDraggedY - diffStartY;
-        } else if (!this.ghost) {
-            const totalDraggedX = this.getTransformX(this.element.nativeElement);
-            const totalDraggedY = this.getTransformY(this.element.nativeElement);
-            newPosX = this.baseLeft - totalDraggedX;
-            newPosY = this.baseTop - totalDraggedY;
-            const deltaX = this._baseOriginX - newPosX;
-            const deltaY = this._baseOriginY - newPosY;
-            this.setTransformXY(totalDraggedX + deltaX, totalDraggedY + deltaY);
-        }
-        this._baseOriginX = newPosX !== undefined ? newPosX : this._baseOriginX;
-        this._baseOriginY = newPosY !== undefined ? newPosY : this._baseOriginY;
-    }
-
-    /**
-     * @deprecated This method will be removed in future major version. Please use `transitionToOrigin` or `transitionTo`.
-     * Informs the `igxDrag` directive that it has been dropped/released.
-     * This should usually be called when `animateOnRelease` is set to `true`.
-     * When canceling or defining custom drop logic this tells the igxDrag to update it's positions and
-     * animate correctly to the new position.
-     * ```typescript
-     * public onDropElem(event) {
-     *     // Function bound to the igxDrop directive event `onDrop`
-     *     // This cancels the default drop logic of the `igxDrop`
-     *     event.cancel = true;
-     *     event.drag.dropFinished();
-     * }
-     * ```
-    */
-    public dropFinished() {
-        this.updateDragRelativePos();
-        if (this.animateOnRelease && this.ghostElement) {
-            this.transitionToOrigin();
-        }
-    }
-
     /**
      * @hidden
      */

projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.directive.ts

@@ -1175,106 +1175,6 @@ describe('General igxDrag/igxDrop', () => {
         expect(dragDirsRects[0].top + 50).toBeLessThan(currTop);
         expect(currTop).toBeLessThanOrEqual(dragDirsRects[0].top + 100);
     }));
-
-    it('should keep same base element page position when element is moved in the DOM after executing updateDragRelativePos.', (async() => {
-        const firstDrag = fix.componentInstance.dragElems.first;
-        const firstElement = firstDrag.element.nativeElement;
-        const startingX = (dragDirsRects[0].left + dragDirsRects[0].right) / 2;
-        const startingY = (dragDirsRects[0].top + dragDirsRects[0].bottom) / 2;
-        firstDrag.ghost = false;
-
-        // Step 1.
-        UIInteractions.simulatePointerEvent('pointerdown', firstElement, startingX, startingY);
-        fix.detectChanges();
-        await wait();
-
-        // Step 2.
-        UIInteractions.simulatePointerEvent('pointermove', firstElement, startingX + 10, startingY + 10);
-        fix.detectChanges();
-        await wait(100);
-
-        // Step 3.
-        UIInteractions.simulatePointerEvent('pointermove', firstElement, startingX + 20, startingY + 20);
-        fix.detectChanges();
-        await wait(100);
-
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 20);
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().top).toEqual(dragDirsRects[0].top + 20);
-
-        fix.componentInstance.renderer.removeChild(firstElement.parentNode, firstElement);
-        fix.componentInstance.renderer.appendChild(dropArea.element.nativeElement, firstElement);
-        fix.detectChanges();
-
-        firstDrag.updateDragRelativePos();
-        fix.detectChanges();
-
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 20);
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().top).toEqual(dragDirsRects[0].top + 20);
-
-        // Step 4.
-        UIInteractions.simulatePointerEvent('pointermove', firstElement, startingX + 30, startingY + 30);
-        fix.detectChanges();
-        await wait(100);
-
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 30);
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().top.toFixed(2)).toEqual((dragDirsRects[0].top + 30).toFixed(2));
-
-        // Step 5.
-        UIInteractions.simulatePointerEvent('pointerup', firstElement, startingX + 30, startingY + 30);
-        fix.detectChanges();
-        await wait();
-
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 30);
-        expect(firstDrag.element.nativeElement.getBoundingClientRect().top.toFixed(2)).toEqual((dragDirsRects[0].top + 30).toFixed(2));
-    }));
-
-    it('should keep same ghost page position when element is moved in the DOM after executing updateDragRelativePos.', (async() => {
-        const firstDrag = fix.componentInstance.dragElems.first;
-        const firstElement = firstDrag.element.nativeElement;
-        const startingX = (dragDirsRects[0].left + dragDirsRects[0].right) / 2;
-        const startingY = (dragDirsRects[0].top + dragDirsRects[0].bottom) / 2;
-
-        // Step 1.
-        UIInteractions.simulatePointerEvent('pointerdown', firstElement, startingX, startingY);
-        fix.detectChanges();
-        await wait();
-
-        // Step 2.
-        UIInteractions.simulatePointerEvent('pointermove', firstElement, startingX + 10, startingY + 10);
-        fix.detectChanges();
-        await wait(100);
-
-        // Step 3.
-        UIInteractions.simulatePointerEvent('pointermove', firstDrag.ghostElement, startingX + 20, startingY + 20);
-        fix.detectChanges();
-        await wait(100);
-
-        expect(firstDrag.ghostElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 20);
-        expect(firstDrag.ghostElement.getBoundingClientRect().top).toEqual(dragDirsRects[0].top + 20);
-
-        fix.componentInstance.renderer.removeChild(firstDrag.ghostElement.parentNode, firstDrag.ghostElement);
-        fix.componentInstance.renderer.appendChild(dropArea.element.nativeElement, firstDrag.ghostElement);
-        fix.detectChanges();
-
-        firstDrag.updateDragRelativePos();
-        fix.detectChanges();
-
-        expect(firstDrag.ghostElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 20);
-        expect(firstDrag.ghostElement.getBoundingClientRect().top).toEqual(dragDirsRects[0].top + 20);
-
-        // Step 4.
-        UIInteractions.simulatePointerEvent('pointermove', firstDrag.ghostElement, startingX + 30, startingY + 30);
-        fix.detectChanges();
-        await wait(100);
-
-        expect(firstDrag.ghostElement.getBoundingClientRect().left).toEqual(dragDirsRects[0].left + 30);
-        expect(firstDrag.ghostElement.getBoundingClientRect().top).toEqual((dragDirsRects[0].top + 30));
-
-        // Step 5.
-        UIInteractions.simulatePointerEvent('pointerup', firstElement, startingX + 30, startingY + 30);
-        fix.detectChanges();
-        await wait();
-    }));
 });
 
 describe('Linked igxDrag/igxDrop ', () => {

projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.spec.ts

@@ -32,6 +32,9 @@ export class IgxTemplateOutletDirective implements OnChanges {
     @Output()
     public onCachedViewLoaded = new EventEmitter<ICachedViewLoadedEventArgs>();
 
+    @Output()
+    public onBeforeViewDetach = new EventEmitter<IViewChangeEventArgs>();
+
     constructor(public _viewContainerRef: ViewContainerRef, private _zone: NgZone, public cdr: ChangeDetectorRef) {
     }
 
@@ -66,6 +69,7 @@ export class IgxTemplateOutletDirective implements OnChanges {
         const prevIndex = this._viewRef ? this._viewContainerRef.indexOf(this._viewRef) : -1;
         // detach old and create new
         if (prevIndex !== -1) {
+            this.onBeforeViewDetach.emit({ owner: this, view: this._viewRef, context: this.igxTemplateOutletContext });
             this._viewContainerRef.detach(prevIndex);
         }
         if (this.igxTemplateOutlet) {
@@ -92,9 +96,11 @@ export class IgxTemplateOutletDirective implements OnChanges {
         if (view !== this._viewRef) {
             if (owner._viewContainerRef.indexOf(view) !== -1) {
                 // detach in case view it is attached somewhere else at the moment.
+                this.onBeforeViewDetach.emit({ owner: this, view: this._viewRef, context: this.igxTemplateOutletContext });
                 owner._viewContainerRef.detach(owner._viewContainerRef.indexOf(view));
             }
             if (this._viewRef && this._viewContainerRef.indexOf(this._viewRef) !== -1) {
+                this.onBeforeViewDetach.emit({ owner: this, view: this._viewRef, context: this.igxTemplateOutletContext });
                 this._viewContainerRef.detach(this._viewContainerRef.indexOf(this._viewRef));
             }
             this._viewRef = view;
@@ -113,6 +119,7 @@ export class IgxTemplateOutletDirective implements OnChanges {
         // then detach old view and insert the stored one with the matching template
         // after that update its context.
         if (this._viewContainerRef.length > 0) {
+            this.onBeforeViewDetach.emit({ owner: this, view: this._viewRef, context: this.igxTemplateOutletContext });
             this._viewContainerRef.detach(this._viewContainerRef.indexOf(this._viewRef));
         }
 

projects/igniteui-angular/src/lib/directives/template-outlet/template_outlet.directive.ts

@@ -18,6 +18,7 @@ import { KEYS } from '../../../core/utils';
 import { AbsoluteScrollStrategy, AutoPositionStrategy } from '../../../services/index';
 import { IgxColumnComponent } from '../../columns/column.component';
 import { GridType } from '../../common/grid.interface';
+import { DataUtil } from './../../../data-operations/data-util';
 
 /**
  *@hidden
@@ -468,7 +469,7 @@ export class IgxAdvancedFilteringDialogComponent implements AfterViewInit, OnDes
         if (this.editedExpression) {
             this.editedExpression.expression.fieldName = this.selectedColumn.field;
             this.editedExpression.expression.condition = this.selectedColumn.filters.condition(this.selectedCondition);
-            this.editedExpression.expression.searchVal = this.searchValue;
+            this.editedExpression.expression.searchVal = DataUtil.parseValue(this.selectedColumn.dataType, this.searchValue);
 
             this.editedExpression.inEditMode = false;
             this.editedExpression = null;

projects/igniteui-angular/src/lib/grids/filtering/advanced-filtering/advanced-filtering-dialog.component.ts

@@ -13,7 +13,7 @@ import {
     ChangeDetectionStrategy,
     ViewRef
 } from '@angular/core';
-import { DataType } from '../../../data-operations/data-util';
+import { DataType, DataUtil } from '../../../data-operations/data-util';
 import { IgxColumnComponent } from '../../columns/column.component';
 import { IgxDropDownComponent, ISelectionEventArgs } from '../../../drop-down/index';
 import { IFilteringOperation } from '../../../data-operations/filtering-condition';
@@ -100,7 +100,7 @@ export class IgxGridFilteringRowComponent implements AfterViewInit {
             this.expression.searchVal = null;
             this.showHideArrowButtons();
         } else {
-            this.expression.searchVal = this.transformValue(val);
+            this.expression.searchVal = DataUtil.parseValue(this.column.dataType, val);
             if (this.expressionsList.find(item => item.expression === this.expression) === undefined) {
                 this.addExpression(true);
             }
@@ -659,16 +659,6 @@ export class IgxGridFilteringRowComponent implements AfterViewInit {
         });
     }
 
-    private transformValue(value): any {
-        if (this.column.dataType === DataType.Number) {
-            value = parseFloat(value);
-        } else if (this.column.dataType === DataType.Boolean) {
-            value = Boolean(value);
-        }
-
-        return value;
-    }
-
     private addExpression(isSelected: boolean) {
         const exprUI = new ExpressionUI();
         exprUI.expression = this.expression;