login.html

The complete code for login.html used in Using HTML page templates is:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>HostSurfer Application Example</title>
<link rel="stylesheet" href="css/styles.css"/>
</head>
<body>
<script>
function checkkey(e) {
  e = e || event;
  if (e.key == "Enter") {
    zScope.hostSurfer.navigate('main');
  };
}
</script>
<div class="fullbox nomenu">
<div class="header">
<div class="title">Blue Card / User Login</div>
</div>
<div class="main">
<div class="floatbox">
<table class="verticalTable">
<tr>
<th>Username:</th>
<td><input type="text" size="13" maxlength="6" hs-field="hs.data.username" onkeypress="checkkey()"/></td>
</tr>
<tr>
<th>Password:</th>
<td><input type="password" size="13" hs-field="hs.data.password" maxlength="6" onkeypress="checkkey()"/></td>
</tr>
<tr>
<th>New Password:</th>
<td><input type="password" size="13" hs-field="hs.data.newPassword" maxlength="6" onkeypress="checkkey()"/></td>
</tr>
<tr><td colspan="2">&nbsp;</td></tr>
<tr>
<td colspan="2" class="center">
<span class="button" id="login_btn" tabindex=0 onclick="hs.navigate('main')" onkeypress="checkkey()">Sign in</span> &nbsp;
<span class="button" id="exit_btn" tabindex=0 onclick="hs.navigate('exit')">Exit</span>
</td>
</tr>
</table>
<div class="fullwidth screenmsg nobreak center">
<p>{{hs.data.R18C9}} {{hs.data.commerceLastUpdate}} &mdash; {{hs.data.R18C39}} {{hs.data.accountsLastUpdate}}</p>
</div>
</div>
</div>
<div class="footer">
<span style="visibility: hidden">&nbsp;</span>
</div>
</div>
</body>
</html>