LNReader
Toggle option to disable chapter titles everywhere in the app
Describe your suggested feature
A toggle option in the settings to hide chapter titles in the app.
Here
;
Here:
Here:
Here:
Download Queue:
Here:
Here:
[Facultative] I suggest to add in this last image to add a check box to show chapter titles there just in case users want to take a quick peek at titles without unhiding every single titles in the app so this should apply only on this section like this:
and on the download progress notification:
Why
Titles are spoiler; some like them there, but not everybody for sure.
If one accidentally reads the title of the 400th unread chapter (or more) ahead the current progress (while scrolling the chapter list or download list) by mistake there is the chance that title is a really hard spoiler that can ruin the reading experience like "Bob's death" or "Bob's marriage" etc.. Titles are a kind of summary of the chapter and can really ruin the surprise factor, aka spoilers.
Other details
I noticed that some sources (like FastNovel) don't even have chapters numbered in the chapter list with just the titles so i assume the app itself doesn't number them in the chapter list but it is done by the source. So maybe it would be better if the numbering of chapters is managed by the app.
Acknowledgements
- [X] I have searched the existing issues and this is a new ticket, NOT a duplicate or related to another open or closed issue.
- [X] I have written a short but informative title.
- [X] If this is an issue with a source, I should be opening an issue in the sources repository.
- [X] I have updated the app to version 1.1.14.
- [X] I will fill out all of the requested information in this form.
Regarding the chapter titles inside the chapter itself I made a working script that can hide it.
/////★★★↓↓ Chapter-titles-hider
spoooiler = document.querySelector(".next-button");
if(spoooiler) {spoooiler.innerText = "———Next Chapter———"}
const rHsl=(r,g,b)=>{r*=0.00392,g*=0.00392,b*=0.00392;let h,s,M=Math.max(r,g,b),m=Math.min(r,g,b),l=M+m,d=M-m;return 0===d?h=s=0:(s=l<1?d/l:d/(2-l),M===r?h=(g-b)/d+(g<b?6:0):M===g?h=(b-r)/d+2:M===b&&(h=(r-g)/d+4)),[60*h,100*s,50*l]}
let [r,g,b]= document.body.computedStyleMap().get("background-color").toString().match(/[\d\.]+/g);
let [hh,ss,ll]= rHsl(r,g,b);
chapter = document.querySelector('#LNReader-chapter');
chapter.innerHTML = chapter.innerHTML
//preparatory
.replace(/(<h[1-8]) [^>]+>/g, '$1>')
.replace(/ /g, ' ')//
.replace(/<title>[^<]*<\/title>/, '')//epubs
.replace(/^(?:(?=<)[^\?\.,A-Z”“]*?<\/?div\b[^>]*>\s*)+/, '')
.replace(/(<\/?(?:p|h[1-9]|div|span(?!>\s+<i>))>)\s+/g, '$1')//
.replace(/\s+(?=<\/?(?:p|h[1-9]|div|(?<=<\/)span)>)/g, '')//
.replace(/<p><\/p>/g, '')//
.replace(/^[\s\n]*|$/g, '<p></p>')//
.replace(/<\/h([1-4])><\/?h\1>/ , ' ')
.replace(/^((?:<p><\/p>|<(?!(?:p|h[1-4])>)[^>]*>)?[^<]*(?:<input[^>]+>)?(?:\s*<[^>]+>\s*<\/[^>]+>)*)/, '$1π√')//keep $1
.replace(/π√<(h[1-4]|p)>(?:<(?:span|strong|b)>)?(([^C]?Chapter\W+)?(\d{1,4}\b(?:\.\d)?)(\W+(?=\w))?(.+?))(<\/\1>)((?=(.*?<p>))\9((?:\3|\4|\5|\6)(?:\4(?<=\3\4))?\5?\6?\.?)<\/p>)?/i, (_0,_1,_2,_3,_4,_5,_6,_7,_8,_9,_10) => {
const gu2 = _2.replace(/<\/\w+>/g, '');
if(_8 === undefined)
return `⸙<${_1}>~~<spo>${gu2}</spo>${_7}⸙`;
else
return `⸙<${_1}>~~<spo>${gu2}${_7}${_9}~~<spo>${_10}⸙`})
.replace(/⸙([^⸙]+)⸙/, (_, a) => `${a.replace(/<(h[1-4]|p)>([^]+?)<\/\1>/, '<h1>$2</h1>')}`)
.replace(/π√<(p|h[1-5])>([^]+?)<\/\1>/, (_, a,b)=> {
const bas = b.replace(/(?:<\/?[a-z]+>|\.$)/g, '')
let dare = reader.chapter.name.includes(bas);
if(dare) return `<h1>~~<spo>${reader.chapter.name}<\/spo></h1>`;
else return _})
.replace(/~~<spo>/g, S => `<spo style="background: hsl(${hh}, ${ss}%, ${ll>3?ll-2:ll<1?ll+5:ll>2?ll+1:ll>1?ll+2:ll+3}%)\" onclick=\"event.preventDefault(); event.stopPropagation()">`)
.replace(/π√/, '')
;
its CSS:
spo {
color: transparent !important;
border-radius: 0.19vh;
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
user-select: none;
}
spo:active {
color: inherit !important;
user-select: none;
}
spo:not(:active), spo:not(:active) * {
transition-duration: 500ms;
color: transparent !important;
}
This could be a sub-option (checkbox) that the user can choose to activate. Of course it is not perfect but doesn't target wrong text; at most it will not censor the chapter title. I might come back to edit the code if I can improve it.
A dedicated segment in the settings (maybe Reader) to manage these options would be cool. There is also this #854 that would fit very well in the settings and overall spoiler-cover feature.
Wuxiaworld and Ranobes also allow to hide titles.
It is known spoilerous titles are annoying to users