"use strict";
((w, d, l) => {
const API_BASE = "https://api.stackexchange.com";
const API_VER = 2.3;
const delay = (ms = 100) => new Promise((resolve) => setTimeout(resolve, ms));
const getQuestionComments = async(id, {
site = "stackoverflow",
page = 1,
...rest
}) => {
const url = new URL(`${API_BASE}/${API_VER}/questions/${id}/comments`);
url.search = new URLSearchParams({
site,
page: page.toString(),
...rest,
}).toString();
const res = await fetch(url.toString());
if (!res.ok)
return [];
const {
items = [], has_more = false, backoff
} = await res.json();
if (backoff) {
await delay(backoff * 1e3);
return getQuestionComments(id, {
site,
page,
...rest
});
}
if (has_more) {
items.push(...(await getQuestionComments(id, {
site,
page: page + 1,
...rest,
})));
}
return items;
};
const getAnswerComments = async(id, {
site = "stackoverflow",
page = 1,
...rest
}) => {
const url = new URL(`${API_BASE}/${API_VER}/answers/${id}/comments`);
url.search = new URLSearchParams({
site,
page: page.toString(),
...rest,
}).toString();
const res = await fetch(url.toString());
if (!res.ok)
return [];
const {
items = [], has_more = false, backoff
} = await res.json();
if (backoff) {
await delay(backoff * 1e3);
return getAnswerComments(id, {
site,
page,
...rest
});
}
if (has_more) {
items.push(...(await getAnswerComments(id, {
site,
page: page + 1,
...rest,
})));
}
return items;
};
const getQuestions = async(id, {
site = "stackoverflow",
page = 1,
...rest
}) => {
const url = new URL(`${API_BASE}/${API_VER}/questions/${id}`);
url.search = new URLSearchParams({
site,
page: page.toString(),
...rest,
}).toString();
const res = await fetch(url.toString());
if (!res.ok)
return [];
const {
items = [], has_more = false, backoff
} = await res.json();
if (backoff) {
await delay(backoff * 1e3);
return getQuestions(id, {
site,
page,
...rest
});
}
if (has_more) {
items.push(...(await getQuestions(id, {
site,
page: page + 1,
...rest,
})));
}
return items;
};
const getQuestionAnswers = async(id, {
site = "stackoverflow",
page = 1,
...rest
}) => {
const url = new URL(`${API_BASE}/${API_VER}/questions/${id}/answers`);
url.search = new URLSearchParams({
site,
page: page.toString(),
...rest,
}).toString();
const res = await fetch(url.toString());
if (!res.ok)
return [];
const {
items = [], has_more = false, backoff
} = await res.json();
if (backoff) {
await delay(backoff * 1e3);
return getQuestionAnswers(id, {
site,
page,
...rest
});
}
if (has_more) {
items.push(...(await getQuestionAnswers(id, {
site,
page: page + 1,
...rest,
})));
}
return items;
};
class ParticipationInfo {
constructor(userId, questionComments, answerComments, answers, questions) {
this.userId = userId;
this.questionComments = questionComments;
this.answerComments = answerComments;
this.answers = answers;
this.questions = questions;
}
get myAnswers() {
const {
answers,
userId
} = this;
return answers.filter(({
owner
}) => (owner === null || owner === void 0 ? void 0 : owner.user_id) === userId);
}
get myQuestions() {
const {
questions,
userId
} = this;
return questions.filter(({
owner
}) => (owner === null || owner === void 0 ? void 0 : owner.user_id) === userId);
}
get editedAnswers() {
const {
answers,
userId
} = this;
return answers.filter(({
last_editor
}) => (last_editor === null || last_editor === void 0 ? void 0 : last_editor.user_id) === userId);
}
get editedQuestions() {
const {
questions,
userId
} = this;
return questions.filter(({
last_editor
}) => (last_editor === null || last_editor === void 0 ? void 0 : last_editor.user_id) === userId);
}
get hasAnswers() {
const {
myAnswers
} = this;
return !!myAnswers.length;
}
get hasQuestions() {
const {
myQuestions
} = this;
return !!myQuestions.length;
}
get hasEditedAnswers() {
const {
editedAnswers
} = this;
return !!editedAnswers.length;
}
get hasEditedQuestions() {
const {
editedQuestions
} = this;
return !!editedQuestions.length;
}
get hasQuestionComments() {
const {
questionComments
} = this;
return !!questionComments.length;
}
get hasAnswerComments() {
const {
answerComments
} = this;
return !!answerComments.length;
}
}
const addParticipationInfo = (info) => {
const statsRow = d.querySelector("#question-header + div");
if (!statsRow)
return;
const titleText = "Participated";
const activityMap = [
[info.hasAnswers, "A"],
[info.hasQuestions, "Q"],
[info.hasEditedAnswers, "EA"],
[info.hasEditedQuestions, "EQ"],
[info.hasAnswerComments, "AC"],
[info.hasQuestionComments, "QC"],
];
const participated = activityMap.filter(([cond]) => cond);
const infoText = participated.map(([, l]) => l).join(" ") || "no";
const item = d.createElement("div");
item.id = "participated";
item.classList.add("flex--item", "ws-nowrap", "mb8", "ml16");
item.title = `${titleText}: ${infoText}`;
const title = d.createElement("span");
title.classList.add("fc-light", "mr2");
title.textContent = titleText;
item.append(title);
title.after(` ${infoText} `);
statsRow.append(item);
};
const formatDate = (timestamp) => new Date(timestamp * 1e3).toISOString().replace("T", " ").replace(/\..+/, "Z");
const getDateDiff = (start, end) => Math.floor((end.valueOf() - start.valueOf()) / 864e5);
d.addEventListener("click", async({
target
}) => {
if (target.id !== "load") return;
try {
const { elements } = d.forms.activity;
const userId = +elements.userId.value;
const questionId = +elements.questionId.value;
const site = elements.site.value;
if (!questionId || !userId) return;
const commonOpts = {
site,
key: "UKKfmybQ9USA0N80jdnU8w(("
};
const questionComments = await getQuestionComments(questionId, {
...commonOpts,
filter: "!--OzlnfZUU0r",
});
const questions = await getQuestions(questionId, {
...commonOpts,
filter: "AYfEom_eVg0.fJ-eMNhmr",
});
const preview = d.getElementById("preview");
const missing = d.getElementById("404");
if(!questions.length) {
missing.classList.remove("hidden");
preview.classList.add("hidden");
}
const [{
creation_date,
last_activity_date,
title,
view_count
}] = questions;
const asked = d.querySelector("#asked span:nth-child(2)");
const acted = d.querySelector("#active span:nth-child(2)");
const viewed = d.querySelector("#viewed span:nth-child(2)");
const header = d.querySelector("#question-header h1");
d.getElementById("participated")?.remove();
const now = new Date();
now.setHours(0);
const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
const c_date = rtf.format(getDateDiff(now, creation_date*1e3), "day");
const a_date = rtf.format(getDateDiff(now, last_activity_date*1e3), "day");
asked.textContent = c_date;
asked.title = formatDate(creation_date);
acted.textContent = a_date;
acted.title = formatDate(last_activity_date);
const vc = `${view_count} time${view_count > 1 ? "s" : ""}`;
viewed.textContent = vc;
viewed.title = `Viewed ${vc}`;
header.textContent = title;
preview.classList.remove("hidden");
missing.classList.add("hidden");
const answers = await getQuestionAnswers(questionId, {
...commonOpts,
filter: "!ao-)ijIL.2UJgN",
});
const answerCommentsPromises = answers.map(({
answer_id
}) => {
return getAnswerComments(answer_id, {
...commonOpts,
filter: "!--OzlnfZUU0r",
});
});
const answerComments = await Promise.all(answerCommentsPromises);
const commentFilter = ({
owner,
reply_to_user
}) => [owner === null || owner === void 0 ? void 0 : owner.user_id, reply_to_user === null || reply_to_user === void 0 ? void 0 : reply_to_user.user_id].includes(userId);
const myQuestionComments = questionComments.filter(commentFilter);
const myAnswerComments = answerComments
.flat()
.filter(commentFilter);
const info = new ParticipationInfo(userId, myQuestionComments, myAnswerComments, answers, questions);
console.debug(info);
addParticipationInfo(info);
} catch (error) {
console.debug(`Activity Indicator error:\n${error}`);
}
});
})(window, document, location);
:root {
--family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Liberation Sans", sans-serif;
}
#question-header {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
}
.d-flex {
display: flex !important;
}
.ow-break-word {
overflow-wrap: break-word !important;
word-wrap: break-word !important;
}
.fw-wrap {
flex-wrap: wrap !important;
}
.ws-nowrap {
white-space: nowrap !important;
}
.mb8 {
margin-bottom: 8px !important;
}
.mb16 {
margin-bottom: 16px !important;
}
.mr2 {
margin-right: 2px !important;
}
.mr16 {
margin-right: 16px !important;
}
.ml16 {
margin-left: 16px !important;
}
.pb8 {
padding-bottom: 8px !important;
}
.fl1 {
flex: 1 auto !important;
}
.bb {
border-bottom-style: solid !important;
border-bottom-width: 1px !important;
}
body {
font-family: var(--family);
font-size: 13px;
}
h1 {
margin: 0 0 1em;
font-size: 1.75rem;
line-height: 1.35;
font-weight: normal;
margin-bottom: 0;
}
/* end of Stack Exchange styles */
#preview {
margin-top: 5vh;
}
.hidden {
display: none;
}
label, input {
display: block;
font-family: var(--family);
}
label {
margin-bottom: 0.5vh;
font-weight: 600;
}
input {
margin-bottom: 2vh;
padding: 1vh 1vw 1vh 0;
border-width: 0 0 1px 0;
}
button {
margin: 1vh 0;
padding: 1vh 1vw;
background: none;
border-radius: 1vh;
border-width: 1px;
}
button:hover {
color: grey;
border-color: grey;
}
<form id="activity">
<label>Site Hostname</label>
<input id="site" type="text" placeholder="meta.stackoverflow" value="meta.stackoverflow" />
<label>User Id</label>
<input id="userId" type="text" placeholder="2370483" value="2370483" />
<label>Question Id</label>
<input id="questionId" type="text" placeholder="411441" value="411441" />
<button id="load" type="button">Load</button>
</form>
<div id="404" class="hidden">
<p>Question with this id is not found</p>
</div>
<div id="preview" class="hidden">
<div id="question-header" class="d-flex sm:fd-column">
<h1 class="ow-break-word mb8 flex--item fl1"></h1>
</div>
<div class="d-flex fw-wrap pb8 mb16 bb">
<div id="asked" class="flex--item ws-nowrap mr16 mb8">
<span class="mr2">Asked</span>
<span></span>
</div>
<div id="active" class="flex--item ws-nowrap mr16 mb8">
<span class="mr2">Active</span>
<span></span>
</div>
<div id="viewed" class="flex--item ws-nowrap mb8" title="">
<span class="mr2">Viewed</span>
<span></span>
</div>
</div>
</div>
currentUser()
on that post. I don't know if SE itself agrees with this feature request but I like the idea, and I don't see it being an expensive call to implement. It's arguably more expensive for users to dig up their old questions and answers from 10 years ago, which we can already do from our own profile.