Skip to content


Subversion checkout URL

You can clone with
Download ZIP
tree: d8af08de0e
Fetching contributors…

Cannot retrieve contributors at this time

333 lines (312 sloc) 12.597 kb
<!DOCTYPE html>
<title>Cinux Stream</title>
<meta charset="UTF-8" />
<script src=""></script>
<script src="popcorn.js"></script>
<script src="plugins/webpage/popcorn.webpage.js"></script>
<script src="plugins/googlemap/popcorn.googlemap.js"></script>
<script src="plugins/footnote/popcorn.footnote.js"></script>
<script src="plugins/twitter/popcorn.twitter.js"></script>
<script src="plugins/subtitle/popcorn.subtitle.js"></script>
<script src="plugins/tagthisperson/popcorn.tagthisperson.js"></script>
<script src="plugins/wikipedia/popcorn.wikipedia.js"></script>
<script src="plugins/flickr/"></script>
<script src="plugins/attribution/popcorn.attribution.js"></script>
<script src="plugins/lastfm/popcorn.lastfm.js"></script>
<script src="modules/timeline-sources/popcorn.timeline-sources.js"></script>
<script src="popcorn.applyclass.js"></script>
<script src="parsers/parserXML/popcorn.parserXML.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(document).ready(function () {
//Show hide the contents
$(".collapse").click(function () {
//Swap class names
$(".collapse").toggle(function () {
}, function () {
$(".collapse").toggle(function () {
$("span", this).text('Expand');
}, function () {
$("span", this).text('Collapse');
$('section').hover(function() {
}, function() {
setInterval(function() {
$('section.hover').each(function() {
if ($(this).attr('hoveron')) {
if ($('video')[0].currentTime-$(this).attr('hoveron')>1) {
}, 500);
document.addEventListener('DOMContentLoaded', function () {
// popcorn events are chainable this means that you can also do:
//; or p.footnote{};
// Make a popcorn instance, passing the id of the video element.
// notice the <video id='video' ... > at the bottom of the page.
var p = Popcorn('#cinuxstreamvids')
// use the footnote plugin
// notice the <div id='footnotediv'> tag at the bottom of the page
// ------------------
// start: 22, // seconds
// end: 30, // seconds
// text: 'this is a subtitle'
//} )
// ------------------
// make the video play automatically
}, false);
<!-- Start First Container Div -->
<div class="container-top">
<!-- Start Second Container Div -->
<div class="container-bot">
<!-- Start Wrapper Div -->
<div class="wrapper">
<!-- Start Header -->
<header id="global-header">
<a href="" class="logo"><img src="images/cstream_logo.png" alt="drumbeat_logo" width="255" height="87" /></a>
<!-- Start Login/Signup -->
<!--nav id="login">
<li><a href="#">log in</a></li>
<li><a href="#">sign up</a></li>
<!-- End Login/Signup -->
<!-- Start Primary Links -->
<nav id="demo-info">
<a href="#" onClick="javascript:void();" class="clickhere green">
<img src="images/video_icon.png" alt="" width="18" height="14" />Cinux Video Stream</a></li>
<!-- End Primary Links -->
<!-- End Header -->
<!-- Start Contents -->
<div id="contents">
<!-- Start Left Contents -->
<div class="left-content">
<!-- Start Video Div -->
<div id="videoContainer" class="video-div">
<video id="cinuxstreamvids" width="530" poster="images/poster.jpg" controls > <!-- loop --> <!--data-timeline-sources="xml/webMadeMovies.xml"-->
<source src="images/pcp.webm" type='video/ogg; codecs="theora, vorbis"'>
<!--<source src="" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>-->
<div id="overlaydiv" style="position:absolute;top:1px;left:1px"></div>
<!-- Start Video Info -->
<div class="video-info">
<!-- Start Choose Language -->
<div class="choose-language">
<h2>Choose your language</h2>
<select id="language">
<option value="gr">Greek</option>
<option value="en" selected="selected">English</option>
<option value="zh">Chinese</option>
<option value="fr">French</option>
<option value="de">German</option>
<option value="it">Italian</option>
<option value="ja">Japanese</option>
<option value="ko">Korean</option>
<option value="fa">Persian</option>
<option value="pl">Polish</option>
<option value="pt">Portuguese</option>
<option value="es">Spanish</option>
<div id="credit">
with help from
<br />
<a href="">Google Translate</a> and <a href="">
jQuery</a><br />
<input type="checkbox" id="accessibility" checked="checked" />All subtitles (accessibility)
<!-- End Choose Language -->
<!-- Start Foot Notes -->
<div class="foot-notes">
<h2>Pandora Cinux promo</h2>
<p id="footnotediv">
December 30, 2011 -
Pandora Cinux promotional video
<!-- End Foot Notes -->
<!-- End Video Info -->
<!-- End Video Div -->
<!-- End Left Contents -->
<!-- Start Right Contents -->
<div class="right-content">
<!-- <h1><span>Where to find Cinux</span></h1> -->
<!-- Start Column A -->
<div class="columna">
<!-- <section>
<div id="container3" class="google-map-title">
<h4>Filmed in:</h4>
<span id="mapinfo">Patras</span>
<img src="images/map.jpg"/>
<div id="container2" class="google-map"></div>
</section> -->
<h3><img src="images/logo_twitter.png" alt="Twitter" width="80" height="19" /></h3>
<a href="#" class="collapse"><span>Collapse</span></a>
<div id="twitter" class="content">
<script src=""></script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 5,
interval: 30000,
width: 239,
height: 350,
theme: {
shell: {
background: '#ffffff',
color: '#606060'
tweets: {
background: '#ffffff', // d7e7f0
color: '#171c1e',
links: '#146b9d'
features: {
scrollbar: false,
loop: false,
live: false,
behavior: 'all'
<!-- -->
<div class="overlay">
<div class="inactive"></div></div>
<!-- End Column A -->
<!-- Start Column B -->
<div class="columnb">
<h3><img src="images/facebook_banner.jpg" alt="Facebook" width="80" height="35" /></h3>
<a href="#" class="collapse"><span>Collapse</span></a>
<div class="content" id="lastfmdiv">
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); = id;
js.src = "";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
<div class="fb-like-box" data-href="" data-width="240" data-height="200" data-show-faces="true" data-stream="false" data-header="true"></div>
<div class="fb-like" data-href="" data-send="true" data-layout="button_count" data-width="240" data-show-faces="true" data-font="verdana"></div><div class="overlay"></div><div class="inactive"></div></div>
<h3><img src="images/google-logo-plus.png" alt="GooglePlus"/></h3>
<a href="#" class="collapse"><span>Collapse</span></a>
<div class="content" id="wikidiv">
<script type="text/javascript">
mbgc='ffffff';ww='240';mbc='ffffff';bbc='3F79D5';bmobc='3b71c6';bbgc='2378b6';bmoc='24467b';bfc='FFFFFF';bmofc='ffffff';tlc='ffffff';tc='a0a0a0';nc='171c1e';bc='171c1e';t='Cinux_on_';fs='16';fsb='13';bw='100';ff='4';pc='4889F0';b='s'; pid='115995459986143840660';
<script type="text/javascript" src="">
<div class="overlay">
<div class="inactive">
<!-- End Column B -->
<h1><span>For more videos...</span></h1>
<div id="container5">
<a href="" target="_blank">
<img src="images/png.png" width="510"/>
<!-- End Right Contents -->
<!-- End Contents -->
<a href="" target="_blank">
<img src="images/stream-tv.png" alt="footer_drumbeat" width="115" height="91" />
<!-- <p>This web page is powered by<br /><a href="" target="_blank">OSArena</a>, the Greek Open Source Arena.<br />
<a href="" target="_blank">Watch more videos about technology and Linux.<span>&raquo;</span></a>
</p> -->
<!--<div class="footer_drumbeat">
<img src="images/osarena-banner.png" alt="footer_drumbeat"/><p>Powered by everybody,<br />directed to everybody.</p>
<div class="copyright">&copy;2011-2012 Constantine Apostolou and Cinux. All content on this page is available under a Creative Commons license.</div>
<!-- End Wrapper Div -->
<!-- End Second Container Div -->
<!-- End First Container Div -->
<!-- Start Popup -->
<div class="pop-overlay">
<div class="popup">
<span class="close_btn">x</span>
<div class="popup-content">
<h1>About this page</h1>
Cinux Stream is a page where videos will be uploaded and streamed. People can visit this page and watch those videos and also share them.
<strong>Are you having trouble getting this demo to play?</strong><br />
This video will only play in modern browsers, such as Firefox 3.5+ or Safari 3+. Internet Explorer does not support open video codecs at the moment, so I won't bother making this page work in that browser.
<!-- End Popup -->
Jump to Line
Something went wrong with that request. Please try again.