Replace my old ResizeObserver workaround for RainLoop bugs with proper CSS flex.

And removed wysiwyg resize() in favor of flexbox.
This commit is contained in:
djmaze 2021-11-05 14:47:19 +01:00
parent d305e090c5
commit 789dc264f7
11 changed files with 386 additions and 441 deletions

View file

@ -312,8 +312,6 @@ class ComposePopupView extends AbstractViewPopup {
}
});
this.resizeObserver = new ResizeObserver(this.resizerTrigger.throttle(50).bind(this));
decorateKoCommands(this, {
sendCommand: self => self.canBeSentOrSaved(),
saveCommand: self => self.canBeSentOrSaved(),
@ -641,8 +639,6 @@ class ComposePopupView extends AbstractViewPopup {
rl.route.on();
this.resizeObserver.disconnect();
(getFullscreenElement() === this.oContent) && exitFullscreen();
}
@ -709,10 +705,6 @@ class ComposePopupView extends AbstractViewPopup {
onShow(type, oMessageOrArray, aToEmails, aCcEmails, aBccEmails, sCustomSubject, sCustomPlainText) {
rl.route.off();
const ro = this.resizeObserver;
ro.observe(ro.compose);
ro.observe(ro.header);
this.autosaveStart();
this.viewModelDom.dataset.wysiwyg = SettingsUserStore.editorDefaultType();
@ -1088,7 +1080,7 @@ class ComposePopupView extends AbstractViewPopup {
}
}
onBuild(dom) {
onBuild() {
// initUploader
if (this.composeUploaderButton()) {
@ -1249,12 +1241,6 @@ class ComposePopupView extends AbstractViewPopup {
return false;
});
const ro = this.resizeObserver;
ro.compose = dom.querySelector('.b-compose');
ro.header = dom.querySelector('.b-header');
ro.toolbar = dom.querySelector('.b-header-toolbar');
ro.els = [dom.querySelector('.textAreaParent'), dom.querySelector('.attachmentAreaParent')];
this.editor(editor => editor[this.isPlainEditor()?'modePlain':'modeWysiwyg']());
// Fullscreen must be on app, else other popups fail
@ -1463,16 +1449,6 @@ class ComposePopupView extends AbstractViewPopup {
item => item.id
);
}
resizerTrigger() {
let ro = this.resizeObserver,
height = Math.max(200, ro.compose.clientHeight - ro.header.offsetHeight - ro.toolbar.offsetHeight) + 'px';
if (ro.height !== height) {
ro.height = height;
ro.els.forEach(element => element.style.height = height);
this.oEditor && this.oEditor.resize();
}
}
}
export { ComposePopupView, ComposePopupView as default };