Lurkars/abi2007
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

set autofocus

Browse Source
This commit is contained in:
Lurkars
2025-09-22 09:34:17 +02:00
parent 637f699aa4
commit 4ab7d114f7
2 changed files with 36 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pom.xml
+1 -1
View File
@@ -4,7 +4,7 @@
<modelVersion>4.0.0</modelVersion>
<groupId>de.champonthis</groupId>
<artifactId>abi</artifactId>
<version>0.2.5</version>
<version>0.2.6</version>
<name>abi</name>
<parent>
src/main/resources/templates/index.html
+35 -20
View File
@@ -107,8 +107,7 @@
:class="{'disabled': working}">Suchen</button>
</form>
</div>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<div class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg" x-show="stepMsg"></div>
<div x-show="userName">
<form @submit.prevent="continueStep1">
<p>
@@ -134,7 +133,7 @@
<div id="step1ContinueDiv" class="d-flex gap-2 mt-3 justify-content-center"
:class="userName ? '' : 'd-none'" x-transition>
<button id="step1ContinueBtn" type="submit" class="btn btn-primary flex-fill"
:class="{'disabled': working}" x-ref="continueBtn">
:class="{'disabled': working}" x-ref="continueBtn" autofocus>
Weiter <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
@@ -154,13 +153,12 @@
<rect x="2" y="4" width="20" height="16" rx="2"></rect>
</svg> Schritt 2: Deine Kontaktdaten
</h2>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<div class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg" x-show="stepMsg"></div>
<form @submit.prevent="submitContactData" class="mb-3" autocomplete="off">
<div class="mb-3">
<label class="form-label">E-Mail:</label>
<input type="email" x-model="email" placeholder="name@example.com" required
autocomplete="off" class="form-control" autofocus />
<input id="step2InputEmail" type="email" x-model="email" placeholder="name@example.com"
required autocomplete="off" class="form-control" autofocus />
</div>
<div class="mb-3">
<label class="form-label">Handynummer (optional):</label>
@@ -202,8 +200,7 @@
:class="{'disabled': working}" autofocus>Suchen</button>
</div>
</form>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<div class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg" x-show="stepMsg"></div>
<div id="knownContactDataDiv" x-show="showKnownContactData" x-transition>
<form @submit.prevent="submitKnownContactData" class="mb-3">
<div class="mb-3">
@@ -231,10 +228,11 @@
:class="{'disabled': working}" @click="setStep(2)">
Zurück
</button>
<button id="step3NextBtn" class="btn btn-primary flex-fill" :class="{'disabled': working}"
@click="setStep(4)">Weiter <svg xmlns="http://www.w3.org/2000/svg" width="24"
height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<button id="step3ContinueBtn" class="btn btn-primary flex-fill"
:class="{'disabled': working}" @click="setStep(4)">Weiter <svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" aria-hidden="true">
<path d="m9 18 6-6-6-6"></path>
</svg></button>
</div>
@@ -250,8 +248,7 @@
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg> Schritt 4: Bist du beim 20-Jahrestreffen am 13.11.2027 in Gevelsberg dabei?
</h2>
<div id="stepMsg" class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg"
x-show="stepMsg"></div>
<div class="alert py-2" :class="'alert-' + stepMsgType" x-text="stepMsg" x-show="stepMsg"></div>
<p x-show="!stepMsg">
Hast du Lust, am Samstag, den 13.11.2027, beim Nachtreffen in Gevelsberg dabei zu sein?
Genauere Infos und Details gibt's dann später hier und per Mail.
@@ -441,6 +438,12 @@
localStorage.setItem('darkMode', this.darkMode.toString());
},
setStep(step) {
this.stepMsg = '';
this.stepMsgType = '';
this.step = step;
},
async findSelf() {
this.stepMsg = '';
this.stepMsgType = '';
@@ -469,11 +472,11 @@
this.stepMsgType = 'danger';
}
this.working = false;
},
setStep(step) {
this.stepMsg = '';
this.stepMsgType = '';
this.step = step;
if (this.userName) {
setTimeout(() => {
document.getElementById('step1ContinueBtn').focus();
}, 100);
}
},
async continueStep1() {
this.pendingUpdatedName = this.altNameChecked ? this.altName.trim() : null;
@@ -490,8 +493,12 @@
}
this.working = false;
}
setTimeout(() => {
document.getElementById('step2InputEmail').focus();
}, 100);
this.setStep(2);
},
async submitContactData() {
this.stepMsg = '';
this.stepMsgType = '';
@@ -517,7 +524,13 @@
this.stepMsgType = 'danger';
}
this.working = false;
setTimeout(() => {
document.getElementById('step3ContinueBtn').focus();
}, 100);
},
async findKnownContact() {
this.stepMsg = '';
this.stepMsgType = '';
@@ -561,6 +574,7 @@
}
this.working = false;
},
async submitKnownContactData() {
this.stepMsg = '';
this.stepMsgType = '';
@@ -597,6 +611,7 @@
}
this.working = false;
},
async submitCommit(committed) {
this.working = true;
this.committed = committed;