d2jsp
Log InRegister
d2jsp Forums > Off-Topic > Computers & IT > Programming & Development > Any Idea For Web App Youtube Manager?
Add Reply New Topic New Poll
Member
Posts: 5,167
Joined: Nov 23 2006
Gold: 11.01
Apr 23 2014 09:54am
m creating a website for an org on campus and need to display their youtube playlist on a page... currently they just upload each video manually to the website and it's just a GIANT scroll down page.

I want to change this to some sort of better looking and easy management system.

I used this code and it works in html...but when I try to intertwine it in my View using CakePHP nothing comes up. Any idea how to fix this code to get it to display or know a better system?

This code would display the first video in a large, center piece and then to the right of it you would have tiny thumbnails that were scrollable to see all videos listed in that feed.

Code
<script type="text/javascript">

$(function() {

$("#youtube").osmplayer({

width: '100%',

height: '600px',

playlist: 'http://www.youtube.com/user/Mizzouwellness/feed'

});

});

</script>


<video id="youtube"></video>
Member
Posts: 2,217
Joined: Sep 10 2007
Gold: 35.88
Apr 30 2014 02:48pm
i wrote some code, once upon a time, which made embedded youtube videos responsive. Why wouldn't you just do that and combined with some kind of show/hide or accordion script? I'm pretty sure you can prevent them from using buffering until you press play.

This post was edited by grievance on Apr 30 2014 02:49pm
Member
Posts: 9,412
Joined: Nov 18 2009
Gold: 20.00
Apr 30 2014 07:37pm
Responsive VIMEO player I used on a website

HTML

Code
<div class="height-chamber">
<div class="responsive-container"style="z-index: 0;">
<iframe class="iframe" src="//player.vimeo.com/video/77015707" width="400" height="300" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>
</div>


CSS:

Code
.height-chamber {max-width: 800px; max-height: 700px;margin: 0 auto;}
.responsive-container {width:100%;margin: 0 auto; position: relative;padding: 0; padding-bottom: 56.25%; padding-top: 70px; height: 0;overflow: hidden; }
.responsive-container iframe {margin: auto; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


This post was edited by PixileDust on Apr 30 2014 07:37pm
Go Back To Programming & Development Topic List
Add Reply New Topic New Poll