diff --git a/README.md b/README.md
index fe52837..0e2b914 100644
--- a/README.md
+++ b/README.md
@@ -45,10 +45,22 @@ Read the [docker installation instructions](https://github.com/ruimarinho/docker
 
 ### Install dependencies and configure apache
 
+
+##### raspberryPi
+raspberryPi follows instructions set out in Debian / Ubuntu below, with the exception of the python-semantic-version.
+You will need to install this manually from PIP using the below command. 
+When following the Debian / Ubuntu instructions remember to remove the python-semantic-version item from the apt-get command
+
+```shell
+pip install semantic_version
+```
+
 #### Debian / Ubuntu
+The below will install and configure the web application, applying relative Alias commands to access local resources
 
 ```shell
 apt-get -y install python-geoip python-ipaddr python-humanize python-bottle python-semantic-version apache2 libapache2-mod-wsgi git wget geoip-database-extra
+echo "Alias /images/ /var/www/html/openvpn-monitor/images/" > /etc/apache2/conf-available/openvpn-monitor.conf
 echo "WSGIScriptAlias /openvpn-monitor /var/www/html/openvpn-monitor/openvpn-monitor.py" > /etc/apache2/conf-available/openvpn-monitor.conf
 a2enconf openvpn-monitor
 systemctl restart apache2
@@ -63,7 +75,6 @@ echo "WSGIScriptAlias /openvpn-monitor /var/www/html/openvpn-monitor/openvpn-mon
 systemctl restart httpd
 ```
 
-
 ### Checkout OpenVPN-Monitor
 
 ```shell
@@ -75,7 +86,7 @@ git clone https://github.com/furlongm/openvpn-monitor.git
 ### Configure OpenVPN
 
 Add the following line to your OpenVPN server configuration to run the
-management console on 127.0.0.1 port 5555:
+management console on 127.0.0.1 port 5555: (This port is arbitary, you may choose any)
 
 ```
 management 127.0.0.1 5555
@@ -87,13 +98,52 @@ access to the management interface.
 
 ### Configure OpenVPN-Monitor
 
-The example configuration file `/var/www/html/openvpn-monitor/openvpn-monitor.conf`
+The provided configuration file `/var/www/html/openvpn-monitor/openvpn-monitor.conf`
 should give some indication of how to set site name, add a logo, etc. You can
 also set a default location (latitude and longitude) for the embedded maps.
 If not set, the default location is New York, USA.
 
-Edit `/var/www/html/openvpn-monitor/openvpn-monitor.conf` to match your site.
 
+Complete the following by editing `/var/www/html/openvpn-monitor/openvpn-monitor.conf` to match your site.
+
+#### OpenVPN-Monitor
+The below should help you quickly configure your vpn monitor with relevant settings
+
+| Option           | Default  | Description |
+| ---              | ---      | ---         |
+| site             | Example  | The name of the monitoring box - Free text, can be anything |
+| logo             | None     | Optional logo. This will be displayed in the top right. No default provided |
+| latitude         | -37.8067 | Latitude location for the centre of map and marker icon to be set. Requires longitude or no action is taken. |
+| longitude        | 144.9635 | Longitude location for the centre of map and marker icon to be set. Requires latitude or no action is taken. |
+| Maps             | False    | Will the site display the map|
+| geoip_data       | /usr/share/GeoIP/GeoIPCity.dat | GeoLocation data location. Unless you are making locational changes this should not need to be changed. |
+| datetime_format  | %a %b %d %H:%M:%S %Y | DateTime format for server display |
+| marker           | False    | Display a marker on the map for the OpenVPN-Monitor Box |
+| externalip       | 0.0.0.0  |  External IP of the OpenVPN-Monitor box. If latitude and longitude not specified then this is used to locate the Monitor box |
+| pervpn_control   | False    |  Display a layer control to turn of element markers per vpn | 
+| itemtype_control | False    |  Display a layer control to turn off element markers per connection type |
+| allowFullscreen  | False    |  Allow the map to be displayed in FullScreen mode |
+
+Note: If latitude, longitude and externalip all cannot be validated then Melbourne, Australia becomes the default centre and marker location.
+
+#### Per VPN Settings
+The below should help you quickly configure connections to vpns
+
+| Option           | Default    | Description |
+| ---              | ---        | ---         |
+| host             | localhost  | Specifies the IP or DNS name of the VPN management interface to connect. |
+| port             | 5555       | Specifies the Port of the management internace to connect. |
+| name             | default    | Free Text. The name of the VPN Connection |
+| show_disconnect  | False      | Show a button to disconnect clients |
+| externalip       | 0.0.0.0    | External IP of the VPN Server. If latitude and longitude not specified then this is used to locate the VPN |
+| latitude         | -35.308065 | Latitude location for the vpn marker icon. Requires longitude or no action is taken. |
+| longitude        | 149.124521 | Longitude location for the vpn marker icon. Requires Latitude or no action is taken. |
+| marker           | False      | Display a marker on the map for the VPN Server |
+| connection_lines | False      | Display connection lines between the Server and the Clients. Requires marker to be on for VPN. |
+
+Note: If latitude, longitude and externalip all cannot be validated then Canberra, Australia becomes the default marker location.
+
+### Your Done
 You should now be able to navigate to `http://myipaddress/openvpn-monitor/`
 
 Note the trailing slash, the images may not appear without it.
@@ -127,3 +177,5 @@ the COPYING file.
 Flags are created by Matthias Slovig (flags@slovig.de) and are licensed under
 Creative Commons License Deed Attribution-ShareAlike 3.0 Unported
 (CC BY-SA 3.0). See http://flags.blogpotato.de/ for more details.
+Fullscreen control provided by https://github.com/brunob/leaflet.fullscreen
+Spiderfy (Closeby Marker control) provided by https://github.com/jawj/OverlappingMarkerSpiderfier-Leaflet
diff --git a/images/favicon.ico b/images/favicon.ico
new file mode 100644
index 0000000..018dd27
Binary files /dev/null and b/images/favicon.ico differ
diff --git a/images/marker-icon-blue.png b/images/marker-icon-blue.png
new file mode 100644
index 0000000..950edf2
Binary files /dev/null and b/images/marker-icon-blue.png differ
diff --git a/images/marker-icon-green.png b/images/marker-icon-green.png
new file mode 100644
index 0000000..fe2a6af
Binary files /dev/null and b/images/marker-icon-green.png differ
diff --git a/images/marker-icon-orange.png b/images/marker-icon-orange.png
new file mode 100644
index 0000000..d6c02e9
Binary files /dev/null and b/images/marker-icon-orange.png differ
diff --git a/images/marker-icon-red.png b/images/marker-icon-red.png
new file mode 100644
index 0000000..364ac35
Binary files /dev/null and b/images/marker-icon-red.png differ
diff --git a/images/route-icon.png b/images/route-icon.png
new file mode 100644
index 0000000..eae13b4
Binary files /dev/null and b/images/route-icon.png differ
diff --git a/openvpn-monitor.conf b/openvpn-monitor.conf
index 9d8ca18..f5f0ee7 100644
--- a/openvpn-monitor.conf
+++ b/openvpn-monitor.conf
@@ -6,9 +6,30 @@ site=Example
 maps=True
 geoip_data=/usr/share/GeoIP/GeoIPCity.dat
 datetime_format=%d/%m/%Y %H:%M:%S
+marker=True
+externalip=0.0.0.0
+pervpn_control=True
+itemtype_control=True
+allowFullscreen=True
 
 [VPN1]
 host=localhost
 port=5555
 name=Staff VPN
 show_disconnect=False
+externalip=0.0.0.0
+#latitude=-35
+#longitude=149
+marker=True
+connection_lines=True
+
+#[VPN2]
+#host=remotehost
+#port=5555
+#name=Test VPN
+#show_disconnect=False
+#externalip=0.0.0.0
+#latitude=-35
+#longitude=149
+#marker=True
+#connection_lines=True
diff --git a/openvpn-monitor.py b/openvpn-monitor.py
index f53571d..d982f7e 100755
--- a/openvpn-monitor.py
+++ b/openvpn-monitor.py
@@ -106,14 +106,28 @@ def load_default_settings(self):
         info('Using default settings => localhost:5555')
         self.settings = {'site': 'Default Site',
                          'geoip_data': '/usr/share/GeoIP/GeoIPCity.dat',
-                         'datetime_format': '%d/%m/%Y %H:%M:%S'}
+                         'datetime_format': '%d/%m/%Y %H:%M:%S',
+                         'marker': False,
+                         'externalip': '0.0.0.0',
+                         'pervpn_control': False,
+                         'itemtype_control': False,
+                         'allowFullscreen': False}
         self.vpns['Default VPN'] = {'name': 'default',
                                     'host': 'localhost',
                                     'port': '5555',
-                                    'show_disconnect': False}
+                                    'show_disconnect': False,
+                                    'externalip': '0.0.0.0',
+                                    'latitude': '-35.308065',
+                                    'longitude': '149.124521',
+                                    'marker': False,
+                                    'connection_lines': False}
+
 
     def parse_global_section(self, config):
-        global_vars = ['site', 'logo', 'latitude', 'longitude', 'maps', 'geoip_data', 'datetime_format']
+        global_vars = ['site', 'logo', 'latitude', 'longitude', 'maps',
+                       'geoip_data', 'datetime_format', 'marker',
+                       'externalip', 'pervpn_control',
+                       'itemtype_control', 'allowFullscreen']
         for var in global_vars:
             try:
                 self.settings[var] = config.get('OpenVPN-Monitor', var)
@@ -134,10 +148,13 @@ def parse_vpn_section(self, config, section):
             except configparser.Error as e:
                 warning('CONFIG: {0!s} on option {1!s}: '.format(e, option))
                 vpn[option] = None
-        if 'show_disconnect' in vpn and vpn['show_disconnect'] == 'True':
-            vpn['show_disconnect'] = True
-        else:
-            vpn['show_disconnect'] = False
+        vpn['show_disconnect'] = bool('show_disconnect' in vpn and
+                                      vpn['show_disconnect'] == 'True')
+        vpn['marker'] = bool('marker' in vpn and vpn['marker'] == 'True')
+        vpn['connection_lines'] = bool('connection_lines' in vpn and
+                                       vpn['connection_lines'] == 'True')
+        if 'externalip' not in vpn:
+            vpn['externalip'] = '0.0.0.0'
         if args.debug:
             debug("=== begin section\n{0!s}\n=== end section".format(vpn))
 
@@ -180,6 +197,18 @@ def collect_data(self, vpn):
         vpn['stats'] = self.parse_stats(stats)
         status = self.send_command('status 3\n')
         vpn['sessions'] = self.parse_status(status, self.gi, vpn['semver'])
+        if 'latitude' not in vpn or 'longitude' not in vpn:
+            # default Canberra
+            vpn['longitude'] = '149.124521'
+            vpn['latitude'] = '-35.308065'
+            if 'externalip' in vpn:
+                try:
+                    gir = self.gi.record_by_addr(str(vpn['externalip']))
+                except SystemError:
+                    gir = None
+                if gir is not None:
+                    vpn['longitude'] = gir['longitude']
+                    vpn['latitude'] = gir['latitude']
 
     def _socket_send(self, command):
         if sys.version_info[0] == 2:
@@ -431,6 +460,7 @@ def __init__(self, cfg, monitor):
     def init_vars(self, settings, monitor):
 
         self.vpns = list(monitor.vpns.items())
+        self.gi = monitor.gi
 
         self.site = 'Example'
         if 'site' in settings:
@@ -444,12 +474,46 @@ def init_vars(self, settings, monitor):
         if 'maps' in settings and settings['maps'] == 'True':
             self.maps = True
 
-        self.latitude = 40.72
-        self.longitude = -74
-        if 'latitude' in settings:
+        self.externalip = '0.0.0.0'
+        if 'externalip' in settings:
+            self.externalip = settings['externalip']
+
+        # default melbourne
+        self.latitude = -37.8067
+        self.longitude = 144.9635
+        if 'latitude' in settings and 'longitude' in settings:
             self.latitude = settings['latitude']
