54 lines
2.0 KiB
HTML
54 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>Federation Widget</title>
|
|
<link rel="stylesheet" href="style.css" type="text/css" />
|
|
</head>
|
|
<body>
|
|
|
|
<h1>Federation Widget</h1>
|
|
<p>The Federation widget parses the Atom output of your account. It shows the timeline from the personal or forum account on your personal blog or website. It works only if <a href="https://en.wikipedia.org/wiki/Cross-origin_resource_sharing" title="CORS at Wikipedia">CORS</a> is enabled on the server. Friendica and Hubzilla accounts are currently supported. You have to give the type of the account as the XML is different for the services (hooray for standards!). <br />
|
|
It makes most sense for static website generators like Pelican. You only have to include the Javascript file, the CSS part and a placeholder in your website template.</p>
|
|
<p>You can test the output with this file.</p>
|
|
<hr />
|
|
<form id="loadForm">
|
|
<p>
|
|
<label for="profile_domain">URL : </label> <input type="text" id="profile_domain" value="https://freunde.ma-nic.de">
|
|
</p>
|
|
<p>
|
|
<label for="server_type">Server Type : </label> <input type="text" id="server_type" value="friendica">
|
|
</p>
|
|
<p>
|
|
<label for="profile_type">Type : </label>
|
|
<select name="profile_type" form="loadForm" id="profile_type">
|
|
<option value="user">User</option>
|
|
<option value="group">Group</option>
|
|
</select>
|
|
</p>
|
|
<p>
|
|
<label for="profile_name">Name : </label> <input type="text" id="profile_name" value="marco">
|
|
</p>
|
|
<p>
|
|
<input type="submit" value="(re)Load">
|
|
</p>
|
|
</form>
|
|
|
|
<div id="federation-widget">
|
|
<p>Timeline activity...</p>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="./federation-widget.max.js">
|
|
var type = 'user'; // could be 'group' to follow a group
|
|
var servertype = 'friendica';
|
|
var user = 'marco';
|
|
var max = 5;
|
|
var tag = 'federation-widget';
|
|
</script>
|
|
|
|
<hr/>
|
|
<p>Get the code at <a href="http://github.com/lubuwest/federation-widget" title="Find federation-widget sources on Github">Federation Widget at Github</a></p>
|
|
|
|
</body>
|
|
</html>
|