Skip to content

Instantly share code, notes, and snippets.

@fry

fry/config.html

Last active June 8, 2018 17:38
Show Gist options
  • Save fry/59a20b44248392e23ba42d9792a0a66a to your computer and use it in GitHub Desktop.
Save fry/59a20b44248392e23ba42d9792a0a66a to your computer and use it in GitHub Desktop.
Download ZIP
Raw
config.html
<html>
<head>
<title>RFID game</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
var mqtt
var state = {}
function onConnect() {
console.log("Connected")
mqtt.subscribe("rfidgame/state")
}
function onMessage(msg) {
console.log(msg)
state = JSON.parse(msg.payloadString)
console.log("a", state)
$("#fountainBases").val(state['bases']['fountain']['requiredBases'].join(","))
$("#fountainCapturedDuration").val(state['bases']['fountain']['capturedDuration'])
$("#baseCaptureDuration").val(state['config']['baseCaptureDuration'])
$("#fountainCooldown").val(state['config']['fountainCooldown'])
$("#fountainLesserCooldown").val(state['config']['fountainLesserCooldown'])
$("#fountainRewards").val(state['stats']['fountainRewards'])
$("#fountainLesserRewards").val(state['stats']['fountainLesserRewards'])
$("#playerCount").val(Object.keys(state['players']).length.toString())
}
function mqttConnect() {
mqtt = new Paho.MQTT.Client("192.168.3.71", 9001, "clientjs")
mqtt.onMessageArrived = onMessage
mqtt.connect({ timeout: 10, onSuccess: onConnect })
}
function onSubmit() {
console.log("submit!")
state['bases']['fountain']['requiredBases'] = $("#fountainBases").val().split(",")
state['bases']['fountain']['capturedDuration'] = parseInt($("#fountainCapturedDuration").val())
state['config']['baseCaptureDuration'] = $("#baseCaptureDuration").val()
state['config']['fountainCooldown'] = $("#fountainCooldown").val()
state['config']['fountainLesserCooldown'] = $("#fountainLesserCooldown").val()
console.log(state)
mqtt.send("rfidgame/state", JSON.stringify(state))
}
function sendPrint(msg) {
mqtt.send('rfidgame/printmojito', msg)
}
</script>
</head>
<body>
<script>
mqttConnect()
</script>
Required Bases for fountain:<br/>
<input id="fountainBases" />
<br/>
Fountain captured duration:<br/>
<input id="fountainCapturedDuration" />
<br/>
Base captured duration:<br/>
<input id="baseCaptureDuration" />
<br/>
Cooldown after receiving mojitos:<br/>
<input id="fountainCooldown" />
<br/>
Cooldown after receiving ingredient:<br/>
<input id="fountainLesserCooldown" />
<br/>
Mojitos given out:<br/>
<input id="fountainRewards" />
<br/>
Ingredients given out:<br/>
<input id="fountainLesserRewards" />
<br/>
Player count<br/>
<input id="playerCount" />
<br/>
<input type="button" onClick="onSubmit()" value="Update"/>
<input type="button" onClick="sendPrint('mojito')" value="print mojito"/>
</body>
</html>
Raw
gistfile1.txt
<html>
<head>
<title>RFID game</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
var mqtt
var state = {}
function onConnect() {
console.log("Connected")
mqtt.subscribe("rfidgame/state")
}
function onMessage(msg) {
console.log(msg)
state = JSON.parse(msg.payloadString)
console.log("a", state)
$("#fountainBases").val(state['bases']['fountain']['requiredBases'].join(","))
$("#fountainCapturedDuration").val(state['bases']['fountain']['capturedDuration'])
$("#baseCaptureDuration").val(state['config']['baseCaptureDuration'])
$("#fountainCooldown").val(state['config']['fountainCooldown'])
$("#fountainLesserCooldown").val(state['config']['fountainLesserCooldown'])
$("#fountainRewards").val(state['stats']['fountainRewards'])
$("#fountainLesserRewards").val(state['stats']['fountainLesserRewards'])
$("#playerCount").val(Object.keys(state['players']).length.toString())
}
function mqttConnect() {
mqtt = new Paho.MQTT.Client("192.168.3.71", 9001, "clientjs")
mqtt.onMessageArrived = onMessage
mqtt.connect({ timeout: 10, onSuccess: onConnect })
}
function onSubmit() {
console.log("submit!")
state['bases']['fountain']['requiredBases'] = $("#fountainBases").val().split(",")
state['bases']['fountain']['capturedDuration'] = parseInt($("#fountainCapturedDuration").val())
state['config']['baseCaptureDuration'] = $("#baseCaptureDuration").val()
state['config']['fountainCooldown'] = $("#fountainCooldown").val()
state['config']['fountainLesserCooldown'] = $("#fountainLesserCooldown").val()
console.log(state)
mqtt.publish("rfidgame/state", JSON.stringify(state))
}
function sendPrint(msg) {
mqtt.publish('rfidgame/printmojito', msg)
}
</script>
</head>
<body>
<script>
mqttConnect()
</script>
Required Bases for fountain:<br/>
<input id="fountainBases" />
<br/>
Fountain captured duration:<br/>
<input id="fountainCapturedDuration" />
<br/>
Base captured duration:<br/>
<input id="baseCaptureDuration" />
<br/>
Cooldown after receiving mojitos:<br/>
<input id="fountainCooldown" />
<br/>
Cooldown after receiving ingredient:<br/>
<input id="fountainLesserCooldown" />
<br/>
Mojitos given out:<br/>
<input id="fountainRewards" />
<br/>
Ingredients given out:<br/>
<input id="fountainLesserRewards" />
<br/>
Player count<br/>
<input id="playerCount" />
<br/>
<input type="button" onClick="onSubmit()" value="Update"/>
<input type="button" onClick="sendPrint('mojito')" value="print mojito"/>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment