53 lines
1.5 KiB
HTML
53 lines
1.5 KiB
HTML
|
<script src="/static/oxjs/min/Ox.js"></script>
|
||
|
|
<script>
|
||
|
|
function pandora_api(action, data, callback) {
|
||
|
|
var url = '/api/';
|
||
|
|
var xhr = new XMLHttpRequest();
|
||
|
|
xhr.addEventListener('load', function (evt) {
|
||
|
|
var data = JSON.parse(evt.target.responseText);
|
||
|
|
callback(data);
|
||
|
|
});
|
||
|
|
var formData = new FormData();
|
||
|
|
formData.append('action', action);
|
||
|
|
formData.append('data', JSON.stringify(data));
|
||
|
|
xhr.open('POST', url);
|
||
|
|
xhr.send(formData);
|
||
|
|
}
|
||
|
|
|
||
|
|
function render() {
|
||
|
|
var hash = document.location.hash.slice(1).split('/')
|
||
|
|
if (hash.length == 2) {
|
||
|
|
var item = hash[0],
|
||
|
|
time = hash[1].split(','),
|
||
|
|
in_ = time[0],
|
||
|
|
out = time[1];
|
||
|
|
|
||
|
|
in_ = Ox.parseDuration(in_);
|
||
|
|
out = Ox.parseDuration(out);
|
||
|
|
pandora_api('get', {
|
||
|
|
id: item,
|
||
|
|
keys: ['title', 'layers']
|
||
|
|
}, function(result) {
|
||
|
|
var html = ''
|
||
|
|
html += '<h1>' + result.data.title + ': ' + time[0] + ' - ' + time[1] + '</h1>'
|
||
|
|
html += '<img src="/' + item + '/240p'+in_+'.jpg">'
|
||
|
|
Ox.sortBy(result.data.layers.keywords, 'value').forEach(function(keyword) {
|
||
|
|
if (keyword['in'] <= out && keyword['out'] >= in_) {
|
||
|
|
html += '<br>' + keyword['value'];
|
||
|
|
}
|
||
|
|
})
|
||
|
|
document.body.innerHTML = html;
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
}
|
||
|
|
}
|
||
|
|
window.onhashchange = render
|
||
|
|
|
||
|
|
render()
|
||
|
|
</script>
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
font-family: sans-serif;
|
||
|
|
}
|
||
|
|
</style>
|