Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Testing Gist embedding

#Gist Embeds

All you need to know is that these gists will be included in the page. So rad.

How does it work?

Simply include the link in your post and it will show up inline, with syntax highlighting and everything.

 > Here is some posted text, followed by a Gist:
 > https://gist.github.com/1002914

There you go! Still working on this, so I wouldn't use it yet. But soon!

define([
'lib/jquery.embedly-sp',
'sprintly/common/settings'
], function(undefined, Settings) {
var Embed = {};
Embed.matchers = {
'gist': RegExp('^(https?://)?gist.github.com/([0-9]+)(#file_(.*))?$', 'i')
};
Embed.gist = function($el, url) {
console.log('Embed gist', this, $el, url);
var url = Embed.gist.getUrl(url);
if (url) {
$.ajax(url, {
dataType: 'json',
context: $el,
success: function (json) {
$(json.div).addClass('embed embed-gist').replaceAll(this).trigger('embed:loaded', json);
}
});
}
};
Embed.gist.getUrl = function(url) {
var https = false, id, file;
var match = Embed.matchers.gist.exec(url);
if (match) {
https = match[1] == 'https://';
id = match[2];
file = match[4];
}
if (!id) {
return null;
}
var url = (https ? 'https' : 'http') + '://gist.github.com/' + id + '.json?';
if (file) {
url += 'file=' + file + '&';
}
url += 'callback=?';
return url;
}
Embed.onJson = function(e, json) {
console.log('Embed json', arguments);
};
Embed.onOembed = function(e, oembed) {
console.log('Embed oembed', arguments);
};
Embed.onPreviewSuccess = function(embed, node) {
console.log('Embed preview', arguments);
};
// Register as a jQuery plugin
(function($) {
$.embed = $.embed || {};
if ($.embed.version) {
return;
}
$.extend({
embed: function(els, options) {
var embedlyEls = [];
$.each(els, function() {
var url = $(this).attr('href');
var $el = $(this);
if (typeof url !== "undefined" && url) {
for(i in Embed.matchers) {
if (Embed.matchers[i].test(url)) {
Embed[i].call(this, $el, url);
return true;
}
}
embedlyEls.push(this);
}
});
// Pass non-special cases to Embed.ly
console.log('embedly passthrough', embedlyEls)
$(embedlyEls).embedly($.extend({}, options.embedly));
return this;
}
});
$.embed.version = "0.1";
$.embed.defaults = {
method: 'fancy',
embedly: {
apiUrl: '/embed/proxy/',
endpoint: 'preview',
urlRe: Settings.EMBEDLY_RE,
allowscripts: true,
method: 'after',
maxWidth: 520,
wmode: 'transparent',
success: Embed.onPreviewSuccess
}
};
$.fn.embed = function(options) {
var settings = $.extend({}, $.embed.defaults, options);
var embedables = [];
this.each(function() {
if (typeof $(this).attr('href') !== "undefined"){
embedables.push(this);
} else {
$(this).find('a').each(function() {
embedables.push(this);
});
}
});
$.embed(embedables, settings);
return this;
};
})(jQuery);
return Embed;
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment