loke/ng2-fittext
1
0
Fork 0
Code Issues 2 Pull requests 2 Projects Releases 3 Packages Wiki Activity Actions

Ref: clean code

Browse source 
Ref: update examples
This commit is contained in:
Lorenzo Iovino 2019-05-06 10:21:16 +02:00
parent 43d4cf66f4
commit ca1576015d
6 changed files with 196 additions and 198 deletions
Download patch file Download diff file Expand all files Collapse all files

11
examples/dev/src/app/app.component.html
View file

@ -1,4 +1,4 @@
<h2>Add text or remove text from div</h2>
<h2>Add text or remove text from div (max and min font size)</h2>
<div style="border: 2px solid; overflow:hidden; width:100%; height:300px; font-size:520px;">
<div [fittext]="true"
[modelToWatch]="title"
@ -7,8 +7,17 @@
[activateOnResize]="true">{{title}}</div>
</div>
<h2>Add text or remove text from div (no max and no min font size)</h2>
<div style="border: 2px solid; overflow:hidden; width:100%; height:300px; font-size:520px;">
<div [fittext]="true"
[modelToWatch]="title"
[activateOnResize]="true">{{title}}</div>
</div>
<button (click)="click('add')"> ADD text</button>
<button (click)="click('remove')"> REMOVE text</button>
<br/>
<br/>
<h2>Write text in input box (text fit inside without overflowing)</h2>

21
examples/dev/src/app/ng2-fittext.directive.ts
View file

@ -31,7 +31,6 @@ export class Ng2FittextDirective implements AfterViewInit, OnInit, OnChanges, Af
setFontSize(fontSize: number) {
if (this.isVisible() && !this.done) {
if (fontSize < this.minFontSize) {
// force that font size will never be lower than minimal allowed font size
fontSize = this.minFontSize;
}
if(fontSize > this.maxFontSize){
@ -44,7 +43,6 @@ export class Ng2FittextDirective implements AfterViewInit, OnInit, OnChanges, Af
}
calculateFontSize(fontSize: number, speed: number) {
// TODO Do with Gauss
return Math.floor(fontSize / speed);
}
@ -79,14 +77,6 @@ export class Ng2FittextDirective implements AfterViewInit, OnInit, OnChanges, Af
ngOnInit() {
this.done = false;
const fontSize = this.getComputetStyle().fontSize;
if (fontSize) {
this.maxFontSize = parseInt(fontSize, undefined);
}
if (this.fittext) {
this.setFontSize(this.maxFontSize);
}
this.el.nativeElement.style.setProperty('will-change', 'content');
this.ngAfterViewInit();
}
@ -103,13 +93,6 @@ export class Ng2FittextDirective implements AfterViewInit, OnInit, OnChanges, Af
this.ngAfterViewInit();
}
} else {
if (this.fontSize > this.maxFontSize) {
const fontSize = this.getComputetStyle().fontSize;
if (fontSize) {
this.maxFontSize = parseInt(fontSize, undefined);
this.setFontSize(this.maxFontSize);
}
}
this.done = true;
}
}
@ -134,10 +117,6 @@ export class Ng2FittextDirective implements AfterViewInit, OnInit, OnChanges, Af
}
}
private getComputetStyle(): CSSStyleDeclaration {
return window.getComputedStyle(this.container ? this.container : this.el.nativeElement.parentElement);
}
private getStartFontSizeFromHeight(): number {
return this.container ? this.container.clientHeight : this.el.nativeElement.parentElement.clientHeight;
}