Badge New Auto hide
Kode zeistmaid
script ini dibuat untuk zeistmaid, tetapi bisa dipasang discript lain asal paham aja sih.Fungsi kode ini untuk menambahkan class badged (new) pada link chapter dengan cara kerja seperti :visited css.
ini menggunakan cookie untuk menyimpan riwayat visited dan kode ini bisa auto hide jika sudah melewati tanggal post, di js aku set 5 hari, artinya jika post sudah lebih dari 5 hari maka Badged new akan menghilang dengan sendirinya.
pemasangan discript/tema lain itu beda-beda caranya, jadi good luck😉
Demo:
Demo
Contoh htmlnya
<ul class="labelchpbytag">
<li><a href="#" tanggal="2024-04-06" data-id="link1">link 1</a></li>
<li><a href="#" tanggal="2024-03-30" data-id="link2">link 2</a></li>
<li><a href="#" tanggal="2024-03-28" data-id="link3">link 3</a></li>
<li><a href="#" tanggal="2024-03-25" data-id="link4">link 4</a></li>
<li><a href="#" tanggal="2024-03-20" data-id="link5">link 5</a></li>
</ul>
a.relink:before {
content: "New";
margin-right: 5px;
display: inline-block;
padding: 0;
background: #ff0000;
border-radius: 50%;
height: 8px;
width: 8px;
}
Js visited dan convert tanggal
<script>
/*<![CDATA[*/
var hideNew = 5; // 5 hari relink dihilangkan
var expNew = 5; // 5 hari exp cookie
var cookieOn = false; /*cookie bersifat mengambil riwayat link dari recent chapter.
true= on
false = off
on artinya riwayat akan load terus
off riwayat tidak diload artinya titik akan terus muncul sampai tanggal sudah lewat yang ditentukan hideNew
*/
var today = new Date();
var links = document.querySelectorAll('.labelchpbytag a');
links.forEach(function(link) {
var tanggalAttr = link.getAttribute('tanggal');
var dataId = link.getAttribute('data-id');
var isVisited = cookieOn? getCookie(dataId) : false;
if (tanggalAttr && (!isVisited || isCookieExpired(dataId))) {
var tanggal = new Date(tanggalAttr);
var diff = Math.ceil((today - tanggal) / (1000 * 60 * 60 * 24));
// Jika tautan belum dikunjungi atau cookie sudah kadaluarsa, tambahkan class 'relink'
if (diff <= hideNew) {
link.classList.add('relink');
}
}
link.addEventListener('click', function(event) {
event.preventDefault();
this.classList.remove('relink');
var expirationDate = new Date();
expirationDate.setDate(expirationDate.getDate() + expNew);
document.cookie = dataId + "=visited; expires=" + expirationDate.toUTCString() + "; path=/";
var url = this.getAttribute('href');
if (url) {
window.location.href = url;
}
});
});
function getCookie(name) {
var cookieArr = document.cookie.split(';');
for(var i = 0; i < cookieArr.length; i++) {
var cookiePair = cookieArr[i].split('=');
if(name == cookiePair[0].trim()) {
return cookiePair[1];
}
}
return null;
}
function isCookieExpired(dataId) {
var visitedDate = new Date(getCookie(dataId));
var expirationDate = new Date();
expirationDate.setDate(visitedDate.getDate() + expNew);
return expirationDate < today;
}
/*]]>*/
</script>
function buat convert tanggal jadi dd/mm/yyyy
<script>
function konversiTanggal(tanggalString) {
var tanggal = new Date(tanggalString);
var bulan = ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"];
var tanggalan = ('0' + tanggal.getDate()).slice(-2);
var namaBulan = bulan[tanggal.getMonth()];
var tahun = tanggal.getFullYear();
var hari = tanggal.toString().split(' ')[0];
var jam = ('0' + tanggal.getHours()).slice(-2);
var menit = ('0' + tanggal.getMinutes()).slice(-2);
var detik = ('0' + tanggal.getSeconds()).slice(-2);
var hasil = tahun + "-" + namaBulan + "-" + tanggalan;
return hasil;
}
/*
ambil tanggal dan convert ======
var publishedDate = entry.published.$t;
var date = new Date(publishedDate);
var dtnew =
konversiTanggal(date);
ambil id post =========
var idnumber = entry.id.$t.split('-').pop();
*/
var hasiltanggal = konversiTanggal("Thu Nov 02 2023 21:13:00 GMT+0700 (Waktu Indonesia Barat)");
console.log(hasiltanggal);
</script>
tanya admin langsung, ke group/komen aja dibawah
Group Telegram
pada link dari recent postnya harus ada data attribute id dan tanggal
<a class="linkNew" href="#" expr:tanggal='data:post.lastUpdated.iso8601' expr:data-id='data:post.id'>link 1</a>
lalu untuk js bisa gunakan yang ini,
<script>
/*<![CDATA[*/
var hideNew = 5; // 5 hari relink dihilangkan
var expNew = 5; // 5 hari exp cookie
var cookieOn = true; /*cookie bersifat mengambil riwayat link dari recent chapter.
true= on
false = off
on artinya riwayat akan load terus
off riwayat tidak diload artinya titik akan terus muncul sampai tanggal sudah lewat yang ditentukan hideNew
*/
var today = new Date();
var currentDate = today.toISOString().split('T')[0]; // Mengambil tanggal hari ini dalam format YYYY-MM-DD
var links = document.querySelectorAll('.linkNew');
links.forEach(function(link) {
var tanggalAttr = link.getAttribute('tanggal');
var dataId = link.getAttribute('data-id');
var isVisited = cookieOn ? getCookie(dataId) : false;
if (tanggalAttr && (!isVisited || isCookieExpired(dataId))) {
var tanggal = new Date(tanggalAttr);
var diff = Math.ceil((today - tanggal) / (1000 * 60 * 60 * 24));
// Jika tautan belum dikunjungi atau cookie sudah kadaluarsa, tambahkan class 'relink'
if (diff <= hideNew) {
link.classList.add('relink');
}
}
link.addEventListener('click', function(event) {
event.preventDefault();
this.classList.remove('relink');
var expirationDate = new Date();
expirationDate.setDate(expirationDate.getDate() + expNew);
document.cookie = dataId + "=visited; expires=" + expirationDate.toUTCString() + "; path=/";
var url = this.getAttribute('href');
if (url) {
window.location.href = url;
}
});
});
function getCookie(name) {
var cookieArr = document.cookie.split(';');
for(var i = 0; i < cookieArr.length; i++) {
var cookiePair = cookieArr[i].split('=');
if(name == cookiePair[0].trim()) {
return cookiePair[1];
}
}
return null;
}
function isCookieExpired(dataId) {
var visitedDate = new Date(getCookie(dataId));
var expirationDate = new Date();
expirationDate.setDate(visitedDate.getDate() + expNew);
return expirationDate < today;
}
var currentDateLinks = document.querySelectorAll('a[tanggal="' + currentDate + '"]');
currentDateLinks.forEach(function(link) {
link.classList.add('relink');
});
/*]]>*/
</script>