Skip to content

Commit 7558d8f

Browse files
eiman-eltigani-ttdeiman-eltigani-ttd
committed
move input buttons to top for js-client-server, react, and server-side
1 parent 66ec918 commit 7558d8f

File tree

3 files changed

+71
-76
lines changed

3 files changed

+71
-76
lines changed

‎web-integrations/javascript-sdk/client-server/views/index.html‎

Lines changed: 21 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,27 @@
7474
<div class="main-content">
7575
<%- include('intro.html'); -%>
7676

77+
<!-- Generate/Clear buttons at the top for easy access -->
78+
<div id="login_form" style="display: none" class="form top-form">
79+
<form action="/login" method="POST">
80+
<div class="email_prompt">
81+
<input
82+
type="text"
83+
id="email"
84+
name="email"
85+
placeholder="Enter an email address"
86+
/>
87+
<input type="submit" value="Generate <%- identityName %>" class="button" />
88+
</div>
89+
</form>
90+
</div>
91+
<div id="logout_form" style="display: none" class="form top-form">
92+
<button type="button" class="button" id="logout">Clear <%- identityName %></button>
93+
</div>
94+
<div id="optout_form" style="display: none" class="form top-form">
95+
<button type="button" class="button" id="try_another">Try Another Email</button>
96+
</div>
97+
7798
<h2><%- identityName %> Integration Status</h2>
7899

79100
<table id="uid_state">
@@ -148,33 +169,6 @@ <h2><%- identityName %> Integration Status</h2>
148169
<td class="value"><pre id="identity_state"></pre></td>
149170
</tr>
150171
</table>
151-
152-
<div id="login_form" style="display: none" class="form">
153-
<form action="/login" method="POST">
154-
<div class="form-inline">
155-
<input
156-
type="text"
157-
id="email"
158-
name="email"
159-
placeholder="Enter an email address"
160-
class="email-input"
161-
/>
162-
<input type="submit" value="Generate <%- identityName %>" class="button" />
163-
</div>
164-
</form>
165-
</div>
166-
167-
<div id="logout_form" style="display: none" class="form">
168-
<form>
169-
<button type="button" class="button" id="logout">Clear <%- identityName %></button>
170-
</form>
171-
</div>
172-
173-
<div id="optout_form" style="display: none" class="form">
174-
<form>
175-
<button type="button" class="button" id="try_another">Try Another Email</button>
176-
</form>
177-
</div>
178172
</div>
179173

180174
<!-- Sidebar for Instructions -->

‎web-integrations/javascript-sdk/react-client-side/src/ClientSideApp.tsx‎

Lines changed: 25 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,31 @@ const ClientSideApp = () => {
113113
</a>.
114114
</p>
115115

116+
{/* Generate/Clear buttons at the top for easy access */}
117+
{showLoginForm ? (
118+
<div id="login_form" className="form top-form">
119+
<div className="email_prompt">
120+
<input
121+
type="text"
122+
id="email"
123+
name="email"
124+
placeholder="Enter an email address"
125+
value={email}
126+
onChange={(e) => setEmail(e.target.value)}
127+
/>
128+
<button type="button" className="button" onClick={handleLogin}>
129+
Generate {IDENTITY_NAME}
130+
</button>
131+
</div>
132+
</div>
133+
) : (
134+
<div id="logout_form" className="form top-form">
135+
<button type="button" className="button" onClick={handleLogout}>
136+
Clear {IDENTITY_NAME}
137+
</button>
138+
</div>
139+
)}
140+
116141
<h2>{IDENTITY_NAME} Integration Status</h2>
117142
<table id="uid_state">
118143
<tbody>
@@ -198,30 +223,6 @@ const ClientSideApp = () => {
198223
</tr>
199224
</tbody>
200225
</table>
201-
202-
{showLoginForm ? (
203-
<div id="login_form" className="form">
204-
<div className="email_prompt">
205-
<input
206-
type="text"
207-
id="email"
208-
name="email"
209-
placeholder="Enter an email address"
210-
value={email}
211-
onChange={(e) => setEmail(e.target.value)}
212-
/>
213-
<button type="button" className="button" onClick={handleLogin}>
214-
Generate {IDENTITY_NAME}
215-
</button>
216-
</div>
217-
</div>
218-
) : (
219-
<div id="logout_form" className="form">
220-
<button type="button" className="button" onClick={handleLogout}>
221-
Clear {IDENTITY_NAME}
222-
</button>
223-
</div>
224-
)}
225226
</div>
226227

227228
<aside className="sidebar">

‎web-integrations/server-side/views/index.html‎

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,31 @@ <h1>Server-Side <%- identityName %> Integration Example</h1>
2828
[<a href="https://github.com/IABTechLab/uid2-examples/tree/main/web-integrations/server-side">Source Code</a>]
2929
</p>
3030

31+
<!-- Generate/Clear buttons at the top for easy access -->
32+
<% if (!identity && !isOptout) { %>
33+
<div id="login_form" class="form top-form">
34+
<form action="/login" method="POST">
35+
<div class="email_prompt">
36+
<input
37+
type="text"
38+
id="email"
39+
name="email"
40+
placeholder="Enter an email address"
41+
/>
42+
<input type="submit" value="Generate <%- identityName %>" class="button" />
43+
</div>
44+
</form>
45+
</div>
46+
<% } else if (isOptout) { %>
47+
<div id="optout_form" class="form top-form">
48+
<button type="button" class="button" id="try_another">Try Another Email</button>
49+
</div>
50+
<% } else { %>
51+
<div id="logout_form" class="form top-form">
52+
<button type="button" class="button" id="logout">Clear <%- identityName %></button>
53+
</div>
54+
<% } %>
55+
3156
<h2><%- identityName %> Integration Status</h2>
3257

3358
<table id="uid_state">
@@ -102,31 +127,6 @@ <h2><%- identityName %> Integration Status</h2>
102127
<td class="value"><pre><%= identity ? JSON.stringify(identity, null, 2) : 'null' %></pre></td>
103128
</tr>
104129
</table>
105-
106-
<% if (!identity && !isOptout) { %>
107-
<div id="login_form" class="form">
108-
<form action="/login" method="POST">
109-
<div class="form-inline">
110-
<input
111-
type="text"
112-
id="email"
113-
name="email"
114-
placeholder="Enter an email address"
115-
class="email-input"
116-
/>
117-
<input type="submit" value="Generate <%- identityName %>" class="button" />
118-
</div>
119-
</form>
120-
</div>
121-
<% } else if (isOptout) { %>
122-
<div id="optout_form" class="form">
123-
<button type="button" class="button" id="try_another">Try Another Email</button>
124-
</div>
125-
<% } else { %>
126-
<div id="logout_form" class="form">
127-
<button type="button" class="button" id="logout">Clear <%- identityName %></button>
128-
</div>
129-
<% } %>
130130
</div>
131131

132132
<!-- Sidebar for Instructions -->

0 commit comments

Comments
 (0)