|
|
|
<!DOCTYPE html>
|
|
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<meta charset="utf-8">
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<title>Presentations</title>
|
|
|
|
|
|
|
|
<link rel='stylesheet' href='_external/normalize.css'>
|
|
|
|
<link rel="stylesheet" href='_external/foundation.min.css'>
|
|
|
|
|
|
|
|
<script src="_external/modernizr.js"></script>
|
|
|
|
|
|
|
|
<style>
|
|
|
|
nav.top-bar {
|
|
|
|
margin-bottom: 15px;
|
|
|
|
}
|
|
|
|
|
|
|
|
div.thumb {
|
|
|
|
background: no-repeat top center;
|
|
|
|
background-size: 100px 100px;
|
|
|
|
height: 100px;
|
|
|
|
width: 100px;
|
|
|
|
}
|
|
|
|
|
|
|
|
ul.inline-list li {
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
div.record {
|
|
|
|
height: 110px;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
</head>
|
|
|
|
|
|
|
|
<body>
|
|
|
|
<nav class='top-bar' data-topbar>
|
|
|
|
<ul class='title-area'>
|
|
|
|
<li class='name'>
|
|
|
|
<h1><a href='/'>Presentations</a></h1>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</nav>
|
|
|
|
|
|
|
|
<!--
|
|
|
|
<div class='row'>
|
|
|
|
<div class="small-8 columns text-center">Title</div>
|
|
|
|
<div class="small-4 columns">Last Updated</div>
|
|
|
|
</div>
|
|
|
|
-->
|
|
|
|
|
|
|
|
<div id='presentations'></div>
|
|
|
|
|
|
|
|
<script src="_external/jquery.js"></script>
|
|
|
|
<script src="_external/foundation.min.js"></script>
|
|
|
|
|
|
|
|
<script>$(document).foundation();</script>
|
|
|
|
|
|
|
|
<div id='record' class='hide row record'>
|
|
|
|
<a href=''>
|
|
|
|
<div class="small-2 columns">
|
|
|
|
<div class="thumb"></div>
|
|
|
|
</div>
|
|
|
|
<div class="small-6 columns title"></div>
|
|
|
|
<div class="small-4 columns updated"></div>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
$(function() {
|
|
|
|
$.ajax({
|
|
|
|
url: 'index.json',
|
|
|
|
dataType: 'json',
|
|
|
|
}).done(function (data) {
|
|
|
|
var record;
|
|
|
|
for (var pos in data) {
|
|
|
|
record = data[pos];
|
|
|
|
console.log(record);
|
|
|
|
|
|
|
|
var template = $('#record').clone();
|
|
|
|
template.removeClass('hide');
|
|
|
|
template.removeAttr('id');
|
|
|
|
|
|
|
|
template.find('a').attr('href', record.presentation);
|
|
|
|
template.find('.thumb').css('background-image', 'url("' + record.image + '")');
|
|
|
|
template.find('.title').append(record.title);
|
|
|
|
template.find('.updated').append(record.changed);
|
|
|
|
|
|
|
|
$('#presentations').append(template);
|
|
|
|
}
|
|
|
|
})
|
|
|
|
})
|
|
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|