var time = [],
    outt = [],
    humr = [],
    prec = [],
    rate = [],
    wind = [],
    hiwi = [],
    dire = [],
    baro = [],
    dewp = [],
    wchi = [],
    heat = [],
    rads = [],
    eetp = [],
    uuvv = [];


var lastScrollTop = 0;
var lastScrollLeft = 5;

var d = new Date();
var mese = d.getMonth() + 1;
if (mese < 10)
  mese = "0" + mese;
var day = d.getDate();
if (day < 10)
  day = "0" + day;
var lasty;

function dayTable() {

  for ( i = 0; i <= 50; i++) {
    time[i] = "";
    outt[i] = "";
    humr[i] = "";
    prec[i] = "";
    rate[i] = "";
    wind[i] = "";
    hiwi[i] = "";
    dire[i] = "";
    baro[i] = "";
    dewp[i] = "";
    wchi[i] = "";
    heat[i] = "";
    rads[i] = "";
    eetp[i] = "";
    uuvv[i] = "";
  }


  $.getJSON('data/edc14f02.php?station=' + jstation + '&data=' + day + mese + d.getFullYear() + '&callback=?', function(data) {
    for ( i = 0; i < data.length - 1; i++) {
      time[i] = data[i][0];
      outt[i] = data[i][1];
      humr[i] = data[i][6];
      prec[i] = data[i][11];
      rate[i] = data[i][12];
      wind[i] = data[i][8];
      hiwi[i] = data[i][9];
      dire[i] = data[i][10];
      baro[i] = data[i][5];
      dewp[i] = data[i][2];
      wchi[i] = data[i][3];
      heat[i] = data[i][4];
      rads[i] = data[i][7];
      eetp[i] = data[i][13];
      uuvv[i] = data[i][14];
    }
    lasty = data[data.length-1][0];
    if ($(window).width() > 600) {
      table(50);
    } else {
      table(10);
    }
  });
}

