[new] add difficulty selection

resources/css/style.css

@@ -2,6 +2,7 @@ body {
     font-size: 18px;
     height: 100%;
     background-color: #FFF;
+    min-width:555px;
 }
 
 /*-------- Navbar --------*/

resources/index.html

@@ -246,7 +246,7 @@
                                 <th scope="col">Your Solution</th>
                                 <th scope="col">Best Solution</th>
                                 <th scope="col">Download</th>
-                                <th scope="col"></th>
+                                <th scope="col">Submit</th>
                             </tr>
                             </thead>
                             <tbody>
@@ -254,8 +254,10 @@
                                 <th scope="col">ulysses16</th>
                                 <td id="ulysses16_your">-</td>
                                 <td id="ulysses16_best">Inf</td>
-                                <td id="ulysses16_download">
+                                <td>
+                                    <div id="ulysses16_download">
                                         <a href="" target="_blank"><span class="badge badge-primary link">txt</span></a> &nbsp;&nbsp; <a href="" target="_blank"><span class="badge badge-success link">json</span></a>
+                                    </div>
                                 </td>
                                 <td>
                                     <button type="submit" class="btn btn-primary" id="ulysses16_submit">Submit</button>
@@ -265,8 +267,10 @@
                                 <th scope="col">att48</th>
                                 <td id="att48_your">-</td>
                                 <td id="att48_best">Inf</td>
-                                <td id="att48_download">
+                                <td>
+                                    <div id="att48_download">
                                         <a href="" target="_blank"><span class="badge badge-primary link">txt</span></a> &nbsp;&nbsp; <a href="" target="_blank"><span class="badge badge-success link">json</span></a>
+                                    </div>
                                 </td>
                                 <td>
                                     <button type="submit" class="btn btn-primary" id="att48_submit">Submit</button>
@@ -276,8 +280,10 @@
                                 <th scope="col">st70</th>
                                 <td id="st70_your">-</td>
                                 <td id="st70_best">Inf</td>
-                                <td id="st70_download">
+                                <td>
+                                    <div id="st70_download">
                                         <a href="" target="_blank"><span class="badge badge-primary link">txt</span></a> &nbsp;&nbsp; <a href="" target="_blank"><span class="badge badge-success link">json</span></a>
+                                    </div>
                                 </td>
                                 <td>
                                     <button type="submit" class="btn btn-primary" id="st70_submit">Submit</button>
@@ -287,8 +293,10 @@
                                 <th scope="col">a280</th>
                                 <td id="a280_your">-</td>
                                 <td id="a280_best">Inf</td>
-                                <td id="a280_download">
+                                <td>
+                                    <div id="a280_download">
                                         <a href="" target="_blank"><span class="badge badge-primary link">txt</span></a> &nbsp;&nbsp; <a href="" target="_blank"><span class="badge badge-success link">json</span></a>
+                                    </div>
                                 </td>
                                 <td>
                                     <button type="submit" class="btn btn-primary" id="a280_submit">Submit</button>
@@ -298,8 +306,10 @@
                                 <th scope="col">pcb442</th>
                                 <td id="pcb442_your">-</td>
                                 <td id="pcb442_best">Inf</td>
-                                <td id="pcb442_download">
+                                <td>
+                                    <div id="pcb442_download">
                                         <a href="" target="_blank"><span class="badge badge-primary link">txt</span></a> &nbsp;&nbsp; <a href="" target="_blank"><span class="badge badge-success link">json</span></a>
+                                    </div>
                                 </td>
                                 <td>
                                     <button type="submit" class="btn btn-primary" id="pcb442_submit">Submit</button>
@@ -309,8 +319,10 @@
                                 <th scope="col">dsj1000</th>
                                 <td id="dsj1000_your">-</td>
                                 <td id="dsj1000_best">Inf</td>
-                                <td id="dsj1000_download">
+                                <td>
+                                    <div id="dsj1000_download">
                                         <a href="" target="_blank"><span class="badge badge-primary link">txt</span></a> &nbsp;&nbsp; <a href="" target="_blank"><span class="badge badge-success link">json</span></a>
+                                    </div>
                                 </td>
                                 <td>
                                     <button type="submit" class="btn btn-primary" id="dsj1000_submit">Submit</button>
@@ -337,6 +349,18 @@
                         <form class="" method="POST" enctype="multipart/form-data" id="fileUploadForm">
                             <div class="form-group">
                                 <input type="file" class="form-control form-control-lg form-control-file mb-3" id="uploadfile" placeholder="Upload File"  name="uploadfile" accept=".py"  data-browse-on-zone-click="true" data-allowed-file-extensions='["py"]' ></input>
+                                <div class="form-check form-check-inline mt-2">
+                                  <input class="form-check-input btn btn-primary" type="checkbox" id="inlineCheckbox1" value="option1" checked>
+                                  <label class="form-check-label" for="inlineCheckbox1">Simple</label>
+                                </div>
+                                <div class="form-check form-check-inline">
+                                  <input class="form-check-input" type="checkbox" id="inlineCheckbox2" value="option2">
+                                  <label class="form-check-label" for="inlineCheckbox2">Medium</label>
+                                </div>
+                                <div class="form-check form-check-inline">
+                                  <input class="form-check-input" type="checkbox" id="inlineCheckbox3" value="option3">
+                                  <label class="form-check-label" for="inlineCheckbox3">Difficult</label>
+                                </div>
                                 <button type="submit" class="btn btn-primary form-control mt-3" id="btnSubmit" disabled>Upload</button>
                             </div>
                         </form>

resources/js/script.js

