Доброй ночи!
Я недавно начала работать с websoket`ом и мне нужно знать как сделать ограничение по выводу в таблицу.
Вот код:
function convertTimestamp(timestamp) {
var d = new Date(timestamp * 1000),
yyyy = d.getFullYear(),
mm = ('0' + (d.getMonth() + 1)).slice(-2),
dd = ('0' + d.getDate()).slice(-2),
hh = d.getHours(),
h = hh,
min = ('0' + d.getMinutes()).slice(-2),
time;
time = yyyy + '-' + mm + '-' + dd + ', ' + h + ':' + min;
return time;
}
var incomingOut = '';
var color = '';
var suspicion = '';
var socket = new WebSocket("ws://localhost:8080/ws");
socket.onopen = function() {
console.log("Соединение установлено.");
};
socket.onerror = function(error) {
console.log("Ошибка " + error.message);
};
socket.onmessage = function(event) {
var data = JSON.parse(event.data);
console.log(data);
var blockslenght = data.blocks.length;
for (var i = blockslenght-1 ; i >= 0; i--) {
var transactionslenght = data.blocks[i].transactions.length;
for (var t = transactionslenght-1; t >= 0; t--) {
incomingOut += '<tr>';
incomingOut += '<td width="50">';
incomingOut += '<img src="static/image/'+data.blocks[i].transactions[t].currency+'.png">';
incomingOut += '</td>';
incomingOut += '<td width="75" class="currency">';
incomingOut += '<p>'+data.blocks[i].transactions[t].currency+'</p>';
incomingOut += '</td>';
incomingOut += '<td width="375">';
incomingOut += '<p class="hash">'+data.blocks[i].transactions[t].transactionHash;
incomingOut += '<span class="date">'+convertTimestamp(data.blocks[i].transactions[t].unixTimestamp)+'</span></p>';
incomingOut += '</td>';
incomingOut += '<td width="250">';
incomingOut += '<p class="amount">'+data.blocks[i].transactions[t].amount + ' ' + data.blocks[i].transactions[t].currency + '</p>';
if( parseFloat(data.blocks[i].transactions[t].senderAddressRank.suspicion) > parseFloat(data.blocks[i].transactions[t].recipientAddressRank.suspicion) ){
suspicion = parseFloat(data.blocks[i].transactions[t].senderAddressRank.suspicion);
}else{
suspicion = parseFloat(data.blocks[i].transactions[t].recipientAddressRank.suspicion);
}
if( suspicion == 0 || suspicion <= 0.1 ){
color = 'linear-gradient(to left, #fbde65 0%, #40a85f 100%)';
}else if(suspicion >= 0.1 && suspicion < 0.2 ){
color = 'linear-gradient(to left, #fbde65 20%, #40a85f 100%)';
}else if(suspicion >= 0.2 && suspicion < 0.3){
color = 'linear-gradient(to left, #fbde65 40%, #40a85f 100%)';
}else if(suspicion >= 0.3 && suspicion < 0.4){
color = 'linear-gradient(to left, #fbde65 60%, #40a85f 100%)';
}else if(suspicion > 0.4 && suspicion < 0.5){
color = 'linear-gradient(to left, #fbde65 80%, #40a85f 100%)';
}else if(suspicion == 0.5){
color = 'linear-gradient(to left, #fbde65 100%, #40a85f 100%)';
}else if(suspicion > 0.5 && suspicion < 0.6){
color = 'linear-gradient(to left, #e14939 20%, #fbde65 100%)';
}else if(suspicion >= 0.6 && suspicion < 0.7){
color = 'linear-gradient(to left, #e14939 40%, #fbde65 100%)';
}else if(suspicion >= 0.7 && suspicion < 0.8){
color = 'linear-gradient(to left, #e14939 60%, #fbde65 100%)';
}else if(suspicion >= 0.8 && suspicion < 0.9){
color = 'linear-gradient(to left, #e14939 80%, #fbde65 100%)';
}else if(suspicion >= 0.9 && suspicion < 1){
color = 'linear-gradient(to left, #e14939 100%, #fbde65 100%)';
}else{
color = 'linear-gradient(to left, #e14939 100%, #fbde65 100%)';
}
incomingOut += '<span class="circle" style="background:'+color+'" title="'+data.blocks[i].transactions[t].suspicion+'"></span>';
incomingOut += '</td>';
incomingOut += '<td>';
incomingOut += '<a href="#" class="detailed"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 492.004 492.004" xml:space="preserve"> <path d="M382.678,226.804L163.73,7.86C158.666,2.792,151.906,0,144.698,0s-13.968,2.792-19.032,7.86l-16.124,16.12 c-10.492,10.504-10.492,27.576,0,38.064L293.398,245.9l-184.06,184.06c-5.064,5.068-7.86,11.824-7.86,19.028 c0,7.212,2.796,13.968,7.86,19.04l16.124,16.116c5.068,5.068,11.824,7.86,19.032,7.86s13.968-2.792,19.032-7.86L382.678,265 c5.076-5.084,7.864-11.872,7.848-19.088C390.542,238.668,387.754,231.884,382.678,226.804z"/></svg></a>';
incomingOut += '</td>';
incomingOut += '</tr>';
}
}
$('.incoming .content table').html(incomingOut);
};
Мне через соккет присылают json массив и я записываю его в таблицу, как мне сделать, чтобы выводилось по 15 записей, к примеру и можно ли это вообще сделать?
Ещё, буду признательна если поможете ещё с одной проблемой
У меня почему-то они выводятся не в правильном порядке, если смотреть по времени
То есть сначала старые, потом новые, хотелось бы сделать, чтобы сначала выводились новые.
Заранее спасибо за ваши ответы, я только учусь :)