From 6baf1bfb5fc7b94f98d371a63d9a89654b6ee2f4 Mon Sep 17 00:00:00 2001
From: Anton Sarukhanov <code@ant.sr>
Date: Wed, 4 May 2016 14:51:55 -0400
Subject: [PATCH] Implemented 'Combined' embed mode

---
 app.py                  |  2 ++
 static/css/combined.css | 23 ++++++++++++++++
 static/js/embed.js      |  2 +-
 templates/combined.html | 61 +++++++++++++++++++++++++++++++++++++++++
 4 files changed, 87 insertions(+), 1 deletion(-)
 create mode 100644 static/css/combined.css
 create mode 100644 templates/combined.html

diff --git a/app.py b/app.py
index 85dbbbc..4c479fb 100644
--- a/app.py
+++ b/app.py
@@ -37,6 +37,8 @@ def map_embed(mode):
     agency = db.session.query(Agency).filter(Agency.tag==agency_tag).one()
     if not mode or mode == "m":
         return render_template('map.html', agency=agency, config=app.config, embed=True)
+    elif mode == "c":
+        return render_template('combined.html', agency=agency, config=app.config, embed=True)
     elif mode == "p":
         return render_template('predictions.html', agency=agency, config=app.config, embed=True)
 
diff --git a/static/css/combined.css b/static/css/combined.css
new file mode 100644
index 0000000..06aaf8d
--- /dev/null
+++ b/static/css/combined.css
@@ -0,0 +1,23 @@
+body {
+    display: flex;
+    margin: 0;
+    padding: 0;
+}
+.combined:not(:first-child) {
+    border-left: 2px solid #ccc;
+}
+.combined.map,
+.combined.predictions {
+    margin: 0;
+    overflow: hidden;
+}
+.combined.map {
+    flex-basis: 20em;
+    flex-grow: 4;
+    flex-shrink: 1;
+}
+.combined.predictions {
+    flex-basis: 15em;
+    flex-shrink: 1;
+    flex-grow: 1;
+}
diff --git a/static/js/embed.js b/static/js/embed.js
index 4fa38ab..a199b57 100644
--- a/static/js/embed.js
+++ b/static/js/embed.js
@@ -71,7 +71,7 @@ BusMap.Embed = function(opts) {
         $("#embed-mode").on('change', function() {
             embedVars['mode'] = $(this).val();
             updateEmbedUrl();
-            if ($(this).val() == "m") {
+            if ($(this).val() == "m" || $(this).val() == "c") {
                 $("label[for=embed-popup]").show();
             } else {
                 $("label[for=embed-popup]").hide();
diff --git a/templates/combined.html b/templates/combined.html
new file mode 100644
index 0000000..4bc43ca
--- /dev/null
+++ b/templates/combined.html
@@ -0,0 +1,61 @@
+{% extends "base.html" %}
+{% block title -%}
+        {% if agency.short_title %}{{ agency.short_title -}}
+        {% elif agency.title %}{{ agency.title }}{% endif %} Bus Map
+{%- endblock %}
+{% block head %}
+    {{ super() }}
+    <link href="bower/leaflet/dist/leaflet.css" rel="stylesheet"/>
+    <link href="bower/leaflet.markercluster/dist/MarkerCluster.Default.css" rel="stylesheet"/>
+    <link href="bower/Leaflet.label/dist/leaflet.label.css" rel="stylesheet"/>
+    <link href="static/css/map.css" rel="stylesheet" />
+    <link href="static/css/predictions.css" rel="stylesheet" />
+    <link href="static/css/combined.css" rel="stylesheet" />
+{% endblock %}
+{% block body %}
+    <div class="combined map" id="c-map">
+    </div>
+    <div class="combined predictions" id="c-predictions">
+    </div>
+    <script src="bower/leaflet/dist/leaflet.js"></script>
+    <script src="bower/Leaflet.label/dist/leaflet.label.js"></script>
+    <script src="bower/leaflet.markercluster/dist/leaflet.markercluster.js"></script>
+    <script src="bower/leaflet-marker-rotate/leaflet.marker.rotate.js"></script>
+    <script src="bower/jquery/dist/jquery.min.js"></script>
+    <script src="static/js/map.js"></script>
+    <script src="static/js/predictions.js"></script>
+    <script>
+        var map = BusMap.Map({
+            {% if embed %}embed: true,{% endif %}
+            agency: {{ agency.tag|tojson|safe }},
+            mapElement: $("#c-map").get(0),
+            tileUrl: '{{ config['MAP_TILE_URL']|safe }}',
+            tileOptions: {
+                subdomains: {{ config['MAP_TILE_SUBDOMAINS']|tojson|safe }},
+                tileset: '{{ config['MAP_TILESET']|safe }}',
+                errorTileUrl: '{{ config['MAP_ERROR_TILE_URL']|safe }}',
+            },
+            bounds: [
+                [{{ (agency.lat_min - config['MAP_LAT_PADDING'])|round(5) }},
+                    {{ (agency.lon_min - config['MAP_LON_PADDING'])|round(5) }}],
+                [{{ (agency.lat_max + config['MAP_LAT_PADDING'])|round(5) }},
+                    {{ (agency.lon_max + config['MAP_LON_PADDING'])|round(5) }}]
+            ],
+            refresh: {
+                routes: 60,
+                vehicles: 5,
+            },
+            hashUpdate: false,
+            predictions: false,
+        });
+        var predictions = BusMap.Predictions({
+            agency: {{ agency.tag|tojson|safe }},
+            predictionsElement: $("#c-predictions").get(0),
+            refresh: {
+                routes: 60,
+                predictions: 10,
+            },
+            hashListen: false,
+        });
+    </script>
+{% endblock %}
-- 
GitLab