paweld/pas2js
1
0
Fork 0
mirror of https://gitlab.com/freepascal.org/fpc/pas2js.git synced 2025-04-05 11:17:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

* Improve HTML

Browse Source
This commit is contained in:
Michaël Van Canneyt 2024-09-07 23:33:09 +02:00
parent a7f2e4e743
commit f07765b895
2 changed files with 64 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
demo/wasienv/websocket/bulma.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

93
demo/wasienv/websocket/index.html
View File

@ -4,39 +4,72 @@
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Project1</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="bulma.min.css" rel="stylesheet">
<script src="wasmwebsocket.js"></script>
</head>
<body>
<h1>Webassembly Websocket-based chat demo</h1>
<div>
<div>
<label for="edtMessage" >
<div style="display: inline-block; min-width: 10em; margin-bottom: 4px;">From:</div>
</label>
<input id="edtFrom" >
</div>
<div>
<label for="edtTo" autocomplete="off">
<div style="display: inline-block; min-width: 10em; margin-bottom: 4px;">To:</div>
</label>
<input id="edtTo" autocomplete="off">
</div>
<div>
<label for="edtMessage" >
<div style="display: inline-block; min-width: 10em; margin-bottom: 4px;">Message:</div>
</label>
<input id="edtMessage">
<button id="btnSend">Send</button>
</div>
</div>
<div><p>Chat history:</p></div>
<div id="pasjsconsole" style="min-height: 75vh;"></div>
<div>
<label for="cbLog">
<input id="cbLog" type="checkbox" checked autocomplete="off">
Show API log
</label>
</div>
<div class="container">
<h3 class="title is-3">Webassembly Websocket-based chat demo</h3>
<hr>
<div class="box">
<div class="field is-horizontal">
<div class="field-label is-small">
<label class="label is-small" for="edtMessage" >
From:
</label>
</div>
<div class="field-body">
<div class="control">
<input class="input is-small" type="text" id="edtFrom" >
</div>
</div>
</div> <!-- .field -->
<div class="field is-horizontal">
<div class="field-label is-small">
<label class="label is-small" for="edtTo">
To:
</label>
</div>
<div class="field-body">
<div class="control">
<input class="input is-small" type="text" id="edtTo" autocomplete="off">
</div>
</div>
</div> <!-- .field -->
<div class="field is-horizontal">
<div class="field-label is-small">
<label class="label is-small" for="edtMessage" >
Message:
</label>
</div>
<div class="field-body">
<div class="field has-addons">
<div class="control is-expanded">
<input class="input is-small" type="text" id="edtMessage">
</div>
<div class="control">
<button class="button is-small" id="btnSend">Send</button>
</div>
</div>
</div>
</div> <!-- .field -->
</div> <!-- .box -->
<div class="box">
<div><p>Chat history:</p></div>
<div id="pasjsconsole" style="min-height: 75vh;"></div>
<div class="field">
<label class="checkbox" for="cbLog">
<input id="cbLog" type="checkbox" checked autocomplete="off">
Show API log
</label>
</div> <!-- .field -->
</div> <!-- .box -->
</div> <!-- .container -->
<script>
rtl.showUncaughtExceptions=true;
window.addEventListener("load", rtl.run);