var hours = 24;
var granularity = '2m';
var end = 0;
var graphdata = "https://bastart.spoton.cz/data/solar_monitor?range=24h&granularity=2m&end=0h";
sol = new Dygraph(
// containing div
document.getElementById("solar"),
// CSV or path to a CSV file.
graphdata
,{
    //labels: ['time','V_solar','Isolar', P_solar, P_cons],
    axes : {
        x : {
            drawGrid: true,
            drawAxis : true
        },
        y : {
            drawGrid: false,
            drawAxis : true
        },
        y2 : {
            drawGrid: false,
            drawAxis: true,
            independentTicks: true
        }
    },
    rollPeriod: 5,
    visibility: [true, false, true, true],
    interactionModel: {},
    connectSeparatedPoints: true,
    series:{
        'V_solar': {
            axis: 'y',
            color: '#ffd020',
            fillGraph: true,
            fillAlpha: 0.4
        },
        'I_solar': {
            axis: 'y',
            color: '#ff1100'
        },
        'P_solar': {
            axis: 'y2',
            color: '#1111ff',
            fillGraph: true,
            fillAlpha: 0.4
        },
        'P_cons': {
            axis: 'y2',
            color: '#ff1111',
            fillGraph: true,
            fillAlpha: 0.4
        }

    },
        ylabel: '<span style="color:#ffd020;">[V]</span>/<span style="color:#ff1100;">[A]</span>',
        y2label: '<span style="color:#111177;">Solar / Consumption [W]</span>',
        labelsDiv: 'solar_labels',
        legend: 'always'
    }
);


function refreshGraph(){
  graphdata = "https://bastart.spoton.cz/data/solar_monitor?range=" + hours + "h&granularity=" + granularity + "&end=" + end + "h";
  sol.updateOptions({'file': graphdata});
  //power.updateOptions({'file': graphdata});
}

function setHours(hours_to_set){
  hours = hours_to_set;
  switch(hours){
      case '1':
        granularity = '30s';
        break;
      case '6':
        granularity = '1m';
        break;
      case '12':
        granularity = '1m';
        break;
      case '24':
        granularity = '2m';
        break;
      case '168':
        granularity = '20m';
        break;
      case '720':
        granularity = '1h';
        break;
      default:
        granularity = '10m';
  }
  end = 0;
  //document.getElementById('xxx').innerHTML = graphdata;
  refreshGraph();
}

function setBack(){
    // range=1h -> range=2h&end=1h
    disp_range = hours*1 - end*1;
    hours = hours*1 + disp_range;
    end = end*1 + disp_range;
    //document.getElementById('xxx').innerHTML = graphdata;
    refreshGraph();
}

function setForth(){
    disp_range = hours*1 - end*1;
    hours = hours*1 - disp_range;
    if(hours < disp_range){
        hours = disp_range;
    }
    end = end*1 - disp_range;
    if(end < 0){
        end = 0;
    }
    //document.getElementById('xxx').innerHTML = graphdata;
    refreshGraph();
}