Mastodon
/
Sengi-Windows-MacOS-Linux
mirror of https://github.com/NicolasConstant/sengi
1
0
Fork 0
Code Issues Releases Wiki Activity

better autogrow

This commit is contained in:
Nicolas Constant 2019-07-26 22:21:16 -04:00
parent 1bba36b474
commit 612e7526a7
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 18 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/components/create-status/create-status.component.html
View File

@ -3,10 +3,10 @@
autocomplete="off" placeholder="Title, Content Warning (optional)" title="title, content warning (optional)" />
<textarea #reply [(ngModel)]="status" name="status"
class="form-control form-control-sm status-form__status status-editor__content flexcroll" rows="5" required
class="form-control form-control-sm status-form__status status-editor__content" rows="5" required
title="content" placeholder="What's in your mind?" (keydown.control.enter)="onCtrlEnter()"
(keydown)="handleKeyDown($event)" (keyup)="autoGrowTextZone($event)"
(blur)="statusTextEditorLostFocus()"></textarea>
(keydown)="handleKeyDown($event)"
(blur)="statusTextEditorLostFocus()"></textarea> <!-- flexcroll (keyup)="autoGrow($event)" -->
<app-autosuggest class="status-editor__autosuggest" *ngIf="autosuggestData"
[pattern]="autosuggestData"

1
src/app/components/create-status/create-status.component.scss
View File

@ -54,6 +54,7 @@ $counter-width: 90px;
min-height: 110px;
height: 110px;
padding-bottom: 10px;
//border-bottom: 1px solid black;
}

22
src/app/components/create-status/create-status.component.ts
View File

@ -48,6 +48,11 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
this.countStatusChar(value);
this.detectAutosuggestion(value);
this._status = value;
setTimeout(() => {
this.autoGrow();
}, 0);
} else {
this.autosuggestData = null;
}
@ -89,7 +94,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
this.notificationService.notifyHttpError(err);
})
.then(() => {
this.isSending = false;
this.isSending = false;
});
}
}
@ -102,6 +107,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
mentionTooFarAwayError: boolean;
autosuggestData: string = null;
private statusLoaded: boolean;
private hasSuggestions: boolean;
@Input() statusReplyingToWrapper: StatusWrapper;
@Output() onClose = new EventEmitter();
@ -124,7 +130,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
private _replyingUserHandle: string;
@Input('replyingUserHandle')
set replyingUserHandle(value: string) {
if (value) {
if (value) {
this._replyingUserHandle = value;
this.initMention();
}
@ -381,7 +387,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
const selectedUser = this.toolsService.getSelectedAccounts()[0];
globalUniqueMentions = globalUniqueMentions.filter(x => x.toLowerCase() !== `${selectedUser.username}@${selectedUser.instance}`.toLowerCase());
return globalUniqueMentions;
}
@ -543,7 +549,6 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
}
}
private hasSuggestions: boolean;
suggestionsChanged(hasSuggestions: boolean) {
this.hasSuggestions = hasSuggestions;
}
@ -585,11 +590,12 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
return false;
}
autoGrowTextZone(e) {
let scrolling = (e.target.scrollHeight + 25);
private autoGrow() {
let scrolling = (this.replyElement.nativeElement.scrollHeight + 25);
if (scrolling > 135) {
e.target.style.height = "0px";
e.target.style.height = (e.target.scrollHeight + 25) + "px";
//this.replyElement.nativeElement.style.height = `0px`;
this.replyElement.nativeElement.style.height = `${this.replyElement.nativeElement.scrollHeight}px`;
}
}