//1222609
var myObj
var matchInit, tablehInit, statsInit;

var timeComp;

getFormation(); getTable();

//bMenu-n and bMenuPnt are being initialized ; and also come with full information
var bMenu = ["match-info"], bMenuPnt="match-info";
makeMenu();

//sec depending
var timeStr="", statusStr="";
var tmCl=document.getElementsByClassName("data__time")[0];
var vlCl=document.getElementsByClassName("vertical__live")[0];
var vrCl=document.getElementsByClassName("vertical__round")[0];

var statusList={"Kick Off":1,"Half Time":2,"Second Half":3,"Full Time":6};
var statusG=res1G=res2G=tsG=0;
var timerInterval,menuInterval;

var evWithCoord=["Throw In","Corner","Goal Kick","Penalty","Shot Off Target","Shot On Target","Free Kick","Dangerous Free Kick"];
var evWithBackGround={"In Possession":{"1":{"left":"2","deg":"0"},"2":{"left":"172","deg":"180"}},
                      "Dangerous Attack":{"1":{"left":"2","deg":"0"},"2":{"left":"100","deg":"180"}},
                      "Attack":{"1":{"left":"2","deg":"0"},"2":{"left":"139","deg":"180"}}
                    };

var thCl=document.getElementsByClassName("throw-in")[0];

var frameCl=document.getElementsByClassName("pitch__frame")[0];

var descCl=document.getElementsByClassName("pitch__frame-1")[0];
var lineCl=descCl.getElementsByClassName("frame__left-horizontal-line")[0];

evWithBackGround["Attack"]["cl1"]=document.getElementsByClassName("attack_1")[0];
evWithBackGround["Dangerous Attack"]["cl1"]=document.getElementsByClassName("dangerous-attack_1")[0];
evWithBackGround["In Possession"]["cl1"]=document.getElementsByClassName("in-possession_1")[0];
evWithBackGround["Attack"]["cl2"]=document.getElementsByClassName("attack_2")[0];
evWithBackGround["Dangerous Attack"]["cl2"]=document.getElementsByClassName("dangerous-attack_2")[0];
evWithBackGround["In Possession"]["cl2"]=document.getElementsByClassName("in-possession_2")[0];

var clBack=descCl.getElementsByClassName('frame__background')[0];
var clT=descCl.getElementsByClassName('frame__title');
var clP=descCl.getElementsByClassName('frame__player');

var textWidthPrev=109, clubPrev=0, rotateDeg=0;

var pointer=0;

//var id=setInterval(makeEvent,1000);

/*
myObj.ev[0].a="";
myObj.ev[0].c="2";
myObj.ev[0].e="Free Kick";
myObj.ev[0].p="1661334957706";
myObj.ev[0].s="24:57";
myObj.ev[0].x="220";
myObj.ev[0].y="150";
makeEvent();
*/


let uWidth=340; //ball size increase with every angle

let bWidth = 340; //ball size
let bHeight = 210;

let vWidth = 340; //window size
let vHeight = 210;

let maxWidth = 340; //ball diagonal

let width = 340; //pitch size
let height = 216;
let width17P = 54; //pitch size 17%
let width10P = 34; //pitch size 10%

let multiplierWidth=1; //
let multiplierHeight=1;

var tKoef=2; //used in ChartEv 
var koefC=100/5400; //used in koefC
window.addEventListener("resize", initSize);
function initSize(){
	tKoef=2-vWidth/1000;
	tKoef=tKoef.toFixed(2);

	vHeight=window.innerHeight;
	vWidth=window.innerWidth;

	bWidth=document.querySelector('.throw-in').offsetWidth;
	bHeight=document.querySelector('.throw-in').offsetHeight;

	maxWidth=Math.sqrt(bWidth*bWidth+bWidth*bWidth)
	uWidth=(maxWidth-bWidth)/45;
	console.log("mW="+maxWidth+";"+uWidth);
	console.log("mW="+uWidth);

        let box = document.querySelector('.base-widget');
        width = box.offsetWidth;
        height = box.offsetHeight-box.offsetHeight/100;
	multiplierWidth=(width/340).toFixed(2);
	multiplierHeight=(height/216).toFixed(2);

	if(Math.trunc(width*17/100)>54) width17P=Math.trunc(width*17/100);
	else width17P=54;
        width10P = Math.trunc(width/15);
        console.log({ width, height });

	  console.log("background");
	evWithBackGround["Attack"]["cl1"].style.height=height+"px";
	evWithBackGround["Dangerous Attack"]["cl1"].style.height=height+"px";
	evWithBackGround["In Possession"]["cl1"].style.height=height+"px";
	evWithBackGround["Attack"]["cl2"].style.height=height+"px";
	evWithBackGround["Dangerous Attack"]["cl2"].style.height=height+"px";
	evWithBackGround["In Possession"]["cl2"].style.height=height+"px";
	getInitial();
}

initSize();


var getFlag=0;
var getTimer=setInterval(get,1000);

function makeMenu(){
  //<li class="match-info itemS"><img alt="" src="./assets/svg/nav-header/field-icon.svg"></li>
  //console.log("makeMenu");
  //console.log(bMenu);
  var str="";
  for(var i=0;i<bMenu.length;i++){
    if(bMenu[i]===bMenuPnt){
      str+="<li class=\""+bMenu[i]+" itemS\"><img alt=\"\" src=\"./assets/svg/nav-header/"+bMenu[i]+"-green-icon.svg\"></li>\n";
    }
    else {
      str+="<li class=\""+bMenu[i]+" item\"><img alt=\"\" src=\"./assets/svg/nav-header/"+bMenu[i]+"-grey-icon.svg\"></li>\n";
    }
  }

  var navCl=document.getElementsByClassName("nav-content__items")[0];
  navCl.innerHTML=str;
  var liCl=navCl.getElementsByTagName('li');
  for(var i=0;i<liCl.length;i++){
    liCl[i].addEventListener("click", clMenu, 1);
  }
}

