var date_begin = 1990
var date_end = 1990
var cit_min=1
var cit_max=1
var radius = 15
var radius_min = 5

var margin = { top: 30, right: 30, bottom: 30, left: 30 };
        width = 800 - margin.left - margin.right,
        height = 500 - margin.top - margin.bottom;
var svg = d3.select("svg")        
.attr("width", width + margin.left + margin.right )
.attr("height", height + margin.top + margin.bottom);
   // width = +svg.attr("width"),
  //  height = +svg.attr("height");


//var color = d3.scaleOrdinal(d3.schemeCategory20);
var searchRadius = 40;
  
  
 var div = d3.select("body").append("div")
    .attr("class", "tooltip")
    .style("visibility", "visible");


var simulation = d3.forceSimulation()
    .force("link", d3.forceLink().id(function(d) { return d.id; }))
    .force("charge", d3.forceManyBody().strength(-80))
    .force("center", d3.forceCenter(width / 2));
  
var tooltip = d3.select("body")
    .append("div")
      .attr("class", "tooltip")
      .style("position", "absolute")
      .style("z-index", "10")
      .style("visibility", "hidden");

d3.json("data.json", function(error, graph) {
  if (error) throw error;



clusternum=0

for (i = 0; i < graph.nodes.length; i++) {

    if (graph.nodes[i].PY < date_begin){date_begin = graph.nodes[i].PY}
    if (graph.nodes[i].PY > date_end){date_end = graph.nodes[i].PY}
    a = parseInt(graph.nodes[i].Z9);
    if (a < cit_min){cit_min = a}
    if (a > cit_max){cit_max = a}
    c = parseInt(graph.nodes[i].cluster);
    if (c > clusternum){clusternum = c}
    console.log(clusternum)

}
var rscale = d3.scaleLinear()
  .domain([cit_min,cit_max])
  .range([radius_min,radius])
 
let color = d3.scaleOrdinal()
      .domain([0,clusternum])
      .range(["#2c7bb6", "#00a6ca","#00ccbc","#90eb9d","#f9d057","#f29e2e","#e76818","#d7191c"]);//"#ffff8c"




var xAxisScale1 = d3.scaleTime()
    .domain([new Date(date_begin, 0, 1), new Date(date_end, 0, 1)])
    .rangeRound([margin.top,height-margin.bottom]);


var xAxis1 = d3.axisLeft(xAxisScale1);


svg.append("g").call(xAxis1)
.attr("transform", "translate(80,0)")
.style("opacity", .5)
.attr("stroke-dasharray", "2,2");

  




  var link = svg.append("g")
      .attr("class", "links")
    .selectAll("line")
    .data(graph.links)
    .enter().append("line")
      .attr("stroke-width", function(d) { return Math.sqrt(d.value); });
  
  
  


//http://eloquentjavascript.net/04_data.html








var word="word"




  var node = svg.append("g")
 //.attr("xlink:href", function(d){return d.DOI;})
    .attr("class", "nodes")
    .selectAll("circle")
    .data(graph.nodes)
    .enter().append("circle")
    .attr("r",  function(d){  return rscale(d.Z9); })//function(d) { return(d.Z9)+0; }
    .attr("fill", function(d) { return color(d.cluster); })
    .style("opacity",.9)
    .on("mouseover", function(d) {
       div.transition()
         .duration(200)

     .style("visibility", "visible")// '<a href="http://dx.doi.org/'+(d.DOI.replace("DOI ","") )+'" target="_blank">' + 
       div .html(
       "<h2 >" + (d.AU) + "</h2>" + "<p>" + (d.TI) + "</p>" + "<p>" +  (d.SO)+ ", "+  (d.VL)+ ", "+  (d.PG)+ ", "+ (d.PY))
         .style("left", (d3.event.pageX+30) + "px")
         .style("top", (d3.event.pageY - 28) + "px");
       })

  .on("mouseout", function(d) {
       div.transition()
         .duration(500)
     .style("visibility", "hidden")
       })
  
  
          .call(d3.drag()
          .on("start", dragstarted)
          .on("drag", dragged)
          .on("end", dragended)) 
          .on("click", click);


 //node.append("title")
  //    .text(function(d) { return d.id; });


//d3.select('Sluga H, 1998, INQUIRY').style('fill','red');
d3.select("circle:nth-child(5)").attr("fill","#f9d057").attr("stroke-width","20px"); // <== CSS selector (DOM)


  simulation
      .nodes(graph.nodes)
      .on("tick", ticked);

  simulation.force("link")
      .links(graph.links);

  function ticked() {
    node.each(function(d) {
    
    d.y = d.py = margin.top+(d.PY-date_begin)*((height-margin.bottom-margin.top)/(date_end-date_begin));


  });
    link
        .attr("x1", function(d) { return d.source.x; })
        .attr("y1", function(d) { return d.source.y; })
        .attr("x2", function(d) { return d.target.x; })
        .attr("y2", function(d) { return d.target.y; });

    node
    .attr("cx", function(d) { return d.x = Math.max(radius, Math.min((width - radius), d.x)); })
    .attr("cy", function(d) { return d.y = Math.max(radius, Math.min(height - radius, d.y)); });
/*
    node
        .attr("cx", function(d) { return d.x; })
        .attr("cy", function(d) { return d.y; });
a.removeAttribute("href"),
        */
  }
});

  function dragsubject() {
    return simulation.find(d3.event.x - width / 2, d3.event.y - height / 2 , searchRadius);
  }

/*
function mousemoved() {
    var a = this.parentNode, m = d3.mouse(this), d = simulation.find(m[0] - width / 2, m[1] - height / 2, 40);
    if (!d) return  a.removeAttribute("title"), tooltip.style('visibility','hidden');
    a.setAttribute("href", "google.com");//+ d.id
    a.setAttribute("title", d.id + (d.url ? " by " + d.url : "") + (d.description ? "\n" + d.description : ""));
    loadTooltipThumb(d);
  }

*/

function dragstarted(d) {
  if (!d3.event.active) simulation.alphaTarget(0.3).restart();
  d.fx = d.x;
  d.fy = d.y;
}

function dragged(d) {
  d.fx = d3.event.x;
  d.fy = d3.event.y;
}

function dragended(d) {
  if (!d3.event.active) simulation.alphaTarget(0);
  d.fx = null;
  d.fy = null;
}



function click(d) {
DI = d.DI
D2 = d.D2
if ( DI != "None"){window.open('http://dx.doi.org/'+(DI), '_blank');}

else { 
if ( d.D2 != "None"){window.location = 'http://dx.doi.org/'+(D2);}
else {window.location = 'https://scholar.google.com/scholar?hl=de&as_sdt=0%2C5&q='+(d.authorshort)+'+'+(d.PY)+'+'+(d.title)+'&btnG='}
}

}