const div = document.createElement("div");
div.innerHTML = `<div style="position:fixed;top:20px;right:20px;width:40px;background:#ff05;">
<input type="range" orient="vertical" id="interval" min="0" max="95" value="30" style="width:100%">
<label for="interval" style="display:block"></label>
</div>`;
const input = div.firstElementChild.firstElementChild;
const label = input.nextElementSibling;
document.body.appendChild(div);
const formatTime = (mins) => {
if (mins > 60) {
return `${Math.floor(mins / 60)}h ${mins % 60}m`;
}
return `${mins}m`;
};
const extrapolate = (val) => {
val = val * 2;
for (let t = 30; t <= 150; t += 30) {
val += Math.max(0, val - t);
}
return val;
};
input.oninput = () => colorStuff(extrapolate(input.value));
const colorStuff = (interval_minutes) => {
label.innerText = `${formatTime(interval_minutes)}`;
const comments = Array.from(document.getElementsByClassName("athing comtr"));
dates = Array.from(document.getElementsByClassName('age'));
dates.sort((c1, c2) => Date.parse((c2).title) - Date.parse((c1).title));
const now = new Date();
const timestamp = now.getTime() + now.getTimezoneOffset() * 60E3;
comments.forEach((c) => {
const commentDateString = c.getElementsByClassName("age")[0].title;
const diff=(timestamp-Date.parse(c.getElementsByClassName('age')[0].title))/60E3;
const diff2=(Date.parse(dates[0].title)-Date.parse(c.getElementsByClassName('age')[0].title))/60E3;
if (diff < interval_minutes) {
const alpha = (1 - diff2 / interval_minutes)**6;
c.style.backgroundColor = `rgba(100, 255, 100, ${alpha})`;
} else {
c.style.backgroundColor = "rgba(255, 255, 255,0)";
}
});
};
colorStuff(extrapolate(input.value));
"possibly near to commercialization"->"they have something flying"
Many others should be mentioned, i.e. https://www.kitemill.com/