function clMenu(){
  clearInterval(menuInterval);
  bMenuPnt=this.classList[0];
  var clList=["","-statistics","-standings","-lineups"];
  for(var i=0;i<clList.length;i++){
    document.getElementsByClassName("match-content__pitch"+clList[i])[0].style.display="none";
  }
  if(bMenuPnt==="match-info") pitchName="match-content__pitch";
  else pitchName="match-content__pitch-"+bMenuPnt;
  //console.log(pitchName);
  document.getElementsByClassName(pitchName)[0].style.display="flex";
  //console.log(this.classList[0]);

  if(bMenuPnt==="statistics"){
    getStats();
    menuInterval=setInterval(getStats,5000);
  }
  if(bMenuPnt==="standings")
  makeStandings(tablehInit.tAll,tablehInit.clubs,0);
  if(bMenuPnt==="lineups")
  makeLineups();
  makeMenu();
}

var timerCnt=0;
function makeTime(){
  var currentDateTime = new Date();
  var resultInSeconds=Math.trunc(currentDateTime.getTime() / 1000);
  var diffTime=resultInSeconds-timeComp;
  if(diffTime>2){
    console.log("bbbbb="+timeComp+";"+resultInSeconds+";"+diffTime+";"+timeStr);
    console.log("oooooooo");
    timerCnt+=diffTime;
    getInitial();
    clearInterval(getTimer);
    setInterval(get,1000);
    return 0;
  }

  timeComp=resultInSeconds;
  var stNT=[0,2,6];

 // if(stNT.includes(statusG)) return 0;

  var min=Math.floor(timerCnt/60);
  var sec=timerCnt%60;
  var str="";
  if(min<10) str="0"+min;
  else str=min;
/*
  if(statusG===1){
    if(min<10) str="0"+min;
    else str=min;
  }
  else if(statusG===3){
    min+=45;
    str=min;
  }
  */
  if(sec<10) str+=":0"+sec;
  else str+=":"+sec;
  tmCl.innerHTML=str;
  makeChart();
  if(bMenuPnt!=="match-info"){
    var tmpCl=document.getElementsByClassName("pitch-"+bMenuPnt+"__data")[0];
    tmpCl.getElementsByClassName("data__time")[0].innerHTML=str;
  }
  timerCnt++;
  timeStr=str;
}

function makeChartEvents(str){

  //str="1,1,y;1,1,g;1,1,y;1,15,y;1,30,r;1,45,g;1,46,y;1,60,g;1,75,g;1,90,g;2,90,y;2,90,g;2,1,y;2,15,y;2,30,r;2,45,g;2,60,g;2,75,g;2,90,g;";
  var evCorr={"r":"red-card","y":"yellow-card","g":"boll"};

/*
  <img class="boll" alt="boll" src="./assets/svg/momentum/boll-icon.svg"/>
  <img class="first-yellow-card" alt="yellow-card" src="./assets/svg/momentum/yellow-card-icon.svg">
  <img class="second-yellow-card" alt="yellow-card" src="./assets/svg/momentum/yellow-card-icon.svg">
  <img class="red-card" alt="red-card" src="./assets/svg/momentum/red-card-icon.svg"/>
*/
  var str1=str2="";
  var tEvs=str.split(";");
  var tEv=[];
  var flag1=Array(91), flag2=Array(91);
  flag1.fill(0); flag2.fill(0);
  for(var i=0;i<tEvs.length;i++){
    tEv[i]=tEvs[i].split(",");
    var min=Number(tEv[i][1]), club=tEv[i][0], ev=evCorr[tEv[i][2]];
    if(!min) continue;
    var coord=min*100/90-tKoef;
    if(min>75){ coord-=(parseFloat(tKoef)+0.5)/15*(min-75); }
    coord=coord.toFixed(2);

    var strAdd="";
    if(club==="1"){
      if(flag1[min]){
        coord=parseFloat(coord)+parseFloat(flag1[min]*0.3);
        var top=-flag1[min]*4;
        strAdd="; top:"+top+"px";
      }
      flag1[min]++;
      //console.log("flag="+flag1[min]+";"+min);
      //console.log(flag1);
      str1+="<img class=event alt=\""+ev+"\" src=\"./assets/svg/momentum/"+ev+"-icon.svg\"/ style=\"left:"+coord+"%"+strAdd+"\">";
    }
    else{
      if(flag2[min]){
        coord=parseFloat(coord)+parseFloat(flag2[min]*0.3);
        var top=flag2[min]*4;
        strAdd="; top:"+top+"px";
      }
      flag2[min]++;
      str2+="<img class=event alt=\""+ev+"\" src=\"./assets/svg/momentum/"+ev+"-icon.svg\"/ style=\"left:"+coord+"%"+strAdd+"\">";
    }
    //console.log("ccc="+coord+";"+min+";"+koefTmp+";"+Math.trunc((min+7)/15));
  }

  if(str1){
    document.getElementsByClassName("stream__srm-top")[0].innerHTML=str1;
  }
  if(str2){
    document.getElementsByClassName("stream__srm-bottom")[0].innerHTML=str2;
  }
}

function makeChart(){
  var chartTm=timerCnt;
  if(timerCnt>2700 && statusG===1) chartTm=2700;
  else if(timerCnt>5400) chartTm=5400;

  res=koefC*chartTm;
  res=100-res;
  vlCl.style.right=res+"%";
  vrCl.style.right=res+"%";
}

function makeResult(str){
  var statusNames=[" ","1st","HT","2nd","ET","11M","FT","FT","Pst","AET","Pen","Ssp","Canc","NIY","AW"];
  console.log("makeResult");
  //console.log(str);
  var tEvs=str.split(",");
  var goalCl=document.getElementsByClassName("team-result");
  goalCl[0].innerHTML="<span>"+tEvs[1]+"</span>";
  goalCl[1].innerHTML="<span>"+tEvs[2]+"</span>";
  statusG=Number(tEvs[0]);
  if(statusStr!=statusNames[statusG]){
    statusStr=statusNames[statusG];
    var stCl=document.getElementsByClassName("data__half")[0];
    stCl.innerHTML=statusStr;
    if(bMenuPnt!=="match-info"){
      var tmpCl=document.getElementsByClassName("pitch-"+bMenuPnt+"__data")[0];
      tmpCl.getElementsByClassName("data__half")[0].innerHTML=statusStr;
    }
  }
  var min=Number(tEvs[3]);
  if(min){
    if(!timerCnt) timerCnt=min*60;
    else{
      var diff=Math.abs(timerCnt-min*60);
      console.log("TM;"+diff);
      if(diff>60){ 
	      console.log("TM="+diff);
	      timerCnt=min*60;
      }	
    }
	  /*
          statusStr="2nd";
          timerCnt=2700;
          if(!timerInterval) timerInterval=setInterval(makeTime,1000);
	  */
    if(!timerInterval){
      makeTime();
      timerInterval=setInterval(makeTime,1000);
    }
  }
  else if(statusG){
    if(statusG==2) timerCnt=45*60;
    else if(statusG==6) timerCnt=90*60;
    else if(statusG==5) timerCnt=120*60;
    else if(statusG==9) timerCnt=120*60;
    else if(statusG==10) timerCnt=120*60;
    makeTime();
  }
}

