Gebruiker:MakiBoy/Gadget-LogCounter.js

/* jshint sub:true maxerr:100000 */
// [[User:MakiBoy/Gadget-LogCounter.js]] gemaakt door [[User:MakiBoy]]

var version = '2.9';

function parseNumber(number) {
    return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
}

function addZero(number) {
	return number < 10 ? "0" + number : number;
}

function showProjectLogCounter(pages) {
    document.getElementsByTagName("h1")[0].textContent = "Speciaal:" + mw.config.get('wgTitle');
    document.title = "Statistieken WikiKids";

    var searchBar = '<div><input type="text" id="lc-searchbar"> <button onclick="searchTitle();">Zoek</button></div>'
        + '<button onclick="reloadPagesLogCounter();">Laad alles opnieuw in</button>';
    var logCounterInfo = '<div id="logCounterInfo">Deze pagina laat zien hoeveel paginabezoeken er zijn geweest op een specifieke pagina. De rij "Views" bevat <b>alle</b> views. De rij daarachter laat alleen maar zien hoeveel views komen vanuit iets specifieks, bijvoorbeeld vanuit een categorie of van een mobiele telefoon. <a href="/Speciaal:Statistieken_WikiKids?action=help">Klik hier voor statistieken van vorige weken.</a> </div>';
    var table = document.createElement('table');
    table.classList.add('wikitable');
    var tableHead = document.createElement('thead');
    var tableHeadRow = document.createElement('tr');
    var tableHeadTitles;
    if (infoHistory) {
    	tableHeadTitles = ['Paginatitel', 'Laatste bezoek', 'Views', infoHistory.Types, '%'];
    } else {
    	tableHeadTitles = ['Paginatitel', 'Laatste bezoek', 'Views', 'Mobiel', '%'];
    }
    var tableBody = document.createElement('tbody');

    var currentPage = 1;
    var rowsPerPage = parameterLC['rows'] ? parseInt(parameterLC['rows']) : 25;
    var totalPages = Math.ceil(pages.length / rowsPerPage);

    function showPage(pageNumber) {
        currentPage = pageNumber;
        tableBody.innerHTML = '';
        var start = (currentPage - 1) * rowsPerPage;
        var end = start + rowsPerPage;
        var paginatedItems = pages.slice(start, end);
        paginatedItems.forEach(function (page) {
            var row = document.createElement('tr');
            var totalVisitors, mainPageVisited, pageTitle, pageLink, date;
            if (historyLogCounter) {
            	if (!page.nV) { // bij een gedeelte van de opgeslagen data, wordt nV of mPV leeggelaten, dit zorgt ervoor dat het juist wordt weergegeven. Dit is alleen nodig bij een voorgaande versie. Bij huidige versies worden alles gewoon doorgegeven. 
            		totalVisitors = page.mPV;
            	} else if (!page.mPV) {
            		totalVisitors = page.nV;
            	} else {
		            totalVisitors = page.nV + page.mPV;
            	}
	            mainPageVisited = page.mPV ? page.mPV : "";
	            pageTitle = page.t.replace(/_/g, ' ');
	            pageLink = page.t;
	            date = new Date(page.uA);
            } else {
	            totalVisitors = page.normalVisitors + page.mainPageVisitors;
	            mainPageVisited = page.mainPageVisitors ? page.mainPageVisitors : "";
	            pageTitle = page.title.replace(/_/g, ' ');
	            pageLink = page.title;
	            date = new Date(page.updatedAt);
            }
            var percentMainPage = Math.round((100/totalVisitors)*mainPageVisited*100)/100;
            var percentStyle = '>';
            if (parameterLC['percentmax'] !== parameterLC['percentmin']) {
            	console.log(percentMainPage, parameterLC);
            	if (percentMainPage < parameterLC['percentmax']) { // 60 < 70 true 
            		if (percentMainPage > parameterLC['percentmin']) { // 60 > 50 true
            			percentStyle = ' style="background:lightgreen"><span style="font-size:0px">Voldoet aan vereisten QQQ</span>';
            		}
            	} else if (percentMainPage > parameterLC['percentmin']) { 
            		if (!parameterLC['percentmax']) {
            			percentStyle = ' style="background:lightgreen"><span style="font-size:0px">Voldoet aan vereisten QQQ</span>';
            		}
            	}
            }
            var dateString; 
            if (!isNaN(date)) {
            	dateString = addZero(date.getDate()) + "-" + addZero((date.getMonth() + 1)) + "-" + date.getFullYear() + " " + addZero(date.getHours()) + ":" + addZero(date.getMinutes());
            } else {
            	dateString = "Niet beschikbaar";
            }

            row.innerHTML = `<td><a href="/${pageLink}">${pageTitle}</a></td>
                <td>${dateString}</td>
                <td>${parseNumber(totalVisitors)}</td><td>${parseNumber(mainPageVisited)}</td>
                <td ${percentStyle + percentMainPage}</td>`;
            tableBody.appendChild(row);
        });
    }

    showPage(1);

    var pagination = document.createElement('div');
    pagination.classList.add('pagination');

    var prevButton = document.createElement('button');
    prevButton.textContent = 'Vorige';
    prevButton.style = 'margin-right: 10px;';
    prevButton.addEventListener('click', function () {
		if (currentPage > 1) {
            showPage(currentPage - 1);
            //Manier waarop je kunt zien op welke pagina je bent
            document.getElementById('pageCounter').innerHTML = `Pagina <input id="logcounternumberpage" type="number" size="5" value=${currentPage}> van ${totalPages}`;
        }
    });
    pagination.appendChild(prevButton);

    var pageCounter = document.createElement('span');
    pageCounter.id = "pageCounter";
    pageCounter.innerHTML = `Pagina <input id="logcounternumberpage" type="number" size="5" value=${currentPage}> van ${totalPages}`;
    pagination.appendChild(pageCounter);

    var nextButton = document.createElement('button');
    nextButton.textContent = 'Volgende';
    nextButton.style = 'margin-left: 10px;';
    nextButton.addEventListener('click', function () {
        if (currentPage < totalPages) {
            showPage(currentPage + 1);
            //Manier waarop je kunt zien op welke pagina je bent
            document.getElementById('pageCounter').innerHTML = `Pagina <input id="logcounternumberpage" type="number" size="5" value=${currentPage}> van ${totalPages}`;
        }
    });
    
    var gotoButton = document.createElement('button');
    gotoButton.textContent = 'Gaan';
    gotoButton.style = 'margin-left: 10px;';
    gotoButton.addEventListener('click', function () {
    	if (document.getElementById('logcounternumberpage').value > totalPages || document.getElementById('logcounternumberpage').value < 1) {
    	} else {
			showPage(parseInt(document.getElementById('logcounternumberpage').value));
			document.getElementById('pageCounter').innerHTML = `Pagina <input id="logcounternumberpage" type="number" size="5" value=${currentPage}> van ${totalPages}`;
    	}
    });
    
    pagination.appendChild(gotoButton);
    pagination.appendChild(nextButton);
    
    tableHeadTitles.forEach(function (title) {
        var tableHeadCell = document.createElement('th');
        tableHeadCell.textContent = title;
        tableHeadRow.appendChild(tableHeadCell);
    });
    tableHead.appendChild(tableHeadRow);
    table.appendChild(tableHead);
    table.appendChild(tableBody);

    var totalVisitors = pages.reduce(function (total, page) {
    	if (historyLogCounter) {
    		if (!page.nV) { 
            	return total + page.mPV;
            } else if (!page.mPV) {
            	return total + page.nV;
            } else {
    			return total + page.nV + page.mPV;
            }
    	} else {
    		return total + page.normalVisitors + page.mainPageVisitors;
    	}
    }, 0);

    var totalElement = document.createElement('div');
    totalElement.style = 'margin-top: 20px; display: flex; flex-direction: column;';

    var totalVisitorsElement = document.createElement('span');
    totalVisitorsElement.textContent = `Totaal aantal bezoeken: ${parseNumber(totalVisitors)}`;
    totalElement.appendChild(totalVisitorsElement);

    var totalPagesElement = document.createElement('span');
    totalPagesElement.textContent = `Totaal aantal pagina's: ${parseNumber(pages.length)}`;
    totalElement.appendChild(totalPagesElement);
    
	if (infoHistory) {
		var moreInfoElement = document.createElement('span');
		var xStarttime = new Date(infoHistory.Starttime); 
		var xEndtime = new Date(infoHistory.Endtime); 
		var firstDateString = addZero(xStarttime.getDate()) + "-" + addZero((xStarttime.getMonth() + 1)) + "-" + xStarttime.getFullYear() + " " + addZero(xStarttime.getHours()) + ":" + addZero(xStarttime.getMinutes());
		var lastDateString = addZero(xEndtime.getDate()) + "-" + addZero((xEndtime.getMonth() + 1)) + "-" + xEndtime.getFullYear() + " " + addZero(xEndtime.getHours()) + ":" + addZero(xEndtime.getMinutes());
		moreInfoElement.textContent = `${firstDateString} tot ${lastDateString}`;
	    totalElement.appendChild(moreInfoElement);
	}
    document.getElementById('bodyContent').innerHTML = searchBar + logCounterInfo;
    document.getElementById('bodyContent').appendChild(table);
    document.getElementById('bodyContent').appendChild(pagination);
    document.getElementById('bodyContent').appendChild(totalElement);
}

