Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Playlist Player Public Show View
<div class="container">
<h1 class="player-title">[player-title]</h1>
<h2 class="video-title">[selected video-title]</h2>
<ul class="playlist-list [many/single - depending if there are many playlists assigned or not]">
<!-- A list element will be created for every playlist assigned to the player -->
<li class="playlist-row [even/odd - alternating for zebra styling] [current - on the currently selected playlist]" data-playlist-id="[playlist-id]">
<span class="title"><a href="#" onclick="[method-for-loading-playlist]">[playlist-title]</a></span>
</li>
<!-- the list ends with a 'last' li useful for clearing if you're using float for the playlist-rows -->
<li class="last"></li>
</ul>
<div id="embed-holder" class="player">
[flash/html5-player - depending on browser and flash support]
</div>
<h3 class="playlist-title">[selected playlist-title]</h3>
<ul class="video-list">
<!-- A list element will be created for every video included in the selected playlist -->
<li class="video-row [even/odd - alternating for zebra styling] [current - on the currently selected video]" data-video-id="[video-id]">
<span class="thumbnail"><a href="#" onclick="[method-for-loading-video]"><img src="[link to video-image thumbnail]" alt=""></img></a></span>
<span class="duration">[video-duration]</span>
<span class="title"><a href="#" onclick="[method-for-loading-video]">[video-title]</a></span>
<span class="description">[video-description]</span>
</li>
</ul>
<div class="pagination">
<span class="current-span">[current video span, ex. 1-4]</span>
<span class="of">/</span>
<span class="page-count">[total number of videos]</span>
<ul class="page-list">
<!-- A list element will be created for every page used for pagination -->
<li class="page-row [current - on the currently selected page]" data-page-number="[page-number]">[page-number]</li>
</ul>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.