function makeEvent(){
  //console.log(timerCnt);
  //console.log(pointer);
  //console.log(myObj.ev[pointer]);
	/*
myObj.ev[0].a="";
myObj.ev[0].c="2";
myObj.ev[0].e="Free Kick";
myObj.ev[0].p="1661334957706";
myObj.ev[0].s="24:57";
myObj.ev[0].x="220";
myObj.ev[0].y="108";
*/

  for(var i in evWithBackGround){
    evWithBackGround[i]["cl1"].style.display="none";
    evWithBackGround[i]["cl2"].style.display="none";
  }
  thCl.style.display="none";

  if(evWithCoord.includes(myObj.ev[pointer].e)){
    console.log("if width coord="+myObj.ev[pointer].x);
    if(myObj.ev[pointer].x && myObj.ev[pointer].y)
      thCl.style.display="block";
    switch (myObj.ev[pointer].e) {
      case "Corner":
        makeCorner();
        break;
      case "Throw In":
        makeThrowIn();
        break;
      case "Penalty":
	console.log("case penalty");
        makePenalty();
        break;
      case "Goal Kick":
        makeGoalKick();
        break;
      default:
        makeStandart();
    }
  }
  else{
    if(evWithBackGround[myObj.ev[pointer].e]){
      evWithBackGround[myObj.ev[pointer].e]["cl"+myObj.ev[pointer].c].style.display="block";
      thCl.style.transform="rotate(55deg)";
    }

    if(statusList[myObj.ev[pointer].e]){
      var stCl=document.getElementsByClassName("data__half")[0];

      statusG=statusList[myObj.ev[pointer].e];
      switch (myObj.ev[pointer].e) {
        case "Kick Off":
          statusStr="1st"; timeStr="00:01";
          if(!timerInterval) timerInterval=setInterval(makeTime,1000);
          break;
        case "Half Time":
          statusStr="HT"; timeStr="45:00";
          timerCnt=0;
          break;
        case "Second Half":
          statusStr="2nd";
          timerCnt=2700;
          if(!timerInterval) timerInterval=setInterval(makeTime,1000);
          break;
        case "Full Time":
          statusStr="FT"; timeStr="90:00";
          timerCnt=0;
          break;
      }
      console.log("chStatus="+statusStr);
      stCl.innerHTML=statusStr;
      tmCl.innerHTML=timeStr;
      if(bMenuPnt!=="match-info"){
        var tmpCl=document.getElementsByClassName("pitch-"+bMenuPnt+"__data")[0];
        tmpCl.getElementsByClassName("data__time")[0].innerHTML=timeStr;
        tmpCl.getElementsByClassName("data__half")[0].innerHTML=statusStr;
      }
    }
    /*
    else if(myObj.ev[pointer].e=="Goal"){
      if(!myObj.ev[pointer].x && !myObj.ev[pointer].y){
        var goalCl=document.getElementsByClassName("team-result");
        if(myObj.ev[pointer].c=="1") goalCl[0].innerHTML="<span>1</span>";
        else goalCl[1].innerHTML="<span>1</span>";
      }
    }
    */
  }

  changeText(myObj.ev[pointer].e,myObj.ev[pointer].a); //title,player
  changeClub(myObj.ev[pointer].x,myObj.ev[pointer].y); //title,player
  changePosition(myObj.ev[pointer].x,myObj.ev[pointer].y); //title,player
}

function changeText(title,player){
  var aPass=0, rPass=1;
  if(clT[0].classList.contains("pass")){ aPass=1; rPass=0; }

  const styles = window.getComputedStyle(clT[0]);

  var canvas = document.createElement("canvas");
  var ctx = canvas.getContext("2d");
  var pt=parseInt(styles.fontSize)*0.75;
  ctx.font = pt+"pt Inter";  // This can be set programmaticly from the element's font-style if desired
  var playerWidth = Math.round(ctx.measureText(player).width)+10+width10P; //25 ramkeqna
  var titleWidth = Math.round(ctx.measureText(title.toUpperCase()).width)+10+width10P; //25 ramkeqna
  var textWidth=playerWidth;
  if(textWidth<titleWidth) textWidth=titleWidth;

  if(textWidth>textWidthPrev) descCl.style.transitionDelay="0s";
  else descCl.style.transitionDelay="0.2s";
  textWidthPrev=textWidth;

  descCl.style.width=textWidth+"px";

  clBack.style.width=textWidth+"px";

  if(clubPrev==2){
    var lineLeft=textWidthPrev-4;
    //var x=textWidthPrev-4;
    //lineCl.style.left=x+"px";
    //console.log("1"+";"+textWidthPrev+";");
    lineCl.style.left=lineLeft+"px";
  }

  clT[rPass].classList.remove("pass");
  clP[rPass].classList.remove("pass");
  clT[rPass].innerHTML=title;
  clP[rPass].innerHTML=player;

  clT[aPass].classList.add("pass");
  clP[aPass].classList.add("pass");

}


function makeGoalKick(){
  if(myObj.ev[pointer].c==1){
    var x=bWidth/5.5+width/30;
    if(myObj.ev[pointer].y<108){
      var y=height/2-bWidth/2+height/25;
      thCl.style.bottom=y+"px";
      thCl.style.left=x+"px";
      thCl.style.transform="rotate(55deg)";
    }
    else{
      var y=height/2-bWidth/2-height/25;
      thCl.style.bottom=y+"px";
      thCl.style.left=x+"px";
      thCl.style.transform="rotate(35deg)";
    }
  }
  else{
    var x=width-bWidth-(bWidth/5.5+width/30);
    if(myObj.ev[pointer].y<108){
      var y=height/2-bWidth/2+height/25;
      thCl.style.bottom=y+"px";
      thCl.style.left=x+"px";
      thCl.style.transform="rotate(215deg)";
    }
    else{
      var y=height/2-bWidth/2-height/25;
      thCl.style.bottom=y+"px";
      thCl.style.left=x+"px";
      thCl.style.transform="rotate(235deg)";
    }
  }
}

