romein/rolens
1
0
Fork 0
mirror of https://github.com/garraflavatra/rolens.git synced 2024-12-01 13:20:54 +00:00
Code Issues Releases Activity

Autofocus action

Browse Source
This commit is contained in:
Romein van Buren 2023-01-17 17:03:11 +01:00
parent 8cbc344eda
commit 69e7502222
Signed by: romein
GPG Key ID: 0EFF8478ADDF6C49
4 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/actions.js
View File

@ -1,4 +1,4 @@
export function input(node, { json } = { json: false }) { export function input(node, { json, autofocus } = { json: false, autofocus: false }) {
const handleInput = () => { const handleInput = () => {
if (json) { if (json) {
try { try {
@ -18,6 +18,10 @@ export function input(node, { json } = { json: false }) {
node.addEventListener('focus', handleFocus); node.addEventListener('focus', handleFocus);
node.addEventListener('input', handleInput); node.addEventListener('input', handleInput);
if (autofocus) {
node.focus();
}
return { return {
destroy: () => { destroy: () => {
node.removeEventListener('focus', handleFocus); node.removeEventListener('focus', handleFocus);

5
frontend/src/organisms/connection/collection/find.svelte
View File

@ -1,7 +1,6 @@
<script> <script>
import { FindItems } from '../../../../wailsjs/go/app/App'; import { FindItems } from '../../../../wailsjs/go/app/App';
import CodeExample from '../../../components/code-example.svelte'; import CodeExample from '../../../components/code-example.svelte';
import { onMount } from 'svelte';
import { input } from '../../../actions'; import { input } from '../../../actions';
import ObjectGrid from '../../../components/objectgrid.svelte'; import ObjectGrid from '../../../components/objectgrid.svelte';
import Icon from '../../../components/icon.svelte'; import Icon from '../../../components/icon.svelte';
@ -67,8 +66,6 @@
console.log(form); console.log(form);
submitQuery(); submitQuery();
} }
onMount(resetFocus);
</script> </script>
<div class="find"> <div class="find">
@ -76,7 +73,7 @@
<div class="form-row one"> <div class="form-row one">
<label class="field"> <label class="field">
<span class="label">Query or id</span> <span class="label">Query or id</span>
<input type="text" class="code" bind:this={queryField} bind:value={form.query} use:input={{ json: true }} placeholder={defaults.query} /> <input type="text" class="code" bind:this={queryField} bind:value={form.query} use:input={{ json: true, autofocus: true }} placeholder={defaults.query} />
</label> </label>
<label class="field"> <label class="field">

2
frontend/src/organisms/connection/collection/insert.svelte
View File

@ -30,7 +30,7 @@
placeholder="[]" placeholder="[]"
class="code" class="code"
bind:value={json} bind:value={json}
use:input={{ json: true }} use:input={{ json: true, autofocus: true }}
></textarea> ></textarea>
</label> </label>

10
frontend/src/organisms/connection/collection/remove.svelte
View File

@ -1,4 +1,5 @@
<script> <script>
import { input } from '../../../actions';
import { RemoveItems } from '../../../../wailsjs/go/app/App'; import { RemoveItems } from '../../../../wailsjs/go/app/App';
import CodeExample from '../../../components/code-example.svelte'; import CodeExample from '../../../components/code-example.svelte';
@ -26,7 +27,14 @@
</div> </div>
<label class="field"> <label class="field">
<textarea cols="30" rows="10" bind:value={json} placeholder={'{}'} class="code"></textarea> <textarea
cols="30"
rows="10"
placeholder={'{}'}
class="code"
bind:value={json}
use:input={{ json: true, autofocus: true }}
></textarea>
</label> </label>
<div class="flex"> <div class="flex">