taipei-light2/modules/ruling_bus/_ruling_bus_widget1.html.erb

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>