function makePenalty(){
  var tsh=bWidth*20/100;
  var b=height/2-maxWidth/2+tsh;
      tsh=width*7/100;
	console.log("pen="+height+";"+maxWidth);
  if(myObj.ev[pointer].c==1){
    var l=width-tsh;
    thCl.style.bottom=b+"px";
    thCl.style.left=l+"px";
    thCl.style.transform="rotate(45deg)";
  }
  else{
    var l=tsh-bWidth;
    thCl.style.bottom=b+"px";
    thCl.style.left=l+"px";
    thCl.style.transform="rotate(225deg)";
  }
}

function makeCorner(){
  if(myObj.ev[pointer].c==1){
    if(myObj.ev[pointer].y<108){
      var tsh=Math.sin(5*Math.PI/180)*bWidth;
      var b=height-bWidth-uWidth*20+10;
      var l=width-bWidth+tsh;
      thCl.style.bottom=b+"px";
      thCl.style.left=l+"px";
      thCl.style.transform="rotate(160deg)";
    }
    else{
      var tsh=Math.sin(5*Math.PI/180)*bWidth;
      var b=uWidth*20;
      var l=width-bWidth+tsh;
      thCl.style.bottom=b+"px";
      thCl.style.left=l+"px";
      thCl.style.transform="rotate(-75deg)";
    }
  }
  else{
    if(myObj.ev[pointer].y<108){
      var b=height-bWidth-uWidth*20+10;
      thCl.style.bottom=b+"px";
      thCl.style.left="-6px";
      thCl.style.transform="rotate(107deg)";
    }
    else{
      var b=uWidth*20;
      thCl.style.bottom=b+"px";
      thCl.style.left="-8px";
      thCl.style.transform="rotate(-20deg)";
    }
  }
}

function makeThrowIn(){
  var x=Math.round(myObj.ev[pointer].x*multiplierWidth),y=myObj.ev[pointer].y,deg=0;
  if(y<108){
    y=height-bHeight+height/100;
    if(myObj.ev[pointer].c==2){
      x-=bWidth;
      if(x<-bWidth/2) x=-bWidth/2;
      else if(x>(width-bWidth-20)) x=width-bWidth-20;
      deg=180;
    }
    else{
      if(x>(width-bWidth/3)) x=width-bWidth/3;
      else if(x<10) x=10;
      deg=90;
    }
  }
  else{
    y=0;
    if(myObj.ev[pointer].c==2){
      x-=bWidth;
      if(x<-bWidth/2) x=-bWidth/2;
      else if(x>(width-bWidth-20)) x=width-bWidth-20;
      deg=270;
    }
    else{
      if(x>(width-bWidth/3)) x=width-bWidth/3;
      else if(x<10) x=10;
    }
  }
  thCl.style.bottom=y+"px";
  thCl.style.left=x+"px";
  thCl.style.transform="rotate("+deg+"deg)";
}

function makeStandart(){
  var x=Math.round(myObj.ev[pointer].x*multiplierWidth),y=Math.round((216-myObj.ev[pointer].y)*multiplierHeight),deg=0;

  if(myObj.ev[pointer].c==2){
	  if(myObj.ev[pointer].y>216) myObj.ev[pointer].y=216;
	  if(myObj.ev[pointer].y<0) myObj.ev[pointer].y=0;
	  if(myObj.ev[pointer].x>340) myObj.ev[pointer].x=340;
	  if(myObj.ev[pointer].x<0) myObj.ev[pointer].x=0;
    var anglePerH=90/height;
    deg=Math.round(anglePerH*y);
    var tshY=Math.round(((maxWidth-bWidth)/45)*deg);
    var tshX=tshY;
    if(deg>45) tshX=Math.round(((maxWidth-bWidth)/45)*(90-deg));
    var degT=180-deg;
    if(deg>45) degT=90+deg;
    tshX=Math.sin(Math.PI/degT)*bWidth;
    y-=tshY;
    x-=tshX+bWidth;
	  console.log("makeStandart="+x+";"+y+";"+deg+";"+tshY+";"+tshX+";"+bWidth+";"+multiplierWidth+";"+maxWidth);
    if(x>(width-bWidth/3-bWidth)) x=width-bWidth/3-bWidth;
    else if(x<(bWidth/3-bWidth)) x=bWidth/3-bWidth;
    if(y>(height)) y=height;
    else if(y<10) y=10;
    //if(x>(width-bWidth)) x=width-bWidth;
    //else if(x<-bWidth/2) x=-bWidth/2;
    //if(y>(height-bWidth/10)) y=height-bWidth/10;
    //else if(y<0) y=0;
    deg=270-deg;
  }
  else{
    var anglePerH=90/height;
    deg=Math.round(anglePerH*y);
    var tshY=Math.round(((maxWidth-bWidth)/45)*deg);
    var tshX=tshY;
    if(deg>45) tshX=Math.round(((maxWidth-bWidth)/45)*(deg-45));
    y-=tshY;
    if(x>(width-bWidth/3)) x=width-bWidth/3;
    else if(x<bWidth/5) x=bWidth/5;
    if(y>(height-bWidth)) y=height-bWidth;
    else if(y<10) y=10;
  }
  //if(deg)

  thCl.style.transform="rotate("+deg+"deg)";
  thCl.style.bottom=y+"px";

  thCl.style.left=x+"px";
}

function changePosition(x,y){
  //if()
  //if((x+textWidthPrev)>360) x=360-textWidthPrev;
  if(clubPrev==1){
    descCl.style.left=width17P+"px";
    descCl.style.transitionDuration="0.2s";
  }
  else if(clubPrev==2){
    descCl.style.transitionDelay="0s";
    descCl.style.transitionDuration="0s";
    x=width-width17P-textWidthPrev; descCl.style.left=x+"px";
  }
  else{
    descCl.style.left=Math.round(width/2-textWidthPrev/2)+"px";
  }
  /*
  descCl.style.top=y+"px";
  descCl.style.left=x+"px";
  */
}

