/*
Forked from http://codepen.io/jmldias/pen/xIJCl (Pen by Jdias).. Eliminated the image and added some css animations..
##################
Hover to animate..
*/

$('body').append("<div class='logo1'><div id='sh1' class='shine'></div> <div class='compname'>Human Computer Interaction</div><br />    <div class='titulo'>      <div class='subhead'>IIITA</div>        <div></div>");
var randArray = function() {

    for(var i = 0, array = new Array(); i<10; i++) {
        array.push(Math.floor(Math.random()*10 + 1))
    }
    return array
}
var rects;
var initRandArray = randArray();
var newArray;
var w = 430;
var h = 40;
var barPadding = 1;
var mAx = d3.max(initRandArray)
var yScale = d3.scale.linear()
                .domain([0, mAx])
                .range([0, h])

var svg = d3.select(".logo1")
    .append("svg")
    .attr("width", w)
    .attr("height", h)
    .attr("margin-left", "0px")

svg.selectAll("rect")
    .data(initRandArray)
    .enter()
    .append("rect")
    .attr("x", function(d,i) {return i*(w/initRandArray.length)})
    .attr("y", function(d) {return h - yScale(d)})
    .attr("width", w / initRandArray.length - barPadding)
    .attr("height", function(d){return yScale(d)})
    .attr("fill", function(d) {
    return "rgb(100, 100, " + (d * 100) + ")";
});

setInterval(function() {
    
    newArray = randArray();
    
    rects = svg.selectAll("rect")
    
    rects.data(newArray)
        .enter()
        .append("rect")
    
    rects.transition()
        .ease("linear")
        .duration(1000)
        .attr("x", function(d,i) {return i*(w/newArray.length)})
        .attr("y", function(d) {return h - yScale(d)})
        .attr("width", w / newArray.length - barPadding)
        .attr("height", function(d){return yScale(d)})
        .attr("fill", function(d) {
            return "rgb(100, 100, " + (d * 40) + ")";
        });

}, 1500)
var flag = 0;
    
$('.logo1').mouseenter(function() {
  $('#sh1').toggleClass('shinelogo');
  $('.compname').fadeTo( 500 , 0.4, 'linear');
  $('.subhead').fadeTo( 500 , 0.0, 'linear');
  setTimeout(function(){$('.subhead').text("Indian Institute of Information Technology Allahabad");flag = 1;},500);
  $('.subhead').fadeTo( 500 , 1, 'linear');
  w=550;
  $('svg').attr("width",w);
  //$('.taglin').stop().css("visibility","visible");
  //$('.taglin').fadeTo( 1500 , 1, 'linear');

});
$('.logo1').mouseleave(function() {
  $('#sh1').toggleClass('shinelogo');
  if(flag == 1)
  $('.subhead').fadeTo( 500 , 0.0, 'linear');
  setTimeout(function(){$('.subhead').text("IIITA");flag = 0;},500);  
  $('svg').attr("width",w);
  w=550;
  
  $('.subhead').fadeTo( 500 , 1, 'linear');
  $('.compname').fadeTo( 500 , 1, 'linear');
  // $('.taglin').stop().fadeTo( 1500 , 0.0, 'linear');
});