Browse Source

add map

station_14109
altob.rd 8 years ago
parent
commit
bf02a4d003
2 changed files with 73 additions and 66 deletions
  1. +29
    -37
      views/qcar2/result_page.php
  2. +44
    -29
      views/qcar2/result_page2.php

+ 29
- 37
views/qcar2/result_page.php View File

@@ -45,7 +45,6 @@
</div>

<?php /* ----- 查詢結果 ----- */ ?>
<!-- div data-items="rent_sync" class="row" style="display:none;"-->
<div data-items="output_pks" class="row" style="display:none;">
<div class="col-lg-6 col-sm-6">
<div class="panel panel-default">
@@ -69,11 +68,6 @@
<td style="text-align:right;vertical-align: middle;">停入時間</td>
<td id="show_update_time" style="text-align:left;vertical-align: middle;"></td>
</tr>
<!--tr>
<td colspan="2" style="text-align:center;vertical-align: middle;">
<button type="button" class="btn btn-large btn-success pull-right" style="font-size:28px;" onclick="show_item('input_lpr');">結束查詢</button>
</td>
</tr-->
</tbody>
</table>
</div>
@@ -109,7 +103,14 @@

</div>


<div data-items="B1" class="row" style="display:none;">
<div class="col-lg-12 col-sm-12">
<div class="panel panel-default">
<div class="panel-heading"><span>停車位置 : B1 樓層</span></div>
<div class="panel-body"><canvas id="b1canvas"></canvas></div>
</div>
</div>
</div>


<!-- /#page-wrapper -->
@@ -140,8 +141,8 @@
<!-- moment -->
<script src="<?=WEB_LIB?>js/moment.min.js"></script>
<!-- jQuery validate -->
<script src="<?=WEB_LIB?>form-validator/jquery.form-validator.min.js"></script>
<!-- altob ats map -->
<script src="<?=WEB_LIB?>js/altob-ats-map.js"></script>

<!-- Custom Theme JavaScript -->
<script src="<?=BOOTSTRAPS?>dist/js/sb-admin-2.js"></script>
@@ -211,12 +212,15 @@ if(PKS_RESULT.pksno == '')
else
{
$("#show_lpr").text(PKS_RESULT.lpr);
$("#show_floors").html(PKS_RESULT.group_name+"<br/> ( 車格: " + PKS_RESULT.pksno.substr(-3, 3) +" )");
$("#show_floors").html(PKS_RESULT.group_name+" ( 車格: " + PKS_RESULT.pksno.substr(-3, 3) +" )");
$("#show_update_time").text(PKS_RESULT.in_time);
$("#show_img").attr("src", "<?=SERVER_URL?>pkspic/" + PKS_RESULT.pic_name);

// 顯示查車結果
show_item("output_pks");
// show map
$("[data-items="+PKS_RESULT.floors+"]").show();
}

var refreshIntervalId = 0; // timer id
@@ -406,35 +410,23 @@ $(document).ready(function()
}

});

// 定時自動更新頁面
(function autoReloadPage(){
var pageReloadTimeMillis = 60000; // 頁面, 自動重新載入週期 ( 1 min )
var pageCheckReloadTimeMillis = 10000; // 頁面, 判斷重新載入週期 ( 10 sec )
var pageShowReloadTimeMillis = 50000; // 頁面, 開始顯示倒數週期 ( 50 sec )
var aliveTime = moment();
var countdownTimeMillis = pageReloadTimeMillis;
$(document.body).bind("mousemove keypress", function(e) {
aliveTime = moment();
countdownTimeMillis = pageReloadTimeMillis;
});
function refresh() {
if(moment() - aliveTime >= pageReloadTimeMillis) // 如果頁面沒動作, 才更新
window.location.reload(true);
else{
countdownTimeMillis -= pageCheckReloadTimeMillis;
if(countdownTimeMillis < pageCheckReloadTimeMillis)
{
alertify_count_down("重新載入中..請稍候..", pageCheckReloadTimeMillis);
}
else if(countdownTimeMillis < pageShowReloadTimeMillis){
alertify_count_down("倒數: " + (countdownTimeMillis / 1000) + " 秒, 重新載入畫面..", pageCheckReloadTimeMillis);
}
setTimeout(refresh, pageCheckReloadTimeMillis);
<?php /* 樓層平面圖 */ ?>
AltobObject.AtsMap({
mapInfo: {
map1: {
floorName: 'B1',
canvasId: 'b1canvas',
src: '<?=SERVER_URL?>i3/pics/b1_map.png',
initialImageRatio: 0.9,
shiftLeft: 50,
shiftUp: 0
}
}
setTimeout(refresh, pageCheckReloadTimeMillis);
})();
});
// 畫出指定位置
AltobObject.AtsMap.drawPosition(PKS_RESULT.floors, PKS_RESULT.posx, PKS_RESULT.posy);

});
</script>