function changeClub(x,y){
  if(myObj.ev[pointer].e=="Half Time" || myObj.ev[pointer].e=="Full Time"){
    descCl.style.display="none";
    frameCl.style.display="flex";
    frameCl.getElementsByClassName("frame__title")[0].innerHTML=myObj.ev[pointer].e;
    return 0;
  }
  else{
    frameCl.style.display="none";
    descCl.style.display="flex";
  }

  if(myObj.ev[pointer].c===clubPrev){
    return 0;
  }

  clubPrev=myObj.ev[pointer].c;
  if(myObj.ev[pointer].c==0){
    lineCl.style.display="none";
    return 0;
  }
  else{
    lineCl.style.display="block";
  }

  if(myObj.ev[pointer].c==1){
    lineCl.style.backgroundColor="#EF3C47";
    lineCl.style.left="0px";
    rotateDeg=0;
  }
  else{
    lineCl.style.backgroundColor="#121421";
    var lineLeft=textWidthPrev-4;
    lineCl.style.left=lineLeft+"px";
    //console.log("2"+";"+textWidthPrev+";");
    rotateDeg=180;
  }

  lineCl.style.transform="rotate("+rotateDeg+"deg)";
}

//get();

function drDesc(i){

  var descCl=document.getElementById("desc");
  if(descCl){
    /*
    descCl.innerHTML="<div class=\"pitch__frame-1\">";
    descCl.innerHTML+="<div class=\"frame__left-horizontal-line-red\"></div>";
    descCl.innerHTML+="<div class=\"frame__description\">";
    descCl.innerHTML+="<p class=\"frame__title\">"+obj[i].e+"</p>";
    descCl.innerHTML+="<p class=\"frame__player\">"+"Modrich"+"</p>";
    descCl.innerHTML+="</div>";
    descCl.innerHTML+="</div>";
*/

var html="<div class=\"pitch__frame-1\"><div class=\"frame__left-horizontal-line-red\"></div>";
html+="<div class=\"frame__description\">";
html+="<p class=\"frame__title\">"+obj[i].e+"</p>";
html+="<p class=\"frame__player\">"+obj[i].e+"</p>";
html+="</div></div>";
descCl.innerHTML=html;

    /*
    descCl.innerHTML=
    <div class="pitch__frame-home">
        <div class="frame__left-horizontal-line-red"></div>
        <div class="frame__description">
            <p class="frame__title">In possession</p>
            <p class="frame__player">L. Modrić</p>
        </div>
    </div>
    */
  }
}

function makeStatistics(){
  var tmpCl=document.getElementsByClassName("pitch-statistics__data")[0];
  tmpCl.getElementsByClassName("data__time")[0].innerHTML=timeStr;
  tmpCl.getElementsByClassName("data__half")[0].innerHTML=statusStr;

  var around={"Possession %":"Posession","Shots":"Shots","On Target":"Shots on Goal"};
  var strA=strB="";
//console.log(statsInit);
//console.log(statsInit.length);
  for(var i=0;i<statsInit.length;i++){
    var percent1=Math.trunc(Number(statsInit[i][1])*100/(Number(statsInit[i][1])+Number(statsInit[i][2])));
    var percent2=100-percent1;
    if(!percent1) percent1=0;
    if(around[statsInit[i]["descr"]]){
      var v1=statsInit[i][1], v2=statsInit[i][2];
      if(statsInit[i]["descr"]=="Possession %"){ v1+="%"; v2+="%"; }
      else{
        if(Number(v1)<10) v1="<span class=hide>0%</span>"+v1; else v1="<span class=hide>%</span>"+v1;
        if(Number(v2)<10) v2+="<span class=hide>0%</span>"; else v2+="<span class=hide>%</span>";
      }
      strA+="<div class=\"around-chart__single\">\n"+
          "<div class=\"around-chart__title\">"+around[statsInit[i]["descr"]]+"</div>\n"+
          "<div class=\"around-chart__content\">\n"+
              "<div class=\"around-chart__percent-home-team\">"+v1+"</div>\n"+
              "<svg class=\"around-chart__circular\" viewBox=\"0 0 36 36\">\n"+
                  "<path class=\"around-chart__circle\" d=\"M18 2.0845\n"+
                          "a 15.9155 15.9155 0 0 1 0 31.831\n"+
                          "a 15.9155 15.9155 0 0 1 0 -31.831\"></path>\n"+
                  "<path class=\"around-chart__circle-bg\" stroke-dasharray=\""+percent2+", 100\" d=\"M18 2.0845\n"+
                          "a 15.9155 15.9155 0 0 1 0 31.831\n"+
                          "a 15.9155 15.9155 0 0 1 0 -31.831\"></path>\n"+
              "</svg>\n"+
              "<div class=\"around-chart__percent-away-team\">"+v2+"</div>\n"+
          "</div>\n"+
      "</div>\n";

    }
    else{
      strB+="<div class=\"bar-chart__statistics-info\">"+
          "<span class=\"bar-chart__percent-home-team\">"+statsInit[i][1]+"</span>"+
          "<span class=\"bar-chart__title\">"+statsInit[i]["descr"]+"</span>"+
          "<span class=\"bar-chart__percent-away-team\">"+statsInit[i][2]+"</span>"+
      "</div>"+
      "<div class=\"bar-chart__single\">"+
          "<svg class=\"bar-chart\" xmlns=\"http://www.w3.org/2000/svg\">"+
              "<rect class=\"home-statistics\" width=\"100%\" height=\"50px\"></rect>"+
              "<rect class=\"away-statistics\" width=\""+percent1+"%\" height=\"50px\"></rect>"+
          "</svg>"+
      "</div>";

    }
  }
  if(strA)
  document.getElementsByClassName("pitch-statistics__around-chart")[0].innerHTML=strA;
  if(strB)
  document.getElementsByClassName("pitch-statistics__bar-chart")[0].innerHTML=strB;
}


function clStandingsMenu(){
    //console.log(this.innerText);
    if(this.innerText==="OVERALL"){
      makeStandings(tablehInit.tAll,tablehInit.clubs,0); return 0;
    }
    if(this.innerText==="HOME"){
      makeStandings(tablehInit.tH,tablehInit.clubs,1); return 1;
    }
    if(this.innerText==="AWAY"){
      makeStandings(tablehInit.tA,tablehInit.clubs,2); return 2;
    }
}

