{{py:
from mapproxy.compat.modules import escape
import textwrap

wrapper = textwrap.TextWrapper(replace_whitespace=False, width=90,
                               break_long_words=False)

def approx_bbox(layer, srs):
    from mapproxy.srs import SRS
    extent = layer.md['extent'].bbox_for(SRS(srs))
    return ', '.join(map(lambda x: '%.2f' % x, extent))

menu_title= "WMTS %s %s"%(layer.name, srs)
jscript_functions=None
}}
{{def jscript_openlayers}}
<script src="static/OpenLayers.js"></script>
<script type="text/javascript">
var map;
function init(){
    var mapOptions = {
    projection: new OpenLayers.Projection('{{srs}}'),
    resolutions: [{{', '.join(str(r) for r in resolutions)}}],
    units: '{{units}}',
    maxExtent: new OpenLayers.Bounds({{', '.join(str(s) for s in layer.grid.bbox)}}),
    tileSize: new OpenLayers.Size({{', '.join(str(s) for s in layer.grid.tile_size)}})
    };

    map = new OpenLayers.Map('map', mapOptions);

    var layer = new OpenLayers.Layer.WMTS({
     name: "WMTS {{layer.name}}",
     url: '../wmts{{restful_url}}',
     layer: '{{layer.name}}',
     matrixSet: '{{matrix_set}}',
     format: '{{format}}',
     isBaseLayer: true,
     style: 'default',
     requestEncoding: 'REST'
    });

    map.addLayer(layer)
    map.zoomToExtent(new OpenLayers.Bounds({{approx_bbox(layer, srs)}}));
}
</script>
{{enddef}}
            <h2>Openlayers Client - Layer {{layer.name}}</h2>
            <table>
                <tr><th>Coordinate System</th><th>Image format</th></tr>
                <tr><td>
                        <select name="srs" size="1" onchange="this.form.submit()">
                                {{for wmts_layer in all_tile_layers.values()}}
                                    {{if wmts_layer.name == layer.name and wmts_layer.grid.supports_access_with_origin('nw')}}
                                        {{if wmts_layer.md['name_internal'] == layer.md['name_internal']}}
                                            <option selected value="{{srs}}">{{srs}}</option>
                                        {{else}}
                                            <option value="{{wmts_layer.grid.srs.srs_code}}">{{wmts_layer.grid.srs.srs_code}}</option>
                                        {{endif}}
                                    {{endif}}
                                {{endfor}}
                            </select>
                            <input type="hidden" name="format" value="{{format}}">
                            <input type="hidden" name="wmts_layer" value="{{layer.name}}">
                    </td>
                    <td>{{layer.format}}</td></tr>
            </table>
            <div id='map'></div>
            <h3>Bounding Box</h3>
            <p class="code">{{', '.join(str(s) for s in layer.grid.bbox)}}</p>
            <h3>JavaScript code</h3>
            <pre>
{{for line in jscript_openlayers().split('\n')}}
{{escape(wrapper.fill(line))}}
{{endfor}}
            </pre>
