GuzhavinAleksey/Vmeda.Online
1
0
Fork 0
forked from CIT/Vmeda.Online
Code Pull Requests Activity

MOBILE-2430 rte: Resize with keyboard open and close

Browse Source
This commit is contained in:
Pau Ferrer Ocaña 2018-06-21 12:10:32 +02:00
parent 82d3bcb012
commit d97fdcee93
1 changed files with 18 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/rich-text-editor/rich-text-editor.ts
View File

@ -46,6 +46,7 @@ import { Subscription } from 'rxjs';
export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy { export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy {
// Based on: https://github.com/judgewest2000/Ionic3RichText/ // Based on: https://github.com/judgewest2000/Ionic3RichText/
// @todo: Anchor button, fullscreen... // @todo: Anchor button, fullscreen...
// @todo: Textarea height is not being updated when editor is resized. Height is calculated if any css is changed.
@Input() placeholder = ''; // Placeholder to set in textarea. @Input() placeholder = ''; // Placeholder to set in textarea.
@Input() control: FormControl; // Form control. @Input() control: FormControl; // Form control.
@ -154,14 +155,21 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
*/ */
protected maximizeEditorSize(): Promise<number> { protected maximizeEditorSize(): Promise<number> {
this.content.resize(); this.content.resize();
const contentVisibleHeight = this.content.contentHeight;
const deferred = this.utils.promiseDefer(); const deferred = this.utils.promiseDefer();
setTimeout(() => { setTimeout(() => {
const contentVisibleHeight = this.content.contentHeight; const contentVisibleHeight = this.content.contentHeight;
// Editor is ready, adjust Height if needed. if (contentVisibleHeight <= 0) {
if (contentVisibleHeight > 0) { deferred.resolve(0);
return;
}
setTimeout(() => {
// Editor is ready, adjust Height if needed.
const height = this.getSurroundingHeight(this.element); const height = this.getSurroundingHeight(this.element);
if (contentVisibleHeight > height) { if (contentVisibleHeight > height) {
this.element.style.height = this.domUtils.formatPixelsSize(contentVisibleHeight - height); this.element.style.height = this.domUtils.formatPixelsSize(contentVisibleHeight - height);
@ -170,11 +178,7 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
} }
deferred.resolve(contentVisibleHeight - height); deferred.resolve(contentVisibleHeight - height);
}, 100);
return;
}
deferred.resolve(0);
}); });
return deferred.promise; return deferred.promise;
@ -206,6 +210,13 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
height += this.domUtils.getComputedStyleMeasure(cs, 'paddingTop') + height += this.domUtils.getComputedStyleMeasure(cs, 'paddingTop') +
this.domUtils.getComputedStyleMeasure(cs, 'paddingBottom'); this.domUtils.getComputedStyleMeasure(cs, 'paddingBottom');
if (element && element.parentNode && element.parentNode.tagName == 'ION-CONTENT') {
const cs2 = getComputedStyle(element);
height -= this.domUtils.getComputedStyleMeasure(cs2, 'paddingTop') +
this.domUtils.getComputedStyleMeasure(cs2, 'paddingBottom');
}
return height; return height;
} }
@ -487,7 +498,6 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
*/ */
ngOnDestroy(): void { ngOnDestroy(): void {
this.valueChangeSubscription && this.valueChangeSubscription.unsubscribe(); this.valueChangeSubscription && this.valueChangeSubscription.unsubscribe();
this.keyboardObs && this.keyboardObs.off();
window.removeEventListener('resize', this.resizeFunction); window.removeEventListener('resize', this.resizeFunction);
} }
} }