Mastodon/mastofeed-iframe-embed
1
0
Fork 0
mirror of https://github.com/fenwick67/mastofeed synced 2025-01-05 13:37:33 +01:00
Code Issues Releases Wiki Activity

Update index.html

Browse Source
This commit is contained in:
Drew Harwell 2017-04-30 13:32:46 -05:00 committed by GitHub
parent 1aaeb6c5b8
commit 421932c725
1 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
static/index.html
View File

@ -1,28 +1,30 @@
<html><head></head><body> <html><head>
<title>Mastofeed - embeddable Mastodon feeds</title>
</head>
<body>
<h4>Example:</h4> <h4>Example:</h4>
<label>Instance URL:<input type="text" id="urlin" placeholder="octodon.social"></input></label><br> <label>Instance URL:<input type="text" id="urlin" placeholder="octodon.social"></label><br>
<label>Username:<input type="text" id="usernamein" placeholder="fenwick67"></input></label><br> <label>Username:<input type="text" id="usernamein" placeholder="fenwick67"></label><br>
<label>Width(px):<input type="text" id="width" value="400"></input></label><br> <label>Width(px):<input type="text" id="width" value="400"></label><br>
<label>Height(px):<input type="text" id="height" value="800"></input></label><br> <label>Height(px):<input type="text" id="height" value="800"></label><br>
<button onclick="genUrl()" value="generate">Generate</button> <button onclick="genUrl()" value="generate">Generate</button>
<br> <br>
<br> <br>
<label>Use this markup in your HTML: <input id="result" placeholder="result will go here"></input> <label>Use this markup in your HTML: <input id="result" placeholder="result will go here">
<br> <br>
<h4>Preview</h4> <h4>Preview</h4>
<iframe width="400" height="800" id="frame" sandbox src=""></iframe> <iframe width="400" height="800" id="frame" sandbox src=""></iframe>
<script> <script>
function genUrl(){ function genUrl(){
//https://octodon.social/users/fenwick67.atom
function val(id){ function val(id){
return document.getElementById(id).value; return document.getElementById(id).value;
} }
var inUrl = window.location.protocol + '//' + val('urlin') + '/users/'+val('usernamein')+'.atom'; var inUrl = 'https://' + val('urlin') + '/users/'+val('usernamein')+'.atom';
var iframeUrl = 'http://'+ window.location.hostname +((window.location.port && window.location.port!=80)?(':'+window.location.port):'') +"/api/feed?url="+encodeURIComponent(inUrl); var iframeUrl = window.location.protocol + '//'+ window.location.hostname +((window.location.port && window.location.port!=80)?(':'+window.location.port):'') +"/api/feed?url="+encodeURIComponent(inUrl);
document.getElementById('result').value = '<iframe sandbox width="'+val('width')+'" height="'+val('height')+'" src="'+iframeUrl+'"></iframe>'; document.getElementById('result').value = '<iframe sandbox width="'+val('width')+'" height="'+val('height')+'" src="'+iframeUrl+'"></iframe>';
var iframe = document.getElementById('frame'); var iframe = document.getElementById('frame');
@ -31,4 +33,5 @@ function genUrl(){
iframe.height = val('height'); iframe.height = val('height');
} }
</script> </script>
</body></html> </body>
</html>