testing chat hamsters

master
louisa 1 year ago
parent 09e4a1cd8d
commit 17d7285aa4

@ -13,8 +13,8 @@ var udpPort = new osc.UDPPort({
localPort: 57121,
// This is where sclang is listening for OSC messages.
remoteAddress: "192.168.2.147", //this is the hamsters ip
remotePort: 57120, //this is the hamsters port :*s
remoteAddress: "192.168.2.151", //this is the hamsters ip
remotePort: 8080, //this is the hamsters port :*s
metadata: true
});
@ -59,10 +59,10 @@ io.on('connection', function(socket) {
var oscmsg = {
address: "/silentserver",
args: [
{
type: "s",
value: "user"
},
// {
// type: "s",
// value: "user"
// },
{
type: "s",
value: msg

@ -19,8 +19,13 @@
<div class="wrapper">
<div class="flex-container">
<div class="flex-left">
<div class="section">
<div class="section" id="chat-window">
<ul id="messages"></ul>
<span><form id="form" action="">
<input id="input" autocomplete="off"/><button onclick="sendMessage()">>>></button>
</form></span>
</div>
<div class="section">
<!-- <progress id="file" max="100" value="70"> 70% </progress> -->
<p>>>> CACHE CODE:</p>
<span><form id="form" action="">
@ -198,6 +203,10 @@
//testing socket message from textinput field to arduino
var messages = document.getElementById('messages');
var chatHistory = localStorage.getItem('chatHistory');
if (chatHistory) {
messages.innerHTML = chatHistory;
}
function sendMessage() {
@ -207,15 +216,10 @@
item.textContent = message;
item.className = 'me';
messages.appendChild(item);
if (message === 'BLINK') {
socket.emit('blink');
console.log('socket: blink');
}
inputField.value = '';
socket.emit('chat message', message);
messages.scrollTop = messages.scrollHeight;
localStorage.setItem('chatHistory', messages.innerHTML);
}
@ -224,8 +228,10 @@
item.textContent = msg;
item.className = 'others';
messages.appendChild(item);
messages.scrollTop = messages.scrollHeight - messages.clientHeight;
});
</script>
<script type="text/javascript" src="js/input.js"></script>S
<script type="text/javascript" src="js/input.js"></script>
</html>

@ -334,4 +334,46 @@ button:active{
#location-log{
display: none;
}
}
#chat-window{
height: 40vh;
border: 1px solid #ccc;
padding: 10px;
overflow-y: scroll;
}
#messages {
height: 40vh;
overflow-y: auto;
padding: 0;
word-wrap: break-word;
}
#messages li {
padding: 5px;
margin-bottom: 10px;
display: block;
}
.me {
text-align: right;
color: #e8b722;
padding-bottom: 2px;
border-radius: 4px;
display: inline-block;
}
.others {
text-align: left;
color: #DE6C3F;
border-radius: 4px;
display: inline-block;
}
input[type="text"] {
padding: 5px;
}

Loading…
Cancel
Save