function getCategoriesLogCounter() { //toon alleen pagina's in een specifieke categorie
}

function getPagesLogCounter() {
    var pages = [];
    var request = new XMLHttpRequest();
    request.open('GET', urlLogCounter, false);
    request.send(null);
    if (request.status === 200) {
        pages = JSON.parse(request.responseText);
    }
    // Sorteer de pagina's op het aantal bezoekers (hoog naar laag) (page.normalVisitors + page.mainPageVisitors)
    pages.sort(function (a, b) {
    	if (historyLogCounter) {
    		return b.nV + b.mPV - a.nV - a.mPV;
    	} else {
    		return b.normalVisitors + b.mainPageVisitors - a.normalVisitors - a.mainPageVisitors;
    	}
    });
    return pages;
}

function searchTitle(searchQuery) {
    if (!searchQuery) {
        searchQuery = document.getElementById('lc-searchbar').value.replace(/ /g, '_');
    }
    var allPages = getPagesLogCounter();
    var titlecheck = historyLogCounter ? 't': 'title'; 
    for (var i = 0; i < allPages.length; i++) {
        if (allPages[i][titlecheck].toLowerCase() === searchQuery.toLowerCase()) {
            var searchResult = [allPages[i]];
            showProjectLogCounter(searchResult);
            break;
        }
    }
    setTimeout(function () {
        if (!searchResult) {
    		var searchBar = '<div><input type="text" id="lc-searchbar"> <button onclick="searchTitle();">Zoek</button></div>'
        	+ '<button onclick="reloadPagesLogCounter();">Laad alles opnieuw in</button>'
        	+ '<br>De pagina <a href="https://wikikids.nl/' + searchQuery + '">' + searchQuery + '</a> heeft geen views ontvangen of bestaat niet.' 
        	+ 'Kijk voor meer <a href="https://wikikids.nl/WikiKids:LogCounter">informatie op deze pagina</a>.';
        	document.getElementById('bodyContent').innerHTML = searchBar;
        	console.log(allPages);
        	console.log(searchQuery);
        }
    }, 750);
}

