|
<style>
|
|
#selectable .ui-selecting { background: #FECA40; }
|
|
#selectable .ui-selected { background: #F39814; color: white; }
|
|
#selectable { list-style-type: none; margin: 0; padding: 0; }
|
|
#selectable li { margin: 3px 3px 3px 0; padding: 1px; float: left; width: 80px; height: 95px; font-size: 1px; text-align: center; cursor:pointer; }
|
|
</style>
|
|
<script>
|
|
$(function() {
|
|
$( "#selectable" ).selectable();
|
|
getLTSPServers();
|
|
});
|
|
|
|
function getLTSPServers(){
|
|
$.post('hosts','action=getLTSPServers', function(data) {
|
|
var result = $.parseJSON(data);
|
|
|
|
$.each(result.response, function(i, l){
|
|
$('#selectable').append('<li class="ui-state-default" id="selectable-'+l+'"><div id="pcName" style="font-size:11px;">'+l+'</div><img class="thumb-image" src="img/turnOff.png"/><div id="userName" style="font-size:11px;"></div></li>');
|
|
});
|
|
|
|
getLTSPStatus();
|
|
});
|
|
}
|
|
|
|
function getLTSPStatus(){
|
|
$.post('hosts','action=getLTSPStatus', function(data) {
|
|
var result = $.parseJSON(data);
|
|
|
|
$('#selectable li .thumb-image').attr('src','img/turnOff.png');
|
|
$('#selectable li #userName').html('');
|
|
|
|
$.each(result.computers, function(i, l){
|
|
$('#selectable #selectable-'+l+' .thumb-image').attr('src','img/turnOn.png');
|
|
});
|
|
|
|
$.each(result.teachers, function(i, l){
|
|
var teacher = l.split(".");
|
|
var computer = teacher[0].split("@");
|
|
$('#selectable #selectable-'+computer[1]+' #userName').html(computer[0]);
|
|
$('#selectable #selectable-'+computer[1]+' .thumb-image').attr('src','img/nobody.png');
|
|
});
|
|
|
|
setTimeout("getLTSPStatus()",10000);
|
|
});
|
|
}
|
|
|
|
</script>
|
|
|
|
<ol id="selectable" style="width:900px;"></ol>
|