@@ -48,12 +48,12 @@ $( document ).ready( () => {
     $('#pcb442_download').hide();
     $('#dsj1000_download').hide();
 
-    $('#ulysses16_submit').hide();
+    $('#ulysses16_submit').prop('disabled', true);
-    $('#att48_submit').hide();
+    $('#att48_submit').prop('disabled', true);
-    $('#st70_submit').hide();
+    $('#st70_submit').prop('disabled', true);
-    $('#a280_submit').hide();
+    $('#a280_submit').prop('disabled', true);
-    $('#pcb442_submit').hide();
+    $('#pcb442_submit').prop('disabled', true);
-    $('#dsj1000_submit').hide();
+    $('#dsj1000_submit').prop('disabled', true);
 
     $( "#ulysses16_submit" ).click(function() {
         if (check_submit_info())
@@ -104,6 +104,39 @@ $( document ).ready( () => {
         }
     });
 
+    //  User option
+    var user_option = {};
+    user_option.easy = true;
+    user_option.medium = false;
+    user_option.difficult = false;
+
+    $('#inlineCheckbox1').change(function() {
+        if (this.checked) {
+            user_option.easy = true;
+        } else {
+            user_option.easy = false;
+        }
+        socket.emit('option', user_option);
+    });
+
+    $('#inlineCheckbox2').change(function() {
+        if (this.checked) {
+            user_option.medium = true;
+        } else {
+            user_option.medium = false;
+        }
+        socket.emit('option', user_option);
+    });
+
+    $('#inlineCheckbox3').change(function() {
+        if (this.checked) {
+            user_option.difficult = true;
+        } else {
+            user_option.difficult = false;
+        }
+        socket.emit('option', user_option);
+    });
+
     // Initialize file uploader
     // initialize with defaults
     // $("#uploadfile").fileinput();
@@ -149,15 +182,18 @@ $( document ).ready( () => {
     $("#btnSubmit").click((event) => {
         // stop submit the form, we will post it manually.
         event.preventDefault();
+
         // Hide submit
-        $('#ulysses16_submit').hide();
+        $('#ulysses16_submit').prop('disabled', true);
-        $('#att48_submit').hide();
+        $('#att48_submit').prop('disabled', true);
-        $('#st70_submit').hide();
+        $('#st70_submit').prop('disabled', true);
-        $('#a280_submit').hide();
+        $('#a280_submit').prop('disabled', true);
-        $('#pcb442_submit').hide();
+        $('#pcb442_submit').prop('disabled', true);
-        $('#dsj1000_submit').hide();
+        $('#dsj1000_submit').prop('disabled', true);
+
         $("#submit_name").val('');
         $("#submit_desc").val('');
+
         // Hide Download
         $('#ulysses16_download').hide();
         $('#att48_download').hide();
@@ -194,14 +230,12 @@ function check_submit_info() {
 }
 
 function disable_btn(btn) {
-    btn.show();
     btn.removeClass('btn-primary');
     btn.text('Submitted');
     btn.prop('disabled', true);
 }
 
 function enable_btn(btn) {
-    btn.show();
     btn.addClass('btn-primary');
     btn.text('Submit');
     btn.prop('disabled', false);

resources/js/socket_script.js

@@ -150,12 +150,12 @@ socket.on('result', (res) => {
 
     res = JSON.parse(res);
 
-    $("#ulysses16_your").text('Error');
+    $("#ulysses16_your").text('-');
-    $("#att48_your").text('Error');
+    $("#att48_your").text('-');
-    $("#st70_your").text('Error');
+    $("#st70_your").text('-');
-    $("#a280_your").text('Error');
+    $("#a280_your").text('-');
-    $("#pcb442_your").text('Error');
+    $("#pcb442_your").text('-');
-    $("#dsj1000_your").text('Error');
+    $("#dsj1000_your").text('-');
 
     $("#ulysses16_your").removeClass('blink_me');
     $("#att48_your").removeClass('blink_me');

server.js

@@ -181,7 +181,16 @@ var update_submission = (socket, sessionID) => {
 
 var check_time = 0
 
-var docker_build = (socket, sessionID) => {
+var docker_build = (socket, sessionID, option) => {
+
+    options = ""
+    if (option.easy)
+        options += " -e "
+    if (option.medium)
+        options += " -m "
+    if (option.difficult)
+        options += " -d "
+
     check_time = 0
     console.log('[server][start]', sessionID)
     socket.emit('start')
@@ -198,7 +207,8 @@ var docker_build = (socket, sessionID) => {
                 '/uploads/' + sessionID.toString() + '/my_model.py:/tsp/model/my_model.py',
                 "/output/" + sessionID.toString() + "/:/output/"
             ]
-        }
+        },
+        Cmd: ['/bin/bash', '-c', 'python main.py' + options + '; mkdir -p /output && cp -r output/* /output']
     })
     .then( (container) => {
         // Start container
@@ -295,6 +305,7 @@ var docker_build = (socket, sessionID) => {
 var clients = 0
 
 io.on('connection', (socket) => {
+
     // New client connected
     const sessionID = socket.id
     console.log('[client][connection]', sessionID)
@@ -307,6 +318,17 @@ io.on('connection', (socket) => {
     // console.log(leaderboard)
     socket.emit('leaderboard', leaderboard)
 
+    user_option = {}
+    user_option.easy = true
+    user_option.medium = false
+    user_option.difficult = false
+
+    //  Client change build option
+    socket.on('option', (option) => {
+        console.log('[client][option]', option)
+        user_option = option
+    })
+
     // Client disconnected
     socket.on('disconnect', () => {
         clients = clients - 1
@@ -317,7 +339,7 @@ io.on('connection', (socket) => {
     // Client request a build
     socket.on('build', () => {
         console.log('[client][build]', sessionID)
-        docker_build(socket, sessionID)
+        docker_build(socket, sessionID, user_option)
     })
 
     //  Client submited a new result