From 1f3c480967f7bcc800856c40a542d258e54479fb Mon Sep 17 00:00:00 2001 From: Tom Naessens Date: Thu, 30 May 2019 18:29:08 +1200 Subject: [PATCH 1/5] Basic code, still needs some layout changes --- app/static/css/map.css | 9 +++++++-- app/static/js/map.js | 12 ++++++++---- app/templates/location.html | 38 +++++++++++++++++++++++++++++++++++-- app/templates/maps.html | 6 ++++-- 4 files changed, 55 insertions(+), 10 deletions(-) diff --git a/app/static/css/map.css b/app/static/css/map.css index eb42ff5..46adeb4 100644 --- a/app/static/css/map.css +++ b/app/static/css/map.css @@ -1,4 +1,9 @@ -#mapid { +.large-map { min-height: 400px; height: 600px; -} \ No newline at end of file +} + +.small-map { + min-height: 150px; + height: 250px; +} diff --git a/app/static/js/map.js b/app/static/js/map.js index 20f68f4..18344df 100644 --- a/app/static/js/map.js +++ b/app/static/js/map.js @@ -1,11 +1,11 @@ -var map = L.map('mapid').setView([ - 51.0231119, 3.7102741 -], 14); +var map = L.map('mapid'); L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© OpenStreetMap contributors' }).addTo(map); +let base_request_uri = "https://photon.komoot.de/api/?limit=1&q="; + function performRequest(url, location, success_callback) { var request = new XMLHttpRequest(); request.open('GET', url, true); @@ -52,6 +52,10 @@ let callback = function OSMCallBack(location, data) { marker.on('mouseout', function(env) { marker.closePopup(); }); + + if (location.center) { + map.setView([lat, lon], 14); + } } else { console.log(`Location ${JSON.stringify(location, null, 2)} returned no features, are you sure this is a valid address?`); } @@ -59,7 +63,7 @@ let callback = function OSMCallBack(location, data) { function loadmap(locations) { for (let loc of locations) { - let request_uri = "https://photon.komoot.de/api/?limit=1&q=" + loc.address; + let request_uri = base_request_uri + loc.address; performRequest(request_uri, loc, callback); } } diff --git a/app/templates/location.html b/app/templates/location.html index 2ac5081..3175d32 100644 --- a/app/templates/location.html +++ b/app/templates/location.html @@ -5,12 +5,19 @@ {% block container %}
-
-

Location: {{ location.name }}

+
+

{{ location.name }}

: {{ location.address }}
: {{ location.telephone }}
: {{ location.website }}
+
+ {% if location.address %} +
+ {% endif %} +
+
+

Products

@@ -29,3 +36,30 @@ {% endblock %} + +{% block styles %} +{{ super() }} + + +{% endblock %} + +{% block scripts %} +{{super()}} + +{% if location.address %} + + + +{% endif %} +{% endblock %} diff --git a/app/templates/maps.html b/app/templates/maps.html index 1310d12..0c43dd5 100644 --- a/app/templates/maps.html +++ b/app/templates/maps.html @@ -4,7 +4,7 @@ {% import "utils.html" as util %} {% block container %} -
+
{% endblock %} {% block styles %} @@ -28,13 +28,15 @@ loc = { "address": "{{loc.address}}", "name": "{{loc.name}}", - "url": "{{ url_for('location', id=loc.id) }}" + "url": "{{ url_for('location', id=loc.id) }}" }; locations.push(loc); {% endif %} {%- endfor %} +map.setView([51.0231119, 3.7102741], 14); + loadmap(locations); {% endblock %} From 6e74e0e078e999366d0cc4e253504bdfd265ff90 Mon Sep 17 00:00:00 2001 From: Tom Naessens Date: Thu, 30 May 2019 18:36:56 +1200 Subject: [PATCH 2/5] Cleaner layout --- app/templates/location.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/templates/location.html b/app/templates/location.html index 3175d32..5e0ed71 100644 --- a/app/templates/location.html +++ b/app/templates/location.html @@ -11,7 +11,7 @@ : {{ location.telephone }}
: {{ location.website }} -
+
{% if location.address %}
{% endif %} From 0619cef2467a6b76114f38e5bfe5219c5474a680 Mon Sep 17 00:00:00 2001 From: Tom Naessens Date: Thu, 30 May 2019 18:46:28 +1200 Subject: [PATCH 3/5] Some layouting --- app/templates/location.html | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/app/templates/location.html b/app/templates/location.html index 5e0ed71..64fb0eb 100644 --- a/app/templates/location.html +++ b/app/templates/location.html @@ -7,9 +7,9 @@

