Guest User

HHTv2

a guest
Dec 24th, 2024
1,204
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /// holhashtags.js
  2. (function() {
  3.     const HHT_POPUP_EFTER = 1000;
  4.     let hht_popup_timer = null;
  5.     let hht_popup_hash = null;
  6.     let hht_popup_indlaeg = null;
  7.     let hht_touch = false;
  8.     let hht_traad = [];
  9.     const hht_find_hash = (find) => {
  10.         if (find === '#0') return hht_traad[0];
  11.         for (let t of hht_traad) if (t.hash === find) return t;
  12.         return null;
  13.     };
  14.     const hht_fjern_referencer = (node) => {
  15.         let links = [];
  16.         for (let n of node.childNodes)
  17.         {
  18.             if (n.nodeType === 1)
  19.             {
  20.                 if ((n.tagName === 'A') && (n.getAttribute('hht_ref') === '1')) links.push(n);
  21.                 else hht_fjern_referencer(n);
  22.             }
  23.         }
  24.         for (let l of links) l.parentElement.replaceChild(document.createTextNode(l.innerText), l);
  25.     };
  26.     const hht_gaa_til_hash = (hash) => {
  27.         let h = hash || location.hash;
  28.         if (h === '#top') window.scrollTo(0, 0);
  29.         else if (h === '#bund') window.scrollTo(0, document.body.scrollHeight);
  30.         else if ((h === '#seneste') && (hht_traad.length > 0)) hht_traad[hht_traad.length - 1].ydre.scrollIntoView();
  31.         else {
  32.             let t = hht_find_hash(h);
  33.             if (t) t.ydre.scrollIntoView();
  34.         }
  35.     };
  36.     const hht_indlaes = () => {
  37.         let start = (new Date()).getTime();
  38.         let cts = document.getElementsByClassName('custom-thread');
  39.         for (let ct of cts)
  40.         {
  41.             let ms = ct.getElementsByClassName('main-svar');
  42.             if (ms.length === 1)
  43.             {
  44.                 ms = ms[0];
  45.                 let tx = ms.getElementsByClassName('svar-text');
  46.                 if (tx.length === 1)
  47.                 {
  48.                     hht_traad.push({ydre:ms, hash:'#0', tekst:tx[0], ref:null, refs:'' });
  49.                     let ss = ct.getElementsByClassName('svar-super-container');
  50.                     for (let s of ss)
  51.                     {
  52.                         let h = s.getElementsByClassName('svar-postcount-styling');
  53.                         tx = s.getElementsByClassName('svar-text');
  54.                         if ((h.length === 1) && (tx.length === 1))
  55.                         {
  56.                             hht_traad.push({ydre:s, hash:h[0].innerText.trim(), tekst:tx[0], ref:null, refs:''});
  57.                         } else console.error('HHT ugyldigt svar indhold');
  58.                     }
  59.                 } else console.error('HHT ugyldig main svar text');
  60.                 break;
  61.             }
  62.         }
  63.         if (hht_traad.length > 0)
  64.         {
  65.             hht_indsaet_html();
  66.             let idx = 0;
  67.             for (let t of hht_traad)
  68.             {
  69.                 hht_lav_referencer(t.tekst, t, idx++);
  70.             }
  71.             console.log('HHT tråd længde: ' + hht_traad.length + ', indlæst på ' + ((new Date()).getTime() - start) + 'ms');
  72.             hht_gaa_til_hash();
  73.             window.addEventListener('hashchange', () => { hht_gaa_til_hash((new URL(event.newURL)).hash) });
  74.         }
  75.         else console.log('HHT ingen tråd fundet');
  76.     };
  77.     const hht_indsaet_html = () => {
  78.         let bg = getComputedStyle(document.body).getPropertyValue('background-color');
  79.         let fg = getComputedStyle(document.getElementsByClassName('main-svar-title')[0]).getPropertyValue('color');
  80.         let fs = getComputedStyle(hht_traad[hht_traad.length > 1 ? 1 : 0].tekst).getPropertyValue('font-size');
  81.         let m = hht_moerkt_tema(bg);
  82.         let bdy = m ? '0,0,0,.1' : '255,255,255,.8';
  83.         let hdr = m ? '0,0,0,.4' : '255,255,255,.4';
  84.         let ref = m ? '255,255,255,.5' : '0,0,0,.5';
  85.         let bdr = m ? '255,255,255,.25' : '0,0,0,.25';
  86.         let e = document.createElement('style');
  87.         e.setAttribute('type', 'text/css');
  88.         e.innerText =   'div.hht_refs { font-size:smaller; margin-top:.5em; padding-top:.5em; border-top:.1em solid '+bg+'; }\n' +
  89.                         'span.hht_hdr { color:rgba('+ref+'); font-weight:bold; margin-right:.5em; }\n' +
  90.                         'a.hht_lnk {  }\n' +
  91.                         'a.hht_ref { margin-right:.25em; }\n' +
  92.                         '#hht_pop_links { position:absolute; margin:0px; background-color:'+bg+'; display:none; border:.1em solid rgba('+bdr+'); padding:.5em 1em; border-radius:5px; z-index:10000; }\n' +
  93.                         '#hht_indlaeg { font-size:'+fs+'; background-color:'+bg+'; border:.1em solid rgba('+bdr+'); color:'+fg+'; border-radius:5px; display:none; position:absolute; z-index:10000; animation-duration:.25s; }\n' +
  94.                         '#hht_indlaeg_top { background-color:rgba('+hdr+'); padding:5px; border-radius:5px 5px 0px 0px; }\n' +
  95.                         '#hht_indlaeg_af { margin-right: .25em; }\n' +
  96.                         '#hht_indlaeg_rang { margin-right: .25em; }\n' +
  97.                         '#hht_indlaeg_navn { margin-right: 1em; }\n' +
  98.                         '#hht_indlaeg_tid { float:right; }\n' +
  99.                         '#hht_indlaeg_bund { background-color:rgba('+bdy+'); clear:both; left:0px; max-height:25vh; overflow-y:scroll; padding:5px; border-radius:0px 0px 5px 5px; margin:0px; white-space:pre-wrap; }\n' +
  100.                         '@keyframes anim_vis { from:{ opacity:0 } to { opacity:1 } }\n@keyframes anim_gem { from:{ opacity:1 } to { opacity:0 } }\n' +
  101.                         '@media screen and (max-width: 600px) { #hht_indlaeg_rang { display:none; } }';
  102.         document.head.appendChild(e);
  103.         e = document.createElement('div');
  104.         e.id = 'hht_pop_links';
  105.         let a = document.createElement('a');
  106.         a.href = 'javascript:void(0)';
  107.         a.innerText = 'Vis';
  108.         a.style.marginRight = '.5em';
  109.         a.addEventListener('click', hht_vis_indlaeg);
  110.         e.appendChild(a);
  111.         a = document.createElement('a');
  112.         a.addEventListener('click', ()=>{ hht_skjul_popup(true); hht_klik_hash(); });
  113.         e.appendChild(a);
  114.         e.addEventListener('mouseleave', hht_skjul_popup);
  115.         document.body.appendChild(e);
  116.         hht_popup_indlaeg = { ydre:null, top:null, rang:null, navn:null, tid:null, bund:null };
  117.         hht_popup_indlaeg.ydre = document.createElement('div');
  118.         hht_popup_indlaeg.ydre.id = 'hht_indlaeg';
  119.         hht_popup_indlaeg.ydre.addEventListener('animationend', () => {
  120.             if (hht_popup_indlaeg.ydre.style.animationName === 'anim_gem') hht_popup_indlaeg.ydre.style.display = 'none';
  121.             else hht_popup_indlaeg.ydre.style.opacity = '1';
  122.             hht_popup_indlaeg.ydre.style.animationName = '';
  123.         });
  124.         hht_popup_indlaeg.top = document.createElement('div');
  125.         hht_popup_indlaeg.top.id = 'hht_indlaeg_top';
  126.         hht_popup_indlaeg.ydre.appendChild(hht_popup_indlaeg.top);
  127.         e = document.createElement('span');
  128.         e.appendChild(document.createTextNode('Af'));
  129.         e.id = 'hht_indlaeg_af';
  130.         hht_popup_indlaeg.top.appendChild(e);
  131.         hht_popup_indlaeg.rang = document.createElement('span');
  132.         hht_popup_indlaeg.rang.id = 'hht_indlaeg_rang';
  133.         hht_popup_indlaeg.top.appendChild(hht_popup_indlaeg.rang);
  134.         hht_popup_indlaeg.navn = document.createElement('span');
  135.         hht_popup_indlaeg.navn.id = 'hht_indlaeg_navn';
  136.         hht_popup_indlaeg.top.appendChild(hht_popup_indlaeg.navn);
  137.         hht_popup_indlaeg.tid = document.createElement('span');
  138.         hht_popup_indlaeg.tid.id = 'hht_indlaeg_tid';
  139.         hht_popup_indlaeg.top.appendChild(hht_popup_indlaeg.tid);
  140.         hht_popup_indlaeg.bund = document.createElement('div');
  141.         hht_popup_indlaeg.bund.id = 'hht_indlaeg_bund';
  142.         hht_popup_indlaeg.ydre.appendChild(hht_popup_indlaeg.bund);
  143.         document.body.appendChild(hht_popup_indlaeg.ydre);
  144.         document.body.addEventListener('mousedown', hht_skjul_indlaeg);
  145.         document.body.addEventListener('touchstart', hht_skjul_indlaeg);
  146.         window.addEventListener('resize', hht_skjul_indlaeg);
  147.     };
  148.     const hht_klik_hash = () => {
  149.         if (hht_touch)
  150.         {
  151.             hht_touch = false;
  152.             hht_vis_popup();
  153.         }
  154.         else hht_gaa_til_hash(event.target.innerText);
  155.     };
  156.     const hht_lav_ref_link = (baseurl, hash) => {
  157.         const start = () => { if (hht_touch) return; stop(); hht_popup_hash = event.target; hht_popup_timer = setTimeout(hht_vis_indlaeg, HHT_POPUP_EFTER); };
  158.         const stop = () => { if (hht_popup_timer) clearTimeout(hht_popup_timer); hht_popup_timer = null; };
  159.         l = document.createElement('a');
  160.         l.appendChild(document.createTextNode(hash));
  161.         l.href = baseurl + hash;
  162.         l.setAttribute('hht_ref', '1');
  163.         l.addEventListener('click', hht_klik_hash);
  164.         l.addEventListener('mouseover', start);
  165.         l.addEventListener('mouseout', stop);
  166.         l.addEventListener('touchstart', () => { hht_touch = true; hht_popup_hash = event.currentTarget; });
  167.         return l;
  168.     };
  169.     const hht_lav_referencer = (node, svar, index) => {
  170.         let baseurl = location.href;
  171.         if (location.hash && (location.hash.length > 0)) baseurl = baseurl.substr(0, baseurl.length - location.hash.length);
  172.         for (let n of node.childNodes)
  173.         {
  174.             if (n.nodeType === 3)
  175.             {
  176.                 const re = /\#[0-9]+/g
  177.                 let m, h, ref, ne;
  178.                 while (n && (m = re.exec(n.nodeValue)))
  179.                 {
  180.                     h = m[0];
  181.                     ref = hht_find_hash(h);
  182.                     if (ref == null) continue;
  183.                     if (ref.refs.indexOf(h + ',') < 0)
  184.                     {
  185.                         ref.refs += h + ',';
  186.                         if (ref.ref == null)
  187.                         {
  188.                             ref.ref = document.createElement('div');
  189.                             ref.ref.className = 'hht_refs';
  190.                             ne = document.createElement('span');
  191.                             ne.className = 'hht_hdr';
  192.                             ne.innerText = 'Refereret:';
  193.                             ref.ref.appendChild(ne);
  194.                             ref.tekst.parentElement.appendChild(ref.ref);
  195.                         }
  196.                         else ref.ref.appendChild(document.createTextNode(' '));
  197.                         ref.ref.appendChild(hht_lav_ref_link(baseurl, svar.hash));
  198.                     }
  199.                     if (m.index > 0) n.parentElement.insertBefore(document.createTextNode(n.nodeValue.substring(0, m.index)), n);
  200.                     n.parentElement.insertBefore(hht_lav_ref_link(baseurl, h), n);
  201.                     if (re.lastIndex >= n.nodeValue.length)
  202.                     {
  203.                         n.parentElement.removeChild(n);
  204.                         n = null;
  205.                     }
  206.                     else n.nodeValue = n.nodeValue.substring(re.lastIndex, n.nodeValue.length);
  207.                 }
  208.             }
  209.             else if ((n.nodeType === 1) && (n.tagName != 'A')) hht_lav_referencer(n, svar, index);
  210.         }
  211.     };
  212.     const hht_moerkt_tema = (rgb) => {
  213.         let cval;
  214.         if (rgb.indexOf('rgb') >= 0)
  215.         {
  216.             cval = rgb.match(/\d+/g); //rgb.match(/\s*\d+(,|\s)*\d+(,|\s)*\d+(,|\s)*/g);
  217.             for (let i = 0; i < cval.length; i++) cval[i] = parseInt(cval[i]);
  218.             while (cval.length < 3) cval.push(0);
  219.         }
  220.         else if (rgb.indexOf('#') == 0)
  221.         {
  222.             let c = rgb.substr(1);
  223.             while (c.length < 6) c = '0' + c;
  224.             cval = [];
  225.             cval.push(parseInt('0x' + c.substr(0, 2)));
  226.             cval.push(parseInt('0x' + c.substr(2, 2)));
  227.             cval.push(parseInt('0x' + c.substr(4, 2)));
  228.         }
  229.         else return false;
  230.         let r = Math.pow(cval[0] / 255.0, 2.218);
  231.         let g = Math.pow(cval[1] / 255.0, 2.218);
  232.         let b = Math.pow(cval[2] / 255.0, 2.218);
  233.         let l = Math.pow((r * 0.2126) + (g * 0.7156) + (b * 0.0722), 0.68) * 100;
  234.         return l < 40;
  235.     };
  236.     const hht_skjul_indlaeg = () => {
  237.         let et = event.target;
  238.         while (et && et.tagName && (et.tagName.toLowerCase() != 'a'))
  239.         {
  240.             if (et.id === hht_popup_indlaeg.ydre.id) return;
  241.             et = et.parentElement;
  242.         }
  243.         hht_popup_indlaeg.ydre.style.animationName = 'anim_gem';
  244.     };
  245.     const hht_skjul_popup = (tving) => {
  246.         let pl = document.getElementById('hht_pop_links');
  247.         if (tving || (event.target === pl))
  248.         {
  249.             pl.children[0].blur();
  250.             pl.children[1].blur();
  251.             pl.style.display = 'none';
  252.         }
  253.     };
  254.     const hht_vis_indlaeg = () => {
  255.         hht_skjul_popup(true);
  256.         let h = hht_popup_hash.innerText;
  257.         let t = hht_find_hash(h);
  258.         if (t == null) console.log('HHT ukendt indlæg: ' + h);
  259.         let svar = { rang:'', navn:'', tid:'' };
  260.         if (h === '#0')
  261.         {
  262.             let e = t.ydre.getElementsByClassName('main-svar-info-bar');
  263.             if (e && (e.length > 0)) svar.tid = e[0].children[0].innerText;
  264.             e = t.ydre.getElementsByClassName('main-svar-sub-content');
  265.             if (e && (e.length > 0))
  266.             {
  267.                 svar.navn = e[0].children[0].innerText;
  268.                 svar.rang = e[0].innerText;
  269.                 let p = svar.rang.search(svar.navn) + svar.navn.length;
  270.                 svar.rang = svar.rang.substring(p, svar.rang.length).trim();
  271.             }
  272.         }
  273.         else
  274.         {
  275.             let e = t.ydre.getElementsByClassName('svar-username');
  276.             if (e && (e.length > 0)) svar.navn = e[0].children[0].innerText;
  277.             e = t.ydre.getElementsByClassName('svar-dato');
  278.             if (e && (e.length > 0)) svar.tid = e[0].children[0].innerText;
  279.             e = t.ydre.getElementsByClassName('svar-rank');
  280.             if (e && (e.length > 0)) svar.rang = e[0].innerText;
  281.         }
  282.         if (svar.navn.length > 0)
  283.         {
  284.             hht_popup_indlaeg.ydre.style.opacity = '0';
  285.             hht_popup_indlaeg.ydre.style.display = 'inline-block';
  286.             hht_popup_indlaeg.rang.innerText = svar.rang;
  287.             hht_popup_indlaeg.navn.innerText = svar.navn;
  288.             hht_popup_indlaeg.tid.innerText = svar.tid;
  289.             hht_popup_indlaeg.bund.innerHTML = t.tekst.innerHTML;
  290.             hht_fjern_referencer(hht_popup_indlaeg.bund);
  291.             hht_popup_indlaeg.bund.scrollTo(0,0);
  292.             let rb = document.body.getBoundingClientRect();
  293.             let rd = hht_traad[0].ydre.getBoundingClientRect();
  294.             let r = hht_popup_hash.getBoundingClientRect();
  295.             let offs = hht_popup_hash.parentElement.className === 'hht_refs' ? -r.height : hht_popup_indlaeg.ydre.offsetHeight;
  296.             let w = rd.width * 0.9;
  297.             hht_popup_indlaeg.ydre.style.width = w + 'px';
  298.             hht_popup_indlaeg.ydre.style.left = (rd.left - rb.left + ((rd.width - w) * 0.5)) + 'px';
  299.             hht_popup_indlaeg.ydre.style.top = (r.top - rb.top - offs) + 'px';
  300.             hht_popup_indlaeg.ydre.style.animationName = 'anim_vis';
  301.         }
  302.     };
  303.     const hht_vis_popup = () => {
  304.         hht_popup_timer = null;
  305.         let rb = document.body.getBoundingClientRect();
  306.         let re = hht_popup_hash.getBoundingClientRect();
  307.         let pl = document.getElementById('hht_pop_links');
  308.         pl.style.top = '-100px';
  309.         pl.style.display = 'inline-block';
  310.         pl.style.fontSize = getComputedStyle(hht_popup_hash).getPropertyValue('font-size');
  311.         let pa = pl.children[1];
  312.         pa.href = hht_popup_hash.href;
  313.         pa.innerText = hht_popup_hash.innerText;
  314.         let pls = getComputedStyle(pl);
  315.         pl.style.left = (re.left - rb.left - pa.offsetLeft - parseFloat(pls.getPropertyValue('border-left-width'))) + 'px';
  316.         pl.style.top = (re.top - rb.top - pa.offsetTop - parseFloat(pls.getPropertyValue('border-top-width'))) + 'px';
  317.     };
  318.     if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', hht_indlaes);
  319.     else hht_indlaes();
  320. })();
  321.  
Advertisement
Add Comment
Please, Sign In to add comment