function getInfoPageLogCounter(urlInfoLogCounter) {
    var infoHistory;
    var request = new XMLHttpRequest();
    request.open('GET', urlInfoLogCounter, false);
    request.send(null);
    if (request.status === 200) {
        infoHistory = JSON.parse(request.responseText);
    }
    return infoHistory;
}

function hulpLogCounter() {
    document.getElementsByTagName("h1")[0].textContent = "Speciaal:" + mw.config.get('wgTitle');
    document.title = "Help - Statistieken WikiKids";
    infotext = 'Elke vrijdag worden, rond 6 uur, de statistieken opnieuw ingesteld. Een week loopt dus van vrijdag tot vrijdag. Het real-time registreren van de bezoekers wordt mogelijk gemaakt door MakiBoy. Voor vragen kun je terecht bij MakiBoy of Rots61. <br>' 
    	+ '<a href="/Special:Statistieken_WikiKids">Live</a> (van 3 februari tot nu)<br>'
    	+ '<a href="/Special:Statistieken_WikiKids?date=20230203">Week 5</a> (van 27 januari tot 3 februari)<br>'
        + '<a href="/Special:Statistieken_WikiKids?date=20230127">Week 4</a> (van 20 januari tot 27 januari)<br>'
        + '<a href="/Special:Statistieken_WikiKids?date=20230120">Week 3</a> (van 13 januari tot 20 januari)<br>';
    document.getElementById('bodyContent').innerHTML = infotext;
}

function reloadPagesLogCounter() {
    var allPages = getPagesLogCounter();
    showProjectLogCounter(allPages);
}

if (mw.config.get('wgNamespaceNumber') === -1 && (mw.config.get('wgTitle') === "LogCounter" || (mw.config.get('wgTitle') === "Statistieken Wikikids" ||mw.config.get('wgTitle') === "Statistieken WikiKids"))) {
	var parameterLC = [];
	parameterLC['rows'] = parseInt(mw.util.getParamValue('rows'));
	parameterLC['action'] = mw.util.getParamValue('action');
	parameterLC['date'] = mw.util.getParamValue('date');
	parameterLC['page'] = mw.util.getParamValue('page');
	parameterLC['percentmin'] = parseInt(mw.util.getParamValue('percentmin'));
	parameterLC['percentmax'] = parseInt(mw.util.getParamValue('percentmax'));
	if (parameterLC['action'] === 'help') {
		hulpLogCounter();
	} else {
		document.getElementById("footer-places").innerHTML += '<li id="footer-places-gadget-LogCounter">Script gemaakt door <a href="/User:MakiBoy" title="Gebruiker:MakiBoy">MakiBoy</a>, versie: ' + version + '</li>';
	    if (parameterLC['date']) {
	    	var urlLogCounter = 'https://wikikids.nl/User:Rots61/Statistieken/' + parameterLC['date'] + '?action=raw';
	    	var historyLogCounter = true;
	    	var infoHistory = getInfoPageLogCounter('https://wikikids.nl/User:Rots61/Statistieken/' + parameterLC['date'] + '/info?action=raw');
	    } else {
	    	var urlLogCounter = 'https://wikikids.martvanweeghel.nl/pages';
	    }
	    if (parameterLC['page']) {
	        searchTitle(parameterLC['page']);
	    } else {
	        var allPages = getPagesLogCounter();
	        showProjectLogCounter(allPages);
	    }
	}
}