MOBILE-2473 rte: Fix height
parent
bfcbbbd965
commit
aff8c28ca4
|
@ -181,7 +181,7 @@ export class AddonMessagesDiscussionPage implements OnDestroy {
|
|||
});
|
||||
|
||||
// Recalculate footer position when keyboard is shown or hidden.
|
||||
this.keyboardObserver = this.eventsProvider.on(CoreEventsProvider.KEYBOARD_CHANGE, (isOn) => {
|
||||
this.keyboardObserver = this.eventsProvider.on(CoreEventsProvider.KEYBOARD_CHANGE, (kbHeight) => {
|
||||
this.content.resize();
|
||||
});
|
||||
}
|
||||
|
|
|
@ -92,7 +92,7 @@ export class AddonModChatChatPage {
|
|||
});
|
||||
|
||||
// Recalculate footer position when keyboard is shown or hidden.
|
||||
this.keyboardObserver = this.eventsProvider.on(CoreEventsProvider.KEYBOARD_CHANGE, (isOn) => {
|
||||
this.keyboardObserver = this.eventsProvider.on(CoreEventsProvider.KEYBOARD_CHANGE, (kbHeight) => {
|
||||
this.content.resize();
|
||||
});
|
||||
}
|
||||
|
|
|
@ -1,10 +1,14 @@
|
|||
core-rich-text-editor {
|
||||
height: 40vh;
|
||||
overflow: hidden;
|
||||
min-height: 30vh;
|
||||
min-height: 200px; /* Just in case vh is not supported */
|
||||
min-height: 40vh;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
> div {
|
||||
position: absolute;
|
||||
@include position(0, 0, 0, 0);
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
@ -67,14 +71,20 @@ core-rich-text-editor {
|
|||
}
|
||||
}
|
||||
|
||||
.core-textarea textarea {
|
||||
margin: 0 !important;
|
||||
padding: 0;
|
||||
height: 100% !important;
|
||||
width: 100% !important;
|
||||
resize: none;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
.core-textarea {
|
||||
position: relative;
|
||||
|
||||
textarea {
|
||||
margin: 0 !important;
|
||||
padding: 0;
|
||||
height: 100% !important;
|
||||
width: 100% !important;
|
||||
resize: none;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
position: absolute;
|
||||
@include position(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
div.core-rte-toolbar {
|
||||
|
@ -108,4 +118,8 @@ core-rich-text-editor {
|
|||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.keyboard-is-open core-rich-text-editor {
|
||||
min-height: 200px;
|
||||
}
|
|
@ -61,6 +61,8 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
|
|||
protected element: HTMLDivElement;
|
||||
protected editorElement: HTMLDivElement;
|
||||
protected resizeFunction;
|
||||
protected kbHeight = 0; // Last known keyboard height.
|
||||
protected minHeight = 200; // Minimum height of the editor.
|
||||
|
||||
protected valueChangeSubscription: Subscription;
|
||||
protected keyboardObs: any;
|
||||
|
@ -121,7 +123,8 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
|
|||
});
|
||||
}, 750);
|
||||
|
||||
this.keyboardObs = this.events.on(CoreEventsProvider.KEYBOARD_CHANGE, (isOn) => {
|
||||
this.keyboardObs = this.events.on(CoreEventsProvider.KEYBOARD_CHANGE, (kbHeight) => {
|
||||
this.kbHeight = kbHeight;
|
||||
this.maximizeEditorSize();
|
||||
});
|
||||
}
|
||||
|
@ -137,7 +140,7 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
|
|||
const deferred = this.utils.promiseDefer();
|
||||
|
||||
setTimeout(() => {
|
||||
const contentVisibleHeight = this.content.contentHeight;
|
||||
const contentVisibleHeight = this.content.contentHeight - this.kbHeight;
|
||||
|
||||
if (contentVisibleHeight <= 0) {
|
||||
deferred.resolve(0);
|
||||
|
@ -147,16 +150,16 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
|
|||
|
||||
setTimeout(() => {
|
||||
// Editor is ready, adjust Height if needed.
|
||||
const height = this.getSurroundingHeight(this.element);
|
||||
if (contentVisibleHeight > height) {
|
||||
this.element.style.height = this.domUtils.formatPixelsSize(contentVisibleHeight - height);
|
||||
const height = this.content.contentHeight - this.kbHeight - this.getSurroundingHeight(this.element);
|
||||
if (height > this.minHeight) {
|
||||
this.element.style.height = this.domUtils.formatPixelsSize(height);
|
||||
} else {
|
||||
this.element.style.height = '';
|
||||
}
|
||||
|
||||
deferred.resolve(contentVisibleHeight - height);
|
||||
deferred.resolve(height);
|
||||
}, 100);
|
||||
});
|
||||
}, 100);
|
||||
|
||||
return deferred.promise;
|
||||
}
|
||||
|
|
|
@ -192,7 +192,7 @@ export class CoreCourseModuleMainResourceComponent implements OnInit, OnDestroy,
|
|||
promise = Promise.resolve();
|
||||
}
|
||||
|
||||
return this.fetchContent(refresh).catch((error) => {
|
||||
return promise.catch((error) => {
|
||||
// Error getting data, fail.
|
||||
this.domUtils.showErrorModalDefault(error, this.fetchContentDefaultError, true);
|
||||
}).finally(() => {
|
||||
|
|
|
@ -52,11 +52,11 @@ export class CoreCoursesCourseLinkHandler extends CoreContentLinksHandlerBase {
|
|||
courseId = parseInt(params.id, 10);
|
||||
|
||||
const sectionId = params.sectionid ? parseInt(params.sectionid, 10) : null,
|
||||
sectionNumber = typeof params.section != 'undefined' ? parseInt(params.section, 10) : NaN,
|
||||
pageParams: any = {
|
||||
course: { id: courseId },
|
||||
sectionId: sectionId || null
|
||||
};
|
||||
let sectionNumber = typeof params.section != 'undefined' ? parseInt(params.section, 10) : NaN;
|
||||
|
||||
if (!sectionId && !sectionNumber) {
|
||||
// Check if the URL has a hash to navigate to the section.
|
||||
|
|
|
@ -79,7 +79,9 @@ export class CoreAppProvider {
|
|||
zone.run(() => {
|
||||
document.body.classList.add('keyboard-is-open');
|
||||
this.isKeyboardShown = true;
|
||||
events.trigger(CoreEventsProvider.KEYBOARD_CHANGE, this.isKeyboardShown);
|
||||
// Error on iOS calculating size.
|
||||
// More info: https://github.com/ionic-team/ionic-plugin-keyboard/issues/276 .
|
||||
events.trigger(CoreEventsProvider.KEYBOARD_CHANGE, data.keyboardHeight);
|
||||
});
|
||||
});
|
||||
this.keyboard.onKeyboardHide().subscribe((data) => {
|
||||
|
@ -87,7 +89,7 @@ export class CoreAppProvider {
|
|||
zone.run(() => {
|
||||
document.body.classList.remove('keyboard-is-open');
|
||||
this.isKeyboardShown = false;
|
||||
events.trigger(CoreEventsProvider.KEYBOARD_CHANGE, this.isKeyboardShown);
|
||||
events.trigger(CoreEventsProvider.KEYBOARD_CHANGE, 0);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue