map.html

<!DOCTYPE html>
<html>
<head>
  <title>Freifunk Community Map</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="default" />
  <link rel="apple-touch-icon" href="images/touch-icon-52.png" />
  <link rel="apple-touch-icon" href="images/touch-icon-114.png" sizes="114x114" />
  <link rel="apple-touch-icon" href="images/touch-icon-72.png" sizes="72x72" />

  <link rel="stylesheet" href="node_modules/leaflet/dist/leaflet.css" />
  <link rel="stylesheet" href="node_modules/leaflet.markercluster/dist/MarkerCluster.css" />
  <link rel="stylesheet" href="node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css" />
  <link rel="stylesheet" href="external/leaflet/leaflet-button-control.css" />
  <link rel="stylesheet" href="external/forkawesome/css/fork-awesome.min.css" />
  <link rel="stylesheet" type="text/css" href="//api.freifunk.net/timeline/malihu-scrollbar/jquery.mCustomScrollbar.min.css" />
	<link rel="stylesheet" type="text/css" href="//api.freifunk.net/timeline/timeline.css"/>
	<link rel="stylesheet" type="text/css" href="//api.freifunk.net/timeline/custom.css"/>
	<link rel="stylesheet" href="community_map.css" />
</head>
<body>

  <div id="map"></div>

  <script type="text/template" class="template" id="community-popup">
    <div class="community-popup" data-id="<%- props.shortname %>" >
    <% if ( props.name ) { %>
      <h2><a href="<%- props.url %>" target="_window"><%- props.name %></a></h2>
    <% } %>

    <% if (props.metacommunity) { %>
      <h3><%- props.metacommunity %></h3>
    <% } %>

    <% if (props.city) { %>
      <div class="city"><%- props.city  %></div>
    <% } %>

    <% if (props.nodes) { %>
      <div class="nodes">
         Zug&auml;nge: <%- props.nodes  %>
         <% if (props.state && props.age) { %>
            <span class="state <%- props.state  %>" title="Die letzte Aktualisierung der Daten war vor <%- props.age  %> Tagen">(<%- props.state  %>)</span>
         <% } %>
      </div>
    <% } %>

    <% if (props.phone) { %>
      <div class="phone">&#9742; <%- props.phone  %></div>
    <% } %>

    <ul class="contacts" style="height:<%- Math.round(props.contacts.length/6+0.4)*30+10 %>px; width: <%- 6*(30+5)%>px;">
    <% _.each(props.contacts, function(contact, index, list) { %>
      <li class="contact">
        <a href="<%- contact.url %>" target="_window">
          <span class="fa-stack fa-lg">
            <i class="fa fa-square fa-stack-2x"></i>
            <i class="fa fa-<%- contact.type %> fa-stack-1x fa-inverse" aria-hidden="true"></i>
          </span>
        </a>
      </li>
    <% }); %>
    </ul>
    <div class="events">
    </div>
    </div>
  </script>
  <script type="text/javascript" src="node_modules/leaflet/dist/leaflet.js"></script>
  <script type="text/javascript" src="external/leaflet/leaflet-button-control.js"></script>
  <script type="text/javascript" src="node_modules/leaflet.markercluster/dist/leaflet.markercluster.js"></script>
  <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
  <script type="text/javascript" src="node_modules/underscore/underscore-min.js"></script>
  <script type="text/javascript" src="community_map.js"></script>
	<script src="//api.freifunk.net/timeline/malihu-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
	<script src="//api.freifunk.net/timeline/timeline.js"></script>
	<script>
    $.getJSON('config.json', function(configs) {
      var widget = FFCommunityMapWidget({
          ffGeoJsonUrl: configs.geoJsonUrl,
          scrollByMousewheel : true,
          hideLocationButton: false,
          hideLayerControl: false,
          hideInfoBox: false,
	  feedUrl: configs.feedUrl,
	  embedTimelineUrl: configs.embedTimelineUrl,
	  postContentLimit: 3,
          postContentLength: 30,
	  showNews: configs.showNews,
	  showEvents: configs.showEvents,
          mapboxId: configs.mapboxId
      });
    });
  </script>
</body>
</html>