FarmMaps/FarmMapsLib
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Update to angular 8.2

Browse Source
This commit is contained in:
Willem Dantuma
2019-11-25 14:34:51 +01:00
parent 16db063339
commit 7bd5dada2b
22 changed files with 5929 additions and 4352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

170
projects/common/src/fm/components/side-panel/side-panel.component.ts
View File

@@ -1,85 +1,85 @@
import { Component, Input,ViewChild,ElementRef,OnChanges,SimpleChanges,HostListener,ChangeDetectorRef } from '@angular/core';
@Component({
selector: 'fm-side-panel',
templateUrl: 'side-panel.component.html',
styleUrls: ['side-panel.component.scss']
})
export class SidePanelComponent implements OnChanges {
@Input() public visible: boolean;
@Input() public collapsed: boolean;
@Input() public collapsable: boolean;
@Input() public resizeable: boolean = false;
@ViewChild("resizeGrip") elementView: ElementRef;
public mobile:boolean = true;
private parentHeight:number = 0;
public top = "100%";
private resizeTop:number=50;
public resizing:boolean=false;
constructor(private element: ElementRef,private ref: ChangeDetectorRef) {
this.collapsable = false;
this.setTop();
}
checkMobile():boolean {
let size = parseFloat(getComputedStyle(document.documentElement).width);
let rem = parseFloat(getComputedStyle(document.documentElement).fontSize);
let threshold = 44 * rem;
return !(size>threshold);
}
setTop() {
this.mobile = this.checkMobile();
this.resizeTop = this.mobile?50:0;
this.top = (this.visible?this.resizeTop: (this.mobile? 100:0)) + "%";
}
ngAfterViewInit() {
this.parentHeight = this.element.nativeElement.offsetParent.clientHeight;
}
handleToggleClick(event) {
if (this.collapsable) {
this.collapsed = !this.collapsed;
}
}
handleStartGripDrag(event:DragEvent|TouchEvent) {
this.resizing=true;
if(event instanceof DragEvent) {
var crt = new Image();
crt.style.display = "none";
document.body.appendChild(crt);
event.dataTransfer.setDragImage(crt,0,0);
}
}
handleEndGripDrag() {
this.resizing = false;
}
handleGripDrag(event:DragEvent|TouchEvent) {
var clientY = 0;
if((event instanceof TouchEvent)) {
clientY = (event as TouchEvent).changedTouches[0].clientY;
} else {
clientY=(event as DragEvent).clientY;
}
this.resizeTop = Math.min(98, Math.max(0, clientY / (this.parentHeight / 100)));
this.top = (this.visible? this.resizeTop:(this.mobile? 100:0)) + "%";
}
ngOnChanges(changes: SimpleChanges) {
if(changes.visible) {
this.top = (changes.visible.currentValue?this.resizeTop:(this.mobile? 100:0)) + "%";
}
}
@HostListener('window:resize', ['$event'])
onResize(event) {
this.setTop();
}
}
import { Component, Input,ViewChild,ElementRef,OnChanges,SimpleChanges,HostListener,ChangeDetectorRef } from '@angular/core';
@Component({
selector: 'fm-side-panel',
templateUrl: 'side-panel.component.html',
styleUrls: ['side-panel.component.scss']
})
export class SidePanelComponent implements OnChanges {
@Input() public visible: boolean;
@Input() public collapsed: boolean;
@Input() public collapsable: boolean;
@Input() public resizeable: boolean = false;
@ViewChild("resizeGrip", { static: false }) elementView: ElementRef;
public mobile:boolean = true;
private parentHeight:number = 0;
public top = "100%";
private resizeTop:number=50;
public resizing:boolean=false;
constructor(private element: ElementRef,private ref: ChangeDetectorRef) {
this.collapsable = false;
this.setTop();
}
checkMobile():boolean {
let size = parseFloat(getComputedStyle(document.documentElement).width);
let rem = parseFloat(getComputedStyle(document.documentElement).fontSize);
let threshold = 44 * rem;
return !(size>threshold);
}
setTop() {
this.mobile = this.checkMobile();
this.resizeTop = this.mobile?50:0;
this.top = (this.visible?this.resizeTop: (this.mobile? 100:0)) + "%";
}
ngAfterViewInit() {
this.parentHeight = this.element.nativeElement.offsetParent.clientHeight;
}
handleToggleClick(event) {
if (this.collapsable) {
this.collapsed = !this.collapsed;
}
}
handleStartGripDrag(event:DragEvent|TouchEvent) {
this.resizing=true;
if(event instanceof DragEvent) {
var crt = new Image();
crt.style.display = "none";
document.body.appendChild(crt);
event.dataTransfer.setDragImage(crt,0,0);
}
}
handleEndGripDrag() {
this.resizing = false;
}
handleGripDrag(event:DragEvent|TouchEvent) {
var clientY = 0;
if((event instanceof TouchEvent)) {
clientY = (event as TouchEvent).changedTouches[0].clientY;
} else {
clientY=(event as DragEvent).clientY;
}
this.resizeTop = Math.min(98, Math.max(0, clientY / (this.parentHeight / 100)));
this.top = (this.visible? this.resizeTop:(this.mobile? 100:0)) + "%";
}
ngOnChanges(changes: SimpleChanges) {
if(changes.visible) {
this.top = (changes.visible.currentValue?this.resizeTop:(this.mobile? 100:0)) + "%";
}
}
@HostListener('window:resize', ['$event'])
onResize(event) {
this.setTop();
}
}