120 lines
3.7 KiB
HTML
120 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title> {{ text.title }} </title>
|
|
<link rel="stylesheet" type="text/css" href="/static/css/text.css" />
|
|
<link rel="stylesheet" type="text/css" href="/static/css/jquery.tooltip.css" />
|
|
<script type="text/javascript" src="/static/js/jquery.js"></script>
|
|
<script type="text/javascript" src="/static/js/padma/jquery.tooltip.js"></script>
|
|
<script type="text/javascript" src="/static/js/padma/padma.layers.js"></script>
|
|
<script type="text/javascript" src="/static/js/padma/padma.links.js"></script>
|
|
<script type="text/javascript" src="/static/js/views/{{ text.view }}.js"></script>
|
|
<script type="text/javascript" src="/static/js/padma/utils.js"></script>
|
|
</head>
|
|
<body>
|
|
<script type="text/html" id="tmpl_tcRange">
|
|
<div class="padmaWrapper">
|
|
<!-- <img src="<%= video.getFrame(linkData.tcIn) %>" /> -->
|
|
<video width="400" src="<%= video.getLayerVideo(linkData.tcIn, linkData.tcOut) %>" controls="controls" autoplay="autoplay"></video>
|
|
<!-- <img src="<%= video.getFrame(linkData.tcOut) %>" /> -->
|
|
<div class="annotation">
|
|
Transcripts / annotations will appear here.
|
|
</div>
|
|
<div class="closeButton">x</div>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/html" id="tmpl_layers">
|
|
<div class="layersWrapper">
|
|
<% for (var i=0; i<layers.length; i++) { var layer = layers[i]; %>
|
|
<div class="layerWrapper">
|
|
<div class="layerTrack"><%= layer.track %></div>
|
|
<div class="layerText"><%= layer.value_html %></div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
|
|
</script>
|
|
|
|
<script type="text/html" id="tmpl_tooltip">
|
|
<div class="padmaTooltip">
|
|
<div class="videoInfo">
|
|
Click link to play
|
|
</div>
|
|
<img src="<%= thumbUrl %>" />
|
|
<h4 class="padmaTitle">
|
|
<%= video.video.title %>
|
|
</h4>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/html" id="tmpl_sidebar">
|
|
<div class="padmaViewer">
|
|
<div class="padmaButtons">
|
|
<span class="viewOnPadma">
|
|
<a title="Click to view clip on Pad.ma" target="_blank" href="<%= linkData.url %>">p</a>
|
|
</span>
|
|
<span class="videoInfo">
|
|
<a title="Click to get more info about video" target="_blank" href="<%= video.infoUrl %>">¡</a>
|
|
</span>
|
|
<span class="downloadVideo">
|
|
<a title="Right-click and Save Link As to download video" target="_blank" href="<%= linkData.url %>">↓</a>
|
|
</span>
|
|
<span class="aboutThis">
|
|
<a title="What is this?" target="_blank" href="about.html">?</a>
|
|
</span>
|
|
<span class="padmaHelp">
|
|
<a title="Help!" target="_blank" href="help.html">¿</a>
|
|
</span>
|
|
<span class="padmaCopyright">
|
|
<a title="Copyright notice" target="_blank" href="copyright.html">ↄ</a>
|
|
</span>
|
|
</div>
|
|
<video src="<%= video.getLayerVideo(linkData.tcIn, linkData.tcOut) %>" width="320" poster="<%= video.getFrame(linkData.tcIn) %>" controls="controls" autoplay="autoplay"></video>
|
|
|
|
<div class="annotationWrapper">
|
|
|
|
<div class="trackButtons" data-selected="transcript">
|
|
<span class="trackButton" data-track="transcript">Transcript</span>
|
|
</div>
|
|
|
|
<div class="annotationText">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</script>
|
|
{% autoescape off %}
|
|
<div id="loading"></div>
|
|
<div id="wrapper">
|
|
<div id="leftWrapper">
|
|
<h1>
|
|
{{ text.title }}
|
|
</h1>
|
|
<h4>
|
|
by <a href="#bio">{{ text.author }}</a>
|
|
</h4>
|
|
<div id="essayAbstract">
|
|
<p>
|
|
{{ text.abstract }}
|
|
</p>
|
|
</div>
|
|
<div id="padmaSidebar">
|
|
<div id="padmaSidebarWrapper"></div>
|
|
</div>
|
|
|
|
<div id="essay">
|
|
{{ text.html }}
|
|
</div>
|
|
<div id="authorBio">
|
|
<a name="bio"></a>
|
|
<h3>{{ text.author }}</h3>
|
|
{{ text.author_bio }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endautoescape %}
|
|
</body>
|
|
</html>
|