mirror of
https://github.com/zigzap/zap.git
synced 2025-10-21 07:34:08 +00:00
Fix tiny typos
This commit is contained in:
Jora Troosh
parent
a231371c3a
commit
ada2bd1837
23 changed files with 559 additions and 534 deletions
15
README.md
15
README.md
|
|
@ -1,5 +1,3 @@
|
|||
|
||||
|
||||
# ⚡zap⚡ - blazingly fast backends in zig
|
||||
|
||||
 [](https://discord.gg/jQAAN6Ubyj)
|
||||
|
|
@ -364,16 +362,3 @@ pub fn main() !void {
|
|||
});
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -329,4 +329,3 @@ Vulnerability Spectre v2: Mitigation; Enhanced IBRS, IBPB conditional,
|
|||
Vulnerability Srbds: Mitigation; Microcode
|
||||
Vulnerability Tsx async abort: Not affected
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -122,7 +122,7 @@ var map = Map.init(allocator);
|
|||
defer map.deinit();
|
||||
|
||||
// create user / pass entry
|
||||
const user = "Alladdin";
|
||||
const user = "Aladdin";
|
||||
const pass = "opensesame";
|
||||
try map.put(user, pass);
|
||||
|
||||
|
|
@ -268,5 +268,3 @@ pub fn main() !void {
|
|||
});
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ hashes, as well as a `MY_TAG.tar.gz`.
|
|||
You can then host this via python HTTP server and proceed as if you had
|
||||
downloaded it from github.
|
||||
|
||||
If all goes well, your dependend code should be able to use your freshly-built
|
||||
If all goes well, your dependent code should be able to use your freshly-built
|
||||
zap release, depending on it via localhost URL in its `build.zig.zon`.
|
||||
|
||||
If not, fix bugs, rinse, and repeat.
|
||||
|
|
@ -97,5 +97,3 @@ with the non-localhost version from the master branch. Commit it, make sure your
|
|||
worktree is clean, and perform above steps again. This time, using a tag that
|
||||
doesn't contain `localhost`. You can then push to your fork and create a release
|
||||
for the future when zig's bug is fixed.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ the `.hash` value in `build.zig.zon`.
|
|||
|
||||
## Using an arbitrary (last) commit
|
||||
|
||||
Use the same workflow as above for tags, excpept for the URL, use this schema:
|
||||
Use the same workflow as above for tags, except for the URL, use this schema:
|
||||
|
||||
```zig
|
||||
.url = "https://github.com/zigzap/zap/archive/[COMMIT-HASH].tar.gz",
|
||||
|
|
@ -36,5 +36,3 @@ Use the same workflow as above for tags, excpept for the URL, use this schema:
|
|||
|
||||
Replace `[COMMIT-HASH]` with the full commit hash as provided, e.g. by `git
|
||||
log`.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@ fn on_request_with_errors(r: zap.SimpleHttpRequest) !void {
|
|||
```
|
||||
|
||||
```zig
|
||||
// THIS IS WHAT YOU PASS TO THE LISTENER / ENDPONT / ...
|
||||
// THIS IS WHAT YOU PASS TO THE LISTENER / ENDPOINT / ...
|
||||
fn on_request(r: zap.SimpleHttpRequest) void {
|
||||
on_request_with_errors(r) catch |err| {
|
||||
// log the error or use:
|
||||
|
|
@ -84,5 +84,3 @@ To better support the use-case of flask-like error returning, we will "soon":
|
|||
|
||||
- only in debug builds would it return the stack traces and in release builds it
|
||||
would return more generic 50x responses.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -92,16 +92,14 @@ pub fn main() !void {
|
|||
Handler.alloc = allocator;
|
||||
|
||||
// setup listener
|
||||
var listener = zap.SimpleHttpListener.init(
|
||||
.{
|
||||
.port = 3000,
|
||||
.on_request = Handler.on_request,
|
||||
.log = true,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 10 * 1024 * 1024,
|
||||
.public_folder = ".",
|
||||
},
|
||||
);
|
||||
var listener = zap.SimpleHttpListener.init(.{
|
||||
.port = 3000,
|
||||
.on_request = Handler.on_request,
|
||||
.log = true,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 10 * 1024 * 1024,
|
||||
.public_folder = ".",
|
||||
});
|
||||
zap.enableDebugLog();
|
||||
try listener.listen();
|
||||
std.log.info("\n\nURL is http://localhost:3000\n", .{});
|
||||
|
|
|
|||
|
|
@ -98,15 +98,13 @@ pub fn main() !void {
|
|||
Handler.alloc = allocator;
|
||||
|
||||
// setup listener
|
||||
var listener = zap.SimpleHttpListener.init(
|
||||
.{
|
||||
.port = 3000,
|
||||
.on_request = Handler.on_request,
|
||||
.log = false,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 1 * 1024,
|
||||
},
|
||||
);
|
||||
var listener = zap.SimpleHttpListener.init(.{
|
||||
.port = 3000,
|
||||
.on_request = Handler.on_request,
|
||||
.log = false,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 1 * 1024,
|
||||
});
|
||||
zap.enableDebugLog();
|
||||
try listener.listen();
|
||||
std.log.info("\n\nTerminate with CTRL+C", .{});
|
||||
|
|
|
|||
|
|
@ -92,7 +92,6 @@ fn postUser(e: *zap.SimpleEndpoint, r: zap.SimpleRequest) void {
|
|||
}
|
||||
} else |err| {
|
||||
std.debug.print("ADDING error: {}\n", .{err});
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,23 +1,59 @@
|
|||
<html lang='en'>
|
||||
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width'>
|
||||
<title>ZAP Demo</title>
|
||||
<style>
|
||||
body {background-color: #0d1117; }
|
||||
h1 {color: #cdb4db; text-align: center;}
|
||||
h2 {color: #ffafcc; text-align: center;}
|
||||
h3 {color: #ffc8dd; text-align: center; text-decoration: underline;}
|
||||
.brighter {color: #bde0fe;}
|
||||
p {color: #ffc927; padding-left: 50px; margin-right: 50px;}
|
||||
body {
|
||||
background-color: #0d1117;
|
||||
}
|
||||
|
||||
label {color: #B0B0B0;}
|
||||
a {color: #ffc927; padding-left:15px;}
|
||||
input {color: #B06060; margin-bottom: 20px; font-weight: bold; }
|
||||
textarea {
|
||||
background-color:#181818;
|
||||
h1 {
|
||||
color: #cdb4db;
|
||||
font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #ffafcc;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #ffc8dd;
|
||||
text-align: center;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.brighter {
|
||||
color: #bde0fe;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #ffc927;
|
||||
padding-left: 50px;
|
||||
margin-right: 50px;
|
||||
}
|
||||
|
||||
label {
|
||||
color: #B0B0B0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #ffc927;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
input {
|
||||
color: #B06060;
|
||||
margin-bottom: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
textarea {
|
||||
background-color: #181818;
|
||||
color: #cdb4db;
|
||||
font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
font-size: 1em;
|
||||
border-radius: 12px;
|
||||
border: 2px solid #cdb4db;
|
||||
|
|
@ -26,6 +62,7 @@
|
|||
width: 80%;
|
||||
height: 18rem;
|
||||
}
|
||||
|
||||
form {
|
||||
border: 2px solid #cdb4db;
|
||||
border-radius: 12px;
|
||||
|
|
@ -36,6 +73,7 @@
|
|||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.tdform {
|
||||
border: none;
|
||||
border-radius: none;
|
||||
|
|
@ -46,6 +84,7 @@
|
|||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #ffafcc;
|
||||
border-radius: 12px;
|
||||
|
|
@ -55,37 +94,42 @@
|
|||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.updatebutton {
|
||||
background-color: #B0B0B0;
|
||||
color: #181818;
|
||||
}
|
||||
|
||||
.delbutton {
|
||||
background-color: #B06060;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
table {
|
||||
background-color:#181818;
|
||||
background-color: #181818;
|
||||
border-radius: 12px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
th {
|
||||
color: #B06060;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
td {
|
||||
color: #B0B0B0;
|
||||
}
|
||||
tr {
|
||||
}
|
||||
</style>
|
||||
<html>
|
||||
<html>
|
||||
|
||||
<body>
|
||||
<div class="center">
|
||||
<form >
|
||||
<form>
|
||||
<div>
|
||||
<label>First name:</label><br>
|
||||
<input id="first_name"></input>
|
||||
|
|
@ -94,7 +138,7 @@
|
|||
<label>Last name:</label><br>
|
||||
<input id="last_name"></input>
|
||||
</div>
|
||||
<div >
|
||||
<div>
|
||||
<button type="button" onclick="onNewUser();">Add new user!</button>
|
||||
</div>
|
||||
</form>
|
||||
|
|
@ -113,149 +157,150 @@
|
|||
<textarea id="log" style="display:none"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var eL = document.getElementById("log");
|
||||
var eLt = document.getElementById("logtoggler");
|
||||
<script>
|
||||
var eL = document.getElementById("log");
|
||||
var eLt = document.getElementById("logtoggler");
|
||||
|
||||
var showLog = false;
|
||||
var showLog = false;
|
||||
|
||||
function toggleLog() {
|
||||
if(showLog) {
|
||||
eL.style.display = "none";
|
||||
eLt.textContent = "(show)";
|
||||
} else {
|
||||
eL.style.display = "block";
|
||||
eLt.textContent = "(hide)";
|
||||
}
|
||||
showLog = !showLog;
|
||||
}
|
||||
function log(s) {
|
||||
eL.value += s.toString();
|
||||
eL.value += "\n"
|
||||
eL.scrollTop = eL.scrollHeight;
|
||||
}
|
||||
|
||||
function sendJSON(data, slug, method="POST") {
|
||||
json = JSON.stringify(data);
|
||||
log("SENDING: " + json);
|
||||
const response = fetch(slug, {
|
||||
method: method,
|
||||
body: json,
|
||||
headers: {
|
||||
"Content-Type": "application/json; charset=UTF-8"
|
||||
function toggleLog() {
|
||||
if (showLog) {
|
||||
eL.style.display = "none";
|
||||
eLt.textContent = "(show)";
|
||||
} else {
|
||||
eL.style.display = "block";
|
||||
eLt.textContent = "(hide)";
|
||||
}
|
||||
});
|
||||
return response;
|
||||
}
|
||||
|
||||
function onNewUser() {
|
||||
var first_name = document.getElementById("first_name").value;
|
||||
var last_name = document.getElementById("last_name").value;
|
||||
data = {
|
||||
first_name: first_name,
|
||||
last_name: last_name,
|
||||
showLog = !showLog;
|
||||
}
|
||||
sendJSON(data, "/users", "POST")
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCESS: " + JSON.stringify(data));
|
||||
getUserList();
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error posting data");
|
||||
});
|
||||
}
|
||||
|
||||
function deleteUser(id) {
|
||||
fetch("/users/" + id, { method: "DELETE", } )
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCESS: " + JSON.stringify(data));
|
||||
getUserList();
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error deleting data");
|
||||
});
|
||||
}
|
||||
|
||||
function changeUser(id) {
|
||||
const firstname = document.getElementById("first_" + id).value;
|
||||
const lastname = document.getElementById("last_" + id).value;
|
||||
data = {
|
||||
first_name: firstname,
|
||||
last_name: lastname,
|
||||
function log(s) {
|
||||
eL.value += s.toString();
|
||||
eL.value += "\n"
|
||||
eL.scrollTop = eL.scrollHeight;
|
||||
}
|
||||
sendJSON(data, "/users/" + id, "PATCH")
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCESS: " + JSON.stringify(data));
|
||||
getUserList();
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error updating data");
|
||||
});
|
||||
}
|
||||
|
||||
function addHeaderCell(tr, text) {
|
||||
var th = document.createElement('TH');
|
||||
th.innerHTML = text;
|
||||
tr.appendChild(th);
|
||||
}
|
||||
|
||||
function showTable(users) {
|
||||
var t = document.getElementById("usertable");
|
||||
var new_t = document.createElement("TABLE");
|
||||
var header = new_t.createTHead();
|
||||
var tr = header.insertRow();
|
||||
// insertCell creates TD, we want TH
|
||||
addHeaderCell(tr, 'id');
|
||||
addHeaderCell(tr, 'first name');
|
||||
addHeaderCell(tr, 'last name');
|
||||
addHeaderCell(tr, '');
|
||||
addHeaderCell(tr, '');
|
||||
|
||||
console.log("showTable()");
|
||||
console.log(users);
|
||||
// add the data rows
|
||||
for(var i=0; i<users.length; i++) {
|
||||
var row = new_t.insertRow();
|
||||
var c1 = row.insertCell();
|
||||
c1.innerHTML = users[i].id;
|
||||
var c2 = row.insertCell();
|
||||
c2.innerHTML = '<input id="first_' + users[i].id + '" value="' + users[i].first_name + '"></input>';
|
||||
var c3 = row.insertCell();
|
||||
c3.innerHTML = '<input id="last_' + users[i].id + '" value="' + users[i].last_name + '"></input>';
|
||||
var c4 = row.insertCell();
|
||||
c4.innerHTML = ''
|
||||
+ '<form class="tdform"><button class="updatebutton" type="button" onclick="changeUser(' + users[i].id + ');">change</button></form>'
|
||||
;
|
||||
var c5 = row.insertCell();
|
||||
c5.innerHTML = ''
|
||||
+ '<form class="tdform"><button class="delbutton" type="button" onclick="deleteUser(' + users[i].id + ');">del</button></form>'
|
||||
;
|
||||
function sendJSON(data, slug, method = "POST") {
|
||||
json = JSON.stringify(data);
|
||||
log("SENDING: " + json);
|
||||
const response = fetch(slug, {
|
||||
method: method,
|
||||
body: json,
|
||||
headers: {
|
||||
"Content-Type": "application/json; charset=UTF-8"
|
||||
}
|
||||
});
|
||||
return response;
|
||||
}
|
||||
|
||||
function onNewUser() {
|
||||
var first_name = document.getElementById("first_name").value;
|
||||
var last_name = document.getElementById("last_name").value;
|
||||
data = {
|
||||
first_name: first_name,
|
||||
last_name: last_name,
|
||||
}
|
||||
sendJSON(data, "/users", "POST")
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCCESS: " + JSON.stringify(data));
|
||||
getUserList();
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error posting data");
|
||||
});
|
||||
}
|
||||
|
||||
function deleteUser(id) {
|
||||
fetch("/users/" + id, { method: "DELETE", })
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCCESS: " + JSON.stringify(data));
|
||||
getUserList();
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error deleting data");
|
||||
});
|
||||
}
|
||||
|
||||
function changeUser(id) {
|
||||
const firstname = document.getElementById("first_" + id).value;
|
||||
const lastname = document.getElementById("last_" + id).value;
|
||||
data = {
|
||||
first_name: firstname,
|
||||
last_name: lastname,
|
||||
}
|
||||
sendJSON(data, "/users/" + id, "PATCH")
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCCESS: " + JSON.stringify(data));
|
||||
getUserList();
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error updating data");
|
||||
});
|
||||
}
|
||||
|
||||
function addHeaderCell(tr, text) {
|
||||
var th = document.createElement('TH');
|
||||
th.innerHTML = text;
|
||||
tr.appendChild(th);
|
||||
}
|
||||
|
||||
function showTable(users) {
|
||||
var t = document.getElementById("usertable");
|
||||
var new_t = document.createElement("TABLE");
|
||||
var header = new_t.createTHead();
|
||||
var tr = header.insertRow();
|
||||
// insertCell creates TD, we want TH
|
||||
addHeaderCell(tr, 'id');
|
||||
addHeaderCell(tr, 'first name');
|
||||
addHeaderCell(tr, 'last name');
|
||||
addHeaderCell(tr, '');
|
||||
addHeaderCell(tr, '');
|
||||
|
||||
console.log("showTable()");
|
||||
console.log(users);
|
||||
// add the data rows
|
||||
for (var i = 0; i < users.length; i++) {
|
||||
var row = new_t.insertRow();
|
||||
var c1 = row.insertCell();
|
||||
c1.innerHTML = users[i].id;
|
||||
var c2 = row.insertCell();
|
||||
c2.innerHTML = '<input id="first_' + users[i].id + '" value="' + users[i].first_name + '"></input>';
|
||||
var c3 = row.insertCell();
|
||||
c3.innerHTML = '<input id="last_' + users[i].id + '" value="' + users[i].last_name + '"></input>';
|
||||
var c4 = row.insertCell();
|
||||
c4.innerHTML = ''
|
||||
+ '<form class="tdform"><button class="updatebutton" type="button" onclick="changeUser(' + users[i].id + ');">change</button></form>'
|
||||
;
|
||||
var c5 = row.insertCell();
|
||||
c5.innerHTML = ''
|
||||
+ '<form class="tdform"><button class="delbutton" type="button" onclick="deleteUser(' + users[i].id + ');">del</button></form>'
|
||||
;
|
||||
}
|
||||
console.log("before replace");
|
||||
t.innerHTML = new_t.innerHTML;
|
||||
console.log("after replace");
|
||||
}
|
||||
console.log("before replace");
|
||||
t.innerHTML = new_t.innerHTML;
|
||||
console.log("after replace");
|
||||
}
|
||||
|
||||
|
||||
function getUserList() {
|
||||
fetch("/users", { method: "GET", } )
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCESS: " + JSON.stringify(data));
|
||||
showTable(data);
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error fetching data");
|
||||
});
|
||||
}
|
||||
function getUserList() {
|
||||
fetch("/users", { method: "GET", })
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
log("SUCCESS: " + JSON.stringify(data));
|
||||
showTable(data);
|
||||
})
|
||||
.catch((error) => {
|
||||
log("Error fetching data");
|
||||
});
|
||||
}
|
||||
|
||||
function init() {
|
||||
getUserList();
|
||||
}
|
||||
init();
|
||||
</script>
|
||||
function init() {
|
||||
getUserList();
|
||||
}
|
||||
init();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -98,15 +98,13 @@ pub fn main() !void {
|
|||
Handler.alloc = allocator;
|
||||
|
||||
// setup listener
|
||||
var listener = zap.SimpleHttpListener.init(
|
||||
.{
|
||||
.port = 3000,
|
||||
.on_request = Handler.on_request,
|
||||
.log = false,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 1 * 1024,
|
||||
},
|
||||
);
|
||||
var listener = zap.SimpleHttpListener.init(.{
|
||||
.port = 3000,
|
||||
.on_request = Handler.on_request,
|
||||
.log = false,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 1 * 1024,
|
||||
});
|
||||
zap.enableDebugLog();
|
||||
try listener.listen();
|
||||
std.log.info("\n\nTerminate with CTRL+C or by sending query param terminate=true\n", .{});
|
||||
|
|
|
|||
|
|
@ -191,7 +191,6 @@ const HtmlEndpoint = struct {
|
|||
|
||||
r.setContentType(.TEXT) catch unreachable;
|
||||
r.sendBody(message) catch unreachable;
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -27,15 +27,13 @@ pub fn on_request(r: zap.SimpleRequest) void {
|
|||
|
||||
pub fn main() !void {
|
||||
// setup listener
|
||||
var listener = zap.SimpleHttpListener.init(
|
||||
.{
|
||||
.port = 3000,
|
||||
.on_request = on_request,
|
||||
.log = true,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 1 * 1024, // careful here
|
||||
},
|
||||
);
|
||||
var listener = zap.SimpleHttpListener.init(.{
|
||||
.port = 3000,
|
||||
.on_request = on_request,
|
||||
.log = true,
|
||||
.max_clients = 10,
|
||||
.max_body_size = 1 * 1024, // careful here
|
||||
});
|
||||
|
||||
zap.enableDebugLog();
|
||||
try listener.listen();
|
||||
|
|
|
|||
|
|
@ -1,90 +1,94 @@
|
|||
<html>
|
||||
<head>
|
||||
<style>
|
||||
/* Bordered form */
|
||||
form {
|
||||
border: 3px solid #f1f1f1;
|
||||
}
|
||||
|
||||
/* Full-width inputs */
|
||||
input[type=text], input[type=password] {
|
||||
width: 100%;
|
||||
padding: 12px 20px;
|
||||
margin: 8px 0;
|
||||
display: inline-block;
|
||||
border: 1px solid #ccc;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
<head>
|
||||
<style>
|
||||
/* Bordered form */
|
||||
form {
|
||||
border: 3px solid #f1f1f1;
|
||||
}
|
||||
|
||||
/* Set a style for all buttons */
|
||||
button {
|
||||
background-color: #04AA6D;
|
||||
color: white;
|
||||
padding: 14px 20px;
|
||||
margin: 8px 0;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
}
|
||||
/* Full-width inputs */
|
||||
input[type=text],
|
||||
input[type=password] {
|
||||
width: 100%;
|
||||
padding: 12px 20px;
|
||||
margin: 8px 0;
|
||||
display: inline-block;
|
||||
border: 1px solid #ccc;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Add a hover effect for buttons */
|
||||
button:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
/* Set a style for all buttons */
|
||||
button {
|
||||
background-color: #04AA6D;
|
||||
color: white;
|
||||
padding: 14px 20px;
|
||||
margin: 8px 0;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Extra style for the cancel button (red) */
|
||||
.cancelbtn {
|
||||
width: auto;
|
||||
padding: 10px 18px;
|
||||
background-color: #f44336;
|
||||
}
|
||||
/* Add a hover effect for buttons */
|
||||
button:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* Center the avatar image inside this container */
|
||||
.imgcontainer {
|
||||
text-align: center;
|
||||
margin: 24px 0 12px 0;
|
||||
}
|
||||
/* Extra style for the cancel button (red) */
|
||||
.cancelbtn {
|
||||
width: auto;
|
||||
padding: 10px 18px;
|
||||
background-color: #f44336;
|
||||
}
|
||||
|
||||
/* Avatar image */
|
||||
img.avatar {
|
||||
width: 40%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
/* Center the avatar image inside this container */
|
||||
.imgcontainer {
|
||||
text-align: center;
|
||||
margin: 24px 0 12px 0;
|
||||
}
|
||||
|
||||
/* Add padding to containers */
|
||||
.container {
|
||||
padding: 16px;
|
||||
}
|
||||
/* Avatar image */
|
||||
img.avatar {
|
||||
width: 40%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* Add padding to containers */
|
||||
.container {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
|
||||
/* Change styles for span and cancel button on extra small screens */
|
||||
@media screen and (max-width: 300px) {
|
||||
span.psw {
|
||||
display: block;
|
||||
float: none;
|
||||
}
|
||||
.cancelbtn {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<form action="normal_page" method="post"> <!-- we post directly to the page we want to display if login is successful-->
|
||||
<div class="imgcontainer">
|
||||
<img src="/login/Ziggy_the_Ziguana.svg.png" alt="Avatar" class="avatar">
|
||||
</div>
|
||||
/* Change styles for span and cancel button on extra small screens */
|
||||
@media screen and (max-width: 300px) {
|
||||
span.psw {
|
||||
display: block;
|
||||
float: none;
|
||||
}
|
||||
|
||||
<div class="container">
|
||||
<label for="username"><b>Username</b></label>
|
||||
<input type="text" placeholder="Enter Username" name="username" required>
|
||||
.cancelbtn {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<label for="password"><b>Password</b></label>
|
||||
<input type="password" placeholder="Enter Password" name="password" required>
|
||||
<body>
|
||||
<form action="normal_page" method="post"> <!-- we post directly to the page we want to display if login is successful-->
|
||||
<div class="imgcontainer">
|
||||
<img src="/login/Ziggy_the_Ziguana.svg.png" alt="Avatar" class="avatar">
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<label for="username"><b>Username</b></label>
|
||||
<input type="text" placeholder="Enter Username" name="username" required>
|
||||
|
||||
<label for="password"><b>Password</b></label>
|
||||
<input type="password" placeholder="Enter Password" name="password" required>
|
||||
|
||||
<button type="submit">Login</button>
|
||||
</div>
|
||||
</form>
|
||||
</body>
|
||||
|
||||
<button type="submit">Login</button>
|
||||
</div>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,183 +1,192 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<script src="showdown.min.js"></script>
|
||||
|
||||
<title>ZAP-Chat</title>
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<script src="showdown.min.js"></script>
|
||||
|
||||
body {
|
||||
font-family: 'Arial', sans-serif;
|
||||
background-color: #f0f0f0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: #cd0f0d;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 2rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
padding: 2rem;
|
||||
/* height: 500px; */
|
||||
height: calc(100vh - 260px);
|
||||
margin-top: 2rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.message {
|
||||
max-width: 80%;
|
||||
padding: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
border-radius: 10px;
|
||||
/* font-size: 1.2rem; */
|
||||
}
|
||||
|
||||
.bot {
|
||||
align-self: flex-start;
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.user {
|
||||
align-self: flex-end;
|
||||
background-color: #cd0f0d;;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.busy-indicator {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: 3px solid rgba(255, 255, 255, 0.3);
|
||||
border-radius: 50%;
|
||||
border-top-color: #ffffff;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
<title>ZAP-Chat</title>
|
||||
<style>
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
|
||||
body {
|
||||
font-family: 'Arial', sans-serif;
|
||||
background-color: #f0f0f0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
.input-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: #f0f0f0;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
padding-bottom: 0.8rem;
|
||||
padding-top: 1rem;
|
||||
max-width: 960px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
/* box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1); */
|
||||
}
|
||||
.container {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.input-container input {
|
||||
flex-grow: 1;
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
border: 2px solid #cd0f0d;
|
||||
outline: none;
|
||||
/* font-size: 1.2rem; */
|
||||
}
|
||||
header {
|
||||
background-color: #cd0f0d;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.input-container button {
|
||||
background-color: #cd0f0d;;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
padding: 1rem 2rem;
|
||||
cursor: pointer;
|
||||
margin-left: 1rem;
|
||||
outline: none;
|
||||
transition: 0.3s;
|
||||
}
|
||||
header h1 {
|
||||
font-size: 2rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.input-container button:hover {
|
||||
background-color: #A20000;
|
||||
}
|
||||
.chat-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
padding: 2rem;
|
||||
/* height: 500px; */
|
||||
height: calc(100vh - 260px);
|
||||
margin-top: 2rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.status-bar {
|
||||
background-color: #8B0000;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 0.5rem;
|
||||
font-size: 0.9rem;
|
||||
position: fixed;
|
||||
/* bottom: 60px; */
|
||||
left: 0;
|
||||
right: 0;
|
||||
max-width: 960px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
/* border-top-left-radius: 10px; */
|
||||
/* border-top-right-radius: 10px; */
|
||||
border-bottom-left-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.message {
|
||||
max-width: 80%;
|
||||
padding: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
border-radius: 10px;
|
||||
/* font-size: 1.2rem; */
|
||||
}
|
||||
|
||||
.status-online {
|
||||
/* Green, MediumSeaGreen */
|
||||
background-color: #3CB371;
|
||||
}
|
||||
.status-busy {
|
||||
/* Blue, DodgerBlue */
|
||||
background-color: #1E90FF;
|
||||
}
|
||||
.status-thinking {
|
||||
/* Light Gray, LightSlateGray */
|
||||
background-color: #778899;
|
||||
}
|
||||
.status-offline {
|
||||
/* Red, Tomato */
|
||||
background-color: #FF6347;
|
||||
}
|
||||
.status-warning {
|
||||
/* Yellow, Goldenrod */
|
||||
background-color: #DAA520;
|
||||
}
|
||||
.status-error {
|
||||
/* Dark-Red, Firebrick */
|
||||
background-color: #B22222;
|
||||
}
|
||||
.bot {
|
||||
align-self: flex-start;
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
</style>
|
||||
.user {
|
||||
align-self: flex-end;
|
||||
background-color: #cd0f0d;
|
||||
;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.busy-indicator {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: 3px solid rgba(255, 255, 255, 0.3);
|
||||
border-radius: 50%;
|
||||
border-top-color: #ffffff;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.input-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: #f0f0f0;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
padding-bottom: 0.8rem;
|
||||
padding-top: 1rem;
|
||||
max-width: 960px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
/* box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1); */
|
||||
}
|
||||
|
||||
.input-container input {
|
||||
flex-grow: 1;
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
border: 2px solid #cd0f0d;
|
||||
outline: none;
|
||||
/* font-size: 1.2rem; */
|
||||
}
|
||||
|
||||
.input-container button {
|
||||
background-color: #cd0f0d;
|
||||
;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
padding: 1rem 2rem;
|
||||
cursor: pointer;
|
||||
margin-left: 1rem;
|
||||
outline: none;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.input-container button:hover {
|
||||
background-color: #A20000;
|
||||
}
|
||||
|
||||
.status-bar {
|
||||
background-color: #8B0000;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 0.5rem;
|
||||
font-size: 0.9rem;
|
||||
position: fixed;
|
||||
/* bottom: 60px; */
|
||||
left: 0;
|
||||
right: 0;
|
||||
max-width: 960px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
/* border-top-left-radius: 10px; */
|
||||
/* border-top-right-radius: 10px; */
|
||||
border-bottom-left-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.status-online {
|
||||
/* Green, MediumSeaGreen */
|
||||
background-color: #3CB371;
|
||||
}
|
||||
|
||||
.status-busy {
|
||||
/* Blue, DodgerBlue */
|
||||
background-color: #1E90FF;
|
||||
}
|
||||
|
||||
.status-thinking {
|
||||
/* Light Gray, LightSlateGray */
|
||||
background-color: #778899;
|
||||
}
|
||||
|
||||
.status-offline {
|
||||
/* Red, Tomato */
|
||||
background-color: #FF6347;
|
||||
}
|
||||
|
||||
.status-warning {
|
||||
/* Yellow, Goldenrod */
|
||||
background-color: #DAA520;
|
||||
}
|
||||
|
||||
.status-error {
|
||||
/* Dark-Red, Firebrick */
|
||||
background-color: #B22222;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
|
|
@ -207,4 +216,5 @@
|
|||
document.head.appendChild(scriptTag);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -39,13 +39,13 @@ See [the README](https://github.com/renerocksai/zap) for how easy it is to get s
|
|||
|
||||
I'll continue wrapping more of facil.io's functionality and adding stuff to zap to a point where I can use it as the JSON REST API backend for real research projects, serving thousands of concurrent clients. Now that the endpoint example works, ZAP has actually become pretty usable to me.
|
||||
|
||||
**Side-note:** It never ceases to amaze me how productive I can be in zig, eventhough I am still considering myself to be a newbie. Sometimes, it's almost like writing python but with all the nice speed and guarantees that zig gives you. Also, the C integration abilities of zig are just phenomenal! I am super excited about zig's future!
|
||||
**Side-note:** It never ceases to amaze me how productive I can be in zig, even though I am still considering myself to be a newbie. Sometimes, it's almost like writing python but with all the nice speed and guarantees that zig gives you. Also, the C integration abilities of zig are just phenomenal! I am super excited about zig's future!
|
||||
|
||||
Now, on to the guiding principles of Zap.
|
||||
|
||||
## robust
|
||||
|
||||
A common recommendation for doing web stuff in zig is to write the actual HTTP server in Go, and use zig for the real work. While there is a selection of notable and cool HTTP server implementations written in zig out there, at the time of writing, most of them seem to a) depend on zig's async facilities which are unsupported until ca. April 2023 when async will return to the self-hosted compiler, and b) have not matured to a point where **I** feel safe using them in production. These are just my opionions and they could be totally wrong though.
|
||||
A common recommendation for doing web stuff in zig is to write the actual HTTP server in Go, and use zig for the real work. While there is a selection of notable and cool HTTP server implementations written in zig out there, at the time of writing, most of them seem to a) depend on zig's async facilities which are unsupported until ca. April 2023 when async will return to the self-hosted compiler, and b) have not matured to a point where **I** feel safe using them in production. These are just my opinions and they could be totally wrong though.
|
||||
|
||||
However, when I conduct my next online research experiment with thousands of concurrent clients, I cannot afford to run into potential maturity-problems of the HTTP server. These projects typically feature a you-get-one-shot process with little room for errors or re-tries.
|
||||
|
||||
|
|
@ -91,10 +91,10 @@ I am super excited about both zig and zap's future. I am still impressed by how
|
|||
|
||||
Provided that the incorporated C code is well-written and -tested, WYSIWYG even holds mostly true for combined Zig and C projects.
|
||||
|
||||
You can truly build on the soulders of giants here. Mind you, it took me less than a week to arrive at the current state of zap where I am confident that I can already use it to write the one or other REST API with it and, after stress-testing, just move it into production - from merely researching Zig and C web frameworks a few days ago.
|
||||
You can truly build on the shoulders of giants here. Mind you, it took me less than a week to arrive at the current state of zap where I am confident that I can already use it to write the one or other REST API with it and, after stress-testing, just move it into production - from merely researching Zig and C web frameworks a few days ago.
|
||||
|
||||
Oh, and have I mentioned Zig's built-in build system and testing framework? Those are both super amazing and super convenient. `zig build` is so much more useful than `make` (which I quite like to be honest). And `zig test` is just amazing, too. Zig's physical code layout: which file is located where and how can it be built, imported, tested - it all makes so much sense. Such a coherent, pleasant experience.
|
||||
|
||||
Looking forward, I am also tempted to try adding some log-and-replay facilities as a kind of backup for when things go wrong. I wouldn't be confident to attemt such things in C because I'd view them as being too much work; too much could go wrong. But with Zig, I am rather excited about the possibilities that open up and eager to try such things.
|
||||
Looking forward, I am also tempted to try adding some log-and-replay facilities as a kind of backup for when things go wrong. I wouldn't be confident to attempt such things in C because I'd view them as being too much work; too much could go wrong. But with Zig, I am rather excited about the possibilities that open up and eager to try such things.
|
||||
|
||||
For great justice!
|
||||
|
|
|
|||
|
|
@ -156,7 +156,7 @@ pub fn BasicAuth(comptime Lookup: type, comptime kind: BasicAuthStrategy) type {
|
|||
} else |err| {
|
||||
// can't calc slice size --> fallthrough to return false
|
||||
zap.debug(
|
||||
"ERROR: UserPassAuth: cannot calc slize size for encoded `{s}`: {any} \n",
|
||||
"ERROR: UserPassAuth: cannot calc slice size for encoded `{s}`: {any} \n",
|
||||
.{ encoded, err },
|
||||
);
|
||||
return .AuthFailed;
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ pub fn Handler(comptime ContextType: anytype) type {
|
|||
};
|
||||
}
|
||||
|
||||
/// A convenience handler for artibrary zap.SimpleEndpoint
|
||||
/// A convenience handler for arbitrary zap.SimpleEndpoint
|
||||
pub fn EndpointHandler(comptime HandlerType: anytype, comptime ContextType: anytype) type {
|
||||
return struct {
|
||||
handler: HandlerType,
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ test "BasicAuth UserPass" {
|
|||
defer map.deinit();
|
||||
|
||||
// create user / pass entry
|
||||
const user = "Alladdin";
|
||||
const user = "Aladdin";
|
||||
const pass = "opensesame";
|
||||
try map.put(user, pass);
|
||||
|
||||
|
|
@ -521,7 +521,7 @@ test "BasicAuth UserPass authenticateRequest" {
|
|||
defer map.deinit();
|
||||
|
||||
// create user / pass entry
|
||||
const user = "Alladdin";
|
||||
const user = "Aladdin";
|
||||
const pass = "opensesame";
|
||||
try map.put(user, pass);
|
||||
|
||||
|
|
@ -587,7 +587,7 @@ test "BasicAuth UserPass authenticateRequest test-unauthorized" {
|
|||
defer map.deinit();
|
||||
|
||||
// create user / pass entry
|
||||
const user = "Alladdin";
|
||||
const user = "Aladdin";
|
||||
const pass = "opensesame";
|
||||
try map.put(user, pass);
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue