JSFiddle - React, Tailwind, and code Playground

by Chase Wilson

HTML

<script type="text/javascript">
  I18n.defaultLocale = "en";
  I18n.locale = "en";
</script>


  <iframe id="youtubeGallery_97049" width="100%" frameborder="0" allowtransparency="true"></iframe>

<script type="text/javascript">

    //Set app ID
    var app_id = 140201916047746;
    
        app_id = 140201916047746;
    
    
    //Set facebook user id
    var fb_uid = false;
    
    
    //Set brand template css and view level css
    var view_css = '20492/store_draft';
    
        var view_css = '20492/store_published';
    
    
    //Load youtube gallery
    $('iframe#youtubeGallery_97049').attr('src', 'https://youtubegallery.cpn.preview.vitrue.com/app/views/render.php?module_id=97049&app_id='+app_id+'&fb_uid='+fb_uid+'&view_css='+view_css);

    //Listening event to resize iframe height when new videos are loaded if fluid height enabled or set fixed height
    $.pm.bind('iframe_height', function(data){
  		console.log(data);
        if(97049 === data.module){
            if(data.scroll === 'fD'){
                $('#module_97049 #youtubeGallery_97049').attr('scrolling', 'no').height(data.iframe_height);
                FB.Canvas.setSize();
			}
            else{
                $('iframe#youtubeGallery_97049').attr('scrolling', 'yes').height(data.pixels);
            }
    	}
    });
</script>