const WIDGET_TEXT = "Noteefy Tee Time Assistant";
const IFRAME_SOURCE = "https://carolinamountaingolf.noteefy.app/?referrer=WIDGET";
const WIDGET_THEME_SOURCE =
  "https://noteefypublic.blob.core.windows.net/widget/NCSmokyMountainCountryClub/NCSmokyMountainCountryClubWidget.css";

const noteefyWidget = document.getElementById("noteefy-widget");
noteefyWidget.className = "widget-closed";

// Populate div with the right elements
const noteefyWidgetHeader = document.createElement("div");
noteefyWidgetHeader.id = "noteefy-widget-header";
noteefyWidget.appendChild(noteefyWidgetHeader);

const styleSheet = document.createElement("link");
styleSheet.href = WIDGET_THEME_SOURCE;
styleSheet.rel = "stylesheet";
noteefyWidget.appendChild(styleSheet);

const widgetIcon = document.createElement("div");
widgetIcon.id = "noteefy-icon";
noteefyWidgetHeader.appendChild(widgetIcon);

const widgetText = document.createElement("span");
widgetText.innerText = WIDGET_TEXT;

const widgetArrow = document.createElement("div");
widgetArrow.id = "noteefy-arrow";
widgetArrow.className = "widget-closed";

const widgetBody = document.createElement("div");
widgetBody.id = "noteefy-widget-body";
const widgetIFrame = document.createElement("iframe");
widgetIFrame.id = "noteefy-widget-iframe";
widgetIFrame.src = IFRAME_SOURCE;
widgetIFrame.scrolling = "auto";
widgetIFrame.width = "100%";
widgetIFrame.height = "100%";
widgetBody.appendChild(widgetIFrame);
noteefyWidget.appendChild(widgetBody);

// Add click listeners
noteefyWidgetHeader.addEventListener("click", toggleOpen, false);

function toggleOpen() {
  const widgetClassName = document.getElementById("noteefy-widget").className;

  if (isSafari() || isCurrentPageUrlHttp()) {
    // Open a new tab to the search page, safari has limitations on iFrames
    window.open(IFRAME_SOURCE, "_blank");
  } else {
    if (widgetClassName == "widget-closed") {
      document.getElementById("noteefy-widget").className = "widget-open";
      widgetArrow.className = "widget-open";
    } else {
      document.getElementById("noteefy-widget").className = "widget-closed";
      widgetArrow.className = "widget-closed";
    }
    appendOrRemoveElements();
  }
}

function appendOrRemoveElements() {
  if (noteefyWidget.className == "widget-open" || window.innerWidth > 700) {
    if (!noteefyWidgetHeader.contains(widgetText)) {
      noteefyWidgetHeader.appendChild(widgetText);
    }
    if (!noteefyWidgetHeader.contains(widgetArrow)) {
      noteefyWidgetHeader.appendChild(widgetArrow);
    }
  } else {
    if (noteefyWidgetHeader.contains(widgetText)) {
      noteefyWidgetHeader.removeChild(widgetText);
    }
    if (noteefyWidgetHeader.contains(widgetArrow)) {
      noteefyWidgetHeader.removeChild(widgetArrow);
    }
  }
}

// Initial check
appendOrRemoveElements();

// Handle window resize
window.addEventListener("resize", function () {
  appendOrRemoveElements();
});

function isSafari() {
  var userAgent = navigator.userAgent.toLowerCase();
  return (
    userAgent.indexOf("safari") !== -1 && userAgent.indexOf("chrome") === -1
  );
}

function isCurrentPageUrlHttp() {
  const url = window.location.href;
  return url.startsWith("http://");
}
