Skip to content

Instantly share code, notes, and snippets.

@youhosi youhosi/news item Secret
Created Nov 23, 2019

Embed
What would you like to do?
$(window).on("action:ajaxify.end", () => {
"use strict";
if (ajaxify.data.template.name !== "categories") return;
const API =
"https://cors.io/?https://api.steampowered.com/ISteamNews/GetNewsForApp/v0002/?appid=393420&count=3&maxlength=300";
const fragmentSteam = document.createDocumentFragment();
const content = document.querySelector("#content");
const row = content.querySelector(".row");
const categories = row.querySelector(".col-lg-9");
const col12 = document.createElement("div");
const ul = document.createElement("ul");
col12.className = "col-sm-12 updates";
ul.className = "clearfix";
const createCard = (background, title, author, date, url, contents) => {
const cardEl = document.createElement("li");
const imgEl = document.createElement("div");
const linkEl = document.createElement("a");
const titleEl = document.createElement("h2");
const metaEl = document.createElement("span");
const contentEl = document.createElement("span");
linkEl.setAttribute("href", url);
imgEl.className = "bg";
imgEl.style.background = `url(${background})`;
metaEl.classList = "meta";
contentEl.classList = "content";
titleEl.textContent = title;
metaEl.textContent = `${author} - ${date}`;
contentEl.textContent = contents;
linkEl.append(titleEl, metaEl, contentEl);
cardEl.append(imgEl, linkEl);
return cardEl;
};
fetch(API)
.then((response) => response.json())
.then(({ appnews: { newsitems } }) => {
newsitems.forEach(({ title, author, date, url, contents } = {}) => {
const background = contents
.split(" ")
.slice(0, 1)
.join(" ");
const trimContent = contents
.split(" ")
.slice(1)
.join(" ");
const formattedDate = new Date(date * 1000)
.toISOString()
.slice(0, 16)
.replace("T", " ");
ul.appendChild(createCard(background, title, author, formattedDate, url, trimContent));
});
});
col12.appendChild(ul);
fragmentSteam.appendChild(col12);
row.insertBefore(fragmentSteam, categories);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.