+ 44
- 29
views/qcar2/result_page2.php View File

@@ -47,7 +47,7 @@

<?php /* ----- 查詢結果 ----- */ ?>
<!-- div data-items="rent_sync" class="row" style="display:none;"-->
<div data-items="output_pks" class="row" style="display:none;">
<div data-items="output_pks" class="row" style="display:none; height:100%">
<div class="col-lg-3 col-sm-6">
<div class="panel panel-default">
<div class="panel-heading" style="font-size:28px;"><?php /* 資料顯示區灰色小表頭 */ ?>
@@ -102,6 +102,30 @@
</div>
<!-- /.panel -->
</div>
<!--div class="col-lg-9 col-sm-9">
<table class="table table-striped table-hover">
<thead><tr><th style="text-align:center;">停車位置 : B1 樓層</th></tr></thead>
<tbody>
<canvas id="b1canvas"></canvas>
</tbody>
</table>
</div-->
<div class="col-lg-9 col-sm-9">
<div class="panel panel-default" style="min-height: 1200px">
<div class="panel-heading" style="font-size:28px;"><span>停車位置 : B1 樓層</span></div>
<div class="panel-body"><canvas id="b1canvas"></canvas></div>
</div>
</div>
<!--div class="col-lg-9 col-sm-9" style="height=1000px">
<div class="panel panel-default">
<div class="panel-heading"><span>停車位置 : B1 樓層</span></div>
<div class="panel-body"><canvas id="b1canvas"></canvas></div>
</div>
</div-->
<!--div class="col-lg-3 col-sm-6">
<div class="panel panel-default">
<div class="panel-heading" style="font-size:28px;">
@@ -159,6 +183,9 @@
<!-- jQuery validate -->
<script src="<?=WEB_LIB?>form-validator/jquery.form-validator.min.js"></script>
<!-- altob ats map -->
<script src="<?=WEB_LIB?>js/altob-ats-map.js"></script>

<!-- Custom Theme JavaScript -->
<script src="<?=BOOTSTRAPS?>dist/js/sb-admin-2.js"></script>
@@ -228,7 +255,7 @@ if(PKS_RESULT.pksno == '')
else
{
$("#show_lpr").text(PKS_RESULT.lpr);
$("#show_floors").html(PKS_RESULT.group_name+"<br/> ( 車格: " + PKS_RESULT.pksno.substr(-3, 3) +" )");
$("#show_floors").html(PKS_RESULT.group_name+" ( 車格: " + PKS_RESULT.pksno.substr(-3, 3) +" )");
$("#show_update_time").text(PKS_RESULT.in_time);
$("#show_img").attr("src", "<?=SERVER_URL?>pkspic/" + PKS_RESULT.pic_name);

@@ -423,35 +450,23 @@ $(document).ready(function()
}

});

// 定時自動更新頁面
(function autoReloadPage(){
var pageReloadTimeMillis = 60000; // 頁面, 自動重新載入週期 ( 1 min )
var pageCheckReloadTimeMillis = 10000; // 頁面, 判斷重新載入週期 ( 10 sec )
var pageShowReloadTimeMillis = 50000; // 頁面, 開始顯示倒數週期 ( 50 sec )
var aliveTime = moment();
var countdownTimeMillis = pageReloadTimeMillis;
$(document.body).bind("mousemove keypress", function(e) {
aliveTime = moment();
countdownTimeMillis = pageReloadTimeMillis;
});
function refresh() {
if(moment() - aliveTime >= pageReloadTimeMillis) // 如果頁面沒動作, 才更新
window.location.reload(true);
else{
countdownTimeMillis -= pageCheckReloadTimeMillis;
if(countdownTimeMillis < pageCheckReloadTimeMillis)
{
alertify_count_down("重新載入中..請稍候..", pageCheckReloadTimeMillis);
}
else if(countdownTimeMillis < pageShowReloadTimeMillis){
alertify_count_down("倒數: " + (countdownTimeMillis / 1000) + " 秒, 重新載入畫面..", pageCheckReloadTimeMillis);
}
setTimeout(refresh, pageCheckReloadTimeMillis);
<?php /* 樓層平面圖 */ ?>
AltobObject.AtsMap({
mapInfo: {
map1: {
floorName: 'B1',
canvasId: 'b1canvas',
src: '<?=SERVER_URL?>i3/pics/b1_map.png',
initialImageRatio: 0.8,
shiftLeft: 250,
shiftUp: 0
}
}
setTimeout(refresh, pageCheckReloadTimeMillis);
})();
});
// 畫出指定位置
AltobObject.AtsMap.drawPosition(PKS_RESULT.floors, PKS_RESULT.posx, PKS_RESULT.posy);

});
</script>

Loading…
Cancel
Save