function table(row) {

  var codes = "";

  codes += '<div class="row no-margin">';
  codes += '<div class="input-field col s3 m3 l3">';
  codes += '<select id="giorno">';
  codes += '<option value="01">01</option>';
  codes += '<option value="02">02</option>';
  codes += '<option value="03">03</option>';
  codes += '<option value="04">04</option>';
  codes += '<option value="05">05</option>';
  codes += '<option value="06">06</option>';
  codes += '<option value="07">07</option>';
  codes += '<option value="08">08</option>';
  codes += '<option value="09">09</option>';
  codes += '<option value="10">10</option>';
  codes += '<option value="11">11</option>';
  codes += '<option value="12">12</option>';
  codes += '<option value="13">13</option>';
  codes += '<option value="14">14</option>';
  codes += '<option value="15">15</option>';
  codes += '<option value="16">16</option>';
  codes += '<option value="17">17</option>';
  codes += '<option value="18">18</option>';
  codes += '<option value="19">19</option>';
  codes += '<option value="20">20</option>';
  codes += '<option value="21">21</option>';
  codes += '<option value="22">22</option>';
  codes += '<option value="23">23</option>';
  codes += '<option value="24">24</option>';
  codes += '<option value="25">25</option>';
  codes += '<option value="26">26</option>';
  codes += '<option value="27">27</option>';
  codes += '<option value="28">28</option>';
  codes += '<option value="29">29</option>';
  codes += '<option value="30">30</option>';
  codes += '<option value="31">31</option>';
  codes += '</select>';
  codes += '<label>Giorno</label>';
  codes += '</div>';
  codes += '<div class="input-field col s3 m3 l3">';
  codes += '<select id="mese">';
  codes += '<option value="01">Gennaio</option>';
  codes += '<option value="02">Febbraio</option>';
  codes += '<option value="03">Marzo</option>';
  codes += '<option value="04">Aprile</option>';
  codes += '<option value="05">Maggio</option>';
  codes += '<option value="06">Giugno</option>';
  codes += '<option value="07">Luglio</option>';
  codes += '<option value="08">Agosto</option>';
  codes += '<option value="09">Settembre</option>';
  codes += '<option value="10">Ottobre</option>';
  codes += '<option value="11">Novembre</option>';
  codes += '<option value="12">Dicembre</option>';
  codes += '</select>';
  codes += '<label>Mese</label>';
  codes += '</div>';
  codes += '<div class="input-field col s3 m3 l3">';
  codes += '<select id="anno">';

  for ( i = d.getFullYear(); i >= lasty; i--) {
    codes += '<option value="' + i + '">' + i + '</option>';
  }

  codes += '</select>';
  codes += '<label>Anno</label>';
  codes += '</div>';
  codes += '<div class="input-field col s3 m3 l3">';
  codes += '<button class="btn-floating btn-large waves-effect waves-light" type="submit" name="action" onclick=daytbody($("select#giorno").val(),$("select#mese").val(),$("select#anno").val())><i class="small material-icons">input</i></button>';
  codes += '</div>';
  codes += '</div>';

  if (row == 10) {
    codes += '<div class="row no-margin">';
    codes += '<div class="col s6 m6 l6 i6">';
    codes += '<button id="minus" class="btn-floating btn-small waves-effect waves-teal red" type="submit" name="action" onclick=tbodyrspv((lastScrollLeft-10),lastScrollLeft,0)><i class="small material-icons">skip_previous</i></button>';
    codes += '</div>';
    codes += '<div class="col s6 m6 l6 i6">';
    codes += '<button id="pluss" class="btn-floating btn-small waves-effect waves-teal red" type="submit" name="action" onclick=tbodyrspv(lastScrollLeft,(lastScrollLeft+10),1)><i class="small material-icons">skip_next</i></button>';
    codes += '</div>';
    codes += '</div>';
  }

  codes += '<div id="divtable" style="max-height:600px;overflow:auto;"><table class="centered responsive-table">';
  codes += '<thead>';
  codes += '<tr>';
  codes += '<th data-field="id1" class="style3"><strong>Orario</strong></th>';
  codes += '<th data-field="id2" class="style3"><strong>Temp °C</strong></th>';
  codes += '<th data-field="id3" class="style3"><strong>UR %</strong></th>';
  codes += '<th data-field="id4" class="style3"><strong>Prec mm</strong></th>';
  codes += '<th data-field="id5" class="style3"><strong>Rate mm/h</strong></th>';
  codes += '<th data-field="id6" class="style3"><strong>Vento km/h</strong></th>';
  codes += '<th data-field="id7" class="style3"><strong>Raffica km/h</strong></th>';
  codes += '<th data-field="id8" class="style3"><strong>DIR</strong></th>';
  codes += '<th data-field="id9" class="style3"><strong>Baro hPa</strong></th>';
  codes += '<th data-field="id10" class="style3"><strong>Dew °C</strong></th>';
  codes += '<th data-field="id11" class="style3"><strong>W.Chi °C</strong></th>';
  codes += '<th data-field="id12" class="style3"><strong>HeatI °C</strong></th>';
  codes += '<th data-field="id13" class="style3"><strong>Rad W/m²</strong></th>';
  codes += '<th data-field="id14" class="style3"><strong>ET mm</strong></th>';
  codes += '<th data-field="id15" class="style3"><strong>UV index</strong></th>';
  codes += '</tr>';
  codes += '</thead>';
  codes += '<tbody id="daytable">';
  for ( i = 0; i < row; i++) {
    codes += '<tr>';
    codes += '<td class="style4">' + time[i] + '</td>';
    codes += '<td class="style2">' + (Math.round(outt[i] * 100) / 100).toFixed(1) + '</td>';
    codes += '<td class="style4">' + (Math.round(humr[i] * 100) / 100).toFixed(0) + '</td>';
    codes += '<td class="style2">' + prec[i] + '</td>';
    codes += '<td class="style4">' + rate[i] + '</td>';
    codes += '<td class="style2">' + (Math.round(wind[i] * 100) / 100).toFixed(1) + '</td>';
    codes += '<td class="style4">' + (Math.round(hiwi[i] * 100) / 100).toFixed(1) + '</td>';
    codes += '<td class="style2">' + dire[i] + '</td>';
    codes += '<td class="style4">' + (Math.round(baro[i] * 100) / 100).toFixed(1) + '</td>';
    codes += '<td class="style2">' + dewp[i] + '</td>';
    codes += '<td class="style4">' + wchi[i] + '</td>';
    codes += '<td class="style2">' + heat[i] + '</td>';
    codes += '<td class="style4">' + rads[i] + '</td>';
    codes += '<td class="style2">' + eetp[i] + '</td>';
    codes += '<td class="style4">' + uuvv[i] + '</td>';
    codes += '</tr>';
  }
  codes += '</tbody>';
  codes += '</table></div>';
  codes += '<script>$(document).ready(function() {';
  codes += '$("select").material_select();});$("select#mese").val(mese);$("select#giorno").val(day);$("select#anno").val(d.getFullYear());';
  codes += '$("#divtable").scroll(function() {';
  codes += 'var st = $(this).scrollTop();';
  codes += 'if (st > lastScrollTop+1){';
  codes += 'var codess;';
  codes += 'if($("#daytable tr").length<time.length){';
  codes += 'for ( i = $("#daytable tr").length; i < ($("#daytable tr").length)+5; i++) {if(i==time.length){break;}';
  codes += 'codess += \'<tr>\';';
  codes += 'codess += \'<td class="style4">\' + time[i] + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + (Math.round(outt[i] * 100) / 100).toFixed(1) + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + (Math.round(humr[i] * 100) / 100).toFixed(0) + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + prec[i] + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + rate[i] + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + (Math.round(wind[i] * 100) / 100).toFixed(1) + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + (Math.round(hiwi[i] * 100) / 100).toFixed(1) + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + dire[i] + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + (Math.round(baro[i] * 100) / 100).toFixed(1) + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + dewp[i] + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + wchi[i] + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + heat[i] + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + rads[i] + \'</td>\';';
  codes += 'codess += \'<td class="style2">\' + eetp[i] + \'</td>\';';
  codes += 'codess += \'<td class="style4">\' + uuvv[i] + \'</td>\';';
  codes += 'codess += \'    </tr>\';';
  codes += '}}';
  codes += '$("#daytable").append(codess);';
  codes += 'lastScrollTop = st;';
  codes += '}';
  codes += '});';
  codes += '</script>';
  $( "#contpageg" ).hide("slow", function() {
    $('#contpage').html(codes).fadeIn("slow");
  });
}

