import $ from "jquery";

class OverlayControl {
  constructor(arrayVisualization) {
    this.visualization = arrayVisualization;
  }

  init(overlaySelector, legendSelector) {
    let self = this;

    this.setOverlay("ANCHOR", overlaySelector, legendSelector);

    overlaySelector.find("#anchor_overlay").click(function () {
      self.setOverlay("ANCHOR", overlaySelector, legendSelector);
    });

    overlaySelector.find("#all_overlay").click(function () {
      self.setOverlay("ALL", overlaySelector, legendSelector);
    });
  }

  setOverlay(overlay, overlaySelector, legendSelector) {
    let selectedButton;
    let selectedLegend;
    if (overlay == "ANCHOR") {
      selectedButton = overlaySelector.find("#anchor_overlay");
      selectedLegend = legendSelector.find("img.anchors_mode");
    } else if (overlay == "ALL") {
      selectedButton = overlaySelector.find("#all_overlay");
      selectedLegend = legendSelector.find("img.all_mode");
    }

    this.visualization.setOverlay(overlay);

    overlaySelector.find('.overlay_toggle').removeClass("overlay_active");
    selectedButton.addClass("overlay_active");

    legendSelector.find('.legend').hide();
    selectedLegend.show();
  }
}

export default OverlayControl;