Marauroa Chat Tutorial/HTML5 Client: Difference between revisions
Content deleted Content added
imported>Hendrik Brummermann Created page with "{{Navigation for Marauroa Top|Using}} {{Navigation for Marauroa Users}} {{Marauroa Chat Tutorial}} <div style="padding: 1em; border: 2px solid #AA0;"> HTML5 support in Marauroa ..." |
imported>Hendrik Brummermann No edit summary |
||
Line 13:
We start our HTML 5 client by creating a HTML page consisting of an output area for the chat log and a small input field to enter text. We use CSS rules to make the page look nicely. We are using a development version of Marauroa, which consists of several JS files. The final version will consists of one file to reduce startup time.
<source lang="
<!doctype html>
<html><head>
<title>Marautoa Chat Tutoral Client in HTML 5</title>
<style type="text/css">
body {font-family: "Arial"}
#chat {border: 1px solid #000; padding:0.5em; overflow-y: scroll}
#chat p {margin: 0}
p.logclient {color: #888}
p.logerror {color: #F00}
</style>
<!-- low level communication -->
<script src="json.js"></script>▼
<script src="
<script
<!-- Marauroa -->
<script type="text/javascript" src="client-framework.js"></script>▼
<script type="text/javascript" src="
<script type="text/javascript" src="
<script type="text/javascript" src="
<script type="text/javascript" src="
<!-- Out code -->
</head>
<body>
<h1>Marautoa Chat Tutoral Client in HTML 5</h1>
<!-- input field for text -->
<form id="form" onsubmit="stendhal.ui.chatBar.send(); return false">
<input type="submit" value="Send">
</form>
<div id="chat" style="height:200px">▼
<!-- Chat history -->
<noscript>JavaScript is required by the Web Client.</noscript>▼
▲ <div id="chat" style="height:200px">
▲ <noscript>JavaScript is required by the Web Client.</noscript>
</body>▼
</
▲</body></html>
</source>
| |||