DOAP ('Description Of A Project') is a specification for describing software projects. It was extended to include implementation status of XEPs in XMPP software, see XEP-0453.
This XSL stylesheet makes DOAP files render nicely in web browsers with XSLT support.
Reference the stylesheet in your DOAP xml file:
<?xml-stylesheet href="style.xsl" type="text/xsl"?>
That's it!
Most web browsers natively support XSLT, so, people opening your file in a web browser will now see a nice webpage. And computers can easily make sense of the raw XML data which is presented to them in a standardized way.
If you want to adapt the primary color of the rendering to your client, just change the HSL color variables in style.css
to your needs:
:root {
/* Primary color in HSL: Change this to customize all colored elements */
--color-h: 210;
--color-s: 13%;
--color-l: 50%;
}
How does it look in the end? Have a look at this sample rendering.
DOAP files can be rendered in an existing website (e.g. built using Hugo, Doxygen or other systems) by using an <iframe>
element.
How does rendering a DOAP file on my website work? You need:
- a DOAP file (here:
doap.xml
) for your project - style.xsl from this repository
- style.css from this repository
- optional: xeplist.xml from xmpp.org
A few URLs need to be adapted to your website's structure.
-
Add the stylesheet to your
doap.xml
:<?xml-stylesheet href="style.xsl" type="text/xsl"?>
-
Make sure that
style.xsl
points to where you storestyle.css
on your website:<link href="style.css" type="text/css" rel="stylesheet"/>
-
Optional: Download xeplist.xml from xmpp.org, and reference it in
style.xsl
:<xsl:variable name="xeplist" select="document('https://your-website.tld/xeplist.xml')/xep-infos" />
Please note: This step is a workaround! Due to a bug in Chromium, XSL files cannot request external resources, even if CORS headers are set correctly. Make sure to update
xeplist.xml
periodically, until this bug is fixed.
To integrate your DOAP file with your website, you need to add an <iframe>
element:
<iframe src="doap.xml" width="100%" frameborder="0">
Since an <iframe>
's height cannot be determined before it is rendered, you can apply this javascript snippet to adjust the frame's height:
function resizeIframe(iframe) {
iframe.style.height = iframe.contentWindow.document.documentElement.scrollHeight + 20 + 'px';
}
You can either integrate this with your existing javascript, or add it to the frame's onload
event:
<iframe src="doap.xml" width="100%" frameborder="0" onload="resizeIframe(this)">