[clean] clean code
This commit is contained in:
@@ -143,14 +143,14 @@ body::after {
|
||||
margin-top: 10%;
|
||||
margin-left: 40%;
|
||||
width: 80%;
|
||||
content:url("/static/img/exeter.png");
|
||||
content:url("/img/exeter.png");
|
||||
}
|
||||
|
||||
.russell {
|
||||
margin-top: 5%;
|
||||
margin-left: 40%;
|
||||
width: 80%;
|
||||
content:url("/static/img/russell.png");
|
||||
content:url("/img/russell.png");
|
||||
}
|
||||
|
||||
#main-footer {
|
||||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
487
resources/index.html
Normal file
487
resources/index.html
Normal file
@@ -0,0 +1,487 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>COM2014 TSP Workshop</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
||||
<!-- Bootstrap -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
|
||||
|
||||
<!-- Jquery -->
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
|
||||
|
||||
<!-- SocketIO -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/3.0.4/socket.io.js"></script>
|
||||
|
||||
<!-- Console Log -->
|
||||
<script type="application/javascript" src="//cdn.rawgit.com/Alorel/console-log-html/master/console-log-html.min.js"></script>
|
||||
|
||||
<!-- FullPage -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/jquery.fullpage.css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/jquery.fullpage.js"></script>
|
||||
|
||||
<!-- File Input -->
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.1.3/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" />
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" crossorigin="anonymous">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/5.1.3/js/fileinput.min.js"></script>
|
||||
<script src="/themes/fas/theme.js" type="text/javascript"></script>
|
||||
<script src="/themes/explorer-fas/theme.js" type="text/javascript"></script>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Ubuntu+Mono" />
|
||||
|
||||
<!-- My Script -->
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<script src="/js/script.js"></script>
|
||||
<script src="/js/socket_script.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body data-spy="scroll" data-target="#main-nav" data-offset="0">
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar navbar-expand-md bg-dark navbar-dark sticky-top" id="main-nav">
|
||||
<a class="navbar-brand" href="/">TSP Workshop <span class="badge badge-primary" id="status"><span id="user_counts">0</span> Online</span></a>
|
||||
<button class="navbar-toggler" data-toggle="collapse" data-target="#navbarCollapse">
|
||||
<span class="navbar-toggler-icon "></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-right" id="navbarCollapse">
|
||||
<ul class="nav navbar-nav ml-auto">
|
||||
<li class="nav-item" >
|
||||
<a class="nav-link" href="#overview">Overview</a>
|
||||
</li>
|
||||
<li class="nav-item" >
|
||||
<a class="nav-link" href="#leaderboard">Leaderboard</a>
|
||||
</li>
|
||||
<li class="nav-item" >
|
||||
<a class="nav-link" href="#submission">Submission</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div id="fullpage">
|
||||
<div id="overview">
|
||||
<section class="section" id="section2">
|
||||
<div class="slide">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="display-4 mt-5 mb-5 text-center">Traveling Salesman Problem</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-5">
|
||||
<div class="col-12">
|
||||
<div class="embed-responsive embed-responsive-16by9 box-shadow">
|
||||
<iframe class="embed-responsive-item" src="/preview.html" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="leaderboard">
|
||||
<!-- <section class="section" id="section0">
|
||||
<div class="slide">
|
||||
<div class="container">
|
||||
<div class="row text-center">
|
||||
<div class="col-12">
|
||||
<div class="display-3 mb-5">Leaderboard</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<table class="table">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">ulysses16.tsp</th>
|
||||
<th scope="colthead-dark">a280.tsp</th>
|
||||
<th scope="col">pcb442.tsp</th>
|
||||
<th scope="col">dsj1000.tsp</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">1</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">2</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">3</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">4</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">5</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">6</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">7</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">8</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">9</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">10</th>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
<td>Inf</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section> -->
|
||||
<section id="tabs" class="section project-tab" id="section0">
|
||||
<div class="slide">
|
||||
<div class="container">
|
||||
<div class="row text-center">
|
||||
<div class="col-12">
|
||||
<div class="display-3 mb-5">Leaderboard</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<nav>
|
||||
<div class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
|
||||
<a class="nav-item nav-link active" id="nav-ulysses16-tab" data-toggle="tab" href="#nav-ulysses16" role="tab" aria-controls="nav-ulysses16" aria-selected="true">ulysses16</a>
|
||||
<a class="nav-item nav-link" id="nav-att48-tab" data-toggle="tab" href="#nav-att48" role="tab" aria-controls="nav-att48" aria-selected="false">att48</a>
|
||||
<a class="nav-item nav-link" id="nav-st70-tab" data-toggle="tab" href="#nav-st70" role="tab" aria-controls="nav-st70" aria-selected="false">st70</a>
|
||||
<a class="nav-item nav-link" id="nav-a280-tab" data-toggle="tab" href="#nav-a280" role="tab" aria-controls="nav-a280" aria-selected="false">a280</a>
|
||||
<a class="nav-item nav-link" id="nav-pcb442-tab" data-toggle="tab" href="#nav-pcb442" role="tab" aria-controls="nav-pcb442" aria-selected="false">pcb442</a>
|
||||
<a class="nav-item nav-link" id="nav-dsj1000-tab" data-toggle="tab" href="#nav-dsj1000" role="tab" aria-controls="nav-dsj1000" aria-selected="false">dsj1000</a>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="tab-content" id="nav-tabContent">
|
||||
<div class="tab-pane fade show active" id="nav-ulysses16" role="tabpanel" aria-labelledby="nav-ulysses16-tab">
|
||||
<table class="table leaderboard-table" cellspacing="0">
|
||||
<thead class="thead-dark ">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Fitness</th>
|
||||
<th>Remark</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="ulysses16-last">
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="nav-att48" role="tabpanel" aria-labelledby="nav-att48-tab">
|
||||
<table class="table leaderboard-table" cellspacing="0">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Fitness</th>
|
||||
<th>Remark</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="att48-last">
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="nav-st70" role="tabpanel" aria-labelledby="nav-st70-tab">
|
||||
<table class="table leaderboard-table" cellspacing="0">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Fitness</th>
|
||||
<th>Remark</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="st70-last">
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="nav-a280" role="tabpanel" aria-labelledby="nav-a280-tab">
|
||||
<table class="table leaderboard-table" cellspacing="0">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Fitness</th>
|
||||
<th>Remark</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="a280-last">
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="nav-pcb442" role="tabpanel" aria-labelledby="nav-pcb442-tab">
|
||||
<table class="table leaderboard-table" cellspacing="0">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Fitness</th>
|
||||
<th>Remark</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="pcb442-last">
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="nav-dsj1000" role="tabpanel" aria-labelledby="nav-dsj1000-tab">
|
||||
<table class="table leaderboard-table" cellspacing="0">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Fitness</th>
|
||||
<th>Remark</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr id="dsj1000-last">
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="submission">
|
||||
<section class="section" id="section1">
|
||||
<div class="slide">
|
||||
<div class="container">
|
||||
|
||||
<div class="row">
|
||||
<div class="col col-12">
|
||||
<h1 class="mt-5 mb-5">Your Submission</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col col-12">
|
||||
<table class="table">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th scope="col">Problem</th>
|
||||
<th scope="col">Your Solution</th>
|
||||
<th scope="col">Best Solution</th>
|
||||
<th scope="col"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="col">ulysses16.tsp</th>
|
||||
<td id="ulysses16_your">Inf</td>
|
||||
<td id="ulysses16_best">Inf</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-primary" id="ulysses16_submit">Submit</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col">att48.tsp</th>
|
||||
<td id="att48_your">Inf</td>
|
||||
<td id="att48_best">Inf</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-primary" id="att48_submit">Submit</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col">st70.tsp</th>
|
||||
<td id="st70_your">Inf</td>
|
||||
<td id="st70_best">Inf</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-primary" id="st70_submit">Submit</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col">a280.tsp</th>
|
||||
<td id="a280_your">Inf</td>
|
||||
<td id="a280_best">Inf</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-primary" id="a280_submit">Submit</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col">pcb442.tsp</th>
|
||||
<td id="pcb442_your">Inf</td>
|
||||
<td id="pcb442_best">Inf</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-primary" id="pcb442_submit">Submit</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="col">dsj1000.tsp</th>
|
||||
<td id="dsj1000_your">Inf</td>
|
||||
<td id="dsj1000_best">Inf</td>
|
||||
<td>
|
||||
<button type="submit" class="btn btn-primary" id="dsj1000_submit">Submit</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mb-3" id="submission_info">
|
||||
<div class="col col-4">
|
||||
<label for="">Your Name</label>
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Your Name" id="submit_name">
|
||||
</div>
|
||||
<div class="col col-8">
|
||||
<label for="">Description</label>
|
||||
<input class="form-control form-control-lg" type="text" placeholder="Precisely describe your submission." id="submit_desc">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col col-12">
|
||||
<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>
|
||||
<button type="submit" class="btn btn-primary form-control mt-3" id="btnSubmit" disabled>Upload</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div class="row mb-5" id="console-box">
|
||||
<div class="col col-12">
|
||||
<ul id="console"></ul> <!-- I will hold the log messages -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- SubFooter -->
|
||||
<footer id="sub-footer" class="subfooter">
|
||||
<div class="container">
|
||||
<div class="row p-4">
|
||||
<div class="col-md-4 about">
|
||||
<span>ABOUT ETAL</span>
|
||||
<p class="text-justify font-weight-light small">
|
||||
Exeter Trustworthy AI Lab (ETAL) Group is affiliated with College of Engineering, Mathematics and Physical Sciences, University of Exeter, UK.</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="d-none d-md-block col-md-4 link">
|
||||
<img class="exeter" alt="" srcset="">
|
||||
</div>
|
||||
<div class="d-none d-md-block col-md-4 link">
|
||||
<img class="russell" alt="" srcset="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer id="main-footer" class="footer text-center">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md">
|
||||
<span>Copyright © Exeter Trustworthy AI Lab</span>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
236
resources/js/script.js
Normal file
236
resources/js/script.js
Normal file
@@ -0,0 +1,236 @@
|
||||
$( document ).ready( () => {
|
||||
// warn the user when leaving
|
||||
window.onbeforeunload = function(){
|
||||
return "Make sure to save your graph locally before leaving";
|
||||
};
|
||||
|
||||
$('body').scrollspy({ target: '#main-nav', offset: 130 })
|
||||
|
||||
$('#fullpage').fullpage({
|
||||
// anchors: ['underPage', 'gradPage', 'phdPage'],
|
||||
sectionsColor: ['#ffffff', '#f8f8f8'],
|
||||
autoScrolling: false,
|
||||
css3: true,
|
||||
fitToSection: false,
|
||||
afterLoad: function(anchorLink, index) {
|
||||
// history.pushState(null, null, "");
|
||||
// console.log(anchorLink);
|
||||
}
|
||||
});
|
||||
|
||||
// Initialize Console
|
||||
ConsoleLogHTML.connect(document.getElementById("console")); // Redirect log messages
|
||||
// ConsoleLogHTML.disconnect(); // Stop redirecting
|
||||
|
||||
// Navbar click scroll
|
||||
$(".navbar a").on('click', function(event) {
|
||||
// Make sure this.hash has a value before overriding default behavior
|
||||
if (this.hash !== "") {
|
||||
// Prevent default anchor click behavior
|
||||
event.preventDefault();
|
||||
|
||||
// Store hash
|
||||
var hash = this.hash;
|
||||
|
||||
// Using jQuery's animate() method to add smooth page scroll
|
||||
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
|
||||
var offset = 0;
|
||||
if (hash === "#home")
|
||||
{
|
||||
offset = -100;
|
||||
}
|
||||
else {
|
||||
offset = -60;
|
||||
}
|
||||
$('html, body').animate({
|
||||
scrollTop: ($(hash).offset().top + offset)
|
||||
}, 1000, function(){
|
||||
// Add hash (#) to URL when done scrolling (default click behavior)
|
||||
// window.location.hash = hash;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('#submission_info').hide();
|
||||
|
||||
$('#ulysses16_submit').hide();
|
||||
$('#att48_submit').hide();
|
||||
$('#st70_submit').hide();
|
||||
$('#a280_submit').hide();
|
||||
$('#pcb442_submit').hide();
|
||||
$('#dsj1000_submit').hide();
|
||||
|
||||
$( "#ulysses16_submit" ).click(function() {
|
||||
upload_leaderboard('ulysses16');
|
||||
$('#ulysses16_submit').removeClass('btn-primary');
|
||||
$('#ulysses16_submit').text('Submitted');
|
||||
$('#ulysses16_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#att48_submit" ).click(function() {
|
||||
upload_leaderboard('att48');
|
||||
$('#att48_submit').removeClass('btn-primary');
|
||||
$('#att48_submit').text('Submitted');
|
||||
$('#att48_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#st70_submit" ).click(function() {
|
||||
upload_leaderboard('st70');
|
||||
$('#st70_submit').removeClass('btn-primary');
|
||||
$('#st70_submit').text('Submitted');
|
||||
$('#st70_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#a280_submit" ).click(function() {
|
||||
upload_leaderboard('a280');
|
||||
$('#a280_submit').removeClass('btn-primary');
|
||||
$('#a280_submit').text('Submitted');
|
||||
$('#a280_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#pcb442_submit" ).click(function() {
|
||||
upload_leaderboard('pcb442');
|
||||
$('#pcb442_submit').removeClass('btn-primary');
|
||||
$('#pcb442_submit').text('Submitted');
|
||||
$('#pcb442_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#dsj1000_submit" ).click(function() {
|
||||
upload_leaderboard('dsj1000');
|
||||
$('#dsj1000_submit').removeClass('btn-primary');
|
||||
$('#dsj1000_submit').text('Submitted');
|
||||
$('#dsj1000_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
// Initialize file uploader
|
||||
// initialize with defaults
|
||||
// $("#uploadfile").fileinput();
|
||||
|
||||
// with plugin options
|
||||
$("#uploadfile").fileinput({
|
||||
// theme: "fa",
|
||||
'theme': 'fas',
|
||||
showUpload:false,
|
||||
previewFileType:'py',
|
||||
maxFileCount: 1,
|
||||
allowedFileExtensions: ["py"]
|
||||
});
|
||||
|
||||
var url = window.location;
|
||||
|
||||
// GET REQUEST
|
||||
$("#btnGetFiles").click( (event) => {
|
||||
event.preventDefault();
|
||||
ajaxGet();
|
||||
});
|
||||
|
||||
// DO GET
|
||||
function ajaxGet(){
|
||||
$.ajax({
|
||||
type : "GET",
|
||||
url : "/api/files/getall",
|
||||
success: (data) => {
|
||||
// clear old data
|
||||
$("#listFiles").html("");
|
||||
// render list of files
|
||||
$("#listFiles").append('<ul>');
|
||||
$.each(data, (index, filename) => {
|
||||
$("#listFiles").append('<li><a href=' + url + 'api/files/' + filename +'>' + filename + '</a></li>');
|
||||
});
|
||||
$("#listFiles").append('</ul>');
|
||||
},
|
||||
error : (err) => {
|
||||
$("#listFiles").html(err.responseText);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Upload File
|
||||
$('#uploadfile').change(function(e){
|
||||
if(e.target.files[0])
|
||||
{
|
||||
var fileName = e.target.files[0].name;
|
||||
if(fileName !== "my_model.py")
|
||||
{
|
||||
alert('Please upload my_model.py');
|
||||
$('#btnSubmit').prop('disabled', true);
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#btnSubmit').prop('disabled', false);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Submit results
|
||||
$("#btnSubmit").click((event) => {
|
||||
// stop submit the form, we will post it manually.
|
||||
event.preventDefault();
|
||||
doAjax();
|
||||
});
|
||||
})
|
||||
|
||||
function upload_leaderboard(name) {
|
||||
obj = {}
|
||||
obj.name = name;
|
||||
data = {}
|
||||
if(name === 'ulysses16') {
|
||||
data.fitness = my_res.ulysses16.fitness;
|
||||
}
|
||||
else if (name === 'att48') {
|
||||
data.fitness = my_res.att48.fitness;
|
||||
}
|
||||
else if (name === 'st70') {
|
||||
data.fitness = my_res.st70.fitness;
|
||||
}
|
||||
else if (name === 'a280') {
|
||||
data.fitness = my_res.a280.fitness;
|
||||
}
|
||||
else if (name === 'pcb442') {
|
||||
data.fitness = my_res.pcb442.fitness;
|
||||
}
|
||||
else if (name === 'dsj1000') {
|
||||
data.fitness = my_res.dsj1000.fitness;
|
||||
}
|
||||
data.name = $('#submit_name').val();
|
||||
data.desc = $('#submit_desc').val()
|
||||
data.time = Date.now()
|
||||
obj.data = data;
|
||||
socket.emit('submit', obj);
|
||||
}
|
||||
|
||||
function doAjax() {
|
||||
// Get form
|
||||
var form = $('#fileUploadForm')[0];
|
||||
|
||||
var data = new FormData(form);
|
||||
var file = data.get('uploadfile');
|
||||
|
||||
var renameFile =new File([file], window.id + '.py' ,{type:file.type});
|
||||
var formdata = new FormData();
|
||||
|
||||
formdata.append('uploadfile', renameFile);
|
||||
|
||||
if(window.id) {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
enctype: 'multipart/form-data',
|
||||
url: "/api/files/upload",
|
||||
data: formdata,
|
||||
processData: false, //prevent jQuery from automatically transforming the data into a query string
|
||||
contentType: false,
|
||||
cache: false,
|
||||
success: (data) => {
|
||||
console.log('Emit build request')
|
||||
socket.emit('build', {});
|
||||
},
|
||||
error: (e) => {
|
||||
$("#listFiles").text(e.responseText);
|
||||
}
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
alert('Failed to connect to server');
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,3 @@
|
||||
// warn the user when leaving
|
||||
window.onbeforeunload = function(){
|
||||
return "Make sure to save your graph locally before leaving";
|
||||
};
|
||||
|
||||
var my_res = {};
|
||||
my_res.ulysses16 = {}
|
||||
@@ -20,28 +16,32 @@ my_res.dsj1000.fitness = -1;
|
||||
|
||||
var socket = io();
|
||||
|
||||
// User connected
|
||||
socket.on('connect', () => {
|
||||
$("#status").removeClass('badge-secondary');
|
||||
$("#status").addClass('badge-primary');
|
||||
window.id = socket.id
|
||||
console.log('Session Id: ', socket.id); // an alphanumeric id...
|
||||
console.log('Session Id: ', socket.id);
|
||||
});
|
||||
|
||||
// User disconnected
|
||||
socket.on('disconnect', () => {
|
||||
$("#status").removeClass('badge-primary');
|
||||
$("#status").addClass('badge-secondary');
|
||||
$("#status").text('offline');
|
||||
});
|
||||
|
||||
|
||||
// Update online users
|
||||
socket.on('users_count', (clients) => {
|
||||
$("#status").text(clients + ' online');
|
||||
});
|
||||
|
||||
// Server running algorithms
|
||||
socket.on('start', () => {
|
||||
console.log('Building start');
|
||||
});
|
||||
|
||||
// Update Leaderboard Table
|
||||
socket.on('leaderboard', (obj) => {
|
||||
console.log(obj);
|
||||
$(".leaderboard-table").find("tr:not(:first):not(:last)").remove();
|
||||
@@ -88,7 +88,8 @@ socket.on('leaderboard', (obj) => {
|
||||
|
||||
});
|
||||
|
||||
socket.on('update', (msg) => {
|
||||
// Log info in console
|
||||
socket.on('info', (msg) => {
|
||||
// var msg = msg.replace(/\x1b[[0-9;]*[a-zA-Z]/g, '');
|
||||
msg = msg.replace(/[^\x20-\x7E]/g, '')
|
||||
if(msg[1] == '[') {
|
||||
@@ -97,130 +98,52 @@ socket.on('update', (msg) => {
|
||||
console.log(msg);
|
||||
});
|
||||
|
||||
// Update personal result
|
||||
socket.on('result', (res) => {
|
||||
// console.log(res)
|
||||
res = JSON.parse(res);
|
||||
$('#submission_info').show();
|
||||
res.forEach(e => {
|
||||
if(e.name === "ulysses16.txt") {
|
||||
my_res.ulysses16.fitness = e.fitness
|
||||
$("#ulysses16_your").text(e.fitness);
|
||||
$('#ulysses16_submit').show();
|
||||
if(e.fitness > 0) {
|
||||
$('#ulysses16_submit').show();
|
||||
}
|
||||
}
|
||||
if(e.name === "att48.txt") {
|
||||
my_res.att48.fitness = e.fitness
|
||||
$("#att48_your").text(e.fitness);
|
||||
$('#att48_submit').show();
|
||||
if(e.fitness > 0) {
|
||||
$('#att48_submit').show();
|
||||
}
|
||||
}
|
||||
if(e.name === "st70.txt") {
|
||||
my_res.st70.fitness = e.fitness
|
||||
$("#st70_your").text(e.fitness)
|
||||
$('#st70_submit').show();
|
||||
if(e.fitness > 0) {
|
||||
$('#st70_submit').show();
|
||||
}
|
||||
}
|
||||
if(e.name === "a280.txt") {
|
||||
my_res.a280.fitness = e.fitness
|
||||
$("#a280_your").text(e.fitness)
|
||||
$('#a280_submit').show();
|
||||
if(e.fitness > 0) {
|
||||
$('#a280_submit').show();
|
||||
}
|
||||
}
|
||||
if(e.name === "pcb442.txt") {
|
||||
my_res.pcb442.fitness = e.fitness
|
||||
$("#pcb442_your").text(e.fitness)
|
||||
$('#pcb442_submit').show();
|
||||
if(e.fitness > 0) {
|
||||
$('#pcb442_submit').show();
|
||||
}
|
||||
}
|
||||
if(e.name === "dsj1000.txt") {
|
||||
my_res.dsj1000.fitness = e.fitness
|
||||
$("#dsj1000_your").text(e.fitness)
|
||||
$('#dsj1000_submit').show();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$(document).ready( () => {
|
||||
$("#btnSubmit").click((event) => {
|
||||
//stop submit the form, we will post it manually.
|
||||
event.preventDefault();
|
||||
doAjax();
|
||||
});
|
||||
|
||||
$('#uploadfile').change(function(e){
|
||||
if(e.target.files[0])
|
||||
{
|
||||
var fileName = e.target.files[0].name;
|
||||
if(fileName !== "my_model.py")
|
||||
{
|
||||
alert('Please upload my_model.py');
|
||||
$('#btnSubmit').prop('disabled', true);
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#btnSubmit').prop('disabled', false);
|
||||
if(e.fitness > 0) {
|
||||
$('#dsj1000_submit').show();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function upload_loaderboard(name) {
|
||||
obj = {}
|
||||
obj.name = name;
|
||||
data = {}
|
||||
if(name === 'ulysses16') {
|
||||
data.fitness = my_res.ulysses16.fitness;
|
||||
}
|
||||
else if (name === 'att48') {
|
||||
data.fitness = my_res.att48.fitness;
|
||||
}
|
||||
else if (name === 'st70') {
|
||||
data.fitness = my_res.st70.fitness;
|
||||
}
|
||||
else if (name === 'a280') {
|
||||
data.fitness = my_res.a280.fitness;
|
||||
}
|
||||
else if (name === 'pcb442') {
|
||||
data.fitness = my_res.pcb442.fitness;
|
||||
}
|
||||
else if (name === 'dsj1000') {
|
||||
data.fitness = my_res.dsj1000.fitness;
|
||||
}
|
||||
data.name = $('#submit_name').val();
|
||||
data.desc = $('#submit_desc').val()
|
||||
data.time = Date.now()
|
||||
obj.data = data;
|
||||
socket.emit('submit', obj);
|
||||
}
|
||||
|
||||
function doAjax() {
|
||||
|
||||
// Get form
|
||||
var form = $('#fileUploadForm')[0];
|
||||
|
||||
var data = new FormData(form);
|
||||
var file = data.get('uploadfile');
|
||||
|
||||
var renameFile =new File([file], window.id + '.py' ,{type:file.type});
|
||||
var formdata = new FormData();
|
||||
formdata.append('uploadfile', renameFile);
|
||||
// console.log(formdata.get('uploadfile'))
|
||||
if(window.id) {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
enctype: 'multipart/form-data',
|
||||
url: "/api/files/upload",
|
||||
data: formdata,
|
||||
processData: false, //prevent jQuery from automatically transforming the data into a query string
|
||||
contentType: false,
|
||||
cache: false,
|
||||
success: (data) => {
|
||||
// $("#listFiles").text(data);
|
||||
console.log('Emit build request')
|
||||
socket.emit('build', {});
|
||||
},
|
||||
error: (e) => {
|
||||
$("#listFiles").text(e.responseText);
|
||||
}
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
alert('Failed to connect to server');
|
||||
}
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Hello</h1>
|
||||
<div class="ratio ratio-16x9">
|
||||
<iframe src="preview.html" title="YouTube video" allowfullscreen></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<section>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<h1>Leader</h1>
|
||||
<label for="formFileLg" class="form-label">Large file input example</label>
|
||||
<input class="form-control form-control-lg" id="formFileLg" type="file" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,142 +0,0 @@
|
||||
$( document ).ready( () => {
|
||||
|
||||
$('body').scrollspy({ target: '#main-nav', offset: 130 })
|
||||
|
||||
$('#fullpage').fullpage({
|
||||
// anchors: ['underPage', 'gradPage', 'phdPage'],
|
||||
sectionsColor: ['#ffffff', '#f8f8f8'],
|
||||
autoScrolling: false,
|
||||
css3: true,
|
||||
fitToSection: false,
|
||||
afterLoad: function(anchorLink, index) {
|
||||
// history.pushState(null, null, "");
|
||||
// console.log(anchorLink);
|
||||
}
|
||||
});
|
||||
|
||||
$(".navbar a").on('click', function(event) {
|
||||
// Make sure this.hash has a value before overriding default behavior
|
||||
if (this.hash !== "") {
|
||||
// Prevent default anchor click behavior
|
||||
event.preventDefault();
|
||||
|
||||
// Store hash
|
||||
var hash = this.hash;
|
||||
|
||||
// Using jQuery's animate() method to add smooth page scroll
|
||||
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
|
||||
var offset = 0;
|
||||
if (hash === "#home")
|
||||
{
|
||||
offset = -100;
|
||||
}
|
||||
else {
|
||||
offset = -60;
|
||||
}
|
||||
$('html, body').animate({
|
||||
scrollTop: ($(hash).offset().top + offset)
|
||||
}, 1000, function(){
|
||||
// Add hash (#) to URL when done scrolling (default click behavior)
|
||||
// window.location.hash = hash;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('#submission_info').hide();
|
||||
$('#ulysses16_submit').hide();
|
||||
$('#att48_submit').hide();
|
||||
$('#st70_submit').hide();
|
||||
$('#a280_submit').hide();
|
||||
$('#pcb442_submit').hide();
|
||||
$('#dsj1000_submit').hide();
|
||||
|
||||
$( "#ulysses16_submit" ).click(function() {
|
||||
upload_loaderboard('ulysses16');
|
||||
$('#ulysses16_submit').removeClass('btn-primary');
|
||||
$('#ulysses16_submit').text('Submitted');
|
||||
$('#ulysses16_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#att48_submit" ).click(function() {
|
||||
upload_loaderboard('att48');
|
||||
$('#att48_submit').removeClass('btn-primary');
|
||||
$('#att48_submit').text('Submitted');
|
||||
$('#att48_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#st70_submit" ).click(function() {
|
||||
upload_loaderboard('st70');
|
||||
$('#st70_submit').removeClass('btn-primary');
|
||||
$('#st70_submit').text('Submitted');
|
||||
$('#st70_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#a280_submit" ).click(function() {
|
||||
upload_loaderboard('a280');
|
||||
$('#a280_submit').removeClass('btn-primary');
|
||||
$('#a280_submit').text('Submitted');
|
||||
$('#a280_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#pcb442_submit" ).click(function() {
|
||||
upload_loaderboard('pcb442');
|
||||
$('#pcb442_submit').removeClass('btn-primary');
|
||||
$('#pcb442_submit').text('Submitted');
|
||||
$('#pcb442_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
$( "#dsj1000_submit" ).click(function() {
|
||||
upload_loaderboard('dsj1000');
|
||||
$('#dsj1000_submit').removeClass('btn-primary');
|
||||
$('#dsj1000_submit').text('Submitted');
|
||||
$('#dsj1000_submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
// initialize with defaults
|
||||
// $("#uploadfile").fileinput();
|
||||
|
||||
// with plugin options
|
||||
$("#uploadfile").fileinput({
|
||||
// theme: "fa",
|
||||
'theme': 'fas',
|
||||
showUpload:false,
|
||||
previewFileType:'py',
|
||||
maxFileCount: 1,
|
||||
allowedFileExtensions: ["py"]
|
||||
});
|
||||
|
||||
ConsoleLogHTML.connect(document.getElementById("console")); // Redirect log messages
|
||||
// ConsoleLogHTML.disconnect(); // Stop redirecting
|
||||
|
||||
var url = window.location;
|
||||
|
||||
// GET REQUEST
|
||||
$("#btnGetFiles").click( (event) => {
|
||||
event.preventDefault();
|
||||
ajaxGet();
|
||||
});
|
||||
|
||||
// DO GET
|
||||
function ajaxGet(){
|
||||
$.ajax({
|
||||
type : "GET",
|
||||
url : "/api/files/getall",
|
||||
success: (data) => {
|
||||
//clear old data
|
||||
$("#listFiles").html("");
|
||||
|
||||
/*
|
||||
render list of files
|
||||
*/
|
||||
$("#listFiles").append('<ul>');
|
||||
$.each(data, (index, filename) => {
|
||||
$("#listFiles").append('<li><a href=' + url + 'api/files/' + filename +'>' + filename + '</a></li>');
|
||||
});
|
||||
$("#listFiles").append('</ul>');
|
||||
},
|
||||
error : (err) => {
|
||||
$("#listFiles").html(err.responseText);
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
|
Before Width: | Height: | Size: 133 KiB After Width: | Height: | Size: 133 KiB |
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
Reference in New Issue
Block a user