Merge pull request #31 from giacomoferlaino/master

Prettier code formatter integration

.vscode/settings.json

@@ -0,0 +1,4 @@
+{
+    "prettier.configPath": "./src/.prettierrc",
+    "editor.formatOnSave": true
+}

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ng2-fittext",
-  "version": "1.2.9",
+  "version": "1.2.10",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

src/.prettierrc

@@ -0,0 +1,7 @@
+{
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": true,
+  "arrowParens": "always"
+}

src/directives/ng2-fittext.directive.ts

@@ -1,141 +1,152 @@
 import {
-    AfterViewChecked,
+  AfterViewChecked,
-    AfterViewInit,
+  AfterViewInit,
-    Directive,
+  Directive,
-    ElementRef, HostListener,
+  ElementRef,
-    Input,
+  HostListener,
-    Output,
+  Input,
-    EventEmitter,
+  Output,
-    OnChanges,
+  EventEmitter,
-    OnInit,
+  OnChanges,
-    Renderer2
+  OnInit,
+  Renderer2,
 } from '@angular/core';
 
 @Directive({
-    selector: '[fittext]'
+  selector: '[fittext]',
 })
-export class Ng2FittextDirective implements AfterViewInit, OnInit, OnChanges, AfterViewChecked {
+export class Ng2FittextDirective
+  implements AfterViewInit, OnInit, OnChanges, AfterViewChecked {
+  @Input('fittext') fittext: any;
+  @Input('activateOnResize') activateOnResize: boolean;
+  @Input('container') container: HTMLElement;
+  @Input('activateOnInputEvents') activateOnInputEvents: boolean;
+  @Input('minFontSize') minFontSize = 7;
+  @Input('maxFontSize') maxFontSize = 1000;
 
-    @Input('fittext') fittext: any;
+  /* Deprecated */
-    @Input('activateOnResize') activateOnResize: boolean;
+  @Input('useMaxFontSize') useMaxFontSize = true;
-    @Input('container') container: HTMLElement;
-    @Input('activateOnInputEvents') activateOnInputEvents: boolean;
-    @Input('minFontSize') minFontSize = 7;
-    @Input('maxFontSize') maxFontSize = 1000;
 
-    /* Deprecated */
+  @Input('modelToWatch') modelToWatch: any;
-    @Input('useMaxFontSize') useMaxFontSize = true;
 
-    @Input('modelToWatch') modelToWatch: any;
+  @Output() fontSizeChanged = new EventEmitter();
-    
-    @Output() fontSizeChanged = new EventEmitter();
-    
-    private fontSize = 1000;
-    private speed = 1.05;
-    private done = false;
 
-    constructor(public el: ElementRef,
+  private fontSize = 1000;
-                public renderer: Renderer2) {}
+  private speed = 1.05;
+  private done = false;
 
-    setFontSize(fontSize: number) {
+  constructor(public el: ElementRef, public renderer: Renderer2) {}
-        if (this.isVisible() && !this.done) {
-            if (fontSize < this.minFontSize) {
-                fontSize = this.minFontSize;
-            }
-            if(fontSize > this.maxFontSize){
-                fontSize = this.maxFontSize;
-            }
 
-            this.fontSize = fontSize;
+  setFontSize(fontSize: number) {
-            this.fontSizeChanged.emit(fontSize);
+    if (this.isVisible() && !this.done) {
-            return this.el.nativeElement.style.setProperty('font-size', (fontSize).toString() + 'px');
+      if (fontSize < this.minFontSize) {
-        }
+        fontSize = this.minFontSize;
+      }
+      if (fontSize > this.maxFontSize) {
+        fontSize = this.maxFontSize;
+      }
+
+      this.fontSize = fontSize;
+      this.fontSizeChanged.emit(fontSize);
+      return this.el.nativeElement.style.setProperty(
+        'font-size',
+        fontSize.toString() + 'px'
+      );
     }
+  }
 
-    calculateFontSize(fontSize: number, speed: number) {
+  calculateFontSize(fontSize: number, speed: number) {
-        return Math.floor(fontSize / speed);
+    return Math.floor(fontSize / speed);
+  }
+
+  checkOverflow(parent: any, children: any) {
+    const overflowX = children.scrollWidth - parent.clientWidth;
+    const overflowY = children.clientHeight - parent.clientHeight;
+    return overflowX > 1 || overflowY > 1;
+  }
+
+  @HostListener('window:resize', ['$event'])
+  onResize(event: Event) {
+    this.done = false;
+    if (this.activateOnResize && this.fittext) {
+      if (this.activateOnInputEvents && this.fittext) {
+        this.setFontSize(this.getStartFontSizeFromHeight());
+      } else {
+        this.setFontSize(this.getStartFontSizeFromWeight());
+      }
+
+      this.ngAfterViewInit();
     }
+  }
 
-    checkOverflow(parent: any, children: any) {
+  @HostListener('input', ['$event'])
-        const overflowX = children.scrollWidth - parent.clientWidth;
+  onInputEvents(event: Event) {
-        const overflowY = children.clientHeight - parent.clientHeight;
+    this.done = false;
-        return (overflowX > 1 || overflowY > 1);
+    if (this.activateOnInputEvents && this.fittext) {
+      this.setFontSize(this.getStartFontSizeFromHeight());
+      this.ngAfterViewInit();
     }
+  }
 
-    @HostListener('window:resize', ['$event'])
+  ngOnInit() {
-    onResize(event: Event) {
+    this.done = false;
-        this.done = false;
+    this.el.nativeElement.style.setProperty('will-change', 'content');
-        if (this.activateOnResize && this.fittext) {
+    this.ngAfterViewInit();
-            if (this.activateOnInputEvents && this.fittext) {
+  }
-                this.setFontSize(this.getStartFontSizeFromHeight());
-            } else {
-                this.setFontSize(this.getStartFontSizeFromWeight());
-            }
 
+  ngAfterViewInit() {
+    if (this.isVisible() && !this.done) {
+      if (this.fittext) {
+        const overflow = this.container
+          ? this.checkOverflow(this.container, this.el.nativeElement)
+          : this.checkOverflow(
+              this.el.nativeElement.parentElement,
+              this.el.nativeElement
+            );
+        if (overflow) {
+          if (this.fontSize > this.minFontSize) {
+            // iterate only until font size is bigger than minimal value
+            this.setFontSize(this.calculateFontSize(this.fontSize, this.speed));
             this.ngAfterViewInit();
+          }
+        } else {
+          this.done = true;
         }
+      }
     }
+  }
 
-    @HostListener('input', ['$event'])
+  ngOnChanges(changes: any): void {
-    onInputEvents(event: Event) {
+    if (changes.modelToWatch) {
+      // change of model to watch - call ngAfterViewInit where is implemented logic to change size
+      setTimeout(() => {
         this.done = false;
-        if (this.activateOnInputEvents && this.fittext) {
+        this.setFontSize(this.maxFontSize);
-            this.setFontSize(this.getStartFontSizeFromHeight());
-            this.ngAfterViewInit();
-        }
-    }
-
-    ngOnInit() {
-        this.done = false;
-        this.el.nativeElement.style.setProperty('will-change', 'content');
         this.ngAfterViewInit();
+      });
     }
+  }
 
-    ngAfterViewInit() {
+  ngAfterViewChecked() {
-        if (this.isVisible() && !this.done) {
+    if (this.fontSize > this.minFontSize) {
-            if (this.fittext) {
+      this.setFontSize(this.getStartFontSizeFromHeight());
-                const overflow = this.container ? this.checkOverflow(this.container, this.el.nativeElement)
+      this.ngAfterViewInit();
-                    : this.checkOverflow(this.el.nativeElement.parentElement, this.el.nativeElement);
-                if (overflow) {
-                    if (this.fontSize > this.minFontSize) {
-                        // iterate only until font size is bigger than minimal value
-                        this.setFontSize(this.calculateFontSize(this.fontSize, this.speed));
-                        this.ngAfterViewInit();
-                    }
-                } else {
-                    this.done = true;
-                }
-            }
-        }
     }
+  }
 
-    ngOnChanges(changes: any): void {
+  private getStartFontSizeFromHeight(): number {
-        if (changes.modelToWatch) {
+    return this.container
-            // change of model to watch - call ngAfterViewInit where is implemented logic to change size
+      ? this.container.clientHeight
-            setTimeout(() => {
+      : this.el.nativeElement.parentElement.clientHeight;
-                this.done = false;
+  }
-                this.setFontSize(this.maxFontSize);
-                this.ngAfterViewInit();
-            });
-        }
-    }
 
-    ngAfterViewChecked() {
+  private getStartFontSizeFromWeight(): number {
-        if (this.fontSize > this.minFontSize) {
+    return this.container
-            this.setFontSize(this.getStartFontSizeFromHeight());
+      ? this.container.clientWidth
-            this.ngAfterViewInit();
+      : this.el.nativeElement.parentElement.clientWidth;
-        }
+  }
-    }
 
-    private getStartFontSizeFromHeight(): number {
+  private isVisible(): boolean {
-        return this.container ? this.container.clientHeight : this.el.nativeElement.parentElement.clientHeight;
+    return this.getStartFontSizeFromHeight() > 0;
-    }
+  }
-
-    private getStartFontSizeFromWeight(): number {
-        return this.container ? this.container.clientWidth : this.el.nativeElement.parentElement.clientWidth;
-    }
-
-    private isVisible(): boolean {
-        return this.getStartFontSizeFromHeight() > 0;
-    }
 }

src/ng2-fittext.module.ts

@@ -1,23 +1,17 @@
 import { Ng2FittextDirective } from './directives/ng2-fittext.directive';
-import {CommonModule} from '@angular/common';
+import { CommonModule } from '@angular/common';
-import {NgModule} from "@angular/core";
+import { NgModule } from '@angular/core';
 
 @NgModule({
-    declarations: [
+  declarations: [Ng2FittextDirective],
-        Ng2FittextDirective
+  exports: [Ng2FittextDirective],
-    ],
+  imports: [CommonModule],
-    exports: [
-        Ng2FittextDirective
-    ],
-    imports: [
-        CommonModule
-    ]
 })
 export class Ng2FittextModule {
-    static forRoot() {
+  static forRoot() {
-        return {
+    return {
-            ngModule: Ng2FittextModule,
+      ngModule: Ng2FittextModule,
-            providers: []
+      providers: [],
-        };
+    };
-    }
+  }
 }

src/package.json

@@ -29,5 +29,8 @@
   },
   "repository": {
     "url": "https://github.com/lokenxo/ng2-fittext.git"
+  },
+  "devDependencies": {
+    "prettier": "^1.19.1"
   }
 }