function makeStandings(tblObject,clubs,menuPnt){
  var corr={"overall":0,"HOME":1,"AWAY":2};

  menuFlag=1;
  if(menuFlag){
    var strMenu="";
    for(var menu in corr) {
      if(corr[menu]===menuPnt){
        strMenu+="<li class=\"tabs-list__item active\">"+menu+"</li>";
      }
      else strMenu+="<li class=\"tabs-list__item\">"+menu+"</li>";
    }
    var tabCl=document.getElementsByClassName("tabs-list")[0];
    tabCl.innerHTML=strMenu;
    var liCl=tabCl.getElementsByClassName('tabs-list__item');
    for(var i=0;i<liCl.length;i++){
      liCl[i].addEventListener("click", clStandingsMenu, 1);
    }
  }

  var tmpCl=document.getElementsByClassName("pitch-standings__data")[0];
  tmpCl.getElementsByClassName("data__time")[0].innerHTML=timeStr;
  tmpCl.getElementsByClassName("data__half")[0].innerHTML=statusStr;

  //console.log("Standings");
  var tableH = {"p":"MP", "w":"", "ow":"OTW", "d":"", "l":"", "ol":"OTL", "gf":"", "ga":"", "fa":"GD", "pnt":"Pts","n":""};

  var i,j,strHtm="";

  for(i=0; i<tblObject.length; i++){
    var oldGrup="",oldName="",lngth;
    for(j=0; j<tblObject[i]["t"].length; j++){
      if(tblObject[i].t[j].g!==oldGrup){
        if(strHtm) strHtm+="</tbody></table></div>\n";
//header
        pl=0;
        oldGrup=tblObject[i].t[j].g;
        if(tblObject[i][oldGrup] || tblObject[i].nm){
          var oldGrupName="";
          if(tblObject[i].nm) oldGrupName=tblObject[i].nm;
          if(tblObject[i][oldGrup]){
            if(oldGrupName){
              oldGrupName+=" - ";
            }
            oldGrupName+=tblObject[i][oldGrup];
          }
          strHtm+="<div class=group_a>"+oldGrupName+"</div>";
          //console.log(strHtm);
        }

                strHtm+="<div class=\"table__header into-header\">\n"+
                    "<div class=\"table__team-titles\">\n"+
                        "<span class=\"table__grid\">#</span>\n"+
                        "<span class=\"table__team\">Team</span>\n"+
                    "</div>\n"+
                    "<div class=\"table__point-titles\">\n"+
                        "<span class=\"table__point\">P</span>\n"+
                        "<span class=\"table__gd\">GD</span>\n"+
                        "<span class=\"table__pts\">PTS</span>\n"+
                    "</div>\n"+
                "</div>\n"+
                 "<div class=\"pitch-standings-tabs__table\">\n"+
                    "<table class=\"table__standings\">\n"+
                        "<tbody>\n";
      }
      //line
      pl++;
      strHtm+="  <tr class=\"table__row-standings\">\n";
          strHtm+="  <td class=\"table__team-description\">";
          strHtm+="  <div class=\"table__indicator\"><div class=\"note "+tblObject[i].t[j].n+"\"></div></div>";
          strHtm+="  <span class=\"table__number table__number-overall\">"+pl+"</span>\n";
	  strHtm+="<span class=\"table__small-arrow\"></span>\n";
          strHtm+="  <span class=\"table__club\"><img class=\"flag\" alt=\"flag\" src=\"https://livescore.joymatik.com/img/clubs/"+clubs[tblObject[i].t[j].c]+".png\"></span>\n";
          strHtm+="  <span class=\"table__full-name\">"+tblObject[i].t[j].c+"</span>\n";
          strHtm+="  </td>\n";
          strHtm+="  <td class=\"table__team-points\">\n";
          strHtm+="  <span class=\"table__p\">"+tblObject[i].t[j]["p"]+"</span>\n";
          strHtm+="  <span class=\"table__gd\">"+tblObject[i].t[j]["fa"]+"</span>\n";
          strHtm+="  <span class=\"table__pts\">"+tblObject[i].t[j]["pnt"]+"</span>\n";
          strHtm+="  </td>\n";
      strHtm+="  </tr>\n";
    }
    strHtm+="</tbody></table>\n";



    if(tblObject[i].text){
      strHtm+="<div class=\"next-steps\">";
      var legendStr="", legendCnt=0;
      for(var col in tblObject[i].text) {
        legendCnt++;
        strHtm+="<span class=\"table__playoff\"><div class=\"color "+col+"\"></div>"+tblObject[i].text[col]+"</span>";
      }
      strHtm+="</div>";
    }
    strHtm+="</div>";
  }

  var x = document.getElementsByClassName("tabInfo");
  x[0].innerHTML=strHtm;
}

