|
|
|
WhatsPopularVon $1
Inhaltsverzeichniskeine GliederungReferenz: http://web.archive.org/web/201209261...es_Alternative /* WARNING
* WARNING: this community-contributed template is not fit for production use as it performs a complete db-scan with every invocation
* WARNING
*/
// Parameters:
// title: The title text
// Path: pathe to the starting page
// max: Maximum number of items to list
// depth: The level of sub page to evaluate
// reverse: Reverse to sort order
// blockstyle: Any valid in-line styles. Affects container that wraps entire template
// titlestyle: Any valid in-line styles. Affects the title section
// bodystype: Any valid in-line styles. Affects the body section
/*
In a dekiscript block:
WhatsPopular{ title: 'My Popular Pages',
path: '/resources',
max: 5,
depth: 2,
reverse: true,
};
Vesion History: 1.0 - Initial release
1.0.a - Changed from using div id's to div classes
1.1 - (neilw) Changed to using @pageid to find the pages from wiki.tree()
2.0 - Redesign: flex rows, right-aligned view badges, hover
*/
var ttl = ($0 ?? args.title ?? 'Whats New!');
var path = ($1 ?? args.path ?? page.path);
var maxnum = ($2 ?? args.max ?? 10);
var depth = ($3 ?? args.depth ?? 10);
var reverse = ($4 ?? args.reverse ?? true);
var blockstyle = ($5 ?? args.blockstyle ?? '');
var titlestyle = ($6 ?? args.titlestyle ?? '');
var bodystyle = ($7 ?? args.bodystyle ?? '');
var pageviews = 0;
var pagelist = [];
var pxml = wiki.tree(path,depth);
foreach(var pid in xml.list(pxml, "//a/@pageid")) {
let p = wiki.getpage(num.cast(pid));
let pagelist ..= [ {title: p.title, uri: p.uri, viewcount: p.viewcount } ];
}
let pagelist = list.sort(pagelist, 'viewcount', reverse);
<div class="wp-list" style=(bodystyle)>
foreach(var p in pagelist) {
if(__count >= maxnum) {break;}
if(p.uri) {
<div class="wp-row">
<span class="wp-link">; web.link(p.uri, p.title); </span>
<span class="wp-views">; <em class="wp-views-icon">; '◉'; </em>; ' ' .. num.format(p.viewcount,'##,#'); </span>
</div>;
}
}
</div>
div.wp-list {
padding: 0;
margin: 0;
}
div.wp-row {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 6px;
border-bottom: 1px solid #eee;
transition: background 0.15s ease;
}
div.wp-row:last-child {
border-bottom: none;
}
div.wp-row:hover {
background: #f0f6ff;
}
span.wp-link {
flex: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
span.wp-link a {
color: #0077aa;
text-decoration: none !important;
font-weight: bold;
font-size: 14px;
}
span.wp-link a:hover {
color: #005580;
text-decoration: underline !important;
}
span.wp-views {
display: inline-flex;
align-items: center;
gap: 4px;
background: #e8f4ff;
border: 1px solid #b8d8f0;
border-radius: 12px;
padding: 3px 10px 3px 8px;
font-size: 12px;
color: #0077aa;
font-weight: bold;
white-space: nowrap;
flex-shrink: 0;
}
em.wp-views-icon {
font-size: 11px;
font-style: normal;
opacity: 0.7;
}
/* Legacy classes - keep for backward compat */
div.whtspoptitle {
display: none;
}
div.whtspopbody {
padding: 0;
border: none;
}
Tags: (Schlagworte bearbeiten)
|