mirror of
https://github.com/Team254/cheesy-arena-lite.git
synced 2026-03-09 21:56:50 -04:00
Merge branch 'master' of https://github.com/Team254/cheesy-arena
This commit is contained in:
Patrick Fairbank
42
static/audience.html
Normal file
42
static/audience.html
Normal file
@@ -0,0 +1,42 @@
|
||||
<!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 - Audience Screen</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/audience.css"/>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id='topcontainer'></div>
|
||||
|
||||
<div class='controlpanel'>
|
||||
<h3>Control Panel</h3>
|
||||
<button onclick="openScreen('logo');">Logo</button><br />
|
||||
<button onclick="openScreen('blank');">None</button><br />
|
||||
</button>
|
||||
|
||||
<script src="/static/lib/jquery.min.js"></script>
|
||||
<script src="/static/lib/jquery.transit.min.js"></script>
|
||||
<script src="/static/js/audience.js"></script>
|
||||
|
||||
<script type='text/x-template' class='template' id='blank'></script>
|
||||
<script type='text/x-template' class='template' id='logo'>
|
||||
<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>
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -3,12 +3,24 @@ Copyright 2014 Team 254. All Rights Reserved.
|
||||
Author: nick@team254.com (Nick Eyre)
|
||||
*/
|
||||
|
||||
/* Control Panel (Temporary) */
|
||||
.controlpanel {
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
z-index: 99;
|
||||
background-color: white;
|
||||
padding: 20px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
|
||||
/* Top Level Container */
|
||||
html,body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.container {
|
||||
#topcontainer {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
@@ -16,7 +28,7 @@ html,body {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
|
||||
/* Design Element: Blinds */
|
||||
.blinds {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@@ -38,13 +50,14 @@ html,body {
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
#fillerscreen .blinds.background {
|
||||
/* Screen: Logo */
|
||||
#logo .blinds.background {
|
||||
background-image: url('/static/img/endofmatch-bg.png');
|
||||
}
|
||||
#fillerscreen .blinds.center {
|
||||
#logo .blinds.center {
|
||||
background-image: url('/static/img/endofmatch-center.png');
|
||||
-webkit-backface-visibility: hidden;
|
||||
}
|
||||
#fillerscreen .blinds.center.blank {
|
||||
#logo .blinds.center.blank {
|
||||
background-image: url('/static/img/endofmatch-center-blank.png');
|
||||
}
|
||||
@@ -7,7 +7,7 @@ body {
|
||||
font-family: 'robotoregular';
|
||||
position: fixed;
|
||||
font-size: 2em;
|
||||
cursor: none;
|
||||
/*cursor: none;*/
|
||||
}
|
||||
|
||||
#titlebar {
|
||||
@@ -32,7 +32,6 @@ body {
|
||||
width: 100%;
|
||||
background-color: #0070ff;
|
||||
color: white;
|
||||
text-align: center;
|
||||
}
|
||||
#container {
|
||||
position: fixed;
|
||||
@@ -46,6 +45,10 @@ body {
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
td {
|
||||
padding: 0.2em 1em;
|
||||
}
|
||||
|
||||
@@ -1,81 +0,0 @@
|
||||
<!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>
|
||||
79
static/js/audience.js
Normal file
79
static/js/audience.js
Normal file
@@ -0,0 +1,79 @@
|
||||
// Copyright 2014 Team 254. All Rights Reserved.
|
||||
// Author: nick@team254.com (Nick Eyre)
|
||||
|
||||
var screens = {
|
||||
|
||||
blank: {
|
||||
init: function(cb){callback(cb);},
|
||||
open: function(cb){callback(cb);},
|
||||
close: function(cb){callback(cb);}
|
||||
},
|
||||
|
||||
logo: {
|
||||
init: function(cb){
|
||||
$('.blinds.center:not(.blank)').css({rotateY: '-180deg'});
|
||||
callback(cb);
|
||||
},
|
||||
open: function(cb){
|
||||
closeBlinds(function(){
|
||||
setTimeout(function(){
|
||||
$('.blinds.center.blank').transition({rotateY: '180deg'});
|
||||
$('.blinds.center:not(.blank)').transition({rotateY: '0deg'}, function(){
|
||||
callback(cb);
|
||||
});
|
||||
}, 400);
|
||||
});
|
||||
},
|
||||
close: function(cb){
|
||||
$('.blinds.center.blank').transition({rotateY: '360deg'});
|
||||
$('.blinds.center:not(.blank)').transition({rotateY: '180deg'}, function(){
|
||||
openBlinds(callback);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
var currentScreen = 'blank';
|
||||
function openScreen(screen){
|
||||
|
||||
// If Screen Exists
|
||||
if(typeof(screens[screen]) == 'object' && $('.template#'+screen).length > 0 && currentScreen != screen){
|
||||
|
||||
// Initialize New Screen
|
||||
$('#topcontainer').append("<div class='container' id='"+screen+"'>"+$('.template#'+screen).html()+"</div>");
|
||||
screens[screen].init(function(){
|
||||
|
||||
// Close Current Screen
|
||||
screens[currentScreen].close(function(){
|
||||
|
||||
// Open New Screen
|
||||
currentScreen = screen;
|
||||
screens[screen].open();
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function callback(cb){
|
||||
if(typeof(cb) == 'function')
|
||||
cb();
|
||||
}
|
||||
|
||||
function closeBlinds(cb){
|
||||
$('.blinds.right').transition({right: 0});
|
||||
$('.blinds.left').transition({left: 0}, function(){
|
||||
$(this).addClass('full');
|
||||
callback(cb);
|
||||
});
|
||||
}
|
||||
|
||||
function openBlinds(cb){
|
||||
$('.blinds.right').show();
|
||||
$('.blinds.left').removeClass('full');
|
||||
$('.blinds.right').show().transition({right: '-50%'});
|
||||
$('.blinds.left').transition({left: '-50%'}, function(){
|
||||
callback(cb);
|
||||
});
|
||||
}
|
||||
@@ -23,27 +23,18 @@ function getData(callback){
|
||||
|
||||
function populateView(){
|
||||
$('#container table').html(template(rankings));
|
||||
equalize(true);
|
||||
equalize();
|
||||
setTimeout(scroll, PAUSE_TIME);
|
||||
}
|
||||
|
||||
// Balance Column Widths
|
||||
var widths = [];
|
||||
function equalize(all){
|
||||
if(all){
|
||||
var width = $('#container table').width();
|
||||
var count = $('#container tr').first().children('td').length;
|
||||
var offset = ($(window).width() - width) / (count + 1);
|
||||
$('#container tr').first().children('td').each(function(){
|
||||
var width = $(this).width()+offset;
|
||||
$(this).width(width);
|
||||
widths.push(width);
|
||||
});
|
||||
$('#header').children('td').each(function(index){
|
||||
$(this).width(widths[index]);
|
||||
});
|
||||
}
|
||||
$('#container table#new tr').first().children('td').each(function(index){
|
||||
function equalize(){
|
||||
$('#container #new tr').first().children('td').each(function(){
|
||||
var width = $(this).width();
|
||||
widths.push(width);
|
||||
});
|
||||
$('#header').children('td').each(function(index){
|
||||
$(this).width(widths[index]);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -24,13 +24,13 @@
|
||||
|
||||
<table>
|
||||
<tr id='header'>
|
||||
<td class='rank'>Rank</td>
|
||||
<td class='team'>Team</td>
|
||||
<td class='team'>Name</td>
|
||||
<td class='qs'>QS</td>
|
||||
<td class='assist'>Assist</td>
|
||||
<td class='tc'>Auto</td>
|
||||
<td class='qs'>W-L-T</td>
|
||||
<td>Rank</td>
|
||||
<td>Team</td>
|
||||
<td class='left'>Name</td>
|
||||
<td>QS</td>
|
||||
<td>Assist</td>
|
||||
<td>Auto</td>
|
||||
<td>W-L-T</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user