This commit is contained in:
relikd
2020-09-25 02:56:16 +02:00
parent bd4a5f321f
commit 69b2875177
15 changed files with 340 additions and 193 deletions

View File

@@ -31,11 +31,14 @@ function lookup_domain_js(fname_a, fname_b, id1, id2, id3) {
let bid = apps[i][0];
let item = template.cloneNode(true);
item.href = '/app/'+bid+'/';
item.querySelector('img').src = '/app/'+bid+'/icon.png';
let img = item.querySelector('img');
img.classList = 'lozad';
img.setAttribute('data-src', '/app/'+bid+'/icon.png');
item.querySelector('.name').innerHTML = apps[i][1];
item.querySelector('.detail').innerHTML = bid;
dom_app_list.appendChild(item);
}
const observer = lozad(); observer.observe();
});
});
}

View File

@@ -20,16 +20,6 @@ function lookup_rank_js(bundle_id) {
meta[1].innerHTML = fmt(best[i]);
meta[2].innerHTML = fmt(worst[i]);
}
// formatting
function dot1(x) { return Math.round(x * 10) / 10; }
function as_percent(x) { return dot1(x * 100) + '%'; }
function as_pm(x) { return dot1(x) + '/min'; }
function HHmmss(seconds) {
const h = Math.floor(seconds / 3600);
const m = Math.floor((seconds % 3600) / 60);
const s = Math.round(seconds % 60);
return (h<10?'0'+h:h)+':'+(m<10?'0'+m:m)+':'+(s<10?'0'+s:s);
}
// order is important!
update(0, 'sum_rec');
update(1, 'avg_time', HHmmss);

9
out/static/lozad.js Normal file
View File

@@ -0,0 +1,9 @@
/*! lozad.js - v1.9.0 - 2019-02-09
* https://github.com/ApoorvSaxena/lozad.js
* Copyright (c) 2019 Apoorv Saxena; Licensed MIT */
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.lozad=e()}(this,function(){"use strict";var g=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},n="undefined"!=typeof document&&document.documentMode,l={rootMargin:"0px",threshold:0,load:function(t){if("picture"===t.nodeName.toLowerCase()){var e=document.createElement("img");n&&t.getAttribute("data-iesrc")&&(e.src=t.getAttribute("data-iesrc")),t.getAttribute("data-alt")&&(e.alt=t.getAttribute("data-alt")),t.appendChild(e)}if("video"===t.nodeName.toLowerCase()&&!t.getAttribute("data-src")&&t.children){for(var r=t.children,o=void 0,a=0;a<=r.length-1;a++)(o=r[a].getAttribute("data-src"))&&(r[a].src=o);t.load()}t.getAttribute("data-src")&&(t.src=t.getAttribute("data-src")),t.getAttribute("data-srcset")&&t.setAttribute("srcset",t.getAttribute("data-srcset")),t.getAttribute("data-background-image")&&(t.style.backgroundImage="url('"+t.getAttribute("data-background-image")+"')"),t.getAttribute("data-toggle-class")&&t.classList.toggle(t.getAttribute("data-toggle-class"))},loaded:function(){}};
/**
* Detect IE browser
* @const {boolean}
* @private
*/function f(t){t.setAttribute("data-loaded",!0)}var b=function(t){return"true"===t.getAttribute("data-loaded")};return function(){var r,o,a=0<arguments.length&&void 0!==arguments[0]?arguments[0]:".lozad",t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},e=g({},l,t),n=e.root,i=e.rootMargin,d=e.threshold,c=e.load,u=e.loaded,s=void 0;return window.IntersectionObserver&&(s=new IntersectionObserver((r=c,o=u,function(t,e){t.forEach(function(t){(0<t.intersectionRatio||t.isIntersecting)&&(e.unobserve(t.target),b(t.target)||(r(t.target),f(t.target),o(t.target)))})}),{root:n,rootMargin:i,threshold:d})),{observe:function(){for(var t=function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:document;return t instanceof Element?[t]:t instanceof NodeList?t:e.querySelectorAll(t)}(a,n),e=0;e<t.length;e++)b(t[e])||(s?s.observe(t[e]):(c(t[e]),f(t[e]),u(t[e])))},triggerLoad:function(t){b(t)||(c(t),f(t),u(t))},observer:s}}});

59
out/static/ranking.js Normal file
View File

