(function() {
    "use strict";

    LS.imagePath = 'images/';
    LS.dataPath = 'data.json';

    var $buildingsSidebar = $('#buildingsSidebar');
    var $sitesSidebar = $('#sitesSidebar');

    var $navBuildingsLi = $('#navBuildingsLi');
    var $navSitesLi = $('#navSitesLi');

    function hideSitesSidebar() {
        $sitesSidebar.hide();
        $navSitesLi.removeClass("active");
    }

    function hideBuildingsSidebar() {
        $buildingsSidebar.hide();
        $navBuildingsLi.removeClass("active");
    }

    var buildingsSidebarLink = document.getElementById("buildingsSidebarLink")
    buildingsSidebarLink.onclick = function() {
        hideSitesSidebar();

        $navBuildingsLi.toggleClass("active");
        $buildingsSidebar.toggle();

        map.invalidateSize();

        return false;
    };

    var sitesSidebarLink = document.getElementById("sitesSidebarLink")
    sitesSidebarLink.onclick = function() {
        hideBuildingsSidebar();

        $navSitesLi.toggleClass("active");
        $sitesSidebar.toggle();

        map.invalidateSize();

        return false;
    };

    var buildingsSidebarHideButton = document.getElementById("buildingsSidebarHideButton");
    buildingsSidebarHideButton.onclick = function() {
        hideBuildingsSidebar();

        map.invalidateSize();
        return false;
    };

    var sitesSidebarHideButton = document.getElementById("sitesSidebarHideButton");
    sitesSidebarHideButton.onclick = function() {
        hideSitesSidebar();

        map.invalidateSize();

        return false;
    };

    var map = LS.map('map', {
        workstations: true,
        indoor: true,
        popupWidth: 550,
        popupHeight: 550,
        zoomControl: false,
        levelControlPosition: 'bottomleft'
    });

    map.showInfo = function(content, latlng, options) {
        var $content = $(content);

        var contentTitle = $content.children('h2');
        var titleText = contentTitle.text();
        contentTitle.remove();

        $("#feature-title").html(titleText);
        $("#feature-info").html(content);
        $("#featureModal").modal("show");
    };

    map.closeInfo = function() {
        $("#featureModal").modal("hide");
    };

    var zoomControl = L.control.zoom({
      position: "bottomright"
    }).addTo(map);

    /* GPS enabled geolocation control set to follow the user's location */
    var locateControl = L.control.locate({
      position: "bottomright",
      drawCircle: true,
      follow: true,
      setView: true,
      keepCurrentZoomLevel: true,
      markerStyle: {
        weight: 1,
        opacity: 0.8,
        fillOpacity: 0.8
      },
      circleStyle: {
        weight: 1,
        clickable: false
      },
      icon: "icon-direction",
      metric: false,
      strings: {
        title: "My location",
        popup: "You are within {distance} {unit} from this point",
        outsideMapBoundsMsg: "You seem located outside the boundaries of the map"
      },
      locateOptions: {
        maxZoom: 18,
        watch: true,
        enableHighAccuracy: true,
        maximumAge: 10000,
        timeout: 10000
      }
    }).addTo(map);

    /* Larger screens get expanded layer control and visible sidebar */
    if (document.body.clientWidth <= 767) {
      var isCollapsed = true;
    } else {
      var isCollapsed = false;
    }

    /* Highlight search box text on click */
    $("#searchbox").click(function () {
      $(this).select();
    });

    /* Typeahead search functionality */
    LS.getData(function(data) {

      function buildRow(first, second) {
        var tr = document.createElement("tr");
        tr.style = "cursor: pointer;"

        var reftd = document.createElement("td");
        reftd.className = "feature-ref";
        reftd.style.verticalAlign = "middle";
        reftd.appendChild(first);
        tr.appendChild(reftd);

        var featuretd = document.createElement("td");
        featuretd.className = "feature-name";
        featuretd.appendChild(second);
        tr.appendChild(featuretd);

        var arrowtd = document.createElement("td");
        arrowtd.style.verticalAlign = "middle";
        var i = document.createElement("i");
        i.className = "glyphicon glyphicon-chevron-right pull-right";
        arrowtd.appendChild(i);
        tr.appendChild(arrowtd);

        return tr;
      }

      function show(uri) {
          return function() {
              map.panByURI(uri);

              /* Hide sidebars and go to the map on small screens */
              if (document.body.clientWidth <= 767) {
                hideSitesSidebar();
                hideBuildingsSidebar();

                map.invalidateSize();
              }
          };
      }

      var buildingstbody = $("#buildingsList tbody");

      data.buildings.features.forEach(function(building) {
        if (!("loc_ref" in building.properties) ||
            building.properties.name.length === 0) {
            return;
        }

        var loc_ref = document.createTextNode(building.properties.loc_ref);
        var name = document.createTextNode(building.properties.name);
        var tr = buildRow(loc_ref, name);

        tr.onclick = show(building.properties.uri);

        buildingstbody.append(tr);
      });

      var buildingsList = new List("buildings", {
          valueNames: [
              "feature-ref",
              "feature-name"
          ]
      });
      buildingsList.sort("feature-name", {
          order:"asc"
      });

      buildingsList.on("filterStart", function() {
          console.log("filterComplete");

          console.log(buildingsList.matchingItems);
      });

      var sitestbody = $("#sitesList tbody");

      data.sites.features.forEach(function(site) {
        if (!("name" in site.properties)) {
            return;
        }

        var loc_ref = document.createTextNode(site.properties.loc_ref);
        var name = document.createTextNode(site.properties.name);
        var tr = buildRow(loc_ref, name);

        tr.onclick = show(site.properties.uri);

        sitestbody.append(tr);
      });

      var sitesList = new List("sites", {valueNames: ["feature-ref", "feature-name"]});
      sitesList.sort("feature-name", {order:"asc"});

      var buildingsBH = new Bloodhound({
        name: "Buildings",
        datumTokenizer: function (d) {
            return Bloodhound.tokenizers.whitespace(d.properties.loc_ref + " " + d.properties.name);
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        local: data.buildings.features,
        limit: 10
      });

      buildingsBH.initialize();

      var sitesBH = new Bloodhound({
        name: "Buildings",
        datumTokenizer: function (d) {
            return Bloodhound.tokenizers.whitespace(d.properties.loc_ref + " " +d.properties.name);
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        local: data.sites.features,
        limit: 10
      });

      sitesBH.initialize();

      /* instantiate the typeahead UI */
      $("#searchbox").typeahead({
        minLength: 1,
        highlight: true,
        hint: false
      }, {
        name: "Buildings",
        displayKey: "name",
        source: buildingsBH.ttAdapter(),
        templates: {
          header: "<h4 class='typeahead-header'>Buildings</h4>",
          suggestion: function(feature) {
              return feature.properties.name + "<br>&nbsp;<small>" + feature.properties.loc_ref + "</small>";
          }
        }
      }, {
        name: "Sites",
        displayKey: "name",
        source: sitesBH.ttAdapter(),
        templates: {
          header: "<h4 class='typeahead-header'>Sites</h4>",
          suggestion: function(feature) {
              return feature.properties.name + "<br>&nbsp;<small>" + feature.properties.loc_ref + "</small>";
          }
        }
      }).on("typeahead:selected", function (obj, feature) {
        map.panByURI(feature.properties.uri);

        if ($(".navbar-collapse").height() > 50) {
          $(".navbar-collapse").collapse("hide");
        }
      }).on("typeahead:opened", function () {
        $(".navbar-collapse.in").css("max-height", $(document).height() - $(".navbar-header").height());
        $(".navbar-collapse.in").css("height", $(document).height() - $(".navbar-header").height());
      }).on("typeahead:closed", function () {
        $(".navbar-collapse.in").css("max-height", "");
        $(".navbar-collapse.in").css("height", "");
      });
      $(".twitter-typeahead").css("position", "static");
      $(".twitter-typeahead").css("display", "block");
    });
})();