{% block script %}
    <script src="{{ MEDIA_URL }}css/Leaflet-0.6.2/src/leaflet.js"></script>
    <script type="text/javascript">
        var map = L.map('map');
        var osm = new L.TileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
                            maxZoom: 18
                            });
        var london = new L.LatLng(51.505, -0.09); // geographical point (longitude and latitude)
        map.setView(london, 13).addLayer(osm);
        var marker = L.marker([51.5, -0.09]).addTo(map);
        var circle = L.circle([51.508, -0.11], 500, {
                    color: 'red',
                        fillColor: '#f03',
                            fillOpacity: 0.5
                            }).addTo(map);
        var polygon = L.polygon([
                    [51.509, -0.08],
                        [51.503, -0.06],
                            [51.51, -0.047]
                            ]).addTo(map);
        marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup();
        circle.bindPopup("I am a circle.");
        polygon.bindPopup("I am a polygon.");
        var popup = L.popup()
        .setLatLng([51.5, -0.09])
        .setContent("I am a standalone popup.")
            .openOn(map);
    </script>
{% endblock %}

{% block body %}
<br/>
<h2>Welcome to InCTF 2013 Second Round Portal</h2>
<br>
<table style="border:1px dashed #ccc">
    <div id="map"></div>
</table>
<br>
<br>
{% endblock %}