(function() {
    "use strict";

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

    var $sidebars = [
        $('#buildingsSidebar'),
        $('#sitesSidebar'),
        $('#busRoutesSidebar')
    ];

    var $sidebarLi = [
        $('#navBuildingsLi'),
        $('#navSitesLi'),
        $('#navBusRoutesLi')
    ];

    var sidebarHideButtons = [
        "buildingsSidebarHideButton",
        "sitesSidebarHideButton",
        "busRoutesSidebarHideButton"
    ];

    function hideSidebars() {
        $sidebars.forEach(function($sidebar) {
            $sidebar.hide();
        });
        $sidebarLi.forEach(function($sidebarLi) {
            $sidebarLi.removeClass('active');
        });
    }

    $sidebarLi.forEach(function($li, index) {
        var liLink = $li.children('a')[0];

        liLink.onclick = function() {
            // hide the other sidebars
            $sidebars.forEach(function($sidebar, hideIndex) {
                if (index === hideIndex) return; // don't hide this sidebar
                $sidebar.hide();
                $sidebarLi[hideIndex].removeClass('active');
            });

            $li.toggleClass("active");
            $sidebars[index].toggle();

            map.invalidateSize();

            return false;
        };
    });

    sidebarHideButtons.forEach(function(buttonId, index) {
        var button = document.getElementById(buttonId);
        button.onclick = function() {
            $sidebars[index].hide();
            $sidebarLi[index].removeClass('active');

            map.invalidateSize();
            return false;
        };
    });

    var map = LS.map('map', {
        workstations: true,
        indoor: true,
        popupWidth: 400,
        popupHeight: 550,
        busRoutes: true,
        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;
    }

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

      var controls = L.Control.Route.create(map.routeLayer);

      var busRouteSidebarContent = document.getElementById("busRoutesContent");

      busRouteSidebarContent.appendChild(controls);

      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) {
                hideSidebars();

                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();

      var $searchbox = $("#searchbox");

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

      // prevent the page reloading
      $searchbox.submit(function () {
        return false;
      });

      /* 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");
    });
})();