/* global d3 */

const width = 600,
  height = 80;

const x = d3.scaleBand().range([0, width]);
const y = d3.local();

const dimensions = [
  "programID",
  "Date",
  "composerName",
  "ID",
  "conductorName"
];

const svg = d3.select("main").selectAll("svg").data(dimensions)
  .enter().append("svg")
    .attr("class", String)
    .attr("width", width)
    .attr("height", height)
  .each(function () {
    y.set(this, d3.scaleLinear().range([height, 0]));
  });

svg.append("text")
    .attr("x", 4)
    .attr("y", 12)
    .text(String);

const network = d3.select("main").append("svg")
    .attr("class", "network")
    .attr("width", width)
    .attr("height", width);

network.append("g").attr("class", "links");
network.append("g").attr("class", "nodes");

const networkX = d3.scaleLinear().range([0, width]),
  networkY = d3.scaleLinear().range([width, 0]);

d3.queue()
  .defer(d3.json, "performances.json")
  .defer(d3.json, "links.json")
  .defer(d3.json, "nodes.json")
  .await(function (err, performances, links, nodes) {
    const seasons = d3.nest()
        .key(d => d.season)
        .entries(performances);

    x.domain(seasons.map(d => d.key).sort());

    svg.each(function (dimension) {
      const data = seasons.map(function (entry) {
        const valueSet = d3.set(entry.values, v => v[dimension]);
        return [entry.key, valueSet.size()];
      });

      const scale = y.get(this).domain([0, d3.max(data, d => d[1])]);

      d3.select(this).selectAll("rect").data(data)
        .enter().append("rect")
          .attr("x", d => x(d[0]))
          .attr("y", d => scale(d[1]))
          .attr("width", x.bandwidth())
          .attr("height", d => scale.range()[0] - scale(d[1]));
    });

    networkX.domain(d3.extent(nodes, n => n.ix));
    networkY.domain(d3.extent(nodes, n => n.iy));

    const nodeById = d3.map(nodes, d => d.composerName);

    links.forEach(function (l) {
      const s = nodeById.get(l.source),
        t = nodeById.get(l.target);

      if (!s.hasOwnProperty("related")) s.related = d3.set();
      if (!t.hasOwnProperty("related")) t.related = d3.set();

      s.related.add(t.composerName);
      t.related.add(s.composerName);
    });

    network.select(".links").selectAll("line").data(links)
      .enter().append("line")
        .attr("x1", d => networkX(nodeById.get(d.source).ix))
        .attr("y1", d => networkY(nodeById.get(d.source).iy))
        .attr("x2", d => networkX(nodeById.get(d.target).ix))
        .attr("y2", d => networkY(nodeById.get(d.target).iy))
        .style("opacity", 0.3);

    network.select(".nodes").selectAll("circle").data(nodes)
      .enter().append("circle")
        .attr("cx", d => networkX(d.ix))
        .attr("cy", d => networkY(d.iy))
        .attr("r", 2)
        .on("mouseover", function (d) {
          const id = d.composerName;

          network.selectAll("line")
              .style("opacity", l => (l.source === id || l.target === id) ? 1 : 0);

          network.selectAll("circle")
              .style("opacity", n => (n.composerName === id || n.related.has(id) ? 1 : 0.2));
        })
      .append("title")
        .text(d => d.composerName);
  });