-        if 'longitude' in settings:
             self.longitude = settings['longitude']
+        else:
+            try:
+                gir = self.gi.record_by_addr(self.externalip)
+            except SystemError:
+                gir = None
+            if gir is not None:
+                self.location = gir['country_code']
+                self.city = get_str(gir['city'])
+                self.country_name = gir['country_name']
+                self.longitude = gir['longitude']
+                self.latitude = gir['latitude']
+
+        self.marker = False
+        if 'marker' in settings and settings['marker'] == 'True':
+            self.marker = True
+
+        self.pervpn_control = False
+        if ('pervpn_control' in settings and
+                settings['pervpn_control'] == 'True'):
+            self.pervpn_control = True
+
+        self.itemtype_control = False
+        if ('itemtype_control' in settings and
+                settings['itemtype_control'] == 'True'):
+            self.itemtype_control = True
+
+        self.allowFullscreen = False
+        if ('allowFullscreen' in settings and
+                settings['allowFullscreen'] == 'True'):
+            self.allowFullscreen = True
 
         self.datetime_format = settings['datetime_format']
 
@@ -472,6 +536,23 @@ def print_html_header(self):
         output('<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.28.4/css/theme.bootstrap.min.css" integrity="sha256-cerl+DYHeG2ZhV/9iueb8E+s7rubli1gsnKuMbKDvho=" crossorigin="anonymous" />')
         if self.maps:
             output('<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.2/leaflet.css" integrity="sha256-9mfj77orHLh2GsN7CbMvpjO/Wny/ZZhR7Pu7hy0Yig4=" crossorigin="anonymous" />')
+        if self.maps and self.allowFullscreen:
+            # Leaflet.Control.FullScreen css
+            output('<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet.fullscreen/1.4.2/Control.FullScreen.min.css" integrity="sha256-5cUdI/OZOFcVL9i5LiXvBL5UCGT+AFANIphndyL8SBk=" crossorigin="anonymous" />')  # noqa: E501
+        output('<style>')
+        output('.panel-custom {')
+        output('   background-color:#777;')
+        output('   color:#fff;')
+        output('   font-size:75%;')
+        output('   vertical-align:baseline;')
+        output('   padding:.2em .6em .3em;')
+        output('   line-height:1;')
+        output('   font-weight:700;')
+        output('{')
+        output('</style>')
+
+        # favicon
+        output('<link rel="shortcut icon" href="/images/favicon.ico" />')
 
         # js
         output('<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>')
@@ -484,6 +565,11 @@ def print_html_header(self):
         output('});</script>')
         if self.maps:
             output('<script src="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.2/leaflet.js" integrity="sha256-RS5bDpN9YmmUIdtdu8ESPjNp1Bg/Fqu90PwN3uawdSQ=" crossorigin="anonymous"></script>')
+            # spiderfy
+            output('<script src="//cdnjs.cloudflare.com/ajax/libs/OverlappingMarkerSpiderfier-Leaflet/0.2.6/oms.min.js" integrity="sha256-t+V41b9l6j8GMYAbpcnZbib1XiYwCAsDibD8sI1D7+Y=" crossorigin="anonymous"></script>')  # noqa: E501
+        if self.maps and self.allowFullscreen:
+            # Leaflet.Control.FullScreen js
+            output('<script src="//cdnjs.cloudflare.com/ajax/libs/leaflet.fullscreen/1.4.2/Control.FullScreen.min.js" integrity="sha256-1k7z6MchW2n/LeqU0PNtvEgBYSPvtt+eDrUKaR/rksI=" crossorigin="anonymous"></script>')  # noqa: E501
 
         output('</head><body>')
 
@@ -541,6 +627,7 @@ def print_session_table_headers(vpn_mode, show_disconnect):
         elif vpn_mode == 'Server':
             headers = server_headers
 