@@ -0,0 +1,59 @@
function th(cur_col, cur_asc, names) {
var txt = '<tr>';
for (var i = 0; i < names.length; i++) {
var v = names[i];
txt += '\n<th>' + v;
if (v) {
let cls = (i == cur_col) ? ' class="active"' : '';
txt += ' <span><a' + (cur_asc == -1 ? cls : '') + ' onClick="sort_by('+i+', -1)">';
txt += '<svg viewBox="0 0 16 14" width="12"><g><polygon points="8,14 0,0 16,0"/></g></svg>';
txt += '</a><a' + (cur_asc == 1 ? cls : '') + ' onClick="sort_by('+i+', 1)">';
txt += '<svg viewBox="0 0 16 14" width="12"><g><polygon points="8,0 0,14 16,14"/></g></svg>';
txt += '</a></span>';
}
txt += '</th>';
}
return txt + '</tr>';
}
function td(cols, id) {
var txt = '\n<tr id="' + id + '">';
for (var i = 0; i < cols.length; i++) {
txt += '<td>' + cols[i] + '</td>';
}
return txt + '</tr>';
}
function prep(x, i) {
return [
i+1 + '. <img class="lozad" data-src="/app/'+x[0]+'/icon.png"/>', '<a href="/app/'+x[0]+'/">' + x[1] + '</a>',
x[2], HHmmss(x[3]), HHmmss(x[4]), as_pm(x[5]), as_pm(x[6]), x[7], x[8],
as_percent(x[9]), x[10], dot1(x[11]), new Date(x[12] * 1000).toISOString().slice(0, 16).replace('T',' ')
];
}
function update(col, asc) {
let table = document.getElementById('rank-list');
let len = _data.length;
let txt = '';
for (var i = 0; i < len; i++) {
txt += td(prep(_data[i], i), _data[i][0])
}
table.innerHTML = th(col, asc, [
'', 'Application', 'Number of recordings', 'Average recording time',
'Cumulative recording time', 'Average requests per minute',
'Total requests per minute', 'Number of domains', 'Number of subdomains',
'Tracker percentage', 'Total number of requests', 'Average number of requests',
'Last Update'
]) + txt;
const observer = lozad(); observer.observe();
}
function sort_by(col, asc) {
let i = col;
let o = asc;
_data.sort(function(a, b){ return a[i] < b[i] ? -o : a[i] > b[i] ? o : 0; });
update(col, asc);
}
function rank_js(fname) {
loadJSON(fname, function(response) {
_data = JSON.parse(response);
update(12,-1);
});
}

View File

@@ -1,25 +1,35 @@
(function(){// main entry
updateViewport();
addEventListener('touchstart', function() {}); // :hover
updateViewport();
addEventListener('touchstart', function() {}); // :hover
})();
function updateViewport() {// show at least 2 columns on mobile devices
var viewport = document.head.querySelector("meta[name=viewport]");
if (viewport && screen.width < 372) {
document.head.removeChild(viewport);
var x = document.createElement("meta");
x.setAttribute("name", "viewport");
x.setAttribute("content", "width=372");
document.head.appendChild(x);
}
var viewport = document.head.querySelector('meta[name=viewport]');
if (viewport && screen.width < 372) {
document.head.removeChild(viewport);
var x = document.createElement('meta');
x.setAttribute('name', 'viewport');
x.setAttribute('content', 'width=372');
document.head.appendChild(x);
}
}
function loadJSON(url, callback, async=true) {
var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json");
xobj.open('GET', url, async);
xobj.onreadystatechange = function () {
if (xobj.readyState == 4 && xobj.status == "200") {
callback(xobj.responseText);
}
};
xobj.send(null);
var xobj = new XMLHttpRequest();
xobj.overrideMimeType('application/json');
xobj.open('GET', url, async);
xobj.onreadystatechange = function () {
if (xobj.readyState == 4 && xobj.status == '200') {
callback(xobj.responseText);
}
};
xobj.send(null);
}
// formatting
function dot1(x) { return Math.round(x * 10) / 10; }
function as_percent(x) { return dot1(x * 100) + '%'; }
function as_pm(x) { return dot1(x) + '/min'; }
function HHmmss(seconds) {
const h = Math.floor(seconds / 3600);
const m = Math.floor((seconds % 3600) / 60);
const s = Math.round(seconds % 60);
return (h<10?'0'+h:h)+':'+(m<10?'0'+m:m)+':'+(s<10?'0'+s:s);
}

View File

@@ -100,7 +100,7 @@ footer .links {
margin: .5em auto 1em;
display: block;
}
#app-toc img, img.app-icon {
#app-toc img, #rank-list img, img.app-icon {
border-radius: 21.5%;
border: .7px solid #ccc;
}
@@ -150,6 +150,11 @@ p.subtitle { margin-top: .2em; }
.border { border: 1pt solid #CCC; }
.large { font-size: 1.2em; }
.stick-top { top: 0; position: sticky; padding: .8em 0 .5em; background: #FFF; }
.xscroll { overflow-x: scroll; max-width: 100%; }
.yscroll { overflow-y: scroll; max-height: 80vh; }
table.alternate td, table.alternate th { padding: .5em; }
table.alternate tr:nth-child(even) { background: #DDD; }
table.alternate tr:nth-child(odd) { background: #F9F9F9; }
/*#meta { margin-bottom: 2em; }*/
#meta .icons { margin-bottom: 2em; }
@@ -243,13 +248,27 @@ p.trckr { font-size: .9em; margin-left: .5em; }
.cs1{stroke:#CA0D3A}
/* Help needed */
#help-links td { padding: .5em; }
#help-links tr:nth-child(even) { background: #DDD; }
#help-links tr:nth-child(odd) { background: #F9F9F9; }
#help-links span.snd { display: table; }
#help-links .notyet { color: #D11; }
#help-links .done { color: #52C840; }
/* rank-list */
#rank-list th span { display: block; margin-top: 4px; }
#rank-list th { vertical-align: bottom; }
#rank-list th a { cursor:pointer; border: unset; padding: 0 5px; margin: 0 2px; }
#rank-list th a:hover { fill: #F00; }
#rank-list th a.active { fill: #CA0D3A; }
#rank-list th:not(:first-child) { min-width: 12ex; }
#rank-list img { width: 25px; height: 25px; vertical-align: bottom; }
#rank-list td { text-align: center; min-width: max-content; }
#rank-list td:nth-child(1) {
position: sticky; left: 0;
background: inherit;
text-align: right;
}
#rank-list td:nth-child(2) { text-align: left; }
/* responsive */
@media(max-width: 900px) {
#stats { grid-template-columns: repeat(2, max-content); }