Arianne

Marauroa Chat Tutorial/HTML5 Client: Difference between revisions

← Older editNewer edit →
Content deleted Content added
VisualWikitext
imported>Hendrik Brummermann
implementing the framework
imported>Hendrik Brummermann
No edit summary
Line 41:
<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="text" name="chatbar" id="chatbar" style="width:90%">
<input type="submit" value="Send">
Line 94:
== Handling actions ==
 
So far, our client is able to connect to a Marauroa based server and display some basic feedback. There is an input field for chat message. Now we want to send those message to the server.
{{TODO|Complete this section}}▼
== Handling perceptions ==▼
 
In order to keep our code well structures, we create an object called "ui" and a subobject called "chatbar". For Java developers: While Java is a class based programming languages, JavaScript is prototype based.
{{TODO|Complete this section}}
 
document.onkeydown=stendhal.ui.chatBar.keydown;
 
<source lang="javascript">
<!--
/** user interface package */
jSayButton.addActionListener(
ui = {
new ActionListener() {
/** methods for the chat input box */
public void actionPerformed(ActionEvent e) {
chatBar: {
String message = jInputField.getText();
jInputField.setText(""); /** clear the chat window */
clear: function() {
client.SendMessage(message);
document.getElementById('chatbar').value = '';
}
},
});
 
/** send a message to the server */
send: function() {
var val = document.getElementById('chatbar').value;
 
// create an RPAction object of type "chat" with the message.
var action = {
"type": "chat",
"text": val;
};
 
// send the message to the server and clear the input field
marauroa.clientFramework.sendAction(action);
this.clear();
}
}
}
</source>
 
▲== Handling perceptions ==
 
▲{{TODO|Complete this section}}
 
 
== Deployment ==
Retrieved from "https://meet.konsthol.eu/w/index.php?title=Marauroa_Chat_Tutorial/HTML5_Client"