function daytbody(dayt, meset, annot) {

  for ( i = 0; i <= 50; i++) {
    time[i] = "";
    outt[i] = "";
    humr[i] = "";
    prec[i] = "";
    rate[i] = "";
    wind[i] = "";
    hiwi[i] = "";
    dire[i] = "";
    baro[i] = "";
    dewp[i] = "";
    wchi[i] = "";
    heat[i] = "";
    rads[i] = "";
    eetp[i] = "";
    uuvv[i] = "";
  }

  $.getJSON('data/edc14f02.php?station=' + jstation + '&data=' + dayt + meset + annot + '&callback=?', function(data) {
    for ( i = 0; i < data.length - 1; i++) {
      time[i] = data[i][0];
      outt[i] = data[i][1];
      humr[i] = data[i][6];
      prec[i] = data[i][11];
      rate[i] = data[i][12];
      wind[i] = data[i][8];
      hiwi[i] = data[i][9];
      dire[i] = data[i][10];
      baro[i] = data[i][5];
      dewp[i] = data[i][2];
      wchi[i] = data[i][3];
      heat[i] = data[i][4];
      rads[i] = data[i][7];
      eetp[i] = data[i][13];
      uuvv[i] = data[i][14];
    }
    if ($(window).width() > 600) {
      tbody(50);
    } else {
      tbody(10);
    }
  });
}

function tbody(row) {
  lastScrollTop = 0;
  lastScrollLeft = 5;
  var codes = "";
  if (time.length > 0) {
    for ( i = 0; i < row; i++) {
      codes += '<tr>';
      codes += '<td class="style4">' + time[i] + '</td>';
      codes += '<td class="style2">' + (Math.round(outt[i] * 100) / 100).toFixed(1) + '</td>';
      codes += '<td class="style4">' + (Math.round(humr[i] * 100) / 100).toFixed(0) + '</td>';
      codes += '<td class="style2">' + prec[i] + '</td>';
      codes += '<td class="style4">' + rate[i] + '</td>';
      codes += '<td class="style2">' + (Math.round(wind[i] * 100) / 100).toFixed(1) + '</td>';
      codes += '<td class="style4">' + (Math.round(hiwi[i] * 100) / 100).toFixed(1) + '</td>';
      codes += '<td class="style2">' + dire[i] + '</td>';
      codes += '<td class="style4">' + (Math.round(baro[i] * 100) / 100).toFixed(1) + '</td>';
      codes += '<td class="style2">' + dewp[i] + '</td>';
      codes += '<td class="style4">' + wchi[i] + '</td>';
      codes += '<td class="style2">' + heat[i] + '</td>';
      codes += '<td class="style4">' + rads[i] + '</td>';
      codes += '<td class="style2">' + eetp[i] + '</td>';
      codes += '<td class="style4">' + uuvv[i] + '</td>';
      codes += '</tr>';
    }

  }
  $('#daytable').html(codes);
}

function tbodyrspv(e, z, l) {
  if (l == 1) {
    lastScrollLeft += 5;
  } else {
    lastScrollLeft -= 5;
  }

  var codes = "";
  if (time.length > 0) {
    for ( i = e; i < z; i++) {
      if (i >= 0 && i < time.length) {
        codes += '<tr>';
        codes += '<td class="style4">' + time[i] + '</td>';
        codes += '<td class="style2">' + (Math.round(outt[i] * 100) / 100).toFixed(1) + '</td>';
        codes += '<td class="style4">' + (Math.round(humr[i] * 100) / 100).toFixed(0) + '</td>';
        codes += '<td class="style2">' + prec[i] + '</td>';
        codes += '<td class="style4">' + rate[i] + '</td>';
        codes += '<td class="style2">' + (Math.round(wind[i] * 100) / 100).toFixed(1) + '</td>';
        codes += '<td class="style4">' + (Math.round(hiwi[i] * 100) / 100).toFixed(1) + '</td>';
        codes += '<td class="style2">' + dire[i] + '</td>';
        codes += '<td class="style4">' + (Math.round(baro[i] * 100) / 100).toFixed(1) + '</td>';
        codes += '<td class="style2">' + dewp[i] + '</td>';
        codes += '<td class="style4">' + wchi[i] + '</td>';
        codes += '<td class="style2">' + heat[i] + '</td>';
        codes += '<td class="style4">' + rads[i] + '</td>';
        codes += '<td class="style2">' + eetp[i] + '</td>';
        codes += '<td class="style4">' + uuvv[i] + '</td>';
        codes += '</tr>';
      }
    }
  }
  $('#daytable').html(codes);
}