//Define data
function Data(name, github, fastpages) {
this.name = name;
this.git = github;
this.fastpages = fastpages;
}
Data.prototype.setRole = function(role) {
this.role = role;
}
Data.prototype.toJSON = function() {
const obj = {name: this.name, github: this.github, fastpages: this.fastpages};
const json = JSON.stringify(obj);
return json;
}
//Make new data and put in a list
var Max = new Data("Max", "https://github.com/mmaxwu/cs", "https://mmaxwu.github.io/cs/");
var Nathan = new Data("Nathan", "https://github.com/nsk1207/fastpages_nathan", "https://nsk1207.github.io/fastpages_nathan/");
var Sri = new Data("Sri", "https://github.com/SRIHITAKOTT1213/APCSP-Blog-Assignment", "https://srihitakott1213.github.io/APCSP-Blog-Assignment/")
var Alyssa = new Data("Alyssa", "https://github.com/alyssar60819/fastpages-blog", "")
allData = [Max, Nathan, Sri, Alyssa];
//Make a object to hold the data
function DataHolder(allData) {
this.allData = allData;
}
//Use object to hold data
dataHolder = new DataHolder(allData);
//HTML conversion method
DataHolder.prototype._toHtml = function() {
var style = (
"display:inline-block;" +
"border: 2px solid grey;" +
"box-shadow: 0.8em 0.4em 0.4em grey;"
);
var table = "";
table += "<tr>";
table += "<th><mark>" + "Name" + "</mark></th>";
table += "<th><mark>" + "GitHub" + "</mark></th>";
table += "<th><mark>" + "Fastpages" + "</mark></th>";
table += "</tr>";
//Go through all data and each data's properties in a table format
for (var row of allData) {
table += "<tr>";
table += "<td>" + row.name;
table += "<td>" + row.name + "'s Github: " + row.git + "</td>";
table += "<td>" + row.name + "'s Fastpages: " + row.fastpages + "</td>";
table += "<tr>"
}
//Return table
return (
"<div style='" + style + "'>" +
"<table>" +
table +
"</table>" +
"</div>"
);
};
// IJavaScript HTML processor receive parameter of defined HTML fragment
$$.html(dataHolder._toHtml());