+        output('<div class="table-responsive">')
         output('<table id="sessions" class="table table-striped table-bordered ')
         output('table-hover table-condensed table-responsive ')
         output('tablesorter tablesorter-bootstrap">')
@@ -551,7 +638,7 @@ def print_session_table_headers(vpn_mode, show_disconnect):
 
     @staticmethod
     def print_session_table_footer():
-        output('</tbody></table>')
+        output('</tbody></table></div>')
 
     @staticmethod
     def print_unavailable_vpn(vpn):
@@ -588,6 +675,7 @@ def print_vpn(self, vpn_id, vpn):
         output('<div class="panel-heading"><h3 class="panel-title">{0!s}</h3>'.format(
             vpn['name']))
         output('</div><div class="panel-body">')
+        output('<div class="table-responsive">')
         output('<table class="table table-condensed table-responsive">')
         output('<thead><tr><th>VPN Mode</th><th>Status</th><th>Pingable</th>')
         output('<th>Clients</th><th>Total Bytes In</th><th>Total Bytes Out</th>')
@@ -605,15 +693,18 @@ def print_vpn(self, vpn_id, vpn):
         output('<td>{0!s}</td>'.format(local_ip))
         if vpn_mode == 'Client':
             output('<td>{0!s}</td>'.format(remote_ip))
-        output('</tr></tbody></table>')
+        output('</tr></tbody></table></div>')
 
         if vpn_mode == 'Client' or nclients > 0:
             self.print_session_table_headers(vpn_mode, show_disconnect)
             self.print_session_table(vpn_id, vpn_mode, vpn_sessions, show_disconnect)
             self.print_session_table_footer()
 
-        output('<span class="label label-default">{0!s}</span>'.format(vpn['version']))
-        output('</div></div>')
+        output('</div>')
+        output('<div class="panel-footer panel-custom">')
+        output('{0!s}'.format(vpn['version']))
+        output('</div>')
+        output('</div>')
 
     @staticmethod
     def print_client_session(session):
@@ -640,7 +731,8 @@ def print_server_session(self, vpn_id, session, show_disconnect):
             if session['location'] == 'RFC1918':
                 output('<td>RFC1918</td>')
             else:
-                flag = '{0!s}flags/{1!s}.png'.format(image_path, session['location'].lower())
+                loc = session['location'].lower()
+                flag = '{0!s}images/flags/{1!s}.png'.format(image_path, loc)
                 if 'city' in session and 'country_name' in session:
                     country = session['country_name']
                     city = session['city']
@@ -689,28 +781,181 @@ def print_maps_html(self):
         output('<h3 class="panel-title">Map View</h3></div><div class="panel-body">')
         output('<div id="map_canvas" style="height:500px"></div>')
         output('<script type="text/javascript">')
-        output('var map = L.map("map_canvas");')
+        if self.allowFullscreen:
+            output('var map = L.map("map_canvas", { fullscreenControl: true, '
+                   'fullscreenControlOptions: { position: "topleft" }  });')
+        else:
+            output('var map = L.map("map_canvas");')
         output('var centre = L.latLng({0!s}, {1!s});'.format(self.latitude, self.longitude))
         output('map.setView(centre, 8);')
         output('url = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";')
         output('var layer = new L.TileLayer(url, {});')
         output('map.addLayer(layer);')
         output('var bounds = L.latLngBounds(centre);')
