layout | title |
---|---|
page |
Open Science 101 |
`;
if (educational.Link && educational.Link !== "" && educational.Link.includes("youtu")) {
linksDiv += ``;
}
if (educational.Douyu && educational.Douyu !== "") {
linksDiv += ``;
}
linksDiv += `
`;
return linksDiv;
}
function renderEducationalDiv(educationals) {
const mainCategories = ["Open Access", "Open Data", "Open Code", "Reproducibility", "Research Integrity", "Research Culture"];
let educationalHTML = ``;
mainCategories.map(category => {
const relevantEducationalsForCategory = educationals.filter(educational => educational.Tags.includes(category));
if (relevantEducationalsForCategory.length > 0) {
educationalHTML += ``;
educationalHTML += "
`;
// Finally add the cards inside the appropriate div
document.getElementById("educational-contents").innerHTML = educationalHTML;
}
function renderAllEducationals() {
renderEducationalDiv({{ site.data.educational || jsonify }});
}
function renderTags() {
let tags = getUniqueTags();
// Add additional "All" tag to let user reset the list
let tagsHTML= ""
// let tagsHTML = "All";
// Add all other tags available in the educationals data file
tags.map((tag) => {
const tagColorClassName = getTagColorClassName(tag);
tagsHTML += `${tag}`;
});
document.getElementById("tags-contents").innerHTML = tagsHTML;
}
renderTags();
renderAllEducationals();
let tagButtons = document.getElementsByClassName("tag-button");
for (let index = 0; index < tagButtons.length; index++) {
tagButtons[index].addEventListener('click', (event) => {
const tagValue = event.target.outerText === "All" ? "" : event.target.outerText;
const filteredEducationals = getFilteredEducationalsByTag(tagValue);
renderEducationalDiv(filteredEducationals);
})
}
document.getElementById('search-input').addEventListener('keyup', (event) => {
const inputValue = event.target.value;
const filteredEducational = getFilteredEducationalsByContent(inputValue);
renderEducationalDiv(filteredEducational);
});
</script>
";
relevantEducationalsForCategory.map((educational) => {
const titleDiv = ``;
const descriptionDiv = `
";
}
});
educationalHTML += `${educational.Description}
`;
const linksDiv = buildLinkDiv(educational);
educationalHTML += `
${titleDiv}
${descriptionDiv}
${linksDiv}
`;
});
educationalHTML += "