[nodebb-plugin-youtube] Youtube Embed Plugin



  • Thanks @a_5mith 😄



  • I'm missing the full screen button...... what's the hack?



  • You would add allowfullscreen to your iFrame code, alternatively, use the youtube-lite plugin for lazy loading and other niceties. It's the plugin that's used here. 👍



  • @Hero sorry for the delay.

    Here is the updated library.js file you'll need. It will extract the youtube ID from the iFrame, and place it into the lazy load iFrame code instead so will work the same way.

    (function(module) {
    	"use strict";
    
    	var YoutubeLite = {},
    		embed = '<div class="js-lazyYT" data-youtube-id="$1" data-width="640" data-height="360"><iframe class="lazytube" src="//www.youtube.com/embed/$1"></iframe></div>';
    
    	var	regularUrl = /<a href="(?:https?:\/\/)?(?:www\.)?(?:youtube\.com)\/(?:watch\?v=)(.+)">.+<\/a>/g;
            var	shortUrl = /<a href="(?:https?:\/\/)?(?:www\.)?(?:youtu\.be)\/(.+)">.+<\/a>/g;
            var	embedUrl = /<a href="(?:https?:\/\/)?(?:www\.)youtube.com\/embed\/([\w\-_]+)">.+<\/a>/;
    		var iFrameUrl = /<iframe width="560" height=""315" src\=\"(?:https?:\/\/)?(?:www\.)youtube.com\/embed\/([\w\-_]+)" frameborder="0" allowFullScreen=""><\/iframe>/g;
    
        YoutubeLite.parse = function(data, callback) {
            if (!data || !data.postData || !data.postData.content) {
                return callback(null, data);
            }
            if (data.postData.content.match(embedUrl)) {
                data.postData.content = data.postData.content.replace(embedUrl, embed);
            }
            if (data.postData.content.match(regularUrl)) {
                data.postData.content = data.postData.content.replace(regularUrl, embed);
            }
            if (data.postData.content.match(shortUrl)) {
                data.postData.content = data.postData.content.replace(shortUrl, embed);
            }
    		if (data.PostData.content.match(iFrameUrl)) {
    			data.postData.content = data.PostData.content.replace(iFrameUrl, embed);
    		}
            callback(null, data);
    
        };
    
    	module.exports = YoutubeLite;
    }(module));
    


  • @a_5mith SOS Comrade 🙂 If i use that code in my library.js i get NGINX 502 for all single posts, even those where no videos embedded



  • @Bobber said:

    @a_5mith SOS Comrade 🙂 If i use that code in my library.js i get NGINX 502 for all single posts, even those where no videos embedded

    Strange, I'll do some testing. Can you post the contents of ./nodebb dev



  • @3rd-Party-Developers thats what i got in there

    Screen Shot 2015-03-26 at 1.37.36 PM.png


  • GNU/Linux Admin

    @Bobber Try less logs/output.log



  • @julian 17/1 01:50 [7905] - ESC[32minfoESC[39m: Time: Sat Jan 17 2015 01:50:22 GMT-0500 (EST)
    17/1 01:50 [7905] - ESC[32minfoESC[39m: Initializing NodeBB v0.6.0
    17/1 01:50 [7905] - ESC[32minfoESC[39m: NodeBB is now listening on: 0.0.0.0:4567
    17/1 01:50 [7905] - ESC[32minfoESC[39m: NodeBB Ready
    npm WARN package.json nodebb-plugin-dbsearch@0.1.0 No repository field.
    npm WARN package.json reds@0.2.4 No repository field.
    nodebb-plugin-coub@0.0.7 node_modules/nodebb-plugin-coub
    Clustering enabled: Spinning up 1 process(es).
    17/1 01:52 [7905] - ESC[32minfoESC[39m: [app] Shutdown (SIGTERM/SIGINT) Initialised.

    17/1 01:52 [7905] - ESC[32minfoESC[39m: [app] Database connection closed.
    17/1 01:52 [7905] - ESC[32minfoESC[39m: [app] Web server closed to connections.
    17/1 01:52 [7905] - ESC[32minfoESC[39m: [app] Shutdown complete.
    [cluster] Child Process (7905) has exited (code: 0, signal: null)
    17/1 01:52 [7926] - ESC[32minfoESC[39m: Time: Sat Jan 17 2015 01:52:07 GMT-0500 (EST)
    17/1 01:52 [7926] - ESC[32minfoESC[39m: Initializing NodeBB v0.6.0

    And chrome tools:

    Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471172185-5 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471172642-6 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471173299-7 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471174155-8 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471175216-9 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471175474-10 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471175938-11 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471176603-12 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471177459-13 Failed to load resource: the server responded with a status of 502 (Bad Gateway)
    http://forum.chicagoff.com/socket.io/?EIO=3&transport=polling&t=1427471178514-14 Failed to load resource: the server responded with a status of 502 (Bad Gateway)



  • @julian @a_5mith and this only happening when i use the code from below, when i switch back
    everything works as a charm.

    (function(module) {
    	"use strict";
    
    	var YoutubeLite = {},
    		embed = '<div class="js-lazyYT" data-youtube-id="$1" data-width="800" data-height="450"><iframe class="lazytube" src="//www.youtube.com/embed/$1"></iframe></div>';
    
    	    var	regularUrl = /<a href="(?:https?:\/\/)?(?:www\.)?(?:youtube\.com)\/(?:watch\?v=)(.+)">.+<\/a>/g;
            var	shortUrl = /<a href="(?:https?:\/\/)?(?:www\.)?(?:youtu\.be)\/(.+)">.+<\/a>/g;
            var	embedUrl = /<a href="(?:https?:\/\/)?(?:www\.)youtube.com\/embed\/([\w\-_]+)">.+<\/a>/;
    
        YoutubeLite.parse = function(data, callback) {
            if (!data || !data.postData || !data.postData.content) {
                return callback(null, data);
            }
            if (data.postData.content.match(embedUrl)) {
                data.postData.content = data.postData.content.replace(embedUrl, embed);
            }
            if (data.postData.content.match(regularUrl)) {
                data.postData.content = data.postData.content.replace(regularUrl, embed);
            }
            if (data.postData.content.match(shortUrl)) {
                data.postData.content = data.postData.content.replace(shortUrl, embed);
            }
            callback(null, data);
    
        };
    
    	module.exports = YoutubeLite;
    }(module));

Log in to reply
 

Suggested Topics

| |