+
+        # spiderfy closeby clients
+        output('var oms = new OverlappingMarkerSpiderfier '
+               '(map,{keepSpiderfied:true});')
+
+        # Extend the Default marker class
+        output('var LeafIcon = L.Icon.extend('
+               '{options: {iconAnchor: [12, 41]}});')
+        output('var redIcon = new LeafIcon('
+               '{iconUrl: "images/marker-icon-red.png"});')
+        output('var orangeIcon = new LeafIcon('
+               '{iconUrl: "images/marker-icon-orange.png"});')
+        output('var greenIcon = new LeafIcon('
+               '{iconUrl: "images/marker-icon-green.png"});')
+        output('var blueIcon = new LeafIcon('
+               '{iconUrl: "images/marker-icon-blue.png"});')
+
+        # used later to add per vpn layers
+        output('var overlayMaps = {};')
+        output('var overlayPerVPN = {};')
+
+        output('var monitorLayer = L.layerGroup();')
+        # add marker for monitor box
+        if self.marker:
+            output('var monitor = L.marker(centre, {icon: greenIcon});')
+            output('monitor.alt = "Type: Monitor<br/>'
+                   'Name: {0!s}<br/>IP:{1!s}";'.format(
+                    self.site, self.externalip))
+            output('monitorLayer.addLayer(monitor);')
+            output('oms.addMarker(monitor);')
+        output('monitorLayer.addTo(map);')
+
+        output('var vpnclientLayer = L.layerGroup();')
+        output('var vpnserverLayer = L.layerGroup();')
+        output('var vpnconnectionsLayer = L.layerGroup();')
+
+        display_connection_legend = False
+        display_server_legend = False
         for vkey, vpn in self.vpns:
             if 'sessions' in vpn:
                 output('bounds.extend(centre);')
+                # create per vpn layer
+                output('var pervpnLayer = L.layerGroup();')
+                # add self marker per vpn
+                if ('longitude' in vpn and
+                        'latitude' in vpn and
+                        vpn['marker'] is True):
+                    display_server_legend = True
+                    output('var latlng = new L.latLng({0!s}, {1!s});'.format(
+                        vpn['latitude'], vpn['longitude']))
+                    output('bounds.extend(latlng);')
+                    output('var server_marker = L.marker(latlng, '
+                           '{icon: orangeIcon}).addTo(vpnserverLayer)'
+                           '.addTo(pervpnLayer);')
+                    output('oms.addMarker(server_marker);')
+                    output('server_marker.alt = "Type: Server<br/>'
+                           'Name: {0!s}<br/>IP: {1!s}";'.format(
+                            vpn['name'], vpn['externalip']))
+
                 for skey, session in list(vpn['sessions'].items()):
                     if 'longitude' in session and 'latitude' in session:
                         output('var latlng = new L.latLng({0!s}, {1!s});'.format(
                             session['latitude'], session['longitude']))
                         output('bounds.extend(latlng);')
-                        output('var marker = L.marker(latlng).addTo(map);')
-                        output('var popup = L.popup().setLatLng(latlng);')
-                        output('popup.setContent("{0!s} - {1!s}");'.format(
-                            session['username'], session['remote_ip']))
-                        output('marker.bindPopup(popup);')
+                        output('var client_marker = L.marker(latlng)'
+                               '.addTo(vpnclientLayer).addTo(pervpnLayer);')
+                        output('oms.addMarker(client_marker);')
+                        output('client_marker.alt = "Type: Client<br/>'
+                               'Name: {0!s}<br/>IP: {1!s}";'.format(
+                                   session['username'], session['remote_ip']))
+                        # adding routing lines (they rely on server info)
+                        if (vpn['connection_lines'] is True and
+                                vpn['marker'] is True and
+                                'longitude' in vpn and
+                                'latitude' in vpn):
+                            display_connection_legend = True
+                            output('var latlngs = Array();')
+                            output('latlngs.push(client_marker.getLatLng());')
+                            output('latlngs.push(server_marker.getLatLng());')
+                            output('var polyline = L.polyline(latlngs,'
+                                   '{color:"blue",weight:2,opacity:0.5})'
+                                   '.addTo(vpnconnectionsLayer)'
+                                   '.addTo(pervpnLayer).addTo(map);')
+
+                # add to map
+                output('pervpnLayer.addTo(map);')
+                # add per vpn layers
+                output('if(!$.isEmptyObject(pervpnLayer.getLayers())){')
+                output('overlayPerVPN["{0!s}"] = '
+                       'pervpnLayer;'.format(vpn['name']))
+                output('}')
+
+        output('vpnclientLayer.addTo(map);')
+        output('vpnserverLayer.addTo(map);')
+        output('vpnconnectionsLayer.addTo(map);')
         output('map.fitBounds(bounds);')
