add share and shourtcut buttons for mobileclient

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

@@ -313,3 +313,11 @@ footer {
     width:400px;
     max-width:95vw;
 }
+#qr_modal button {
+    margin:0 4px 8px;
+}
+
+
+.nomobileclient .app-only {
+    display:none;
+}

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

@@ -8,6 +8,11 @@ c3nav = {
         c3nav.visible_areas = c3nav.main_view.attr('data-visible-areas').split(';');
         c3nav.qr_modal = $('#qr_modal');
 
+        c3nav.mobileclient = (typeof mobileclient !== "undefined")
+        if (c3nav.mobileclient) {
+            $('body').removeClass('nomobileclient');
+        }
+
         c3nav._typeahead_locations = new Bloodhound({
             datumTokenizer: function(data) {
                 var result = [data.id]
@@ -47,9 +52,15 @@ c3nav = {
         $('#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.find('.qr-close').click(function() {
             c3nav.qr_modal.hide();
         });
+        c3nav.qr_modal.find('.share').click(function() {
+            mobileclient.shareUrl(c3nav.qr_modal.find('strong').text());
+        });
+        c3nav.qr_modal.find('.shortcut').click(function() {
+            mobileclient.createShortcut(c3nav.qr_modal.find('strong').text(), c3nav.qr_modal.data('title'));
+        });
 
         $('.showsettings').show();
         $('.savesettings, .settings').hide();
@@ -72,9 +83,12 @@ c3nav = {
     },
     _locationselect_click_link: function(e) {
         e.preventDefault();
-        var location_id = $(this).closest('.location-group').find('.id-field').val();
+        var location_group = $(this).closest('.location-group');
+        var location_id = location_group.find('.id-field').val();
+        var location_title = location_group.find('.title').text();
         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.data('title', location_title)
         c3nav.qr_modal.show();
     },
     _locationselect_activate_map: function(e) {

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

@@ -3,6 +3,8 @@
 {% load static %}
 {% load i18n %}
 
+{% block bodyclass %} nomobileclient{% endblock %}
+
 {% block content %}
 <form method="post" class="main-view mode-{{ mode }}{% if origin and destination %} can-route{% endif %}"
       data-svg-width="{{ svg_width }}" data-svg-height="{{ svg_height }}" data-visible-areas="{{ visible_areas | join:';' }}"
@@ -95,7 +97,13 @@
         <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>
+            <p>
+                <span class="app-onlya">
+                    <button class="btn btn-default share">{% trans 'share' %}</button>
+                    <button class="btn btn-default shortcut">{% trans 'shortcut' %}</button>
+                </span>
+                <button class="btn btn-default qr-close">{% trans 'close' %}</button>
+            </p>
         </div>
     </div>
 {% if route %}