58 lines
1.8 KiB
Plaintext
58 lines
1.8 KiB
Plaintext
|
<div id="{{update_id}}" class="bus_widget1" data-list="bus_infos" data-level="0">
|
||
|
|
<div class="bus_info" id="{{bus_id}}">
|
||
|
|
<div class="row mt-10">
|
||
|
|
<div class="col-sm-12 bus_title">
|
||
|
|
<i class="fa fa-bus"></i>
|
||
|
|
<strong>{{bus_title}}</strong>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row bus_data" data-list="bus_data" data-level="1">
|
||
|
|
<div class="col-sm-6">
|
||
|
|
<div>
|
||
|
|
<strong class="route_name">{{route_name}}:</strong>
|
||
|
|
<span class="bus_time">{{time_to_arrive}}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<script type="text/javascript">
|
||
|
|
function update_bus(ele){
|
||
|
|
var $self = $(ele);
|
||
|
|
var bus_info_ids = $.map($self.find('.bus_info'),function(v){
|
||
|
|
return $(v).attr('id');
|
||
|
|
});
|
||
|
|
$.{{update_method}}( "{{update_url}}",
|
||
|
|
{
|
||
|
|
bus_info_ids: bus_info_ids
|
||
|
|
}, function( data ) {
|
||
|
|
$.each(data,function(k,v){
|
||
|
|
var bus_info = $self.find('#'+k);
|
||
|
|
var bus_route_names = $.map(bus_info.find('.route_name'),function(v1){
|
||
|
|
return $(v1).text().slice(0,-1)
|
||
|
|
});
|
||
|
|
var bus_time_span = bus_info.find('.bus_time');
|
||
|
|
$.each(v,function(k,v1){
|
||
|
|
var i = bus_route_names.indexOf(v1.route_name);
|
||
|
|
if (i>=0){
|
||
|
|
bus_time_span.eq(i).html(v1.time_to_arrive);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
})
|
||
|
|
window.setTimeout(function(){
|
||
|
|
update_bus(ele);
|
||
|
|
},{{update_interval}});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
function update_interval_bus(ele) {
|
||
|
|
window.setTimeout(function(){
|
||
|
|
update_bus(ele);
|
||
|
|
},{{update_interval}});
|
||
|
|
}
|
||
|
|
update_interval_bus($('#{{update_id}}[data-list="bus_infos"]')[0]);
|
||
|
|
</script>
|
||
|
|
<style type="text/css">
|
||
|
|
.bus_widget1 {margin-top: 1em;}
|
||
|
|
.bus_info {line-height: 1.8;}
|
||
|
|
</style>
|