From 6d988069c745a4b5ee0abc502597db4a8adb92f9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lorenz=20H=C3=BCbschle-Schneider?= <lorenz-dev@lgh-alumni.de> Date: Sat, 9 Aug 2014 14:17:36 +0100 Subject: [PATCH] Add asynchronous GitHub Gist embedding plugin requires a few selectors to be more precise in our CSS --- css/glowingbear.css | 27 ++++++++++++--------------- js/plugins.js | 40 +++++++++++++++++++++++++++++++++++++++- 2 files changed, 51 insertions(+), 16 deletions(-) diff --git a/css/glowingbear.css b/css/glowingbear.css index 7f803ee..108fa9d 100644 --- a/css/glowingbear.css +++ b/css/glowingbear.css @@ -38,20 +38,6 @@ a { cursor: pointer; } -table { - width: 100%; -} -tr { - line-height: 100%; -} -tr:hover { - background-color: #222222; -} -td.time { - padding: 1px 5px 1px 1px; - vertical-align: top; -} - .repeated-time { } .repeated-time .cof-chat_time, @@ -281,8 +267,19 @@ input[type=text], input[type=password], #sendMessage, .badge { -webkit-transition:0.35s ease all; transition:0.35s ease all; } -#bufferlines table { +#bufferlines > table { margin-top: 35px; + width: 100%; +} +tr.bufferline { + line-height: 100%; +} +tr.bufferline:hover { + background-color: #222222; +} +td.time { + padding: 1px 5px 1px 1px; + vertical-align: top; } .withnicklist { diff --git a/js/plugins.js b/js/plugins.js index d795dbe..4febfc3 100644 --- a/js/plugins.js +++ b/js/plugins.js @@ -129,6 +129,19 @@ plugins.service('plugins', ['userPlugins', '$sce', function(userPlugins, $sce) { * */ plugins.factory('userPlugins', function() { + // standard JSONp origin policy trick + var jsonp = function (url, callback) { + var callbackName = 'jsonp_callback_' + Math.round(100000 * Math.random()); + window[callbackName] = function(data) { + delete window[callbackName]; + document.body.removeChild(script); + callback(data); + }; + + var script = document.createElement('script'); + script.src = url + (url.indexOf('?') >= 0 ? '&' : '?') + 'callback=' + callbackName; + document.body.appendChild(script); + }; var urlRegexp = RegExp(/(?:ftp|https?):\/\/\S*[^\s.;,(){}<>]/g); @@ -313,8 +326,33 @@ plugins.factory('userPlugins', function() { ); yrPlugin.name = "meteogram"; + // Embed GitHub gists + var gistPlugin = new Plugin( + urlPlugin(function(url) { + var regexp = /^https:\/\/gist\.github.com\/[^.?]+/i; + var match = url.match(regexp); + if (match) { + // get the URL from the match to trim away pseudo file endings and request parameters + url = match[0] + '.json'; + // load gist asynchronously -- return a function here + return function() { + var element = document.querySelector('.embed_' + this.$$hashKey); + jsonp(url, function(data) { + // Add the gist stylesheet only once + if (document.querySelectorAll('link[rel=stylesheet][href="' + data.stylesheet + '"]').length < 1) { + var stylesheet = '<link rel="stylesheet" href="' + data.stylesheet + '"></link>'; + document.getElementsByTagName('head')[0].innerHTML += stylesheet; + } + element.innerHTML = '<div style="clear:both">' + data.div + '</div>'; + }); + }; + } + }) + ); + gistPlugin.name = 'Gist'; + return { - plugins: [youtubePlugin, dailymotionPlugin, allocinePlugin, imagePlugin, spotifyPlugin, cloudmusicPlugin, googlemapPlugin, asciinemaPlugin, yrPlugin] + plugins: [youtubePlugin, dailymotionPlugin, allocinePlugin, imagePlugin, spotifyPlugin, cloudmusicPlugin, googlemapPlugin, asciinemaPlugin, yrPlugin, gistPlugin] };