mirror of
https://github.com/flarum/framework.git
synced 2024-12-05 09:03:36 +08:00
Reflect composer's focus state in a property
This commit is contained in:
parent
57efa7a335
commit
092f5a27c9
|
@ -36,6 +36,13 @@ class Composer extends Component {
|
|||
*/
|
||||
this.height = null;
|
||||
|
||||
/**
|
||||
* Whether or not the composer currently has focus.
|
||||
*
|
||||
* @type {Boolean}
|
||||
*/
|
||||
this.active = false;
|
||||
|
||||
/**
|
||||
* Computed the composer's current height, based on the intended height, and
|
||||
* the composer's current state. This will be applied to the composer's
|
||||
|
@ -62,7 +69,8 @@ class Composer extends Component {
|
|||
view() {
|
||||
const classes = {
|
||||
'minimized': this.position === Composer.PositionEnum.MINIMIZED,
|
||||
'fullScreen': this.position === Composer.PositionEnum.FULLSCREEN
|
||||
'fullScreen': this.position === Composer.PositionEnum.FULLSCREEN,
|
||||
'active': this.active
|
||||
};
|
||||
classes.visible = this.position === Composer.PositionEnum.NORMAL || classes.minimized || classes.fullScreen;
|
||||
|
||||
|
@ -104,7 +112,10 @@ class Composer extends Component {
|
|||
|
||||
// Whenever any of the inputs inside the composer are have focus, we want to
|
||||
// add a class to the composer to draw attention to it.
|
||||
this.$().on('focus blur', ':input', e => this.$().toggleClass('active', e.type === 'focusin'));
|
||||
this.$().on('focus blur', ':input', e => {
|
||||
this.active = e.type === 'focusin';
|
||||
m.redraw();
|
||||
});
|
||||
|
||||
// When the escape key is pressed on any inputs, close the composer.
|
||||
this.$().on('keydown', ':input', 'esc', () => this.close());
|
||||
|
|
Loading…
Reference in New Issue
Block a user