function formatDate(date) {
  return date.toLocaleDateString();
}

function Comment(props) {
  return (
    <div className="Comment">
      <div className="UserInfo">
        <img
          className="Avatar"
          src={props.author.avatarUrl}
          alt={props.author.name}
        />
        <div className="UserInfo-name">
          {props.author.name}
        </div>
      </div>
      <div className="Comment-text">{props.text}</div>
      <div className="Comment-date">
        {formatDate(props.date)}
      </div>
    </div>
  );
}

const comment = {
  date: new Date(),
  text: 'I hope you enjoy learning React!',
  author: {
    name: 'Hello Kitty',
    avatarUrl: 'https://placekitten.com/g/64/64',
  },
};
ReactDOM.render(
  <Comment
    date={comment.date}
    text={comment.text}
    author={comment.author}
  />,
  document.getElementById('root')
);

const MongoClient = require('mongodb').MongoClient;
const assert = require('assert');

// Connection URL
const url = 'mongodb://localhost:27017';

// Database Name
const dbName = 'myproject';

// Use connect method to connect to the server
MongoClient.connect(url, function(err, client) {
  assert.equal(null, err);
  console.log("Connected successfully to server");

  const db = client.db(dbName);

  client.close();
});

console.log("xa")

//Disclaimer: I do not condone mass web scraping of ESPN websites, and this is just theoretical code that hasn't been used.

//Scrape player stats off of https://www.espn.com/nfl/team/roster/_/name/phi/philadelphia-eagles

//Example player JS object
/*
{
	"shortName": "S. Opeta",
	"name": "Sua Opeta",
	"href": "http://www.espn.com/nfl/player/_/id/3121009/sua-opeta",
	"uid": "s:20~l:28~a:3121009",
	"guid": "dec19157-e984-f981-3724-498281328c97",
	"id": "3121009",
	"height": "6' 4\"",
	"weight": "305 lbs",
	"age": 27,
	"position": "G",
	"jersey": "78",
	"birthDate": "08/15/96",
	"headshot": "https://a.espncdn.com/i/headshots/nfl/players/full/3121009.png",
	"lastName": "Sua Opeta",
	"experience": 4,
	"college": "Weber State"
}
*/

//The page needs to be focused, so you have to put this code in a bookmarklet and click the page before clicking it. Allegedly.
navigator.clipboard.writeText(JSON.stringify(
    window["__espnfitt__"].page.content.roster.groups.flatMap((group)=>{
        return group.athletes.map((athlete)=>{
            //We can assume all football players are above 100 lbs and below 1000 lbs.
            athlete.weight = parseInt(athlete.weight.substring(0,3));
            
            if(athlete.experience == "R") athlete.experience = 0;
            else athlete.experience = parseInt(athlete.experience);

            //We can assume players are at least 1 foot, or under 10 feet tall.
            athlete.inches = 12 * parseInt(athlete.height.substring(0, 1)); //Add feet in inches
            athlete.inches += parseInt(athlete.height.substring(2).replaceAll("\"", "").trim()); //Add remaining inches

            const monthDayYear = athlete.birthDate.split("/");
            athlete.birthMonth = parseInt(monthDayYear[0]);
            athlete.birthDay = parseInt(monthDayYear[1]);
            athlete.birthYear = parseInt(monthDayYear[2]);
            
            //The only really useful stuff we get from this is Height, weight, left handedness, age, position, and birthday
            return athlete;
        });
    })
, null, "\t")).then(null, ()=>{alert("That failed.")});

//Changes all the team links on this page https://www.espn.com/nfl/stats/team to the team's roster for easier scraping
$$("table > tbody > tr > td > div > div > a").forEach((elm)=>{
	elm.setAttribute("href", elm.getAttribute("href").replace("team/", "team/roster/"));
});

//Use at https://mee6.xyz/leaderboard/732262089447702588
//Higher the spammy stat, the more spammy that person is.
//This is because mee doesn't give experience to people who post more comments in a minute.
function statBlock(title, value){
	let elm = document.createElement("div");
	elm.className = "leaderboardPlayerStatBlock";
	let titleElm = document.createElement("div");
	titleElm.className = "leaderboardPlayerStatName";
	titleElm.textContent = title;
	let valueElm = document.createElement("div");
	valueElm.className = "leaderboardPlayerStatValue";
	valueElm.textContent = value;
	elm.appendChild(titleElm);
	elm.appendChild(valueElm);
	elm.remove = function(){
	this.parentElement.removeChild(this);
	}
	return elm;
}
for(let player of Array.from(document.getElementsByClassName("leaderboardPlayer"))){
	if(player.spamminess) player.spamminess.remove();
	let messages = null;
	let experience = null;
	const statBlockArray = Array.from(player.querySelectorAll(".leaderboardPlayerStatBlock"));
	for(let statBlock of statBlockArray){
	const statName = statBlock.querySelector(".leaderboardPlayerStatName").textContent;
	const text = statBlock.querySelector(".leaderboardPlayerStatValue").textContent;
	const number = ((text.includes("k"))? (text.replace("k","") * 1000.0) : +(text));
	if(statName.includes("MESSAGES")){
	messages = number;
	}else if(statName.includes("EXPERIENCE")){
	experience = number;
	}
	}
	const stats = player.querySelector(".leaderboardPlayerStats");
	const messagesElement = stats.firstChild;

	const spamminess = ((messages/experience)*2000.0).toFixed(2);
	
	player.spamminess = stats.insertBefore(statBlock("SPAMMINESS", spamminess), messagesElement);
}

//use this with canvas file finder
function NewTab(testing) {
  window.open(testing, "_blank");
}

for(test in results) {
  var testing = 'https://unt.instructure.com/files/' + test + '/download';
  NewTab(testing);
}