String.empty = "";

var __isFireFox = navigator.userAgent.match(/gecko/i);

var UIConstants = {
  speed: 400,
  speedFast: 200
};

var UIElements = {
  tabbedUi: new Array("#weatherFlowAndTide", "#tripsAndJournal", "#places-asset-grid"),
  weatherContainer: "#weatherContainer",
  flowContainer: "#flowContainer",
  tideContainer: "#tidesContainer",
  tripsContainer: "#tripsOuterContainer",
  waypointsContainer: "#waypointsContainer",
  journalContainer: "#journalContainer"
};


var UIState = {};

UIState.MousePosition = {};
UIState.MousePosition.x = 0;
UIState.MousePosition.y = 0;

UIState.ContextPosition = {};
UIState.ContextPosition.x = 0;
UIState.ContextPosition.y = 0;

UIState.selectedTab = String.empty;
UIState.weatherDisplay = String.empty;
UIState.flowDisplay = String.empty;
UIState.tideDisplay = String.empty;
UIState.tripDisplay = String.empty;
UIState.waypointDisplay = String.empty;
UIState.journalDisplay = String.empty;

UIState.mapLatitude = String.empty;
UIState.mapLongitude = String.empty;
UIState.mapZoomLevel = String.empty;

UIState.Cookies = {};
UIState.Cookies.selectedTab = "selectedTab";
UIState.Cookies.weatherDisplay = "weatherDisplay";
UIState.Cookies.flowDisplay = "flowDisplay";
UIState.Cookies.tideDisplay = "tideDisplay";
UIState.Cookies.tripDisplay = "tripDisplay";
UIState.Cookies.waypointDisplay = "waypointDisplay";
UIState.Cookies.journalDisplay = "journalDisplay";

UIState.Cookies.mapLatitude = "mapLatitude";
UIState.Cookies.mapLongitude = "mapLongitude";
UIState.Cookies.mapZoomLevel = "mapZoomLevel";

UIState.setCookie = function (cookieName, cookieValue) {
  var nextYear = new Date();
  nextYear.setFullYear(nextYear.getFullYear() + 1);
  document.cookie = cookieName + "=" + cookieValue + ";expires=" + nextYear.toGMTString() + ";path=/;";
};

UIState.getCookie = function (cookieName, defaultValue) {
  if (document.cookie.length < 1) return defaultValue;

  var start = document.cookie.indexOf(cookieName + "=");
  if (start == -1) return defaultValue;

  start += cookieName.length + 1;
  var end = document.cookie.indexOf(";", start);
  if (end == -1) end = document.cookie.length;
  return unescape(document.cookie.substring(start, end));
};

UIState.setCookies = function () {
  var nextYear = new Date();
  nextYear.setFullYear(nextYear.getFullYear() + 1);

  this.setCookie(this.Cookies.selectedTab, this.selectedTab);
  this.setCookie(this.Cookies.weatherDisplay, this.weatherDisplay);
  this.setCookie(this.Cookies.flowDisplay, this.flowDisplay);
  this.setCookie(this.Cookies.tideDisplay, this.tideDisplay);
  this.setCookie(this.Cookies.tripDisplay, this.tripDisplay);
  this.setCookie(this.Cookies.waypointDisplay, this.waypointDisplay);
  this.setCookie(this.Cookies.journalDisplay, this.journalDisplay);
  this.setCookie(this.Cookies.mapLatitude, this.mapLatitude);
  this.setCookie(this.Cookies.mapLongitude, this.mapLongitude);
  this.setCookie(this.Cookies.mapZoomLevel, this.mapZoomLevel);
};

UIState.getCookies = function () {
  this.selectedTab = this.getCookie(this.Cookies.selectedTab, UIElements.tabbedUi[settings.defaultTab]);
  this.weatherDisplay = this.getCookie(this.Cookies.weatherDisplay, String.empty);
  this.flowDisplay = this.getCookie(this.Cookies.flowDisplay, String.empty);
  this.tideDisplay = this.getCookie(this.Cookies.tideDisplay, String.empty);
  this.tripDisplay = this.getCookie(this.Cookies.tripDisplay, String.empty);
  this.waypointDisplay = this.getCookie(this.Cookies.waypointDisplay, String.empty);
  this.journalDisplay = this.getCookie(this.Cookies.journalDisplay, String.empty);
  this.mapLatitude = parseFloat(this.getCookie(this.Cookies.mapLatitude, settings.defaultLatitude));
  this.mapLongitude = parseFloat(this.getCookie(this.Cookies.mapLongitude, settings.defaultLongitude));
  this.mapZoomLevel = parseInt(this.getCookie(this.Cookies.mapZoomLevel, settings.defaultZoom));

  return this.weatherDisplay != String.empty;
};

UIState.update = function () {
  for (var iCount = 0; iCount < UIElements.tabbedUi.length; iCount++) {
    if ($(UIElements.tabbedUi[iCount]).css("display") == "none") continue;
    this.selectedTab = UIElements.tabbedUi[iCount];
    break;
  }
  this.weatherDisplay = $(UIElements.weatherContainer).css("display");
  this.flowDisplay = $(UIElements.flowContainer).css("display");
  this.tideDisplay = $(UIElements.tideContainer).css("display");
  this.tripDisplay = $(UIElements.tripsContainer).css("display");
  this.waypointDisplay = $(UIElements.waypointsContainer).css("display");
  this.journalDisplay = $(UIElements.journalContainer).css("display");

  this.mapLatitude = MapState.currentLatLng.lat();
  this.mapLongitude = MapState.currentLatLng.lng();
  this.mapZoomLevel = MapState.map.getZoom();

  this.setCookies();
};

UIState.setDisplay = function () {
  this.setUIDimensions();
  $(UIElements.weatherContainer).css("display", this.weatherDisplay);
  $(UIElements.flowContainer).css("display", this.flowDisplay);
  $(UIElements.tideContainer).css("display", this.tideDisplay);
  $(UIElements.tripsContainer).css("display", this.tripDisplay);
  $(UIElements.waypointsContainer).css("display", this.waypointDisplay);
  $(UIElements.journalContainer).css("display", this.journalDisplay);
  UIDisplay.showTab(this.selectedTab, true);
};

UIState.setUIDimensions = function () {
  // modifier handles potential scrollbar - tweak for non-mobile browsers
  var modifier = 0;
  if (!CurrentBrowser.mobile)
    modifier = 14;

  var computedMapHeight = $(window).height() - settings.headerHeight - settings.footerHeight;

  var variableWidgetHeights = $("#logonHeader").height() + $("#logonAjaxContainer:visible").height() + $(".tabs").height() + $(".tabbed-ui-header").height();

  var computedWidgetHeight = computedMapHeight - variableWidgetHeights + modifier;

  var minMapHeight = CurrentBrowser.mobile ? 770 : 540;
  if (computedMapHeight < minMapHeight) {
    computedMapHeight = minMapHeight;
    computedWidgetHeight = minMapHeight - variableWidgetHeights + modifier;
  }

  $("#map").css("height", computedMapHeight);
  $(".widgetGridContainer").css("height", computedWidgetHeight);
  $(".footerContainer").css("bottom", "");
  $(".footerContainer").css("top", $("#map").height() + settings.headerHeight);
  $(".widgetGridContainer").show(UIConstants.speed);

  UIDisplay.setMapWidth();
  WidgetToggle.setPositions();
};

UIState.setMousePosition = function (event) {
  UIState.MousePosition.x = event.pageX;
  UIState.MousePosition.y = event.pageY;
};

UIState.bindEvents = function () {
  $(window).resize(function () {
    google.maps.event.trigger(MapState.map, 'resize');
    UIState.setUIDimensions();
  });
  $("#map").mousemove(UIState.setMousePosition);
};

UIState.init = function () {
  this.getCookies();
  this.setDisplay();
  this.bindEvents();
};

var UIDisplay = {};

UIDisplay.setMapWidth = function () {
  $("#map").css("width", $(window).width() - $(".widgetContainer").width());
};

UIDisplay.setWidgetContainerScroll = function (potentialWidgetId) {
  var widget = $("div.widgetContainer #" + potentialWidgetId + ":visible");
  if (widget.length > 0) {
    $("div.widgetContainer").stop().animate({ scrollTop: widget.position().top + widget.offsetParent().position().top }, 1200);
  }
};

UIDisplay.toggleDiv = function (sId) {
  var target = $("#" + sId);
  target.toggle();
  UIState.update();
  UIDisplay.setWidgetContainerScroll(sId);
};

UIDisplay.showTab = function (sId, bIsOnUiInit) {
  if (UIState.selectedTab == sId && !bIsOnUiInit) return;

  var tabs = $(".tab");
  for (var i = 0; i < tabs.length; i++) {
    $(tabs[i]).removeClass("active");
  }

  var activeTab = $(".tab[data-target-ui='" + sId + "']");
  activeTab.addClass("active");

  this.hideTabs();
  $(sId).show(UIConstants.speed, function () {
    if (!bIsOnUiInit)
      UIState.update();
  });
};

UIDisplay.hideTabs = function () {
  for (var iCount = 0; iCount < UIElements.tabbedUi.length; iCount++) {
    $(UIElements.tabbedUi[iCount]).hide();
  }
};

//returns the absolute position of some element within document
UIDisplay.getElementAbsolutePos = function (element) {
  var res = new Object();
  res.x = 0; res.y = 0;
  if (element !== null) {
    res.x = element.offsetLeft;
    res.y = element.offsetTop;

    var offsetParent = element.offsetParent;
    var parentNode = element.parentNode;

    while (offsetParent !== null) {
      if (!(__isFireFox) || offsetParent.tagName != "TR") {
        res.x += offsetParent.offsetLeft;
        res.y += offsetParent.offsetTop;
      }
      else if (__isFireFox && offsetParent.tagName == "TR") {
        res.y += 20;
      }

      if (offsetParent != document.body && offsetParent != document.documentElement) {
        res.x -= offsetParent.scrollLeft;
        res.y -= offsetParent.scrollTop;
      }
      //next lines are necessary to support FireFox problem with offsetParent  
      if (__isFireFox) {
        while (offsetParent != parentNode && parentNode !== null) {
          res.x -= parentNode.scrollLeft;
          res.y -= parentNode.scrollTop;
          parentNode = parentNode.parentNode;
        }
      }
      parentNode = offsetParent.parentNode;
      offsetParent = offsetParent.offsetParent;
    }
  }
  return res;
};