{extend name="index/layout" /}
{block name="title"}附近帖子{/block}
{block name="body"}
<div class="fly-panel">
    <div class="fly-panel-title">附近帖子（半径 {$radius} km）</div>
    <div id="geo-tip" style="padding:10px;color:#999;">
        正在获取您的位置…
    </div>
    <ul class="fly-list" id="nearby-list" style="display:none;">
        {volist name="list" id="t"}
        <li>
            <a class="fly-list-title" href="/forum/topic/{$t.id}">{$t.title}</a>
            <span class="fly-list-info">
                {if isset($t.distance_km)}约 {$t.distance_km|round=2} km{/if}
                {$t.board.name|default=''}
            </span>
        </li>
        {/volist}
    </ul>
</div>
<script>
(function(){
    var tip = document.getElementById('geo-tip');
    var list = document.getElementById('nearby-list');
    function load(lat, lng){
        tip.style.display='none'; list.style.display='block';
    }
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(p){
            var lat = p.coords.latitude, lng = p.coords.longitude;
            window.location.href = '/forum/nearby?lat='+lat+'&lng='+lng+'&radius=10';
        }, function(){ tip.textContent='获取位置失败，可在 URL 手动传 ?lat=&lng='; });
    } else {
        tip.textContent='浏览器不支持定位，请在 URL 手动传 ?lat=&lng=';
    }
})();
</script>
{/block}