function clLuLeft(){
  //console.log("clluLeft");
  var luArrowsCl=document.getElementsByClassName("pitch-lineups__arrows")[0];
  arrowCl=luArrowsCl.getElementsByClassName("arrow__left")[0];
  arrowCl.innerHTML="<img class=\"left-arrow\" alt=\"left-arrow\" src=\"assets/svg/pitch/arrows/grey/left-grey-arrow.svg\">\n";
  arrowCl=luArrowsCl.getElementsByClassName("arrow__right")[0];
  arrowCl.innerHTML="<img class=\"right-arrow\" alt=\"right-arrow\" src=\"assets/svg/pitch/arrows/black/right-black-arrow.svg\">\n";
  document.getElementsByClassName("pitch-lineups__field")[0].style.display="block";
  document.getElementsByClassName("substitute-players__table")[0].style.display="none";
  makeLineupsField();
}
function clLuRight(){
  //console.log("clluRight");
  var luArrowsCl=document.getElementsByClassName("pitch-lineups__arrows")[0];
  arrowCl=luArrowsCl.getElementsByClassName("arrow__left")[0];
  arrowCl.innerHTML="<img class=\"left-arrow\" alt=\"left-arrow\" src=\"assets/svg/pitch/arrows/black/left-black-arrow.svg\">\n";
  arrowCl=luArrowsCl.getElementsByClassName("arrow__right")[0];
  arrowCl.innerHTML="<img class=\"right-arrow\" alt=\"right-arrow\" src=\"assets/svg/pitch/arrows/grey/right-grey-arrow.svg\">\n";
  document.getElementsByClassName("pitch-lineups__field")[0].style.display="none";
  document.getElementsByClassName("substitute-players__table")[0].style.display="block";
  makeLineupsTable();
}
function makeLineups(){
  //console.log("makeLineups");
  var tmpCl=document.getElementsByClassName("pitch-lineups__data")[0];
  tmpCl.getElementsByClassName("data__time")[0].innerHTML=timeStr;
  tmpCl.getElementsByClassName("data__half")[0].innerHTML=statusStr;
  if(matchInit.formation){
    if(matchInit.formation["1"] && matchInit.formation["2"]){
      var luArrowsCl=document.getElementsByClassName("pitch-lineups__arrows")[0];
      arrowCl=luArrowsCl.getElementsByClassName("arrow__left")[0];
      arrowCl.innerHTML="<img class=\"left-arrow\" alt=\"left-arrow\" src=\"assets/svg/pitch/arrows/grey/left-grey-arrow.svg\">\n";
      arrowCl=luArrowsCl.getElementsByClassName("arrow__right")[0];
      arrowCl.innerHTML="<img class=\"right-arrow\" alt=\"right-arrow\" src=\"assets/svg/pitch/arrows/black/right-black-arrow.svg\">\n";
      document.getElementsByClassName("pitch-lineups__field")[0].style.display="block";
      document.getElementsByClassName("substitute-players__table")[0].style.display="none";
      makeLineupsField();
    }
  }
  else{
    document.getElementsByClassName("pitch-lineups__field")[0].style.display="none";
    var str="<div class=\"arrow__left\">\n";
    str+="<img class=\"left-arrow\" alt=\"left-arrow\" src=\"assets/svg/pitch/arrows/hide/left-black-arrow.svg\">\n";
    str+="</div>\n";
    str+="<div class=\"arrow__right\">\n";
    str+="<img class=\"right-arrow\" alt=\"right-arrow\" src=\"assets/svg/pitch/arrows/hide/right-black-arrow.svg\">\n";
    str+="</div>\n";
    document.getElementsByClassName("pitch-lineups__arrows")[0].innerHTML=str;
    makeLineupsTable();
  }
}

function makeLineupsField(){
  //console.log("makeLineupsField");

  var str="", k1=k2=1, top=[], bottom=[], left1=[], left2=[];
  var topTmp, bottomTmp;
  var lbCnt1=[], rbCnt1=[], rtCnt1=[], lbCnt2=[], rbCnt2=[], rtCnt2=[], strB1=[], strB2=[], strLu1=[], strLu2=[], leftTmp;
  var strSub1=[], strSub2=[], sub1Cnt=sub2Cnt=0;

  str+="<div class=\"pitch-lineups__formation\">\n";
  str+="<div class=\"formation__scheme-tactics-left\">\n";
  str+="<span class=\"tactics-left\">"+matchInit.formation["1"]+"</span>\n";
  str+="</div>\n";
  str+="<div class=\"formation__scheme-tactics-title\">\n";
  str+="<span class=\"title\">Formation</span>\n";
  str+="</div>\n";
  str+="<div class=\"formation__scheme-tactics-right\">\n";
  str+="<span class=\"tactics-right\">"+matchInit.formation["2"]+"</span>\n";
  str+="</div>\n";
  str+="</div>\n";

  str+="<div class=\"small-pitch__image\">";
  str+="<img class=\"small-pitch\" alt=\"small_court\" src=\"./assets/svg/pitch/court/small-court.svg\">";

  var line=matchInit.formation["1"].split("-");
	console.log(line.length);
  var wdth=Math.trunc(90/line.length);
  str+="<div class=\"home__players-info\">";
  str+="<div class=\"goalkeeper\"><p class=\"player\">"+matchInit.lineup["1"][0].no+"</p></div>";
  var k=0;
  for(var i=0; i<line.length;i++){
    str+="<div class=\"column\" style=\"width: "+wdth+"%\">";
    for(var j=0; j<line[i];j++){
      k++;
      str+="<p class=\"player\">"+matchInit.lineup["1"][k].no+"</p>";
    }
    str+="</div>";
  }
  str+="</div>";

  line=matchInit.formation["2"].split("-");
  wdth=Math.trunc(90/line.length);
  str+="<div class=\"away__players-info\">";
  k=11;
  for(var i= line.length-1;i>=0;i--){
    str+="<div class=\"column\" style=\"width: "+wdth+"%\">";
    for(var j=0; j<line[i];j++){
      k--;
      str+="<p class=\"player\">"+matchInit.lineup["2"][k].no+"</p>";
    }
    str+="</div>";
  }
  str+="<div class=\"goalkeeper\"><p class=\"player\">"+matchInit.lineup["2"][0].no+"</p></div></div>";

  str+="</div>";

  document.getElementsByClassName("pitch-lineups__field")[0].innerHTML=str;
}


