let headlinetxt=[];

let stringContent;

let headlineContent=[];

let headline=[];

let headlinekey=[];

let headlineKey=[];

let keys=[];

let keywords=[];

let index=0;

let index2=0;

let bool = false;

let files=[];

let newfiles=[];

let ball1=[];

let ballKey=[];

let bgtxt=[];

let bgtext=[];

let date=['13th','14th','15th']

let colores_g = ["#3366ccaa", "#dc3912aa", "#ff9900aa", "#109618aa", "#990099aa", "#0099c6aa",

"#dd4477aa", "#66aa00aa", "#b82e2eaa", "#316395aa", "#994499aa", "#22aa99aa", "#aaaa11aa",

"#6633ccaa", "#e67300aa", "#8b0707aa", "#651067aa", "#329262aa", "#5574a6aa", "#3b3eacaa"];

​

​

//json

let proxyUrl = "https://cors-anywhere.herokuapp.com/"

​

let countryCode= 'us';

let apiKey="43537be67578a4850f9e5705097185dc";

let url1="https://gnews.io/api/v4/top-headlines?&token=38dc5840bdc67e56c459f48813e4ac6a&country=us";

​

let popularity_data;

let key_data;

let imgUrl=[];

let img=[];

let classImg=[];

​

let articles_;

//font

let font;

let slider;

​

function preload(){

 key_data=loadJSON(url1);

  files= ['headlinekey1213.txt','headlinekey1214.txt','headlinekey1215.txt'];

  newfiles=['headlineus1213.txt','headlineus1214.txt','headlineus1215.txt','pop.txt'];

  for (let j = 0; j < newfiles.length-1; j++) {

    bgtxt[j]=loadStrings(`files/${newfiles[j]}`);

​

  }

  for (let i = 0; i < files.length-1; i++) {

    headlinetxt[i]= loadStrings('files/' + files[i]);

  }

​

  txt=loadStrings("files/keyword_pop.txt");

  font =loadFont("files/Ubuntu-Light.ttf");

​

}

function setup() {

  createCanvas(600, 600);

​

  console.log(headlinetxt.length);

  articles_=key_data.articles;

  console.log(articles_);

  textFont(font,15);

  slider = new button(width-100,height-40,100,20);

  //

  for(let j=0;j<bgtxt.length;j++){

    for(let i=0;i<bgtxt[j].length;i++){

      bgtext[i]=bgtxt[j][i];

      console.log(bgtext[i]);

​

    }

  }

​

​

​

  //

  for(let k=0;k<articles_.length-1;k++){

    imgUrl[k]=key_data.articles[k].image;

    img[k]=loadImage(imgUrl[k]);

    console.log(imgUrl[k]);

​

  }

​

  stringContent = txt[0];

  keywords= split(stringContent, ',');

​

  textSize(15);

  fill(255);

  for(let i =1;i<keywords.length;i++){

    ball1.push(new rotateBalls(width/3,height/3*2,random(-width/3,width/3),random(-height/3,height/3),`${colores_g[floor(random(0,20))]}`));

    print(`${colores_g[i]}`);

  }

​

  console.log(headlinetxt);

  for(let i=0;i<articles_.length-1;i++){

    classImg[i]=new imageLoading(random(width),random(height),img[i]);

    // image(img[i],i*100,0,img[i].width/10,img[i].height/10);

  }

  rectMode(CENTER);

}

​

function draw() {

  // clear();

  background(200);

  fill(255);

​

  // for(let j=0;j<bgtxt.length;j++){

  //

  for(let i=0;i<bgtext[0].length;i++){

    text(bgtext[i],50,20*i);

​

  }

//     for(let i=0;i<bgtext[1].length;i++){

//     text(bgtext[i],50+35,20*i+20);

​

//   }

  // }

​

​

  for(let i=0;i<articles_.length-1;i++){

    classImg[i].display();

  }

  fill(255,100);

  rect(width/2,height/2,width,height);

​

  noStroke();

  for(let i =1;i<keywords.length-1;i++){

    ball1[i].drawBalls(keywords[i],"Hot Issues");

​

  }

  for (let j = 1; j < headlinetxt[index].length; j++) {

    ballKey.push(new rotateBalls(width/3*2,height/3,random(-width/3*2,width/3),random(-height/3,height/3),`${colores_g[floor(random(0,20))]}`));

  }

​

  for (let j = 1; j < headlinetxt[index].length-1; j++) {

​

    headlineContent[j]=headlinetxt[index][j];

    // console.log(headlineContent[i]);

    // text(headlineContent[j],100,100+10*j);

    ballKey[j].drawBalls(headlineContent[j],`Top Headlines by December${date[index]}.`);

  }

  // rect(width-100,height-40,100,20);

  // fill(255);

  // rect(width-140,height-40,20,20);

​

  slider.display(date[index]);

  slider.update();

  index=slider.value;

​

}

function mousePressed(){

  print(index);

}

​

function mouseDragged(){

  for(let i =1;i<keywords.length-1;i++){

    ball1[i].updatePos();

​

  }

  for (let j = 1; j < headlinetxt[index].length-1; j++) {

    ballKey[j].updatePos();

  }

  slider.sliderfeature();

}

class button{

  constructor(x,y,w,h){

    this.x=x;

    this.y=y;

    this.w=w;

    this.h=h;

    this.x_=this.x-this.w/2+this.h/2;

    this.value=0;

  }

  display(date){

    rectMode(CENTER);

    fill("#D0104C");

    rect(this.x,this.y,this.w,this.h);

    text("Time: 12/"+date,this.x-50,this.y+25);

​

    fill(255);

    rect(this.x_,this.y,this.h,this.h);

​

  // rect(width-140,height-40,20,20);

  }

  update(){

    if(abs(this.x-this.x_)<=(this.w/2-this.h/2)){

​

    this.x_=this.x_;

   }else if(this.x_>(this.x+this.w/2-this.h/2)){

      this.x_=this.x+this.w/2-this.h/2;

​

    }else if(this.x>(this.x-this.w/2+this.h/2)){

      this.x_=this.x+this.w/2-this.h/2;

​

    }

​

    // print(this.value);

​

  }

  sliderfeature(){

     if(dist(this.x_,this.y,mouseX,mouseY)<20){

    if(abs(this.x-this.x_)<=(this.w/2-this.h/2)){

              this.x_=mouseX;

​

   }else if(this.x_>(this.x+this.w/2-this.h/2)){

      this.x_=this.x+this.w/2-this.h/2;

​

    }else if(this.x>(this.x-this.w/2+this.h/2)){

      this.x_=this.x+this.w/2-this.h/2;

​

    }

     }

      this.value=map(this.x_,(this.x-this.w/2+this.h/2),(this.x+this.w/2-this.h/2),0,2);

      this.value=floor(constrain(this.value,0,2));

​

​

​

  }

}

​