Реструкторизованы статические файлы
|
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 9.4 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 8.4 KiB After Width: | Height: | Size: 8.4 KiB |
|
Before Width: | Height: | Size: 486 B After Width: | Height: | Size: 486 B |
|
Before Width: | Height: | Size: 973 B After Width: | Height: | Size: 973 B |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
24
wheretogo/static/maps/js/map.js
Normal file
@@ -0,0 +1,24 @@
|
||||
const copy = "© <a href='https://www.openstreetmap.org/copyright'>OpenStreetMap</a> contributors";
|
||||
const url = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
|
||||
const osm = L.tileLayer(url, { attribution: copy });
|
||||
const map = L.map("map", { layers: [osm], minZoom: 5 });
|
||||
map.
|
||||
locate()
|
||||
.on("locationfound", (e) => map.setView(e.latlng, 8))
|
||||
.on("locationerror", () => map.setView([0, 0], 5));
|
||||
|
||||
async function load_facilities() {
|
||||
const facilities_url = `/api/facilities/?in_bbox=${map.getBounds().toBBoxString()}`
|
||||
const response = await fetch(facilities_url)
|
||||
const geojson = await response.json()
|
||||
return geojson
|
||||
}
|
||||
|
||||
async function render_facilities() {
|
||||
const facilities = await load_facilities();
|
||||
L.geoJSON(facilities)
|
||||
.bindPopup((layer) => layer.feature.properties.name)
|
||||
.addTo(map);
|
||||
}
|
||||
|
||||
map.on("moveend", render_facilities);
|
||||
@@ -7,23 +7,16 @@
|
||||
|
||||
<head>
|
||||
<title>{% block head_title %}{% endblock %}</title>
|
||||
<link rel="icon" type="image/x-icon" href="{% static 'img/favicon.ico' %}">
|
||||
<link rel="icon" type="image/x-icon" href="{% static 'common/img/favicon.ico' %}">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
|
||||
crossorigin="anonymous">
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
|
||||
crossorigin="anonymous"></script>
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.8.0/dist/leaflet.css"
|
||||
integrity="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
|
||||
crossorigin=""/>
|
||||
<script src="https://unpkg.com/leaflet@1.8.0/dist/leaflet.js"
|
||||
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
|
||||
crossorigin=""></script>
|
||||
<link rel="stylesheet" type="text/css" href="{% static 'css/map.css' %}" />
|
||||
{% csrf_token %}
|
||||
{% block extra_head %}
|
||||
{% endblock %}
|
||||
{% csrf_token %}
|
||||
</head>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
|
||||
@@ -1,36 +1,23 @@
|
||||
{% extends "common/base.html" %}
|
||||
|
||||
{% load static %}
|
||||
|
||||
{% block head_title %}WhereToGo{% endblock %}
|
||||
|
||||
{% block extra_head %}
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.8.0/dist/leaflet.css"
|
||||
integrity="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
|
||||
crossorigin=""/>
|
||||
<script src="https://unpkg.com/leaflet@1.8.0/dist/leaflet.js"
|
||||
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
|
||||
crossorigin=""></script>
|
||||
<link rel="stylesheet" type="text/css" href="{% static 'maps/css/map.css' %}" />
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<div id="map"></div>
|
||||
<script>
|
||||
const copy = "© <a href='https://www.openstreetmap.org/copyright'>OpenStreetMap</a> contributors";
|
||||
const url = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
|
||||
const osm = L.tileLayer(url, { attribution: copy });
|
||||
const map = L.map("map", { layers: [osm], minZoom: 5 });
|
||||
map.
|
||||
locate()
|
||||
.on("locationfound", (e) => map.setView(e.latlng, 8))
|
||||
.on("locationerror", () => map.setView([0, 0], 5));
|
||||
|
||||
async function load_facilities() {
|
||||
const facilities_url = `/api/facilities/?in_bbox=${map.getBounds().toBBoxString()}`
|
||||
const response = await fetch(facilities_url)
|
||||
const geojson = await response.json()
|
||||
return geojson
|
||||
}
|
||||
|
||||
async function render_facilities() {
|
||||
const facilities = await load_facilities();
|
||||
L.geoJSON(facilities)
|
||||
.bindPopup((layer) => layer.feature.properties.name)
|
||||
.addTo(map);
|
||||
}
|
||||
|
||||
map.on("moveend", render_facilities);
|
||||
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
{% block scripts %}
|
||||
<script src="{% static 'maps/js/map.js' %}"></script>
|
||||
{% endblock %}
|
||||
@@ -3,7 +3,7 @@
|
||||
|
||||
DATABASES = {
|
||||
"default": {
|
||||
"ENGINE": "django.db.backends.postgresql_psycopg2",
|
||||
"ENGINE": "django.contrib.gis.db.backends.postgis",
|
||||
"NAME": "wheretogo",
|
||||
"USER": "wheretogo",
|
||||
"PASSWORD": "",
|
||||
|
||||