view mod_http_muc_log/res/http_muc_log.html @ 4936:a85efae90e21

mod_rest: Expand mapping of XEP-0045 join stanza The previous 'join' mapping was apparently lost in translation when swithing to datamapper, so might as well map some properties allowing history control. Usually you probably want either zero history or history since the last known time of being joined. Maybe that the former should be the default?
author Kim Alvefur <zash@zash.se>
date Sat, 30 Apr 2022 01:00:01 +0200
parents b65a363d32d2
children 479d618c9e6d
line wrap: on
line source

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
{date&<meta name="dcterms.date" content="{date}">}
<title>{title?{room.name?{jid_node}}{date& - {date}}}</title>
<style>
:link,:visited{color:#3465a4;text-decoration:none;}
:link:hover,:visited:hover{color:#6197df;}
body{background-color:#eeeeec;margin:1ex 0;padding-bottom:3em;font-family:Arial,Helvetica,sans-serif;}
ul,ol{padding:0;}
li{list-style:none;}
hr{visibility:hidden;clear:both;}
br{clear:both;}
header,footer{margin:1ex 1em;}
footer{font-size:smaller;color:#babdb6;}
nav{font-size:large;margin:1ex 1ex;clear:both;line-height:1.5em;}
footer nav .up{display:none;}
@media screen and (min-width: 460px) {
nav {font-size:x-large;margin:1ex 1em;}
}
nav a{padding:1ex}
nav li,nav dt{margin:1ex}
nav .up{font-size:smaller;display:block;clear:both;}
nav .up::before{content:"↑ ";}
nav .prev{float:left;}
nav .next{float:right;}
nav .next::after{content:" →";}
nav .prev::before{content:"← ";}
nav .last::after{content:" ⇥";}
nav :empty::after,nav :empty::before{content:""}
table{display:inline-block; margin:1ex 1em;vertical-align:top;}
th{font-size:x-small}
td{text-align:right;color:#bababa}
td > a, td > span{padding:0.4em}
.content{background-color:white;padding:1em;list-style-position:inside;}
.time{float:right;font-size:small;opacity:0.2;}
li:hover .time{opacity:1;}
.description{font-size:smaller;}
.body{white-space:pre-line;}
.body::before,.body::after{content:"";}
.presence .verb{font-style:normal;color:#30c030;}
.unavailable .verb{color:#c03030;}
.button{display:inline-block}
.button>a{color:white;background-color:orange;border-radius:4px}
form{text-align:right}
li.edited{display:none}
li:target{outline:1px gray dotted;display:inherit}
@media (prefers-color-scheme: dark) {
html{color:#eee}
body{background-color:#161616}
.content{background-color:#1c1c1c}
footer{color:#444}
td{color:#444}
.button>a{background-color:#282828}
}
</style>
</head>
<body>
<header>
<h1 {lang&lang="{lang}"} title="xmpp:{jid?}">{title?{room.name?{jid_node}}{date& - {date}}}</h1>
<nav>
<ul>
{jid_node&
<li class="button"><a href="xmpp:{jid?}?join">Join using a client</a></li>
}
{room.webchat_url&
<li class="button"><a href="{room.webchat_url}">Join via web</a></li>
}
{links#
<li><a class="{item.rel?}" href="{item.href}{hide_presence&?p=h}" rel="{item.rel?}">{item.text}</a></li>}
</ul>
</nav>
</header>
<hr>
<main {lang&lang="{lang}"} class="content">
<nav>
<dl class="room-list">
{rooms#
<dt {item.lang&lang="{item.lang}"} class="name"><a href="{item.href}{hide_presence&?p=h}">{item.name}</a></dt>
<dd {item.lang&lang="{item.lang}"} class="description">{item.description?}</dd>}
</dl>
{dates|calendarize#
<h2 id="{item.year}">{item.year}</h2>
{item.months#
<table id="{item.month}-{item.year}">
<caption>{item.month}</caption>
<thead><tr><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th>Sat</th><th>Sun</th></tr></thead>
<tbody>{item.weeks#
<tr>{item.days#<td>{item.href&<a href="{item.href}{hide_presence&?p=h}">}<span>{item.day?&nbsp;}</span>{item.href&</a>}</td>}</tr>}
</tbody>
</table>
}
}
</nav>

<div>
{presence_available&<form>
<label>
<input name="p" value="h" type="checkbox"{hide_presence& checked}>
<span>Hide joins and parts</span>
</label>
<noscript>
<button type="submit">Apply</button>
</noscript>
</form>}
</div>

<ol class="chat-logs">{lines#
<li {item.lang&lang="{item.lang}"} class="{item.st_name} {item.st_type?} {item.edited&edited}" id="{item.key}">
<a class="time" href="#{item.key}"><time id="{item.time}" datetime="{item.datetime}">{item.time}</time></a>
<b class="nick">{item.nick}</b>
<em class="verb">{item.verb?}</em>
<q class="body">{item.edited&<del>}{item.body?}{item.edited&</del> <a href="#{item.edited}">&#9998;</a>}{item.edit& <a href="#{item.edit}">&#9999;</a>}</q>
{item.oob.url&<figure><a rel="nofollow" href="{item.oob.url?}"><img style="max-height:9em;max-width:16em" alt="{item.oob.desc?}" src="{item.oob.url?}"/></a><figcaption>{item.oob.desc?}</figcaption></figure>}
</li>}
</ol>
</main>
<hr>
<footer>
<nav>
<ul>{links#
<li><a class="{item.rel?}" href="{item.href}{hide_presence&?p=h}" rel="{item.rel?}">{item.text}</a></li>}
</ul>
</nav>
<br>
<div class="powered-by">Prosody</div>
</footer>
<script>
/*
* Local timestamps
*/
(function () {
var timeTags = document.getElementsByTagName("time");
var i = 0, tag, date;
while(timeTags[i]) {
tag = timeTags[i++];
if(date = tag.getAttribute("datetime")) {
date = new Date(date);
tag.textContent = date.toLocaleTimeString(navigator.language);
tag.setAttribute("title", date.toString());
}
}
document.forms[0].elements.p.addEventListener("change", function() {
document.forms[0].submit();
});
})();
</script>
</body>
</html>