From c4e72d669ebb13c16449a991536da4c46475f0c8 Mon Sep 17 00:00:00 2001
From: Anton Sarukhanov <code@ant.sr>
Date: Wed, 13 Apr 2016 21:38:03 -0400
Subject: [PATCH] More embed ui tweaks. Still feature-incomplete.
---
static/css/map.css | 6 ++++++
templates/base.html | 2 +-
templates/map.html | 2 +-
templates/modal-about.html | 6 +++++-
templates/modal-embed.html | 6 +++---
5 files changed, 16 insertions(+), 6 deletions(-)
diff --git a/static/css/map.css b/static/css/map.css
index 88d55be..1f72df1 100644
--- a/static/css/map.css
+++ b/static/css/map.css
@@ -203,6 +203,12 @@ fieldset legend ~ label {
.modal h2 a {
text-decoration: underline;
}
+.embed-only {
+ display: none;
+}
+body.embed .embed-only {
+ display: block;
+}
#embed-form input {
width: 5em;
}
diff --git a/templates/base.html b/templates/base.html
index a7994e4..212512c 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -7,7 +7,7 @@
{% block head %}
{% endblock %}
</head>
-<body>
+<body class="{% if embed %}embed{% endif %}">
{% block body %}{% endblock %}
{% block body_end %}{% endblock %}
</body>
diff --git a/templates/map.html b/templates/map.html
index 74778eb..b092a41 100644
--- a/templates/map.html
+++ b/templates/map.html
@@ -11,7 +11,7 @@
<link href="static/css/map.css" rel="stylesheet" />
{% endblock %}
{% block body %}
- <div id="map" class="{% if embed %}embed{% endif %}"></div>
+ <div id="map"></div>
{# TODO: Generate these using JS, not here. #}
<div id="msg">
<span id="msg-zoomForVehicles">Zoom in to see vehicles.</span>
diff --git a/templates/modal-about.html b/templates/modal-about.html
index e840bdd..b5e7ce0 100644
--- a/templates/modal-about.html
+++ b/templates/modal-about.html
@@ -1,8 +1,12 @@
-<h2>About PyBusMap</h2>
+<h2>About This Map</h2>
<p>
This map displays real-time vehicle locations and arrival predictions
for public transit systems which are tracked by NextBus.
</p>
+<p class="embed-only" style="text-align: center; font-size: 1.2em;">
+ <a href="{{ url_for('map', _external=True) }}" target="_blank">
+ Click to see the full map</a>
+</p>
<p>
Built by <a href="https://ant.sr">Anton Sarukhanov</a>. Open source
and MIT licensed.
diff --git a/templates/modal-embed.html b/templates/modal-embed.html
index 5698208..77a9521 100644
--- a/templates/modal-embed.html
+++ b/templates/modal-embed.html
@@ -1,6 +1,6 @@
<h2>Embed This Map</h2>
<p>
- This map can be used in websites, displays, or digital signage solutions.
+ This map can be used in websites, displays, or digital signage solutions. To embed a list of predictions instead, change the <strong>Mode</strong> selector.
</p>
<h3>Embed Code</h3>
<textarea id="embed-code" cols=100 rows=3 readonly=true></textarea>
@@ -25,12 +25,12 @@
<legend>Size</legend>
<label for="embed-width">
<span>Width:</span>
- <input id="embed-width" type="number" min=50 step=50 value=400> px
+ <input id="embed-width" type="number" min=200 step=50 value=400> px
</label>
<br>
<label for="embed-height">
<span>Height:</span>
- <input id="embed-height" type="number" min=50 step=50 value=250> px
+ <input id="embed-height" type="number" min=200 step=50 value=250> px
</label>
</fieldset>
</p>
--
GitLab