change interface

This commit is contained in:
yourok
2019-09-20 13:20:01 +03:00
parent 0059b181bc
commit ce384ca5f3

View File

@@ -30,14 +30,25 @@ var cachePage = `
margin: 1%; margin: 1%;
} }
.cache { .cache {
display: grid; padding-left:6px;
grid-template-columns: repeat(auto-fit, minmax(25px, 1fr)); padding-right:2px;
line-height:11px
} }
.piece { .piece {
border: 1px dashed white; width:10px;
font-size: 10px; height:10px;
padding: 2px; background-color:#eef2f4;
text-align: center; border:1px solid #dee2e5;
display:inline-block;
margin-right:1px
}
.piece-complete{
background-color:#b8dd69;
border-color:#b8dd69
}
.piece-loading{
background-color:#66cbff;
border-color:#66cbff
} }
</style> </style>
@@ -60,7 +71,7 @@ var cachePage = `
</body> </body>
<script> <script>
$( document ).ready(function() { $( document ).ready(function() {
setInterval(updateState, 1000); setInterval(updateState, 500);
}); });
var cacheHash = ""; var cacheHash = "";
@@ -102,19 +113,20 @@ var cachePage = `
$("#cacheInfo").html(html); $("#cacheInfo").html(html);
makePieces(st.PiecesCount); makePieces(st.PiecesCount);
for(var i = 0; i < st.PiecesCount; i++) { for(var i = 0; i < st.PiecesCount; i++) {
var color = "silver";
var size = "";
var piece = st.Pieces[i]; var piece = st.Pieces[i];
if (piece){ if (piece){
if (piece.Completed && piece.BufferSize >= st.PiecesLength) if (piece.Completed && piece.BufferSize >= st.PiecesLength){
color = "green"; $("#p"+i).addClass("piece-complete");
else if (piece.Completed && piece.BufferSize == 0) $("#p"+i).removeClass("piece-loading");
color = "silver"; }else if (!piece.Completed && piece.BufferSize > 0){
else if (!piece.Completed && piece.BufferSize > 0) $("#p"+i).removeClass("piece-complete");
color = "red"; $("#p"+i).addClass("piece-loading");
size = ' ' + humanizeSize(piece.BufferSize); }
}
if (!piece || piece.Completed && piece.BufferSize == 0){
$("#p"+i).removeClass("piece-complete");
$("#p"+i).removeClass("piece-loading");
} }
setPiece(i,color,size);
} }
},function(){ },function(){
$("#cacheInfo").empty(); $("#cacheInfo").empty();
@@ -129,17 +141,11 @@ var cachePage = `
return; return;
var html = ""; var html = "";
for(var i = 0; i < len; i++) { for(var i = 0; i < len; i++) {
html += '<span class="piece" id="p'+i+'" style="background-color: silver;">'+i+'</span>'; html += '<span class="piece" id="p'+i+'"></span>';
} }
cache.html(html); cache.html(html);
} }
function setPiece(i, color, size){
var piece = $("#p"+i);
piece.delay(100).css("background-color",color);
piece.text(i+''+size);
}
function contains(arr, elem) { function contains(arr, elem) {
for (var i = 0; i < arr.length; i++) { for (var i = 0; i < arr.length; i++) {
if (arr[i].Id === elem) { if (arr[i].Id === elem) {