2017-04-30 20:32:46 +02:00
|
|
|
<html><head>
|
|
|
|
|
<title>Mastofeed - embeddable Mastodon feeds</title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
2017-04-30 04:54:46 +02:00
|
|
|
<h4>Example:</h4>
|
2017-04-30 20:32:46 +02:00
|
|
|
<label>Instance URL:<input type="text" id="urlin" placeholder="octodon.social"></label><br>
|
|
|
|
|
<label>Username:<input type="text" id="usernamein" placeholder="fenwick67"></label><br>
|
|
|
|
|
<label>Width(px):<input type="text" id="width" value="400"></label><br>
|
|
|
|
|
<label>Height(px):<input type="text" id="height" value="800"></label><br>
|
2017-04-30 04:14:25 +02:00
|
|
|
|
2017-04-30 04:54:46 +02:00
|
|
|
<button onclick="genUrl()" value="generate">Generate</button>
|
|
|
|
|
<br>
|
|
|
|
|
<br>
|
2017-04-30 20:32:46 +02:00
|
|
|
<label>Use this markup in your HTML: <input id="result" placeholder="result will go here">
|
2017-04-30 04:54:46 +02:00
|
|
|
<br>
|
|
|
|
|
<h4>Preview</h4>
|
|
|
|
|
<iframe width="400" height="800" id="frame" sandbox src=""></iframe>
|
|
|
|
|
<script>
|
|
|
|
|
function genUrl(){
|
|
|
|
|
function val(id){
|
|
|
|
|
return document.getElementById(id).value;
|
|
|
|
|
}
|
|
|
|
|
|
2017-04-30 20:32:46 +02:00
|
|
|
var inUrl = 'https://' + val('urlin') + '/users/'+val('usernamein')+'.atom';
|
2017-04-30 04:54:46 +02:00
|
|
|
|
|
|
|
|
|
2017-04-30 20:32:46 +02:00
|
|
|
var iframeUrl = window.location.protocol + '//'+ window.location.hostname +((window.location.port && window.location.port!=80)?(':'+window.location.port):'') +"/api/feed?url="+encodeURIComponent(inUrl);
|
2017-04-30 20:37:22 +02:00
|
|
|
document.getElementById('result').value = '<iframe sandbox="allow-top-navigation" width="'+val('width')+'" height="'+val('height')+'" src="'+iframeUrl+'"></iframe>';
|
2017-04-30 04:54:46 +02:00
|
|
|
|
|
|
|
|
var iframe = document.getElementById('frame');
|
|
|
|
|
iframe.src = iframeUrl;
|
|
|
|
|
iframe.width = val('width');
|
|
|
|
|
iframe.height = val('height');
|
|
|
|
|
}
|
|
|
|
|
</script>
|
2017-04-30 20:32:46 +02:00
|
|
|
</body>
|
|
|
|
|
</html>
|
