Skip to content

A
adc2018-system
Commit b33ac986 authored by Kento HASEGAWA's avatar Kento HASEGAWA
Browse files
Options

Improve UI

parent 96cd20b6
Hide whitespace changes
Inline Side-by-side
Showing with 149 additions and 126 deletions
comm/server/static/css/bootstrap.min.css.map 0 → 100644
View file @ b33ac986
This source diff could not be displayed because it is too large. You can view the blob instead.
comm/server/static/css/pynq-manager.css 0 → 100644
View file @ b33ac986
html, body{
/*width: 800px;*/
/*height: 500px;*/
font-size: 11px;
overflow: hidden;
}
body{
margin-top: 20px;
}
/* scrollbar settings */
::-webkit-scrollbar{
width: 30px;
border: 1px solid rgba(0, 0, 50, .2);
}
::-webkit-scrollbar-thumb{
background-color: rgba(0, 0, 50, .5);
}
#question-table-wrapper{
height: 350px;
overflow-y: scroll;
overflow-x: hidden;
}
#question-table-wrapper th.large-cell,
#question-table-wrapper td.large-cell{
width: 24%;
}
#question-table-wrapper th.small-cell,
#question-table-wrapper td.small-cell{
width: 14%;
}
#question-table-wrapper tr.question-row,
#question-table-wrapper tr.question-row td{
cursor: pointer;
}
#question-table-wrapper tr.question-row.q-selected{
background-color: rgba(200, 100, 100, .3);
}
#client-control-pane{
height: 350px;
overflow: scroll;
}
#client-control-pane table th,
#client-control-pane table td{
width: 50%;
}
comm/server/static/js/bootstrap.bundle.min.js.map 0 → 100644
View file @ b33ac986
This source diff could not be displayed because it is too large. You can view the blob instead.
comm/server/static/js/pynq-manager.js
View file @ b33ac986
...@@ -81,3 +81,83 @@ var PynqManager = (function(){ ...@@ -81,3 +81,83 @@ var PynqManager = (function(){
return PynqManager; return PynqManager;
})(); })();
$(function(){
var pynqClients = {}
var pm = null;
var refresh_question_table = function(){
$.ajax({
type: "GET",
dataType: "html",
url: "/get_question_table"
}).done(function(d){
$("#question-table-wrapper").find("#question-table").remove();
$("#question-table-wrapper").html(d);
$(".show-question-status-button").click(function(){
var qname = $(this).data("qname");
show_question_status(qname);
return false;
});
$(".question-row td").click(function(){
var $tr = $(this).parent("tr.question-row");
$(".question-row").removeClass("q-selected");
$tr.addClass("q-selected");
var qname = $tr.data("qname");
show_question_status(qname);
return false;
});
});
}
var refresh_client_table = function(){
$.ajax({
type: "GET",
dataType: "html",
url: "/get_client_table"
}).done(function(d){
$("#client-control-pane").html("");
$("#client-control-pane").html(d);
$.ajax({
type: "GET",
dataType: "json",
url: "/get_clients"
}).done(function(d){
pynqClients = d;
pm = PynqManager(pynqClients);
pm.getStatus();
});
});
}
var show_question_status = function(qname){
$.ajax({
type: "GET",
dataType: "html",
url: "/get_question_status",
data: {qname: qname}
}).done(function(d){
$("#client-control-pane").html("");
$("#client-control-pane").html(d);
$("#client-control-pane").find(".start-button").eq(0).click(function(){
var qname = $(this).data("qname");
pm.sendQuestion(qname, after=refresh_question_table);
});
});
}
refresh_question_table();
refresh_client_table();
$("#view-server-status-button").click(function(){
refresh_client_table();
return false;
});
});
comm/server/templates/index.html
View file @ b33ac986
...@@ -6,142 +6,31 @@ ...@@ -6,142 +6,31 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/static/css/bootstrap.min.css"> <link rel="stylesheet" href="/static/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/css/pynq-manager.css">
<script src="/static/js/jquery.min.js"></script> <script src="/static/js/jquery.min.js"></script>
<script src="/static/js/bootstrap.bundle.min.js"></script> <script src="/static/js/bootstrap.bundle.min.js"></script>
<script src="/static/js/pynq-manager.js"></script> <script src="/static/js/pynq-manager.js"></script>
<style>
html, body{
/*width: 800px;*/
/*height: 500px;*/
font-size: 11px;
overflow: hidden;
}
body{
margin-top: 20px;
}
/* scrollbar settings */
::-webkit-scrollbar{
width: 30px;
border: 1px solid rgba(0, 0, 50, .2);
}
::-webkit-scrollbar-thumb{
background-color: rgba(0, 0, 50, .5);
}
#question-table-wrapper{
height: 350px;
overflow: scroll;
}
#question-table-wrapper th.large-cell,
#question-table-wrapper td.large-cell{
width: 24%;
}
#question-table-wrapper th.small-cell,
#question-table-wrapper td.small-cell{
width: 14%;
}
#client-control-pane table th,
#client-control-pane table td{
width: 50%;
}
</style>
<script>
$(function(){
var pynqClients = {}
var pm = null;
var refresh_question_table = function(){
$.ajax({
type: "GET",
dataType: "html",
url: "/get_question_table"
}).done(function(d){
$("#question-table-wrapper").find("#question-table").remove();
$("#question-table-wrapper").html(d);
$(".show-question-status-button").click(function(){
var qname = $(this).data("qname");
show_question_status(qname);
return false;
});
});
}
var refresh_client_table = function(){
$.ajax({
type: "GET",
dataType: "html",
url: "/get_client_table"
}).done(function(d){
$("#client-control-pane").html("");
$("#client-control-pane").html(d);
$.ajax({
type: "GET",
dataType: "json",
url: "/get_clients"
}).done(function(d){
pynqClients = d;
pm = PynqManager(pynqClients);
pm.getStatus();
});
});
}
var show_question_status = function(qname){
$.ajax({
type: "GET",
dataType: "html",
url: "/get_question_status",
data: {qname: qname}
}).done(function(d){
$("#client-control-pane").html("");
$("#client-control-pane").html(d);
$("#client-control-pane").find(".start-button").eq(0).click(function(){
var qname = $(this).data("qname");
pm.sendQuestion(qname, after=refresh_question_table);
});
});
}
refresh_question_table();
refresh_client_table();
$("#view-server-status-button").click(function(){
refresh_client_table();
return false;
});
});
</script>
</head> </head>
<body> <body>
<div id="wrapper"> <div id="wrapper">
<div id="contorol-panel-wrapper" class="container"> <div id="contorol-panel-wrapper" class="container">
<h3>問題一覧</h3>
<p><a href="#" id="view-server-status-button">クライアント状況</a></p>
<div class="row"> <div class="row">
<div class="col" id="question-control-pane"> <div class="col" id="question-control-pane">
<h3>問題一覧</h3>
<p><a href="#" id="view-server-status-button">サーバ状況</a></p>
<div id="question-table-wrapper"> <div id="question-table-wrapper">
<p>Loading...</p>
</div>
</div>
<div class="col" id="client-control-pane"> <p>Loading...</p>
<p>Loading...</p> </div>
</div> </div>
<div class="col" id="client-control-pane">
<p>Loading...</p>
</div>
</div> </div>
</div> </div>
......
comm/server/templates/part_question_status.html
View file @ b33ac986
<h3>問題 【{{qname}}】</h3> <h3>問題 【{{qname}}】</h3>
<p> <p>
<button class="btn btn-default start-button" type="button" data-qname="{{qname}}">Start</button> <button class="btn btn-primary btn-lg start-button" type="button" data-qname="{{qname}}">Start</button>
</p> </p>
<p>状況：<span id="solving-question-status">{{qdata.status}}</span></p> <p>状況：<span id="solving-question-status">{{qdata.status}}</span></p>
<h4>結果</h4> <h4>結果</h4>
......
comm/server/templates/part_question_table.html
View file @ b33ac986
<table class="table table-bordered" id="question-table"> <table class="table table-bordered table-hover" id="question-table">
<tr> <tr>
<th class="large-cell">ファイル名</th> <th class="large-cell">ファイル名</th>
<th class="large-cell">Size</th> <th class="large-cell">Size</th>
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<th class="small-cell">操作</th> <th class="small-cell">操作</th>
</tr> </tr>
{% for k, v in questions.items() %} {% for k, v in questions.items() %}
<tr> <tr class="question-row" data-qname="{{k}}">
<td class="large-cell">{{k}}</td> <td class="large-cell">{{k}}</td>
<td class="large-cell">{{v.board_size}}</td> <td class="large-cell">{{v.board_size}}</td>
<td class="small-cell">{{v.line_num}}</td> <td class="small-cell">{{v.line_num}}</td>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment