var local_observer = {};

function build_mount_gui() {
  add_mount_labels();
  add_mount_controls();
  add_mount_slew_controls();
  document.getElementById("sky_view").addEventListener("dblclick", e => mount_random_goto(e));
}
function add_mount_labels() {
  container = document.getElementById("mount_labels");
  var new_div = document.createElement("div");
  new_div.id = "mount_ra";
  new_div.className = "mount_label";
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_dec";
  new_div.className = "mount_label";
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_alt";
  new_div.className = "mount_label";
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_az";
  new_div.className = "mount_label";
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_pier_side";
  new_div.className = "mount_label";
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_messages";
  new_div.className = "mount_control";
  container.appendChild(new_div);
}
function add_mount_controls() {
  container = document.getElementById("mount_controls");
  new_div = document.createElement("div");
  new_div.id = "mount_park";
  new_div.className = "button";
  new_div.innerHTML = "PARK";
  new_div.addEventListener("click", e => mount_park());
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_unpark";
  new_div.innerHTML = "UNPARK";
  new_div.className = "button";
  new_div.addEventListener("click", e => mount_unpark());
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_connect";
  new_div.innerHTML = "CONNECT";
  new_div.className = "button";
  new_div.addEventListener("click", e => mount_connect());
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_disconnect";
  new_div.className = "button";
  new_div.innerHTML = "DISCONNECT";
  new_div.addEventListener("click", e => mount_disconnect());
  container.appendChild(new_div);
}
function add_mount_slew_controls() {
  container = document.getElementById("mount_controls");
  new_div = document.createElement("div");
  new_div.id = "slew_rate_container";
  new_div.class = "count";
  new_div.innerHTML = '<input id="slew_rate" class="count" type="number" value="2" step="1" min="1" max="9"/>'
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_slew_north";
  new_div.className = "button";
  new_div.innerHTML = "SLEW NORTH";
  new_div.addEventListener("mousedown", e => mount_slew("NORTH", "true"));
  new_div.addEventListener("mouseup", e => mount_slew("NORTH", "false"));
  new_div.addEventListener("mouseout", e => mount_slew("NORTH", "false"));
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_slew_south";
  new_div.className = "button";
  new_div.innerHTML = "SLEW SOUTH";
  new_div.addEventListener("mousedown", e => mount_slew("SOUTH", "true"));
  new_div.addEventListener("mouseup", e => mount_slew("SOUTH", "false"));
  new_div.addEventListener("mouseout", e => mount_slew("SOUTH", "false"));
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_slew_west";
  new_div.className = "button";
  new_div.innerHTML = "SLEW WEST";
  new_div.addEventListener("mousedown", e => mount_slew("WEST", "true"));
  new_div.addEventListener("mouseup", e => mount_slew("WEST", "false"));
  new_div.addEventListener("mouseout", e => mount_slew("WEST", "false"));
  container.appendChild(new_div);
  new_div = document.createElement("div");
  new_div.id = "mount_slew_east";
  new_div.className = "button";
  new_div.innerHTML = "SLEW EAST";
  new_div.addEventListener("mousedown", e => mount_slew("EAST", "true"));
  new_div.addEventListener("mouseup", e => mount_slew("EAST", "false"));
  new_div.addEventListener("mouseout", e => mount_slew("EAST", "false"));
  container.appendChild(new_div);
}
function update_observatory_sky_view() {
  const sky_view = document.getElementById("sky_view");
  const width = sky_view.offsetWidth;
  const height = sky_view.offsetHeight;
  if (width > 0 && height > 0) {
    const now = new Date;
    const observer = new Astronomy.Observer(local_observer.latitude, local_observer.longitude, local_observer.altitude);
    sun_rise = Astronomy.SearchRiseSet("Sun", observer, 1, now, 1);
    var equ_ofdate = Astronomy.Equator("Sun", sun_rise, observer, true, true);
    const rise_hor = Astronomy.Horizon(sun_rise, observer, equ_ofdate.ra, equ_ofdate.dec, "normal");
    sun_set = Astronomy.SearchRiseSet("Sun", observer, -1, now, 1);
    var equ_ofdate = Astronomy.Equator("Sun", sun_set, observer, true, true);
    const set_hor = Astronomy.Horizon(sun_set, observer, equ_ofdate.ra, equ_ofdate.dec, "normal");
    rise_line_x = Math.round(rise_hor.azimuth) / 360 * width;
    set_line_x = Math.round(set_hor.azimuth) / 360 * width;
    const rise_line = document.getElementById("rise_line");
    rise_line.style.position = "absolute";
    rise_line.style.top = height / 2 - 10;
    rise_line.style.left = rise_line_x;
    rise_line.style.display = "block";
    rise_line.dataset.az = rise_hor.azimuth;
    rise_line.dataset.type = "rise_line";
    const set_line = document.getElementById("set_line");
    set_line.style.position = "absolute";
    set_line.style.top = height / 2 - 10;
    set_line.style.left = set_line_x;
    set_line.style.display = "block";
    set_line.dataset.az = set_hor.azimuth;
    set_line.dataset.type = "set_line";
    rise_line.dataset.day_time = (set_line.dataset.az - rise_line.dataset.az) / 360;
    set_line.dataset.day_time = (set_line.dataset.az - rise_line.dataset.az) / 360;
    top_alt_raw = Astronomy.SearchHourAngle("Sun", observer, 0, now).hor.altitude;
    top_alt = Math.round(top_alt_raw);
    top_az = Math.round(Astronomy.SearchHourAngle("Sun", observer, 0, now).hor.azimuth);
    const top_line = document.getElementById("top_line");
    top_line.style.position = "absolute";
    top_line.style.top = height - (90 + top_alt) / 180 * height;
    top_line.style.left = width / 2 - 10;
    top_line.style.display = "block";
    top_line.dataset.alt = top_alt_raw;
    top_line.dataset.type = "top_line";
    mount.body_name = "Mount";
    if (mount.online == true) {
      draw_mount(sky_view, "#0F0");
    }
    draw_body(sky_view, get_body("Sun", local_observer), 255, 255, 0);
    draw_body(sky_view, get_body("Mercury", local_observer), 255, 255, 255);
    draw_body(sky_view, get_body("Venus", local_observer), 255, 255, 255);
    draw_body(sky_view, get_body("Moon", local_observer), 255, 255, 255);
    draw_body(sky_view, get_body("Mars", local_observer), 255, 175, 175);
    draw_body(sky_view, get_body("Saturn", local_observer), 255, 255, 255);
    draw_body(sky_view, get_body("Jupiter", local_observer), 255, 255, 255);
    draw_body(sky_view, get_body("Uranus",local_observer), 175, 175, 255);
    draw_body(sky_view, get_body("Neptune", local_observer), 255, 255, 255);
    draw_body(sky_view, get_body("Pluto", local_observer), 255, 255, 255);
    draw_clock(sky_view, 0, 200, 0);
    equatorial_origin(local_observer);
    if (stars != "undefined") {
      for(star in stars) {
        draw_star(sky_view, stars[star], false);
      }
    }
    if (nebulae != "undefined") {
      for(nebula in nebulae) {
        draw_nebula(sky_view, nebulae[nebula], false);
      }
    }
  }
}
function get_observer() {
  const xhttp = new XMLHttpRequest();
  xhttp.onload = function() {
    local_observer = JSON.parse(this.responseText)
  }
  xhttp.open("GET", "/mount_observer", true);
  xhttp.send();
}
function photo() {
  const xhttp = new XMLHttpRequest();
  xhttp.onload = function() {
  }
  xhttp.open("POST", "/photo", true);
  xhttp.setRequestHeader("Content-Type", "application/json");
  if (mount.ra != null && mount.dec != null) {
    xhttp.send(`{"ra": ${mount.ra}, "dec": ${mount.dec}}`);
  } else {
    xhttp.send(`{"ra": "", "dec": ""}`);
  }
}
function get_system_state() {
  mount_get_messages();
  mount_get_current_ra_dec();
  mount_get_pier_side();
  update_observatory_sky_view();
}
window.setInterval(get_system_state, 200);
window.setTimeout(get_observer, 10);
window.setTimeout(build_mount_gui, 10);
window.setTimeout(get_stars, 10);
window.setTimeout(get_nebulae, 10);