added fetching of source
This commit is contained in:
parent
33f94af784
commit
6bad869501
@ -10,13 +10,12 @@
|
|||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div id="error" class="alert alert-danger">
|
<div id="error" class="alert alert-danger">
|
||||||
<div class="container"></div>
|
<div class="container">Placeholder...</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="float:right; text-align:right;">
|
<div style="float:right; text-align:right;">
|
||||||
<strong><a href="/ui">HackerBots</a>  </strong>
|
<strong><a href="/ui">Game Center</a>  </strong>
|
||||||
<br>{{ server.hostname }}  {{game}}  
|
|
||||||
</div>
|
</div>
|
||||||
<ul class="nav nav-tabs" id='tabs'>
|
<ul class="nav nav-tabs" id='tabs'>
|
||||||
<li><a href="#code" data-toggle="tab" class='active'>Code</a></li>
|
<li><a href="#code" data-toggle="tab" class='active'>Code</a></li>
|
||||||
@ -34,24 +33,18 @@
|
|||||||
<button id='starter' class="btn btn-primary" style="width:100px;">Play</button><br><br>
|
<button id='starter' class="btn btn-primary" style="width:100px;">Play</button><br><br>
|
||||||
<button id='watch' class="btn btn-success" style="width:100px;">Watch</button><br><br>
|
<button id='watch' class="btn btn-success" style="width:100px;">Watch</button><br><br>
|
||||||
</div>
|
</div>
|
||||||
<br>
|
|
||||||
<div>
|
|
||||||
<select id="robot_picker" class="form-control" style='width:100px'>
|
|
||||||
{% for bot in bots %}
|
|
||||||
<option value="{{bot.id}}">{{bot.name}}</option>
|
|
||||||
{% endfor %}
|
|
||||||
</select><br>
|
|
||||||
<button class='btn bt-primary' id='save' style="width:100px;">Save Bot</button><br>
|
|
||||||
<span class='under-button' id='lastsave'></span><br><br>
|
|
||||||
<button class='btn bt-primary' id='new' style="width:100px;">New Bot</button><br><br>
|
|
||||||
<div id='rename-block' style='display:none;'>
|
|
||||||
<input type='text' id='newname' style="width:100px; "><br><br>
|
|
||||||
</div>
|
</div>
|
||||||
<button class='btn bt-primary' id='rename' style="width:100px;">Rename Bot</button><br><br>
|
<div id="fetch-area">
|
||||||
<br><br>
|
<label for="fetch-url">Source URI:</label>
|
||||||
|
<div class="input-group">
|
||||||
|
<span class="input-group-addon">@</span>
|
||||||
|
<input type="url" class="form-control" id="fetch-url" placeholder="https://gist.github.com/...">
|
||||||
|
<span class="input-group-btn">
|
||||||
|
<button id="fetch-button" class="btn btn-default" type="button">fetch</button>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<pre id="editor" class="center"></pre>
|
<pre id="editor" style="display: none;" class="center"></pre>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="tab-pane" id="arena">
|
<div class="tab-pane" id="arena">
|
||||||
|
|||||||
127
ui/js/arena.js
127
ui/js/arena.js
@ -1,73 +1,12 @@
|
|||||||
var savebot = function(name, callback){
|
|
||||||
data = {
|
|
||||||
"id": $("#robot_picker").val(),
|
|
||||||
"code": editor.getValue()
|
|
||||||
};
|
|
||||||
|
|
||||||
if (name){
|
|
||||||
data.name = name;
|
|
||||||
}
|
|
||||||
|
|
||||||
$.ajax({
|
|
||||||
method:"POST",
|
|
||||||
data: JSON.stringify(data),
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
url:"/api/v1/bot/" + $("#robot_picker").val() + "/",
|
|
||||||
success: function(data){
|
|
||||||
var d = new Date();
|
|
||||||
$("#lastsave").html("Saved at " + d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds());
|
|
||||||
|
|
||||||
if (callback){
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
var newbot = function(){
|
|
||||||
data = {
|
|
||||||
"code": editor.getValue(),
|
|
||||||
};
|
|
||||||
$.ajax({
|
|
||||||
method:"POST",
|
|
||||||
data: JSON.stringify(data),
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
url:"/api/v1/bot/" + $("#robot_picker").val() + "/",
|
|
||||||
success: function(data){
|
|
||||||
console.log(data);
|
|
||||||
if (data.id){
|
|
||||||
$("#robot_picker").val(data.id);
|
|
||||||
}
|
|
||||||
// I'm lazy
|
|
||||||
set_current_bot(data.id);
|
|
||||||
location.reload();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
var set_current_bot = function(name){
|
|
||||||
var queryParameters = {}, queryString = location.search.substring(1),
|
|
||||||
re = /([^&=]+)=([^&]*)/g, m;
|
|
||||||
|
|
||||||
while (m = re.exec(queryString)) {
|
|
||||||
queryParameters[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
|
|
||||||
}
|
|
||||||
queryParameters['bot'] = name;
|
|
||||||
history.pushState(null, null, "?"+ $.param(queryParameters));
|
|
||||||
};
|
|
||||||
|
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
|
$('#starter,#watch').prop('disabled', 'disabled');
|
||||||
$("#error").hide();
|
$("#error").hide();
|
||||||
editor = ace.edit("editor");
|
editor = ace.edit("editor");
|
||||||
editor.setTheme("ace/theme/monokai");
|
editor.setTheme("ace/theme/monokai");
|
||||||
editor.getSession().setMode("ace/mode/javascript");
|
editor.getSession().setMode("ace/mode/javascript");
|
||||||
|
|
||||||
function resizeAce() {
|
function resizeAce() {
|
||||||
return $('#editor').height($(window).height() - $("#editor").offset().top - 20);
|
return $('#editor').height($(window).height() - $("#editor").offset().top - 100);
|
||||||
};
|
};
|
||||||
|
|
||||||
$(window).resize(resizeAce);
|
$(window).resize(resizeAce);
|
||||||
@ -85,44 +24,7 @@ $(document).ready(function(){
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#save").click(function(e){
|
|
||||||
savebot();
|
|
||||||
});
|
|
||||||
|
|
||||||
$("#new").click(function(e){
|
|
||||||
newbot();
|
|
||||||
});
|
|
||||||
|
|
||||||
var renaming = false;
|
|
||||||
$("#rename").click(function(e){
|
|
||||||
if (renaming){
|
|
||||||
// POST new name to server
|
|
||||||
savebot($("#newname").val(), function(){
|
|
||||||
// BE LAZY
|
|
||||||
location.reload();
|
|
||||||
});
|
|
||||||
|
|
||||||
$("#rename-block").hide();
|
|
||||||
$("#rename").html("Rename Bot");
|
|
||||||
renaming = false;
|
|
||||||
} else {
|
|
||||||
$("#rename-block").show();
|
|
||||||
$("#rename").html("Ok");
|
|
||||||
renaming = true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$.ajax({
|
|
||||||
url:"/api/v1/bot/1/",
|
|
||||||
success: function(data){
|
|
||||||
editor.setValue(data.code);
|
|
||||||
$("#robot_picker").val(1);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#starter').click(function() {
|
$('#starter').click(function() {
|
||||||
savebot();
|
|
||||||
|
|
||||||
$('#tabs a[href="#arena"]').tab('show');
|
$('#tabs a[href="#arena"]').tab('show');
|
||||||
var url = "ws://{{ server.hostname }}:8666/ws/";
|
var url = "ws://{{ server.hostname }}:8666/ws/";
|
||||||
gorobots.set_spectator(false);
|
gorobots.set_spectator(false);
|
||||||
@ -132,8 +34,6 @@ $(document).ready(function(){
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
$('#watch').click(function() {
|
$('#watch').click(function() {
|
||||||
savebot();
|
|
||||||
|
|
||||||
$('#tabs a[href="#arena"]').tab('show');
|
$('#tabs a[href="#arena"]').tab('show');
|
||||||
var url = "ws://{{ server.hostname }}:8666/ws/";
|
var url = "ws://{{ server.hostname }}:8666/ws/";
|
||||||
gorobots.set_spectator(true);
|
gorobots.set_spectator(true);
|
||||||
@ -145,4 +45,27 @@ $(document).ready(function(){
|
|||||||
|
|
||||||
$('#tabs a[href="#code"]').tab('show');
|
$('#tabs a[href="#code"]').tab('show');
|
||||||
|
|
||||||
|
$("#fetch-url").keydown(function(e){
|
||||||
|
if(e.keyCode == 13 || e.keyCode == 32){
|
||||||
|
loadCode();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
$("#fetch-button").click(loadCode);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function loadCode() {
|
||||||
|
var url = $("#fetch-url").val();
|
||||||
|
$.get(url).success(function(e) {
|
||||||
|
$("#error").val(e).hide();
|
||||||
|
editor.setValue(e);
|
||||||
|
$("#editor").show();
|
||||||
|
$("#fetch-area").hide();
|
||||||
|
$('#starter,#watch').prop('disabled', function(i, v) { return !v; });
|
||||||
|
}).fail(function(e){
|
||||||
|
var msg = "got a useless error message; is the remote server down?";
|
||||||
|
if (e.statusText != "error") {
|
||||||
|
msg = e.responseText;
|
||||||
|
}
|
||||||
|
$("#error").text(msg).show();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user