add qr modal

src/c3nav/site/static/site/css/c3nav.css

@@ -293,3 +293,23 @@ footer {
     border-width:0 !important;
     padding:0;
 }
+
+
+#qr_modal {
+    position:absolute;
+    top:0;
+    left:0;
+    width:100%;
+    height:100%;
+    background-color:rgba(0, 0, 0, 0.2);
+    display:none;
+}
+#qr_modal .inner {
+    background-color:#FFFFFF;
+    padding:20px;
+    box-sizing:border-box;
+    text-align:center;
+    margin:30px auto;
+    width:400px;
+    max-width:95vw;
+}

src/c3nav/site/static/site/js/c3nav.js

@@ -6,6 +6,7 @@ c3nav = {
         c3nav.svg_width = parseInt(c3nav.main_view.attr('data-svg-width'));
         c3nav.svg_height = parseInt(c3nav.main_view.attr('data-svg-height'));
         c3nav.visible_areas = c3nav.main_view.attr('data-visible-areas').split(';');
+        c3nav.qr_modal = $('#qr_modal');
 
         c3nav._typeahead_locations = new Bloodhound({
             datumTokenizer: function(data) {
@@ -39,12 +40,17 @@ c3nav = {
 
         $('.locationselect .icons .reset').click(c3nav._locationselect_reset);
         $('.locationselect .icons .map').click(c3nav._locationselect_activate_map);
+        $('.locationselect .icons .link').click(c3nav._locationselect_click_link);
         $('.locationselect .close-map').click(c3nav._locationselect_close_map);
         $('.locationselect .level-selector a').click(c3nav._locationselect_click_level);
         $('.locationselect .map-container').on('click', 'img', c3nav._locationselect_click_image);
         $('#route-from-here').click(c3nav._click_route_from_here);
         $('#route-to-here').click(c3nav._click_route_to_here);
 
+        c3nav.qr_modal.find('button').click(function() {
+            c3nav.qr_modal.hide();
+        });
+
         $('.showsettings').show();
         $('.savesettings, .settings').hide();
         $('.showsettings a').click(function(e) {
@@ -64,12 +70,18 @@ c3nav = {
         location_group.find('.tt-suggestion').remove();
         c3nav._locations_changed();
     },
+    _locationselect_click_link: function(e) {
+        e.preventDefault();
+        var location_id = $(this).closest('.location-group').find('.id-field').val();
+        c3nav.qr_modal.find('strong').text(window.location.origin+'/l/'+location_id+'/');
+        c3nav.qr_modal.find('img').attr('src', '/qr/'+location_id+'.png');
+        c3nav.qr_modal.show();
+    },
     _locationselect_activate_map: function(e) {
         e.preventDefault();
         var location_group = $(this).closest('.location-group');
         location_group.addClass('map');
         var map_container = location_group.find('.map-container');
-        console.log(c3nav.svg_height-(map_container.height()/2));
         map_container.scrollTop((c3nav.svg_height-map_container.height())/2).scrollLeft((c3nav.svg_width-map_container.width())/2);
         location_group.find('.level-selector a').first().click();
     },

src/c3nav/site/templates/site/fragment_location.html

@@ -52,9 +52,7 @@
                     <small class="subtitle">{{ location.subtitle }}</small>
                 </div>
                 <div class="icons">
-                    {% if name != 'location' %}
+                    <a href="{% if location %}{% url 'site.location' location=location.location_id %}{% endif %}" class="link"></a>
-                        <a href="{% if location %}{% url 'site.location' location=location.location_id %}{% endif %}" class="link"></a>
-                    {% endif %}
                     <a href="{{ reset_url }}" class="reset"></a>
                 </div>
                 <input type="hidden" name="{{ name }}" value="{{ location.location_id }}" class="id-field">

src/c3nav/site/templates/site/main.html

@@ -91,6 +91,13 @@
     <p>{% trans 'Please try again in a few minutes.' %}</p>
 </div>
 {% endif %}
+    <div id="qr_modal">
+        <div class="inner">
+            <p><img src="/qr/c:0:1:1.png"></p>
+            <p><strong>https://c3nav.de/lalala.png</strong></p>
+            <p><button class="btn btn-default">{% trans 'close' %}</button></p>
+        </div>
+    </div>
 {% if route %}
 {% include 'site/fragment_route.html' %}
 {% endif %}