+
+        # add Layer objects for non empty items
+        output('if(!$.isEmptyObject(monitorLayer.getLayers()))')
+        output('{overlayMaps["VPN Monitor"] = monitorLayer;}')
+        output('if(!$.isEmptyObject(vpnclientLayer.getLayers()))')
+        output('{overlayMaps["VPN Clients"] = vpnclientLayer;}')
+        output('if(!$.isEmptyObject(vpnserverLayer.getLayers()))')
+        output('{overlayMaps["VPN Servers"] = vpnserverLayer;}')
+        output('if(!$.isEmptyObject(vpnconnectionsLayer.getLayers()))')
+        output('{overlayMaps["VPN Routes"] = vpnconnectionsLayer;}')
+        if self.itemtype_control:
+            output('if(!$.isEmptyObject(overlayMaps))')
+            output('{L.control.layers(null,overlayMaps,'
+                   '{position:"topright"}).addTo(map);}')
+        if self.pervpn_control:
+            output('if(!$.isEmptyObject(overlayPerVPN))')
+            output('{L.control.layers(null,overlayPerVPN,'
+                   '{position:"bottomleft"}).addTo(map);}')
+
+        # spiderfy - add pop ups for close by icons
+        output('var popup = new L.Popup({closeButton:false,'
+               'offset:new L.Point(0.5,-24)});')
+        output('oms.addListener("click", function(marker) {')
+        output('   popup.setContent(marker.alt);')
+        output('   popup.setLatLng(marker.getLatLng());')
+        output('   map.openPopup(popup);')
+        output('});')
+        # spiderfy - close pop-ups when clicking elsewhere
+        output('oms.addListener("spiderfy", function(markers) {')
+        output('   map.closePopup();')
+        output('});')
+
         output('</script>')
+
+        output('<ul style="list-style:none;padding-top:5px;'
+               'padding-left:0px;">')
+        if self.marker:
+            output('<li style="float:left;margin-right:10px;">')
+            output('<span>')
+            output('<img src="images/marker-icon-green.png" '
+                   'style="width:20px;"/>')
+            output('</span>')
+            output('<span>Monitor</span>')
+            output('</li>')
+        if display_server_legend:
+            output('<li style="float:left;margin-right:10px;">')
+            output('<span>')
+            output('<img src="images/marker-icon-orange.png" '
+                   'style="width:20px;"/>')
+            output('</span>')
+            output('<span>Server</span>')
+            output('</li>')
+        output('<li style="float:left;margin-right:10px;">')
+        output('<span>')
+        output('<img src="images/marker-icon-blue.png" '
+               'style="width:20px;"/>')
+        output('</span>')
+        output('<span>Client</span>')
+        output('</li>')
+        if display_connection_legend:
+            output('<li style="float:left;margin-right:10px;">')
+            output('<span>')
+            output('<img src="images/route-icon.png" style="width:20px;"/>')
+            output('</span>')
+            output('<span>Route</span>')
+            output('</li>')
+        output('</ul>')
+
         output('</div></div>')
 
     def print_html_footer(self):
diff --git a/setup.py b/setup.py
index bbdc777..1532388 100755
--- a/setup.py
+++ b/setup.py
@@ -11,10 +11,14 @@
 with open('README.md', 'r') as r:
     long_description = r.read()
 
-for dirpath, dirnames, filenames in os.walk('images/flags'):
-    data_files = [('share/openvpn-monitor/images/flags',
+for dirpath, dirnames, filenames in os.walk('images', topdown=False):
+    data_files = [('share/openvpn-monitor/images',
                   [os.path.join(dirpath, f) for f in filenames])]
 
+for dirpath, dirnames, filenames in os.walk('images/flags'):
+    data_files.append([('share/openvpn-monitor/images/flags',
+                      [os.path.join(dirpath, f) for f in filenames])])
+
 with open('requirements.txt') as rt:
     install_requires = []
     for line in rt.read().splitlines():