From 6bad8695014fec40fd9a24ebb3f9c586339c9749 Mon Sep 17 00:00:00 2001
From: stephen mcquay <stephen@mcquay.me>
Date: Sun, 30 Aug 2015 00:58:18 -0700
Subject: [PATCH] added fetching of source

---
 ui/arena/index.html |  35 +++++-------
 ui/js/arena.js      | 127 +++++++++-----------------------------------
 2 files changed, 39 insertions(+), 123 deletions(-)
diff --git a/ui/arena/index.html b/ui/arena/index.html
index e0bbd59..80167c6 100644
--- a/ui/arena/index.html
+++ b/ui/arena/index.html
@@ -10,13 +10,12 @@
     <body>
         <div class="container">
             <div  id="error" class="alert alert-danger">
-                <div class="container"></div>
+                <div class="container">Placeholder...</div>
             </div>
         </div>
 
         <div style="float:right; text-align:right;">
-            <strong><a href="/ui">HackerBots</a>&nbsp&nbsp</strong>
-            <br>{{ server.hostname }}&nbsp&nbsp{{game}}&nbsp&nbsp
+            <strong><a href="/ui">Game Center</a>&nbsp&nbsp</strong>
         </div>
         <ul class="nav nav-tabs" id='tabs'>
             <li><a href="#code" data-toggle="tab" class='active'>Code</a></li>
@@ -32,26 +31,20 @@
                 <div style="float:left; padding:20px">
                     <div id="starters">
                         <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>
-                    </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>
-                        <button class='btn bt-primary' id='rename' style="width:100px;">Rename Bot</button><br><br>
-                        <br><br>
+                        <button id='watch'   class="btn btn-success" style="width:100px;">Watch</button><br><br>
                     </div>
                 </div>
-                <pre id="editor" class="center"></pre>
+                <div id="fetch-area">
+                    <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>
+                <pre id="editor" style="display: none;" class="center"></pre>
             </div>
 
             <div class="tab-pane" id="arena">
diff --git a/ui/js/arena.js b/ui/js/arena.js
index b42b972..5aaa711 100644
--- a/ui/js/arena.js
+++ b/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(){
+    $('#starter,#watch').prop('disabled', 'disabled');
     $("#error").hide();
     editor = ace.edit("editor");
     editor.setTheme("ace/theme/monokai");
     editor.getSession().setMode("ace/mode/javascript");
 
     function resizeAce() {
-        return $('#editor').height($(window).height() - $("#editor").offset().top - 20);
+        return $('#editor').height($(window).height() - $("#editor").offset().top - 100);
     };
 
     $(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() {
-        savebot();
-
         $('#tabs a[href="#arena"]').tab('show');
         var url = "ws://{{ server.hostname }}:8666/ws/";
         gorobots.set_spectator(false);
@@ -132,8 +34,6 @@ $(document).ready(function(){
                 );
     });
     $('#watch').click(function() {
-        savebot();
-
         $('#tabs a[href="#arena"]').tab('show');
         var url = "ws://{{ server.hostname }}:8666/ws/";
         gorobots.set_spectator(true);
@@ -145,4 +45,27 @@ $(document).ready(function(){
 
     $('#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();
+    });
+}
