mirror of
https://github.com/Team254/cheesy-arena-lite.git
synced 2026-03-10 14:16:47 -04:00
82 lines
2.4 KiB
HTML
82 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
|
|
<!--
|
|
Copyright 2014 Team 254. All Rights Reserved.
|
|
Author: nick@team254.com (Nick Eyre)
|
|
-->
|
|
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>Cheesy Arena - A/V Overlay</title>
|
|
<meta name="generator" content="Cheesy Arena" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="/static/css/fonts/roboto-regular/stylesheet.css" type="text/css" charset="utf-8" />
|
|
<link rel="stylesheet" href="/static/css/av.css"/>
|
|
</head>
|
|
<body>
|
|
|
|
<div class='container' id='fillerscreen'>
|
|
<div class='blinds right background'> </div>
|
|
<div class='blinds right center blank'> </div>
|
|
<div class='blinds left background'> </div>
|
|
<div class='blinds left center'> </div>
|
|
<div class='blinds left center blank'> </div>
|
|
</div>
|
|
|
|
|
|
<script src="/static/lib/jquery.min.js"></script>
|
|
<script src="/static/lib/jquery.transit.min.js"></script>
|
|
<script type='text/javascript'>
|
|
|
|
var handle;
|
|
setTimeout(function(){
|
|
handle = fillerScreen();
|
|
}, 200);
|
|
|
|
|
|
function fillerScreen(){
|
|
// Initialize
|
|
$('#fillerscreen .blinds.center:not(.blank)').css({rotateY: '-180deg'})
|
|
|
|
// In Animation
|
|
closeBlinds('fillerscreen', function(){
|
|
setTimeout(function(){
|
|
$('#fillerscreen .blinds.center.blank').transition({rotateY: '180deg'});
|
|
$('#fillerscreen .blinds.center:not(.blank)').transition({rotateY: '0deg'});
|
|
}, 400);
|
|
});
|
|
|
|
// Close Function
|
|
return function(callback){
|
|
$('#fillerscreen .blinds.center.blank').transition({rotateY: '360deg'});
|
|
$('#fillerscreen .blinds.center:not(.blank)').transition({rotateY: '180deg'}, function(){
|
|
openBlinds('fillerscreen', callback);
|
|
});
|
|
}
|
|
}
|
|
|
|
function closeBlinds(id, callback){
|
|
$('#'+id+' .blinds.right').transition({right: 0});
|
|
$('#'+id+' .blinds.left').transition({left: 0}, function(){
|
|
$(this).addClass('full');
|
|
callback();
|
|
});
|
|
}
|
|
|
|
function openBlinds(id, callback){
|
|
$('#'+id+' .blinds.right').show();
|
|
$('#'+id+' .blinds.left').removeClass('full');
|
|
$('#'+id+' .blinds.right').show().transition({right: '-50%'});
|
|
$('#'+id+' .blinds.left').transition({left: '-50%'}, function(){
|
|
callback();
|
|
});
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|