{{ location.name }}

- : {{ location.address }}
- : {{ location.telephone }}
- : {{ location.website }} + {{ location.address }}
+ {{ location.telephone }}
+ {{ location.website }}
{% if location.address %} @@ -55,6 +55,7 @@ loc = { "address": "{{location.address}}", "name": "{{location.name}}", + "url": "{{location.website}}", "center": true, }; locations.push(loc); From 41a289fb470799c78fb71d4d57b37e5dc45009fa Mon Sep 17 00:00:00 2001 From: Tom Naessens Date: Thu, 30 May 2019 19:40:17 +1200 Subject: [PATCH 4/5] Add a small padding-top above location map for mobile devices --- app/static/css/main.css | 6 +++++- app/templates/location.html | 2 +- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/app/static/css/main.css b/app/static/css/main.css index 451f630..6a5f493 100644 --- a/app/static/css/main.css +++ b/app/static/css/main.css @@ -3,6 +3,10 @@ body { padding-top: 70px; } +.padding-top { + padding-top: 10px; +} + .darker { background-color: #fafafa; margin-top: 10px; @@ -21,4 +25,4 @@ body { .product .extras { padding-left: 20px; -} \ No newline at end of file +} diff --git a/app/templates/location.html b/app/templates/location.html index 64fb0eb..4f52558 100644 --- a/app/templates/location.html +++ b/app/templates/location.html @@ -11,7 +11,7 @@ {{ location.telephone }}
{{ location.website }}
-
+
{% if location.address %}
{% endif %} From ec9c034539822b05b893301fb6f70121ecd26152 Mon Sep 17 00:00:00 2001 From: mcbloch Date: Fri, 31 May 2019 19:05:40 +0200 Subject: [PATCH 5/5] add media querries for side padding --- README.md | 3 ++- app/static/css/main.css | 15 +++++++++++++++ app/templates/location.html | 2 +- 3 files changed, 18 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index b8e2a8a..4351b66 100644 --- a/README.md +++ b/README.md @@ -22,7 +22,8 @@ This will create a virtual environment, install the necessary dependencies and w If you are using a database other then sqlite you will first need to configure the correct uri to the database in the generated 'config.py' file. Afterwards upgrade the database to the latest version using - python app/haldis.py db upgrade + cd app + python haldis.py db upgrade You can now still seed the database by running diff --git a/app/static/css/main.css b/app/static/css/main.css index 6a5f493..d01e6bc 100644 --- a/app/static/css/main.css +++ b/app/static/css/main.css @@ -26,3 +26,18 @@ body { .product .extras { padding-left: 20px; } + + +@media(min-width: 768px) and (max-width: 991px){ + /* Make sure the small map in the location page has the same with as the block above */ + .sm-no-side-padding { + padding-left: 0px; + padding-right: 0px; + } +} + +@media(min-width: 992px){ + .md-no-right-padding { + padding-right: 0px; + } +} diff --git a/app/templates/location.html b/app/templates/location.html index 422eb6b..24f8604 100644 --- a/app/templates/location.html +++ b/app/templates/location.html @@ -14,7 +14,7 @@ Create order {% endif %}
-
+
{% if location.address %}
{% endif %}