Skip to content

Instantly share code, notes, and snippets.

@trabus
Created January 5, 2014 06:40
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save trabus/8265176 to your computer and use it in GitHub Desktop.
Save trabus/8265176 to your computer and use it in GitHub Desktop.
Discourse embed code
/* global discourseUrl */
/* global discourseEmbedUrl */
(function() {
var comments = document.getElementById('discourse-comments'),
iframe = document.createElement('iframe');
iframe.src = discourseUrl + "embed/comments?embed_url=" + encodeURIComponent(discourseEmbedUrl);
iframe.id = 'discourse-embed-frame';
iframe.width = "100%";
iframe.frameBorder = "0";
iframe.scrolling = "no";
comments.appendChild(iframe);
// Thanks http://amendsoft-javascript.blogspot.ca/2010/04/find-x-and-y-coordinate-of-html-control.html
function findPosY(obj)
{
var top = 0;
if(obj.offsetParent)
{
while(1)
{
top += obj.offsetTop;
if(!obj.offsetParent)
break;
obj = obj.offsetParent;
}
}
else if(obj.y)
{
top += obj.y;
}
return top;
}
function postMessageReceived(e) {
if (!e) { return; }
if (discourseUrl.indexOf(e.origin) === -1) { return; }
if (e.data) {
if (e.data.type === 'discourse-resize' && e.data.height) {
iframe.height = e.data.height + "px";
}
if (e.data.type === 'discourse-scroll' && e.data.top) {
// find iframe offset
var destY = findPosY(iframe) + e.data.top;
window.scrollTo(0, destY);
}
}
}
window.addEventListener('message', postMessageReceived, false);
})();
<html>
<!-- Just an example ripped from EvilTrout's blog for context -->
<body>
<div id="content">
<h1>Content</h1>
<p>
Content goes here.
</p>
</div>
<div id="discourse-comments"></div>
<script type="text/javascript">
var discourseUrl = "http://fishtank.eviltrout.com/",
discourseEmbedUrl = 'http://eviltrout.com/2013/06/15/ember-vs-angular.html';
(function() {
var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
d.src = discourseUrl + 'javascripts/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
})();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment