jeans/arduino-ide
jeans/arduino-ide
1
0
Fork 0
mirror of https://github.com/arduino/arduino-ide.git synced 2025-07-12 13:56:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Set focus on send field initially

Browse Source 
Signed-off-by: jbicker <jan.bicker@typefox.io>
This commit is contained in:
jbicker 2019-08-19 14:15:11 +02:00
parent dac9c6437e
commit d8454456a9
3 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
arduino-ide-extension/src/browser/monitor/monitor-view-contribution.tsx
View File

@ -96,7 +96,7 @@ export class MonitorViewContribution extends AbstractViewContribution<MonitorWid
}
protected renderAutoScrollButton(): React.ReactNode {
return <React.Fragment>
return <React.Fragment key='autoscroll-toolbar-item'>
<div
title='Toggle Autoscroll'
className={`item enabled fa fa-angle-double-down arduino-monitor ${this.model.autoscroll ? 'toggled' : ''}`}
@ -111,7 +111,7 @@ export class MonitorViewContribution extends AbstractViewContribution<MonitorWid
}
protected renderTimestampButton(): React.ReactNode {
return <React.Fragment>
return <React.Fragment key='line-ending-toolbar-item'>
<div
title='Toggle Timestamp'
className={`item enabled fa fa-clock-o arduino-monitor ${this.model.timestamp ? 'toggled' : ''}`}

17
arduino-ide-extension/src/browser/monitor/monitor-widget.tsx
View File

@ -25,6 +25,9 @@ export namespace SerialMonitorSendField {
}
export class SerialMonitorSendField extends React.Component<SerialMonitorSendField.Props, SerialMonitorSendField.State> {
protected inputField: HTMLInputElement | null;
constructor(props: SerialMonitorSendField.Props) {
super(props);
this.state = { value: '' };
@ -33,10 +36,22 @@ export class SerialMonitorSendField extends React.Component<SerialMonitorSendFie
this.handleSubmit = this.handleSubmit.bind(this);
}
componentDidMount() {
if (this.inputField) {
this.inputField.focus();
}
}
render() {
return <React.Fragment>
<form onSubmit={this.handleSubmit}>
<input type='text' id='serial-monitor-send' autoComplete='off' value={this.state.value} onChange={this.handleChange} />
<input
tabIndex={-1}
ref={ref => this.inputField = ref}
type='text' id='serial-monitor-send'
autoComplete='off'
value={this.state.value}
onChange={this.handleChange} />
<input className="btn" type="submit" value="Submit" />
</form>
</React.Fragment>

3
arduino-ide-extension/src/browser/toolbar/arduino-toolbar.tsx
View File

@ -47,7 +47,7 @@ export class ArduinoToolbarComponent extends React.Component<ArduinoToolbarCompo
render(): React.ReactNode {
const tooltip = <div key='arduino-toolbar-tooltip' className={'arduino-toolbar-tooltip'}>{this.state.tooltip}</div>;
const items = [
<React.Fragment>
<React.Fragment key={this.props.side + '-arduino-toolbar-tooltip'}>
{[...this.props.items].map(item => TabBarToolbarItem.is(item) ? this.renderItem(item) : item.render())}
</React.Fragment>
]
@ -103,6 +103,7 @@ export class ArduinoToolbar extends ReactWidget {
protected render(): React.ReactNode {
return <ArduinoToolbarComponent
key='arduino-toolbar-component'
side={this.side}
items={[...this.items.values()]}
commands={this.commands}