Skip to content

Commit

Permalink
major changeset
Browse files Browse the repository at this point in the history
  • Loading branch information
@rwaldron
rwaldron committed Jan 26, 2011
1 parent 74358ac commit a1a57d8
Show file tree
Hide file tree
Showing 51 changed files with 6,703 additions and 509 deletions.
4 changes: 2 additions & 2 deletions css/screen.css
View file
Expand Up @@ -104,7 +104,7 @@ form.inline p {margin-bottom:0;}
.info a {color:#205791;}

/* grid.css */
.container {width:1030px;margin:0 auto;}
.container {width:960px;margin:0 auto;}
.showgrid {background:url(src/grid.png);}
.column, .span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10, .span-11, .span-12, .span-13, .span-14, .span-15, .span-16, .span-17, .span-18, .span-19, .span-20, .span-21, .span-22, .span-23, .span-24, .span-25, .span-26, .span-27, .span-28 {float:left;margin-right:10px;}
.last {margin-right:0;}
Expand Down Expand Up @@ -265,4 +265,4 @@ hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:1px;margi
hr.space {background:#fff;color:#fff;visibility:hidden;}
.clearfix:after, .container:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}
.clearfix, .container {display:block;}
.clear {clear:both;}
.clear {clear:both;}
21 changes: 16 additions & 5 deletions css/sotu.css
View file
Expand Up @@ -6,8 +6,8 @@ body {

video {
/*border:1px solid black;*/
width:350px;
height: 300px;
width: 710px;/*512px;*/
height: 290px;
background: #000;
/*margin:10px auto;*/
/*margin:10px 10px;*/
Expand Down Expand Up @@ -54,18 +54,21 @@ header{
padding:0;
height:50px;
/*overflow:hidden;*/
/*
background: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.76, rgb(255,255,255)),
color-stop(0, rgb(204,204,204))
color-stop(0, rgb(255,255,255)),
color-stop(0.5, rgb(204,204,204))
);
background: -moz-linear-gradient(
center bottom,
rgb(204,204,204) 0%,
rgb(255,255,255) 76%
);
*/
}
footer.container {
margin-top: 30px;
Expand Down Expand Up @@ -144,6 +147,7 @@ canvas{
.select-li{padding:.1em;list-style-type:none}
.select-li h3 { margin-bottom: 0; }

#analysis ul{list-style-type:none}

.icon{vertical-align: middle;}

Expand All @@ -163,10 +167,17 @@ canvas{
}

.ui-accordion-panel div {
height: 220px;
margin-top:-2px;
height: 250px;
overflow-y:scroll;
}

#ui-lower {
height: 290px;

}


#ui-tools-accordion div {
height: 180px;
overflow-y:scroll;
Expand Down
678 changes: 678 additions & 0 deletions data/sotu-data-draft.js
View file

Large diffs are not rendered by default.

680 changes: 680 additions & 0 deletions data/sotu-data-draft.json
View file

Large diffs are not rendered by default.

189 changes: 53 additions & 136 deletions index.html
View file
Expand Up @@ -8,186 +8,103 @@
<!-- Styles -->
<link href="css/screen.css" rel="stylesheet" type="text/css" media="screen, projection">
<link href="css/print.css" rel="stylesheet" type="text/css" media="print">
<link href="css/Aristo/jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css">
<link href="css/sotu.css" rel="stylesheet" type="text/css" media="screen, projection">

<!-- Fave Libs and extensions-->
<script src="js/underscore.min.js"></script>
<script src="js/markdown.js"></script>

<script src="js/jquery.js"></script>
<script src="js/jquery-ui.min.js"></script>

<!-- Popcorn plugins -->
<script src="popcorn-js/popcorn.js"></script>
<script src="popcorn-js/plugins/googlemap/popcorn.googlemap.js"></script>
<script src="popcorn-js/dist/popcorn.min.js"></script>
<script src="popcorn-js/plugins/footnote/popcorn.footnote.js"></script>
<script src="popcorn-js/plugins/webpage/popcorn.webpage.js"></script>
<script src="popcorn-js/plugins/flickr/popcorn.flickr.js"></script>
<script src="popcorn-js/plugins/image/popcorn.image.js"></script>
<script src="popcorn-js/plugins/wikipedia/popcorn.wikipedia.js"></script>
<script src="popcorn-js/plugins/twitter/popcorn.twitter.js"></script>

<!-- The juice-->
<script src="js/sotu.application.js"></script>
</head>
<body>
<!-- Overlay Scenes -->
<div id="ui-loading-html" class="ui-load-ready">
<img src="img/loading.gif">
<p>This may take a moment if your video is loading over the internet</p>
</div>
<div id="ui-loading-over" class="ui-widget-overlay ui-load-ready"></div>

<!-- Main Scene -->
<div class="container">
<div class="container showgrid">
<header>
<div class="span-26 last">
<img class="logo" src="img/video.png" title="Butter" alt="Butter Logo">
<input placeholder="Video Url" type="text" id="io-video-url" name="io-video-url" class="text ui-menu-entity" value="http://popcornjs.org/tryme.ogv">

<button class="ui-menu-controls marginleft" data-control="load" >Create New Movie</button>

<button class="ui-menuset" data-control="">My Movies</button>
<ul id="ui-user-videos" class="select-ul is-menu">
</ul>

<button class="ui-menuset">Layout</button>
<!-- start out with a default layout in data-layout -->
<ul id="ui-layout" class="select-ul is-menu" data-layout="wide">
</ul>

<button class="ui-menuset">Theme</button>
<!-- start out with a default theme in data-theme -->
<ul id="ui-theme" class="select-ul is-menu" data-theme="clean">
</ul>

<button class="ui-menuset">Export Movie</button>
<ul id="ui-export-to" class="select-ul is-menu">
</ul>
<div class="prepend-1 span-23 last">
<h2>PBS Newshour - Annotated State Of The Union</h2>
</div>
</header>

<hr class="space" >

<div id="ui-video-editor" class="span-26">
<div id="ui-video-editor" class="span-18">
<!-- left pane -->
<div id="ui-panel-video" class="span-9" data-export="true">
<video id="video">
<div id="ui-panel-video" class="span-18">

<video id="video" controls>
<source id="mp4"
src="http://www.pbs.org/newshour/video/2011/specials/SOTU/20110125_SOTU_6-tiny.mp4"
type='video/mp4; codecs="avc1, mp4a"'>


<!--
<source id="ogv"
src="http://media.w3.org/2010/05/sintel/trailer.ogv"
type='video/ogg; codecs="theora, vorbis"'>
-->

<p>Your user agent does not support the HTML5 Video element.</p>

</video>

<div id="ui-video-controls" class="span-10 last">
<button>
<span data-control="play" class="ui-icon ui-icon-play"></span>
</button>
<button>
<span data-control="pause" class="ui-icon ui-icon-pause"></span>
</button>
<button>
<span data-control="seek" data-opt="first" class="ui-icon ui-icon-seek-first"></span>
</button>
<button>
<span data-control="seek" data-opt="prev" class="ui-icon ui-icon-seek-prev"></span>
</button>
<button>
<span data-control="seek" data-opt="next" class="ui-icon ui-icon-seek-next"></span>
</button>
<button>
<span data-control="seek" data-opt="last" class="ui-icon ui-icon-seek-end"></span>
</button>
<input type="text" id="io-current-time" name="io-current-time" class="ui-video-property small-input text-center" value="" />
<button>
<span data-control="volume" data-opt="down" class="ui-icon ui-icon-volume-off"></span>
</button>
<button>
<span data-control="volume" data-opt="up" class="ui-icon ui-icon-volume-on"></span>
</button>
</div>
</div>

<hr class="space" >

<!-- center pane -->
<!-- do not remove the inline styles, these must stay intact for export cloning -->
<div id="ui-panel-preview" class="span-17 last" data-export="true">
<div id="flickr-container" data-plugin="flickr" class="ui-plugin-pane span-6" style="height:120px;width:220px"></div>
<div id="iframe-container" data-plugin="webpage" class="ui-plugin-pane span-6" style="height:120px;width:220px"></div>
<div id="map-container" data-plugin="googlemap" class="ui-plugin-pane span-5 last" style="height:120px;width:210px"></div>
<hr class="space">
<div id="image-container" data-plugin="image" class="ui-plugin-pane span-6" style="height:120px;width:220px"></div>
<div id="twitter-container" data-plugin="twitter" class="ui-plugin-pane span-6" style="height:120px;width:220px"></div>
<div id="wiki-container" data-plugin="wikipedia" class="ui-plugin-pane span-5 last" style="height:120px;width:210px"></div>
<hr class="space">
<div id="footnote-container" data-plugin="footnote" class="ui-plugin-pane span-17 last" style="height:52px;width:670px;"></div>
</div>
</div>

<div id="ui-lower" class="span-18">
<div id="ui-analysis" class="ui-accordion-panel">

<h3><a href="#">Analysis</a></h3>

<div id="analysis">

</div>

<!-- ui-video-editor -->
<hr class="space">
<div id="ui-track-editting" class="span-21">
<div id="ui-tracks">
<div id="ui-scrubber-handle">
<div id="ui-scrubber"></div>
</div>
<div id="ui-tracks-time">
<canvas id="ui-tracks-time-canvas" width="800" height="25"></canvas>
</div>
</div>

</div>

<!-- plugins panel -->
<div id="ui-panel-plugins" class="span-5 last">
<div id="ui-panel-plugins" class="span-6 last">
<div id="ui-accordion-tools" class="ui-accordion-panel">

<h3><a href="#" id="ui-label-chapter">[ Chapter Name ]</a></h3>
<div id="twitter-container">

<h3><a href="#">Save As</a></h3>
<div>
<input placeholder="Title" type="text" id="io-video-title" name="io-video-title" class="text" style="width:150px;" value="" />
<textarea placeholder="Description" id="io-video-description" style="width:150px;height:85px" class="text"></textarea>
<button class="ui-menu-controls" data-control="save" >Save</button>
<button class="ui-menu-controls" data-control="remove" >Delete</button>
</div>

<h3><a href="#">Add Popcorn Data</a></h3>
<div>
<ul id="ui-plugin-select-list" class="select-ul">
</ul>
</div>
</div>
<div id="ui-accordion-tools" class="ui-accordion-panel">

<h3><a href="#">Help</a></h3>
<div>
<ul>
<li>[ Shift + Click ] on a track event to Delete it.</li>

<li>[ Shift + Right or Left ] in the time display to jump to the next frame.</li>
</ul>
</div>
<!--
comingsoon ;)
<h3><a href="#">Data View</a></h3>
<h3><a href="#" id="ui-label-resources">Resources</a></h3>
<div>
<textarea id="io-video-data" name="io-video-data" style="width:150px;height:150px"></textarea>

</div>
-->

</div>

</div>
</div>

<!-- Dialogs -->
<div id="ui-track-event-editor" title="Edit Track Event">
<!-- reusable -->
</div>
<div id="ui-preview-viewer" title="">
<!-- reusable -->
</div>
<div id="ui-application-error" title="">
<!-- reusable -->
</div>
<div id="ui-start-screen" title="Your Movies:">
<h2>Your Movies</h2>
<div id="ui-project-list">
<ul id="ui-start-screen-list"></ul>
</div>
<hr class="space"/>
<h2>Create a New Movie</h2>
<input placeholder="Video Url" type="text" class="text ui-menu-entity" value="http://popcornjs.org/tryme.ogv">
</div>

<!-- DO NOT DELETE THIS (can be moved if display is desired) -->
<div id="transcription" class="hide"></div>


</div>



<footer class="container">
<p>
All code and content on this page are dual licensed under the MIT and GPL licenses. Popcorn.js is a <a href="http://www.drumbeat.org/webmademovies" title="Mozilla's Open Video Lab">Web Made Movies</a>, <a href="http://www.drumbeat.org/" title="Mozilla Drumbeat">Mozilla Drumbeat</a> project, developed by <a href="http://cdot.senecac.on.ca/">CDOT</a>, <a href="http://bocoup.com">Bocoup</a> and contributors like you. This webiste is hosted by <a href="http://mediatemple.net">(mt)</a>.
Expand Down

0 comments on commit a1a57d8

Please sign in to comment.