function makeLineupsTable(){
  //console.log("makeLineupsTable");
  var clubCl=document.getElementsByClassName("team__title");
  var cl1=clubCl[0].innerText, cl2=clubCl[1].innerText;

  var str="<table class=\"substitute-players-table__lineups\">\n<tbody class=\"substitute-players-table__body\">\n";

  var maxLu=matchInit.lineup["1"].length;
  if(maxLu<matchInit.lineup["2"].length) maxLu=matchInit.lineup["2"].length;
  if(maxLu){
    str+="<tr class=\"table__row table__header\">\n";
    str+="<th class=\"table__left-team\">"+cl1+"</th>\n";
    str+="<th class=\"table__title\">Starting Lineup</th>\n";
    str+="<th class=\"table__right-team\">"+cl2+"</th>\n";
    str+="</tr>\n";
  }
  for(var i=0; i<maxLu; i++){
    str+="<tr class=\"table__row\">\n";
    str+="<td class=\"table__number-left\">"+matchInit.lineup["1"][i].no+"</td>\n";
    //str+="<td class=\"table__position-left\"></td>\n";
    str+="<td class=\"table__full-name-left\">"+matchInit.lineup["1"][i].pl+"</td>\n";
    str+="<td class=\"table__empty\"></td>\n";
    str+="<td class=\"table__full-name-right\">"+matchInit.lineup["2"][i].pl+"</td>\n";
    //str+="<td class=\"table__position-right\"></td>\n";
    str+="<td class=\"table__number-right\">"+matchInit.lineup["2"][i].no+"</td>\n";
    str+="</tr>\n";
  }
  if(matchInit.bench){
    var maxBn=matchInit.bench["1"].length;
    if(maxBn<matchInit.bench["2"].length) maxBn=matchInit.bench["2"].length;

    str+="<tr class=\"table__row table__header\">\n";
    str+="<th class=\"table__left-team\">"+cl1+"</th>\n";
    str+="<th class=\"table__title\">Substitute Players</th>\n";
    str+="<th class=\"table__right-team\">"+cl2+"</th>\n";
    str+="</tr>\n";
    //console.log(maxBn);
    for(var i=0; i<maxBn; i++){
      var no1=pl1=no2=pl2="";
      if(matchInit.bench["1"][i]){
        //console.log("1");
        //console.log(matchInit.bench["1"][i]);
        if(matchInit.bench["1"][i].no){ no1=matchInit.bench["1"][i].no; }
        if(matchInit.bench["1"][i].pl){ pl1=matchInit.bench["1"][i].pl; }
      }
      if(matchInit.bench["2"][i]){
        //console.log("2");
        //console.log(matchInit.bench["2"][i]);
        if(matchInit.bench["2"][i].no){ no2=matchInit.bench["2"][i].no; }
        if(matchInit.bench["2"][i].pl){ pl2=matchInit.bench["2"][i].pl; }
      }

      str+="<tr class=\"table__row\">\n";
      str+="<td class=\"table__number-left\">"+no1+"</td>\n";
      //str+="<td class=\"table__position-left\"></td>\n";
      str+="<td class=\"table__full-name-left\">"+pl1+"</td>\n";
      str+="<td class=\"table__empty\"></td>\n";
      str+="<td class=\"table__full-name-right\">"+pl2+"</td>\n";
    //  str+="<td class=\"table__position-right\"></td>\n";
      str+="<td class=\"table__number-right\">"+no2+"</td>\n";
      str+="</tr>\n";
    }
  }

  str+="</tbody>\n</table>";
  document.getElementsByClassName("substitute-players__table")[0].innerHTML=str;
}

function getTable(){
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if(this.readyState == XMLHttpRequest.DONE){
      if(this.status == 200){// && this.responseText) {
        var myObj = JSON.parse(this.responseText);
        tablehInit=myObj;
        //console.log(myObj);
      }
    }
  }
  xhr.timeout = 1000;
  xhr.open("POST", "https://smt.scoresfinder.com/api/det.php?t=table&i="+IDcomp+"&a="+ID, true);
  xhr.send();
}

function getStats(){
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if(this.readyState == XMLHttpRequest.DONE){
      if(this.status == 200){// && this.responseText) {
        var myObj = JSON.parse(this.responseText);
        statsInit=myObj.stats;
        makeStatistics();
        //console.log(myObj);
      }
    }
  }
  xhr.timeout = 1000;
  xhr.open("POST", "https://smt.scoresfinder.com/api/det.php?i=11&a="+ID, true);
  xhr.send();
}


function getFormation(){
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if(this.readyState == XMLHttpRequest.DONE){
      if(this.status == 200){// && this.responseText) {
        var myObj = JSON.parse(this.responseText);
        matchInit=myObj;

        if(matchInit.formation){
          if(matchInit.formation["1"] && matchInit.formation["2"]){
            var luArrowsCl=document.getElementsByClassName("pitch-lineups__arrows")[0];
            var arrowCl=luArrowsCl.getElementsByClassName("arrow__left");
            arrowCl[0].addEventListener("click", clLuLeft, 1);
            arrowCl=luArrowsCl.getElementsByClassName("arrow__right")[0];
            arrowCl.addEventListener("click", clLuRight, 1);
          }
        }

        //console.log(myObj);
      }
    }
  }
  xhr.timeout = 1000;
  xhr.open("POST", "https://smt.scoresfinder.com/api/det.php?t=m&i=11&a="+ID, true);
  xhr.send();
}

function getInitial(){
  var currentDateTime = new Date();
  timeComp=Math.trunc(currentDateTime.getTime() / 1000);
  getFlag=1;
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if(this.readyState == XMLHttpRequest.DONE){
      if(this.status == 200){// && this.responseText) {
        console.log(this.responseText);
        myObj = JSON.parse(this.responseText);
        //bMenu-n and bMenuPnt are being initialized ; and also come with full information
        //this put in get function
        if(myObj.m){
          bMenu=myObj.m;
          console.log(bMenu);
          makeMenu();
        }
        if(myObj.t){
          console.log(myObj.t);
          makeChartEvents(myObj.t);
        }
        if(myObj.r){
          console.log(myObj.r);
          makeResult(myObj.r);
        }
        if(myObj.ts){
          tsG=myObj.ts;
        }

        if(!myObj.ev.length){
          var statusName=["Not Started","1st Half","Half Time","2nd Half","Extra Time","Penalties","Full Time","","","After Extra Time","After Penalties"];
          pointer=0;
          myObj.ev[0]={"p":"1661333467507","s":"00:06","e":statusName[statusG],"c":"0","a":""};
        }
        for(var i=0;i<myObj.ev.length;i++){
          pointer=i;
          console.log(pointer);
          console.log(myObj.ev[pointer]);
          makeEvent();
        }
      }
    }
    getFlag=0;
  }
  xhr.timeout = 1000;
  xhr.open("POST", "https://smt.scoresfinder.com/api/?ID="+ID, true);
  xhr.send();
}


function get(){
  if(getFlag) return 0;
  getFlag=1;
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if(this.readyState == XMLHttpRequest.DONE){
      if(this.status == 200){// && this.responseText) {
        //console.log(this.responseText);
        myObj = JSON.parse(this.responseText);
        //bMenu-n and bMenuPnt are being initialized ; and also come with full information
        //this put in get function
        if(myObj.m){
          bMenu=myObj.m;
          //console.log(bMenu);
          makeMenu();
        }
        if(myObj.t){
          makeChartEvents(myObj.t);
        }
        if(myObj.r){
          makeResult(myObj.r);
	  makeChart();
        }
        if(myObj.ts){
          tsG=myObj.ts;
        }


        for(var i=0;i<myObj.ev.length;i++){
          pointer=i;
          //console.log(pointer);
          //console.log(myObj.ev[pointer]);
          makeEvent();
        }
      }
    }
    getFlag=0;
  }
  xhr.timeout = 1000;
  xhr.open("POST", "https://smt.scoresfinder.com/api/?ID="+ID+"&ts="+tsG, true);
  xhr.send();
}