MediaWiki:Common.js: Difference between revisions

Add Admin Control Panel JS module — live article table with sort, filter, word count, categories, watchers, revisions
No edit summary
Line 257: Line 257:
})();
})();


 
/* ================================================ */
/* ============================================ */
/* ADMIN CONTROL PANEL — AlphaX Wiki               */
/* ADMIN CONTROL PANEL — AlphaX Wiki           */
/* ================================================ */
/* Runs only on AlphaX:Admin_Control_Panel page */
/* ============================================ */
(function() {
(function() {
   if (mw.config.get('wgPageName') !== 'AlphaX:Admin_Control_Panel') return;
   if (mw.config.get('wgPageName') !== 'AlphaX:Admin_Control_Panel') return;
Line 267: Line 265:
   mw.loader.using(['mediawiki.api'], function() {
   mw.loader.using(['mediawiki.api'], function() {


    // Inject styles
     var css = [
     var css = `
       '#axcp-root *{box-sizing:border-box}',
       #axcp-root * { box-sizing: border-box; }
       '#axcp-root{font-family:system-ui,-apple-system,sans-serif;background:#0D0D0D;color:#fff;margin:-8px -20px;padding:0;border-radius:12px;overflow:hidden}',
       #axcp-root { font-family: system-ui,-apple-system,sans-serif; background: #0D0D0D; color: #fff; margin: -8px -20px; padding: 0; border-radius: 12px; overflow: hidden; }
       '.axcp-hdr{background:#1A1A1A;border-bottom:1px solid #2E2E2E;padding:24px 28px 20px}',
       .axcp-header { background: #1A1A1A; border-bottom: 1px solid #2E2E2E; padding: 24px 28px 20px; }
       '.axcp-ttl{font-size:22px;font-weight:700;color:#fff;margin-bottom:3px}',
       .axcp-title { font-size: 22px; font-weight: 700; color: #fff; margin-bottom: 3px; }
       '.axcp-sub{font-size:11px;color:#555;text-transform:uppercase;letter-spacing:.1em}',
       .axcp-subtitle { font-size: 11px; color: #555; text-transform: uppercase; letter-spacing: .1em; }
       '.axcp-sr{display:flex;gap:12px;margin:16px 0 0;flex-wrap:wrap}',
       .axcp-stats-row { display: flex; gap: 12px; margin: 18px 0 0; flex-wrap: wrap; }
       '.axcp-sc{background:#0D0D0D;border:1px solid #2E2E2E;border-radius:12px;padding:14px 18px;flex:1;min-width:90px}',
       .axcp-stat { background: #0D0D0D; border: 1px solid #2E2E2E; border-radius: 12px; padding: 14px 20px; flex: 1; min-width: 100px; }
       '.axcp-sv{font-size:24px;font-weight:700;color:#FF6600;line-height:1}',
       .axcp-stat-val { font-size: 26px; font-weight: 700; color: #FF6600; line-height: 1; }
       '.axcp-sl{font-size:10px;color:#555;text-transform:uppercase;letter-spacing:.08em;margin-top:4px}',
       .axcp-stat-label { font-size: 10px; color: #555; text-transform: uppercase; letter-spacing: .08em; margin-top: 4px; }
       '.axcp-ctrl{display:flex;gap:10px;padding:12px 28px;background:#111;border-bottom:1px solid #2E2E2E;flex-wrap:wrap;align-items:center}',
       .axcp-controls { display: flex; gap: 10px; padding: 14px 28px; background: #111; border-bottom: 1px solid #2E2E2E; flex-wrap: wrap; align-items: center; }
       '.axcp-inp{flex:1;min-width:160px;background:#1A1A1A;border:1px solid #2E2E2E;border-radius:8px;padding:8px 13px;color:#fff;font-size:13px;outline:none}',
       .axcp-search { flex: 1; min-width: 180px; background: #1A1A1A; border: 1px solid #2E2E2E; border-radius: 8px; padding: 9px 14px; color: #fff; font-size: 13px; outline: none; }
       '.axcp-inp:focus{border-color:rgba(255,102,0,.5)}',
       .axcp-search::placeholder { color: #444; }
       '.axcp-sel{background:#1A1A1A;border:1px solid #2E2E2E;border-radius:8px;padding:8px 11px;color:#fff;font-size:12px;outline:none;cursor:pointer;max-width:200px}',
      .axcp-search:focus { border-color: rgba(255,102,0,.5); }
       '.axcp-sel:focus{border-color:rgba(255,102,0,.5)}',
       .axcp-select { background: #1A1A1A; border: 1px solid #2E2E2E; border-radius: 8px; padding: 9px 12px; color: #fff; font-size: 12px; outline: none; cursor: pointer; max-width: 200px; }
       '.axcp-cnt{background:rgba(255,102,0,.12);border:1px solid rgba(255,102,0,.3);color:#FF6600;border-radius:6px;padding:4px 12px;font-size:12px;font-weight:600;white-space:nowrap}',
       .axcp-select:focus { border-color: rgba(255,102,0,.5); }
       '.axcp-rbtn{background:linear-gradient(135deg,#FF6600,#FF8533);border:none;border-radius:8px;color:#fff;padding:9px 16px;font-size:12px;font-weight:700;cursor:pointer}',
       .axcp-count { background: rgba(255,102,0,.12); border: 1px solid rgba(255,102,0,.3); color: #FF6600; border-radius: 6px; padding: 4px 12px; font-size: 12px; font-weight: 600; white-space: nowrap; }
      '.axcp-rbtn:hover{opacity:.85}',
       .axcp-refresh-btn { background: linear-gradient(135deg,#FF6600,#FF8533); border: none; border-radius: 8px; color: #fff; padding: 9px 18px; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; letter-spacing: .03em; }
       '.axcp-tw{overflow-x:auto;padding:0 28px 32px;background:#0D0D0D}',
      .axcp-refresh-btn:hover { opacity: .85; }
       'table.axcp-t{width:100%;border-collapse:collapse;margin-top:14px;font-size:13px}',
       .axcp-table-wrap { overflow-x: auto; padding: 0 28px 32px; background: #0D0D0D; }
       'table.axcp-t thead th{background:#111;color:#555;text-transform:uppercase;letter-spacing:.07em;font-size:10px;font-weight:600;padding:10px 12px;border-bottom:1px solid #2E2E2E;cursor:pointer;white-space:nowrap;user-select:none}',
       table.axcp-tbl { width: 100%; border-collapse: collapse; margin-top: 14px; font-size: 13px; }
       'table.axcp-t thead th:hover{color:#FF6600}',
       table.axcp-tbl thead th { background: #111; color: #555; text-transform: uppercase; letter-spacing: .08em; font-size: 10px; font-weight: 600; padding: 10px 12px; border-bottom: 1px solid #2E2E2E; cursor: pointer; white-space: nowrap; user-select: none; position: sticky; top: 0; z-index: 2; }
       'table.axcp-t thead th.sa::after{content:" ↑";color:#FF6600}',
       table.axcp-tbl thead th:hover { color: #FF6600; }
       'table.axcp-t thead th.sd::after{content:" ↓";color:#FF6600}',
       table.axcp-tbl thead th.s-asc::after { content: " ↑"; color: #FF6600; }
       'table.axcp-t td{padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.03);vertical-align:middle}',
       table.axcp-tbl thead th.s-desc::after { content: " ↓"; color: #FF6600; }
       'table.axcp-t tr:hover td{background:rgba(255,102,0,.04)}',
       table.axcp-tbl td { padding: 8px 12px; border-bottom: 1px solid rgba(255,255,255,.03); vertical-align: middle; }
       'table.axcp-t tr:last-child td{border-bottom:none}',
       table.axcp-tbl tr:hover td { background: rgba(255,102,0,.04); }
       '.axcp-al{color:#fff;text-decoration:none;font-weight:500;font-size:13px}',
       table.axcp-tbl tr:last-child td { border-bottom: none; }
       '.axcp-al:hover{color:#FF6600}',
       .axcp-art-link { color: #fff; text-decoration: none; font-weight: 500; font-size: 13px; }
       '.axcp-cp{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap}',
       .axcp-art-link:hover { color: #FF6600; }
       '.axcp-st{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:600}',
       .axcp-cat-pill { display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 11px; font-weight: 600; white-space: nowrap; }
       '.s-stu{background:rgba(255,60,60,.15);color:#ff7070;border:1px solid rgba(255,60,60,.25)}',
       .axcp-status { display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 11px; font-weight: 600; }
       '.s-sho{background:rgba(255,166,0,.15);color:#ffb020;border:1px solid rgba(255,166,0,.25)}',
       .st-stub { background: rgba(255,60,60,.15); color: #ff7070; border: 1px solid rgba(255,60,60,.25); }
       '.s-med{background:rgba(61,220,132,.15);color:#3ddc84;border:1px solid rgba(61,220,132,.25)}',
       .st-short { background: rgba(255,166,0,.15); color: #ffb020; border: 1px solid rgba(255,166,0,.25); }
       '.s-lon{background:rgba(100,160,255,.15);color:#78b0ff;border:1px solid rgba(100,160,255,.25)}',
       .st-medium { background: rgba(61,220,132,.15); color: #3ddc84; border: 1px solid rgba(61,220,132,.25); }
       '.axcp-n{text-align:right;font-variant-numeric:tabular-nums;color:#777}',
       .st-long { background: rgba(100,160,255,.15); color: #78b0ff; border: 1px solid rgba(100,160,255,.25); }
       '.axcp-bw{background:#1A1A1A;border-radius:3px;height:5px;width:60px;display:inline-block;vertical-align:middle;margin-left:6px;overflow:hidden}',
       .axcp-num { text-align: right; font-variant-numeric: tabular-nums; color: #777; }
       '.axcp-bf{height:5px;border-radius:3px;background:linear-gradient(to right,#FF6600,#FF8533)}',
       .axcp-bar-wrap { background: #1A1A1A; border-radius: 3px; height: 5px; width: 60px; display: inline-block; vertical-align: middle; margin-left: 6px; overflow: hidden; }
       '.axcp-load{text-align:center;padding:80px 40px;color:#555;font-size:15px;background:#0D0D0D}',
       .axcp-bar-fill { height: 5px; border-radius: 3px; background: linear-gradient(to right, #FF6600, #FF8533); }
       '.axcp-prog{color:#FF6600;font-size:13px;margin-top:10px}',
       .axcp-loading { text-align: center; padding: 80px 40px; color: #555; font-size: 15px; background: #0D0D0D; }
       '.axcp-z{color:#333}',
       .axcp-progress { color: #FF6600; font-size: 13px; margin-top: 10px; }
       '.axcp-hi{color:#FF6600;font-weight:600}',
       .axcp-zero { color: #333; }
       '.axcp-wt{color:#3ddc84;font-weight:600}'
       .axcp-hi { color: #FF6600; font-weight: 600; }
     ].join('');
       .axcp-watch { color: #3ddc84; font-weight: 600; }
 
     `;
     var sEl = document.createElement('style');
     var styleEl = document.createElement('style');
     sEl.textContent = css;
     styleEl.textContent = css;
     document.head.appendChild(sEl);
     document.head.appendChild(styleEl);


    // Replace page content
     var contentEl = document.querySelector('#mw-content-text .mw-parser-output') || document.getElementById('mw-content-text');
     var contentEl = document.querySelector('#mw-content-text .mw-parser-output') || document.getElementById('mw-content-text');
     contentEl.innerHTML = '<div id="axcp-root"><div class="axcp-loading"><div style="font-size:28px;margin-bottom:16px;">⚙️</div><div>Loading article database&hellip;</div><div class="axcp-progress" id="axcp-prog">Fetching page list&hellip;</div></div></div>';
     contentEl.innerHTML = '<div id="axcp-root"><div class="axcp-load"><div style="font-size:28px;margin-bottom:14px">&#9881;</div><div>Loading article database&hellip;</div><div class="axcp-prog" id="axcp-prog">Fetching page list&hellip;</div></div></div>';


     var root = document.getElementById('axcp-root');
     var root = document.getElementById('axcp-root');
     var allData = [];
     var allData = [];
     var sortCol = 'title';
     var sortCol = 'title', sortDir = 1, filterText = '', filterCat = '', filterSt = '';
    var sortDir = 1;
    var filterText = '';
    var filterCat = '';


     var CAT_COLORS = {
     var CC = {
       'Sexual Health':           'rgba(255,100,100,.18)|#ff8080',
       'Sexual Health':                       'rgba(255,100,100,.18)|#ff8080',
       'Dating, Sex & Relationships': 'rgba(255,182,60,.18)|#ffb83c',
       'Dating, Sex & Relationships':         'rgba(255,182,60,.18)|#ffb83c',
       'Kink & BDSM':             'rgba(180,80,255,.18)|#c864ff',
       'Kink & BDSM':                         'rgba(180,80,255,.18)|#c864ff',
       'Culture, History & Politics': 'rgba(80,140,255,.18)|#6496ff',
       'Culture, History & Politics':         'rgba(80,140,255,.18)|#6496ff',
       'Fashion & Visual Signaling': 'rgba(255,220,60,.18)|#ffdc3c',
       'Fashion & Visual Signaling':         'rgba(255,220,60,.18)|#ffdc3c',
       'Community & Identity':     'rgba(61,220,132,.18)|#3ddc84',
       'Community & Identity':               'rgba(61,220,132,.18)|#3ddc84',
       'Drugs, Party Culture & Harm Reduction': 'rgba(255,120,40,.18)|#ff8028',
       'Drugs, Party Culture & Harm Reduction':'rgba(255,120,40,.18)|#ff8028',
       'Life Planning':           'rgba(80,200,255,.18)|#50c8ff'
       'Life Planning':                       'rgba(80,200,255,.18)|#50c8ff'
     };
     };
    var KCATS = Object.keys(CC);


    var KNOWN_CATS = Object.keys(CAT_COLORS);
     function catSty(cat) {
 
       var s = CC[cat] || 'rgba(120,120,120,.18)|#888', p = s.split('|');
     function catStyle(cat) {
       var s = CAT_COLORS[cat] || 'rgba(120,120,120,.18)|#888';
      var p = s.split('|');
       return 'background:'+p[0]+';color:'+p[1]+';border:1px solid '+p[1]+';';
       return 'background:'+p[0]+';color:'+p[1]+';border:1px solid '+p[1]+';';
     }
     }
 
     function wSt(w) {
     function wordStatus(w) {
       if (w < 150)  return ['stu','Stub'];
       if (w < 150)  return ['stub',   'Stub'];
       if (w < 500)  return ['sho','Short'];
       if (w < 500)  return ['short', 'Short'];
       if (w < 1500) return ['med','Medium'];
       if (w < 1500) return ['medium', 'Medium'];
       return ['lon','Long'];
       return ['long', 'Long'];
     }
     }
 
     function fDate(iso) {
     function fmtDate(iso) {
       if (!iso) return '<span class="axcp-z">-</span>';
       if (!iso) return '<span class="axcp-zero"></span>';
       var d = new Date(iso);
       var d = new Date(iso);
       return d.toLocaleDateString('en-GB', {day:'2-digit',month:'short',year:'numeric'});
       return d.toLocaleDateString('en-GB',{day:'2-digit',month:'short',year:'numeric'});
     }
     }
 
     function fKb(b) {
     function fmtKb(bytes) {
       if (!b) return '<span class="axcp-z">-</span>';
       if (!bytes) return '<span class="axcp-zero"></span>';
       return (b/1024).toFixed(1)+' <span style="color:#444;font-size:10px">KB</span>';
       return (bytes/1024).toFixed(1)+' <span style="color:#444;font-size:11px">KB</span>';
    }
    function esc(s) {
      return String(s||'').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
     }
     }


     function esc(s) { return String(s||'').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;'); }
     function setP(msg) { var el = document.getElementById('axcp-prog'); if (el) el.textContent = msg; }


     function render(data) {
     function render(data) {
       var filtered = data.filter(function(r) {
       var fd = data.filter(function(r) {
         var mt = !filterText || r.title.toLowerCase().indexOf(filterText) >= 0 || (r.cat||'').toLowerCase().indexOf(filterText) >= 0 || (r.subcat||'').toLowerCase().indexOf(filterText) >= 0;
         var mt = !filterText || r.title.toLowerCase().indexOf(filterText)>=0 || (r.cat||'').toLowerCase().indexOf(filterText)>=0;
         var mc = !filterCat || r.cat === filterCat;
         var mc = !filterCat || r.cat === filterCat;
         return mt && mc;
        var ms = !filterSt || wSt(r.words||0)[0] === filterSt;
         return mt && mc && ms;
       });
       });
 
       fd.sort(function(a,b) {
       filtered.sort(function(a,b) {
         var av=a[sortCol], bv=b[sortCol];
         var av = a[sortCol], bv = b[sortCol];
         if (typeof av==='number'&&typeof bv==='number') return sortDir*(av-bv);
         if (typeof av === 'number' && typeof bv === 'number') return sortDir*(av-bv);
         return sortDir*String(av||'').localeCompare(String(bv||''));
         return sortDir*String(av||'').localeCompare(String(bv||''));
       });
       });
      var mxW = Math.max.apply(null,[1].concat(fd.map(function(r){return r.words||0;})));
      var totW = fd.reduce(function(s,r){return s+(r.words||0);},0);
      var avgW = fd.length ? Math.round(totW/fd.length) : 0;
      var totR = fd.reduce(function(s,r){return s+(r.revisions||0);},0);
      var nocat = fd.filter(function(r){return !r.cat;}).length;
      var cats={};
      data.forEach(function(r){if(r.cat)cats[r.cat]=1;});
      var catList=Object.keys(cats).sort();


       var maxW = Math.max.apply(null, [1].concat(filtered.map(function(r){return r.words||0;})));
       var h='';
       var totalW = filtered.reduce(function(s,r){return s+(r.words||0);},0);
      h+='<div class="axcp-hdr">';
       var avgW  = filtered.length ? Math.round(totalW/filtered.length) : 0;
       h+='<div class="axcp-ttl">&#9881; Admin Control Panel</div>';
       var totalR = filtered.reduce(function(s,r){return s+(r.revisions||0);},0);
      h+='<div class="axcp-sub">AlphaX Wiki &bull; Article Database &bull; Live Data</div>';
       var nocat  = filtered.filter(function(r){return !r.cat;}).length;
      h+='<div class="axcp-sr">';
       h+='<div class="axcp-sc"><div class="axcp-sv">'+fd.length+'</div><div class="axcp-sl">Articles</div></div>';
      h+='<div class="axcp-sc"><div class="axcp-sv">'+avgW.toLocaleString()+'</div><div class="axcp-sl">Avg Words</div></div>';
      h+='<div class="axcp-sc"><div class="axcp-sv">'+totW.toLocaleString()+'</div><div class="axcp-sl">Total Words</div></div>';
       h+='<div class="axcp-sc"><div class="axcp-sv">'+totR.toLocaleString()+'</div><div class="axcp-sl">Total Revisions</div></div>';
      h+='<div class="axcp-sc"><div class="axcp-sv">'+catList.length+'</div><div class="axcp-sl">Categories</div></div>';
      h+='<div class="axcp-sc"><div class="axcp-sv" style="color:'+(nocat>0?'#ff7070':'#3ddc84')+'">'+nocat+'</div><div class="axcp-sl">Uncategorised</div></div>';
       h+='</div></div>';


       // Build category list
       h+='<div class="axcp-ctrl">';
       var cats = {};
      h+='<input class="axcp-inp" id="axcps" type="text" placeholder="Search articles or categories..." value="'+esc(filterText)+'">';
       data.forEach(function(r){ if(r.cat) cats[r.cat]=1; });
       h+='<select class="axcp-sel" id="axcpc"><option value="">All Categories</option>';
       var catList = Object.keys(cats).sort();
       catList.forEach(function(c){h+='<option value="'+esc(c)+'"'+(filterCat===c?' selected':'')+'>'+esc(c)+'</option>';});
 
      h+='</select>';
       var h = '';
      h+='<select class="axcp-sel" id="axcpf"><option value="">All Statuses</option>';
      [['stu','Stub'],['sho','Short'],['med','Medium'],['lon','Long']].forEach(function(s){
        h+='<option value="'+s[0]+'"'+(filterSt===s[0]?' selected':'')+'>'+s[1]+'</option>';
      });
       h+='</select>';
      h+='<span class="axcp-cnt">'+fd.length+' articles</span>';
      h+='<button class="axcp-rbtn" id="axcpr">&#8635; Refresh Data</button>';
       h+='</div>';


      // Header
       h+='<div class="axcp-tw"><table class="axcp-t"><thead><tr>';
      h += '<div class="axcp-header">';
       [{k:'title',l:'Article'},{k:'cat',l:'Category'},{k:'subcat',l:'Subcategory'},
      h += '<div class="axcp-title">⚙️ Admin Control Panel</div>';
      {k:'words',l:'Words'},{k:'size',l:'Size'},{k:'status',l:'Status'},
      h += '<div class="axcp-subtitle">AlphaX Wiki · Article Database · Live Data</div>';
      {k:'created',l:'Published'},{k:'touched',l:'Last Edited'},
      h += '<div class="axcp-stats-row">';
      {k:'revisions',l:'Revisions'},{k:'watchers',l:'Watchers'},{k:'links',l:'Inbound Links'}
      h += '<div class="axcp-stat"><div class="axcp-stat-val">'+filtered.length+'</div><div class="axcp-stat-label">Articles</div></div>';
       ].forEach(function(c){
      h += '<div class="axcp-stat"><div class="axcp-stat-val">'+avgW.toLocaleString()+'</div><div class="axcp-stat-label">Avg Words</div></div>';
         var cl=sortCol===c.k?(sortDir===1?'sa':'sd'):'';
      h += '<div class="axcp-stat"><div class="axcp-stat-val">'+totalW.toLocaleString()+'</div><div class="axcp-stat-label">Total Words</div></div>';
         h+='<th class="'+cl+'" data-col="'+c.k+'">'+c.l+'</th>';
      h += '<div class="axcp-stat"><div class="axcp-stat-val">'+totalR.toLocaleString()+'</div><div class="axcp-stat-label">Total Revisions</div></div>';
      h += '<div class="axcp-stat"><div class="axcp-stat-val">'+catList.length+'</div><div class="axcp-stat-label">Categories</div></div>';
      h += '<div class="axcp-stat"><div class="axcp-stat-val" style="color:'+(nocat>0?'#ff7070':'#3ddc84')+'">'+nocat+'</div><div class="axcp-stat-label">Uncategorised</div></div>';
      h += '</div></div>';
 
      // Controls
      h += '<div class="axcp-controls">';
      h += '<input class="axcp-search" id="axcp-s" type="text" placeholder="🔍 Search articles, categories…" value="'+esc(filterText)+'">';
      h += '<select class="axcp-select" id="axcp-cf"><option value="">All Categories ('+catList.length+')</option>';
      catList.forEach(function(c){ h+='<option value="'+esc(c)+'"'+(filterCat===c?' selected':'')+'>'+esc(c)+'</option>'; });
      h += '</select>';
      h += '<select class="axcp-select" id="axcp-sf"><option value="">All Statuses</option><option value="stub">Stub</option><option value="short">Short</option><option value="medium">Medium</option><option value="long">Long</option></select>';
      h += '<span class="axcp-count">'+filtered.length+' articles</span>';
      h += '<button class="axcp-refresh-btn" id="axcp-reload">⟳ Refresh</button>';
      h += '</div>';
 
      // Table
       h += '<div class="axcp-table-wrap"><table class="axcp-tbl">';
      h += '<thead><tr>';
       [
        {k:'title',l:'Article Title'},
        {k:'cat',l:'Category'},
        {k:'subcat',l:'Subcategory'},
        {k:'words',l:'Words'},
        {k:'size',l:'Size'},
        {k:'status',l:'Status'},
        {k:'created',l:'Published'},
        {k:'touched',l:'Last Edited'},
        {k:'revisions',l:'Revisions'},
        {k:'watchers',l:'Watchers'},
        {k:'links',l:'Inbound Links'}
       ].forEach(function(c) {
         var cls = sortCol===c.k ? (sortDir===1?'s-asc':'s-desc') : '';
         h += '<th class="'+cls+'" data-col="'+c.k+'">'+c.l+'</th>';
       });
       });
       h += '</tr></thead><tbody>';
       h+='</tr></thead><tbody>';


       if (filtered.length === 0) {
       if (!fd.length) {
         h += '<tr><td colspan="11" style="text-align:center;padding:50px;color:#444;">No articles match your filters.</td></tr>';
         h+='<tr><td colspan="11" style="text-align:center;padding:50px;color:#333">No articles match your filters.</td></tr>';
       }
       }
 
       fd.forEach(function(r){
       filtered.forEach(function(r) {
         var st=wSt(r.words||0);
         var st = wordStatus(r.words||0);
         var bp=mxW>0?Math.round(((r.words||0)/mxW)*60):0;
         var barPct = maxW > 0 ? Math.round(((r.words||0)/maxW)*60) : 0;
         h+='<tr>';
         h += '<tr>';
         h+='<td><a class="axcp-al" href="/wiki/'+encodeURIComponent((r.title||'').replace(/ /g,'_'))+'" target="_blank">'+esc(r.title)+'</a></td>';
         h += '<td><a class="axcp-art-link" href="/wiki/'+encodeURIComponent((r.title||'').replace(/ /g,'_'))+'" target="_blank">'+esc(r.title||'')+'</a></td>';
         h+='<td>'+(r.cat?'<span class="axcp-cp" style="'+catSty(r.cat)+'">'+esc(r.cat)+'</span>':'<span class="axcp-z">-</span>')+'</td>';
         h += '<td>'+(r.cat ? '<span class="axcp-cat-pill" style="'+catStyle(r.cat)+'">'+esc(r.cat)+'</span>' : '<span class="axcp-zero"></span>')+'</td>';
         h+='<td style="color:#555;font-size:12px">'+esc(r.subcat||'-')+'</td>';
         h += '<td style="color:#666;font-size:12px;">'+esc(r.subcat||'')+'</td>';
         h+='<td class="axcp-n">'+(r.words||0).toLocaleString()+'<span class="axcp-bw"><span class="axcp-bf" style="width:'+bp+'px"></span></span></td>';
         h += '<td class="axcp-num">'+(r.words||0).toLocaleString()+'<span class="axcp-bar-wrap"><span class="axcp-bar-fill" style="width:'+barPct+'px"></span></span></td>';
         h+='<td class="axcp-n">'+fKb(r.size)+'</td>';
         h += '<td class="axcp-num">'+fmtKb(r.size)+'</td>';
         h+='<td><span class="axcp-st s-'+st[0]+'">'+st[1]+'</span></td>';
         h += '<td><span class="axcp-status st-'+st[0]+'">'+st[1]+'</span></td>';
         h+='<td style="color:#555;white-space:nowrap;font-size:12px">'+fDate(r.created)+'</td>';
         h += '<td style="color:#666;white-space:nowrap;font-size:12px;">'+fmtDate(r.created)+'</td>';
         h+='<td style="color:#555;white-space:nowrap;font-size:12px">'+fDate(r.touched)+'</td>';
         h += '<td style="color:#666;white-space:nowrap;font-size:12px;">'+fmtDate(r.touched)+'</td>';
         h+='<td class="axcp-n '+(r.revisions>20?'axcp-hi':'')+'">'+(r.revisions||0)+'</td>';
         h += '<td class="axcp-num '+(r.revisions>20?'axcp-hi':'')+'">'+((r.revisions||0))+'</td>';
         h+='<td class="axcp-n '+(r.watchers>0?'axcp-wt':'axcp-z')+'">'+(r.watchers>0?'&#128065; '+r.watchers:'0')+'</td>';
         h += '<td class="axcp-num '+(r.watchers>0?'axcp-watch':'axcp-zero')+'">'+((r.watchers!=null&&r.watchers>0)? '👁 '+r.watchers : '0')+'</td>';
         h+='<td class="axcp-n '+(r.links>5?'axcp-hi':'')+'">'+(r.links||0)+'</td>';
         h += '<td class="axcp-num '+(r.links>5?'axcp-hi':'')+'">'+((r.links||0))+'</td>';
         h+='</tr>';
         h += '</tr>';
       });
       });
      h+='</tbody></table></div>';
      root.innerHTML=h;


      h += '</tbody></table></div>';
       var si=document.getElementById('axcps');
      root.innerHTML = h;
       if(si)si.addEventListener('input',function(){filterText=this.value.toLowerCase();render(allData);});
 
       var ci=document.getElementById('axcpc');
      // Bind events
       if(ci)ci.addEventListener('change',function(){filterCat=this.value;render(allData);});
       var searchEl = document.getElementById('axcp-s');
       var fi=document.getElementById('axcpf');
       if (searchEl) searchEl.addEventListener('input', function(){ filterText = this.value.toLowerCase(); render(allData); });
       if(fi)fi.addEventListener('change',function(){filterSt=this.value;render(allData);});
 
       var ri=document.getElementById('axcpr');
       var catEl = document.getElementById('axcp-cf');
       if(ri)ri.addEventListener('click',function(){allData=[];loadData();});
       if (catEl) catEl.addEventListener('change', function(){ filterCat = this.value; render(allData); });
       document.querySelectorAll('table.axcp-t thead th').forEach(function(th){
 
         th.addEventListener('click',function(){
       var sfEl = document.getElementById('axcp-sf');
           var col=this.getAttribute('data-col');
       if (sfEl) sfEl.addEventListener('change', function() {
           if(sortCol===col){sortDir*=-1;}else{sortCol=col;sortDir=1;}
        var sv = this.value;
        if (!sv) { render(allData); return; }
        // Filter by status
        var prev = allData;
        var tmp = allData.filter(function(r){ return wordStatus(r.words||0)[0] === sv; });
        allData = prev;
        // Temporary local render
        var savedFilter = filterText;
        filterText = '';
        var fc = filterCat;
        filterCat = '';
        // just re-render with status override
        root.querySelector('#axcp-reload') && void 0;
        render(tmp);
        allData = prev;
        filterText = savedFilter;
        filterCat = fc;
      });
 
       var reloadEl = document.getElementById('axcp-reload');
       if (reloadEl) reloadEl.addEventListener('click', function(){ allData=[]; loadData(); });
 
       document.querySelectorAll('table.axcp-tbl thead th').forEach(function(th){
         th.addEventListener('click', function(){
           var col = this.getAttribute('data-col');
           if (sortCol === col) { sortDir *= -1; } else { sortCol = col; sortDir = 1; }
           render(allData);
           render(allData);
         });
         });
Line 503: Line 457:
     }
     }


     function setProgress(msg) {
     function apiFetch(url) {
       var el = document.getElementById('axcp-prog');
       return fetch(url).then(function(r){return r.json();});
      if (el) el.textContent = msg;
     }
     }


     async function loadData() {
     function loadData() {
       root.innerHTML = '<div class="axcp-loading"><div style="font-size:28px;margin-bottom:16px;">⚙️</div><div>Loading article database&hellip;</div><div class="axcp-progress" id="axcp-prog">Step 1/4 Fetching page list…</div></div>';
       root.innerHTML='<div class="axcp-load"><div style="font-size:28px;margin-bottom:14px">&#9881;</div><div>Loading article database&hellip;</div><div class="axcp-prog" id="axcp-prog">Step 1/4 &mdash; Fetching page list&hellip;</div></div>';


       try {
       var pages=[], map={}, ids=[];
        // 1. Get all page IDs
        var pages = [];
        var apcontinue = null;
        do {
          var u = '/api.php?action=query&list=allpages&apnamespace=0&aplimit=500&format=json';
          if (apcontinue) u += '&apcontinue=' + encodeURIComponent(apcontinue);
          var r = await fetch(u); var d = await r.json();
          pages = pages.concat(d.query.allpages);
          apcontinue = d.continue ? d.continue.apcontinue : null;
        } while (apcontinue);


         setProgress('Step 2/4 — Fetching page info & categories for '+pages.length+' articles…');
      function fetchPages(apc) {
        var u='/api.php?action=query&list=allpages&apnamespace=0&aplimit=500&format=json';
         if(apc) u+='&apcontinue='+encodeURIComponent(apc);
        return apiFetch(u).then(function(d){
          pages=pages.concat(d.query.allpages);
          if(d.continue&&d.continue.apcontinue) return fetchPages(d.continue.apcontinue);
        });
      }


        var map = {};
      function fetchInfoChunk(i) {
        pages.forEach(function(p){ map[p.pageid] = {title:p.title,cat:'',subcat:'',words:0,size:0,created:'',touched:'',revisions:0,watchers:null,links:0,status:''}; });
         if(i>=ids.length) return Promise.resolve();
         var ids = pages.map(function(p){return p.pageid;});
         var chunk=ids.slice(i,i+50).join('|');
 
        return apiFetch('/api.php?action=query&pageids='+chunk+'&prop=info|categories|revisions&inprop=watchers&rvprop=timestamp&rvdir=newer&rvlimit=1&cllimit=15&format=json').then(function(d){
         // 2. Info + categories + first revision (creation date)
           Object.keys(d.query.pages).forEach(function(pid){
        for (var i=0; i<ids.length; i+=50) {
             var pg=d.query.pages[pid]; if(!map[pid])return;
          var chunk = ids.slice(i,i+50).join('|');
             map[pid].size=pg.length||0;
          var r2 = await fetch('/api.php?action=query&pageids='+chunk+'&prop=info|categories|revisions&inprop=watchers&rvprop=timestamp&rvdir=newer&rvlimit=1&cllimit=15&format=json');
             map[pid].touched=pg.touched||'';
          var d2 = await r2.json();
             map[pid].watchers=pg.watchers!=null?pg.watchers:0;
           Object.keys(d2.query.pages).forEach(function(pid){
             if(pg.revisions&&pg.revisions[0])map[pid].created=pg.revisions[0].timestamp||'';
             var pg = d2.query.pages[pid]; if(!map[pid])return;
             if(pg.categories){pg.categories.forEach(function(c){
             map[pid].size   = pg.length || 0;
              var cn=c.title.replace('Category:','');
             map[pid].touched = pg.touched || '';
              if(KCATS.indexOf(cn)>=0){if(!map[pid].cat)map[pid].cat=cn;}
             map[pid].watchers = (pg.watchers != null) ? pg.watchers : null;
              else if(cn.length<60&&cn.indexOf('stub')<0){if(!map[pid].subcat)map[pid].subcat=cn;}
             if (pg.revisions && pg.revisions[0]) map[pid].created = pg.revisions[0].timestamp || '';
            });}
             if (pg.categories) {
              pg.categories.forEach(function(c){
                var cn = c.title.replace('Category:','');
                if (KNOWN_CATS.indexOf(cn) >= 0) { if(!map[pid].cat) map[pid].cat = cn; }
                else if (cn.indexOf('stub')<0 && cn.indexOf('article')<0 && cn.length < 60) { if(!map[pid].subcat) map[pid].subcat = cn; }
              });
            }
           });
           });
         }
          return fetchInfoChunk(i+50);
 
         });
        setProgress('Step 3/4 — Counting revisions…');
      }


        // 3. Revision counts (rvlimit=max gives us up to 500; count them)
      function fetchRevChunk(i) {
         for (var j=0; j<ids.length; j+=20) {
         if(i>=ids.length) return Promise.resolve();
          var chunk2 = ids.slice(j,j+20).join('|');
        var chunk=ids.slice(i,i+20).join('|');
          var r3 = await fetch('/api.php?action=query&pageids='+chunk2+'&prop=revisions&rvprop=ids&rvlimit=max&format=json');
        return apiFetch('/api.php?action=query&pageids='+chunk+'&prop=revisions&rvprop=ids&rvlimit=max&format=json').then(function(d){
          var d3 = await r3.json();
           Object.keys(d.query.pages).forEach(function(pid){
           Object.keys(d3.query.pages).forEach(function(pid){
             var pg=d.query.pages[pid]; if(!map[pid])return;
             var pg = d3.query.pages[pid]; if(!map[pid])return;
             map[pid].revisions=(pg.revisions||[]).length;
             map[pid].revisions = (pg.revisions||[]).length;
           });
           });
         }
          return fetchRevChunk(i+20);
         });
      }


        setProgress('Step 4/4 — Calculating word counts & inbound links…');
      function fetchContentChunk(i) {
 
         if(i>=ids.length) return Promise.resolve();
         // 4. Word counts from wikitext + inbound links
        var chunk=ids.slice(i,i+8).join('|');
        for (var k=0; k<ids.length; k+=10) {
        return apiFetch('/api.php?action=query&pageids='+chunk+'&prop=revisions|linkshere&rvprop=content&rvslots=main&lhnamespace=0&lhlimit=max&format=json').then(function(d){
          var chunk3 = ids.slice(k,k+10).join('|');
           Object.keys(d.query.pages).forEach(function(pid){
          var r4 = await fetch('/api.php?action=query&pageids='+chunk3+'&prop=revisions|linkshere&rvprop=content&rvslots=main&lhnamespace=0&lhlimit=max&format=json');
             var pg=d.query.pages[pid]; if(!map[pid])return;
          var d4 = await r4.json();
             map[pid].links=(pg.linkshere||[]).length;
           Object.keys(d4.query.pages).forEach(function(pid){
             if(!pg.revisions||!pg.revisions[0])return;
             var pg = d4.query.pages[pid]; if(!map[pid])return;
             var slot=pg.revisions[0].slots?pg.revisions[0].slots.main:pg.revisions[0];
             map[pid].links = (pg.linkshere||[]).length;
             var content=slot['*']||slot.content||'';
             if (!pg.revisions||!pg.revisions[0]) return;
             content=content
             var slot = pg.revisions[0].slots ? pg.revisions[0].slots.main : pg.revisions[0];
               .replace(/{{[sS]*?}}/g,' ')
             var content = slot['*'] || slot.content || '';
              .replace(/[[File:[^]]+]]/gi,' ')
             var clean = content
              .replace(/[[(?:[^]|]+|)?([^]]+)]]/g,'$1')
               .replace(/<!--[sS]*?-->/g,'')
               .replace(/<[^>]+>/g,' ')
               .replace(/<[^>]+>/g,' ')
               .replace(/[[File:[^]]+]]/gi,'')
               .replace(/<!--[sS]*?-->/g,' ')
              .replace(/[[(?:[^]|]+|)?([^]]+)]]/g,'$1')
               .replace(/={2,}[^=]+=={2,}/g,' ')
              .replace(/{{[sS]*?}}/g,'')
               .replace(/[|!*#;:[]]/g,' ')
               .replace(/={2,}([^=]+)={2,}/g,'$1')
               .replace(/https?://S+/g,' ')
               .replace(/[|!*#;:]/g,' ')
               .replace(/https?://S+/g,'')
               .replace(/s+/g,' ').trim();
               .replace(/s+/g,' ').trim();
             map[pid].words = clean ? clean.split(/s+/).filter(function(w){return w.length>1;}).length : 0;
             map[pid].words=content?content.split(/s+/).filter(function(w){return w.length>1;}).length:0;
           });
           });
         }
          return fetchContentChunk(i+8);
         });
      }


         allData = Object.values(map);
      fetchPages(null).then(function(){
        setP('Step 2/4 — Fetching info & categories for '+pages.length+' articles…');
        pages.forEach(function(p){map[p.pageid]={title:p.title,cat:'',subcat:'',words:0,size:0,created:'',touched:'',revisions:0,watchers:0,links:0};});
        ids=pages.map(function(p){return p.pageid;});
        return fetchInfoChunk(0);
      }).then(function(){
        setP('Step 3/4 — Counting revisions…');
        return fetchRevChunk(0);
      }).then(function(){
        setP('Step 4/4 — Calculating word counts & inbound links…');
        return fetchContentChunk(0);
      }).then(function(){
         allData=Object.values(map);
         render(allData);
         render(allData);
 
       }).catch(function(e){
       } catch(e) {
         root.innerHTML='<div class="axcp-load" style="color:#ff7070">&#9888; Error: '+e.message+'</div>';
         root.innerHTML = '<div class="axcp-loading" style="color:#ff7070;">⚠️ Error: '+e.message+'<br><br><button onclick="location.reload()" style="background:#FF6600;border:none;color:#fff;padding:10px 20px;border-radius:8px;cursor:pointer;font-size:14px;">Retry</button></div>';
       });
       }
     }
     }