Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
tree: aeba3202cc
Fetching contributors…

Cannot retrieve contributors at this time

367 lines (305 sloc) 11.384 kb
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-icon-precomposed" href="icon57x57.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="icon72x72.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="icon114x114.png" />
<meta chatset="utf-8">
<title>JuSpinBeat Contest Rank</title>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen" />
<link href="css/bootstrap.min.responsive" rel="stylesheet" type="text/css" media="screen" />
<style type="text/css">
/* Override some defaults */
html, body {
background-color: #eee;
}
.container {
width: 500px;
}
.container-fluid {
min-width: 280px;
}
/* The white background content wrapper */
.container-fluid > .content {
background-color: #fff;
padding: 20px;
padding-top: 60px;
margin: 0 -20px; /* negative indent the amount of the padding to maintain the grid system */
-webkit-border-radius: 0 0 6px 6px;
-moz-border-radius: 0 0 6px 6px;
border-radius: 0 0 6px 6px;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
box-shadow: 0 1px 2px rgba(0,0,0,.15);
}
/* Page header tweaks */
.page-header {
background-color: #f5f5f5;
padding: 20px 20px 10px;
margin: -20px -20px 20px;
}
.item {
padding-top: 5px;
padding-bottom: 5px;
margin: 0;
border-bottom: 1px solid #ddd;
}
/* jbt */
@media (min-width: 460px) {
.records th { text-align: center; background: #444; color: white; vertical-align: middle; }
.records th.user { min-width: 120px; }
.difficulty-BASIC { background: #484 !important; color: white; }
.difficulty-ADVANCED { background: #884 !important; color: white; }
.difficulty-EXTREME { background: #955 !important; color: white; }
.record td { vertical-align: middle; }
.record .rank { line-height: 0%; font-size: 40px; color: #DDD; font-family: Tahoma; }
.record .score { line-height: 0%; font-size: 18px;}
.record .best-diff { font-size: 10px; }
.nav-shortcut, .dropdown, .pager > .previous, .pager > .next { cursor: pointer; }
}
@media (max-width: 459px) {
.container-fluid > .content {
background-color: #fff;
padding: 10px;
padding-top: 60px;
}
.records th { word-break: break-all;text-align: center; background: #444; color: white; vertical-align: middle; }
.records th.user { min-width: 60px; }
.difficulty-BASIC { background: #484 !important; color: white; }
.difficulty-ADVANCED { background: #884 !important; color: white; }
.difficulty-EXTREME { background: #955 !important; color: white; }
.record td { vertical-align: middle; }
.record .rank { line-height: 0%; font-size: 25px; color: #DDD; font-family: Tahoma; }
.record .score {
font-size: 18px;
width: 30px;
overflow: hidden;
text-overflow: clip;
}
.record .total .score{
overflow: visible !important;
text-overflow: string !important;
}
.record .best-diff { font-size: 10px; }
.nav-shortcut, .dropdown, .pager > .previous, .pager > .next { cursor: pointer; }
}
</style>
</head>
<body>
<div class="topbar navbar navbar-fixed-top">
<div class="fill navbar-inner">
<div class="container-fluid">
<a class="brand" href="#top">JuSpinBeat Contest Rank</a>
<ul class="nav">
<li><a class="nav-shortcut" to-href="record">Record</a></li>
<li><a class="nav-shortcut" to-href="history">History</a></li>
<li class="dropdown">
<a class="dropdown-toggle">List</a>
<ul class="dropdown-menu">
</ul>
</li>
</ul>
<ul class="nav pull-right" id="link">
</ul>
</div>
</div>
</div>
<div class="container-fluid">
<div class="content" id="record">
<div class="page-header">
<h1>Record</h1>
</div>
</div>
<div class="content" id="history">
<div class="page-header">
<h1>History</h1>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="script/jquery.tablesorter.js"></script>
<script src="script/juspinbeat.js"></script>
<script>
var valid_hash_regexp = new RegExp("\/contest\/\\d+\/.*");
/*parameters*/
(function (global) {
var _params = location.search.substr(1).split("&"), _return_dict={};
for ( var i = 0; i < _params.length; ++i ) {
t = _params[i].split("=")
_return_dict[t[0]] = t[1]
}
global.params = _return_dict;
var _hash = location.hash;
global.urlhash = {};
if ( _hash) {
var matches= _hash.match(/\/contest\/(\d+)/);
if ( matches && matches.length > 1 )
global.urlhash.contest = matches[1];
}
})(window);
$(function(){
// dropdown
$('.dropdown-toggle').click(function(){
$('.dropdown-menu').toggle();
});
$('.nav-shortcut').click(function() {
var $t = $(this);
scrollTo(0,$("#"+$t.attr('to-href'))[0].offsetTop);
});
// cache
$.juspinbeat = $.juspinbeat || {};
$.juspinbeat.cache = $.juspinbeat.cache || {'record':{},'history':{}};
$.juspinbeat.busy = function(work, value) {
var works = ['record', 'history'];
if( 'boolean' === typeof value ) {
this[work] = value;
return this;
}
for( var i in works ) {
if( this[works[i]] ) {
return true;
}
}
return false;
};
$.juspinbeat.currentContestId = null;
var API_DOMAIN = "http://laika.redfeel.net:4416";
var CONTEST_BASE_URL = "http://p.eagate.573.jp/game/jubeat/copious/p/contest/detail.html?rally_id=";
function dataValidate( data, mandatory ) {
// TODO 적절한 에러 핸들링
if( 'undefined' === typeof data ) return false;
if( data.code === 'error' ) {
return false;
}
if( mandatory instanceof Array ) { for( var i in mandatory ) {
if( 'undefined' === typeof data[mandatory[i]] ) return false;
}}
return true;
}
function renderRecordTable(data) {
if( !dataValidate(data, ['music_list', 'user_records']) ) {
$.juspinbeat.busy('record', false);
return;
}
var html = '<table class="records table">';
html += makeHeader(data.music_list);
html += makeUserRecords(data.user_records);
html += "</table>";
$('#record').append(html);
$('.records').tablesorter({
headers:{0:{sorter:false}},
textExtraction: function(cell) {
return new Number($(cell).find('.score').text().replace(/,/g,'')) * -1;
},
sortList:[[6,0]]
});
$.juspinbeat.cache['record'][$.juspinbeat.currentContestId] = data;
$.juspinbeat.busy('record', false);
}
function makePagination(data) {
var prev = ($.juspinbeat.currentPage > 1);
var next = (data.perpage * $.juspinbeat.currentPage < data.total);
var html = '<div class="pager">';
if(prev) html += '<li class="previous"><a onclick="javascript:$.juspinbeat.goHistory(\'newer\');">&larr; Newer</a></li>';
if(next) html += '<li class="next"><a onclick="javascript:$.juspinbeat.goHistory(\'older\');">Older &rarr;</a></li>';
html += '</div>';
return html;
}
$.juspinbeat.goHistory = function(direction) {
if( $.juspinbeat.busy() ) return;
if( direction == 'older' ) {
$.juspinbeat.currentPage++;
} else if( direction == 'newer' ) {
$.juspinbeat.currentPage--;
} else {
return;
}
var url = API_DOMAIN + '/contest/' + $.juspinbeat.currentContestId + '/history';
if( $.juspinbeat.currentPage > 1 ) {
url += '/page/' + $.juspinbeat.currentPage;
}
$.juspinbeat.busy('history', true);
$('.history').remove();
$('.pager').remove();
$.getJSON(url + '?callback=?', function(data) {
renderHistoryTable(data);
scrollTo(0,$("#history")[0].offsetTop);
});
return false;
}
function renderHistoryTable(data) {
if( !dataValidate(data, ['history']) ) {
$.juspinbeat.busy('history', false);
return;
}
var html = '';
prepareHistory(data.history);
html += makeHistory(data.history);
html += makePagination(data);
$('#history').append(html);
$('.history').tablesorter({sortList:[[0,1]]});
// no-cache
//$.juspinbeat.cache['history'][$.juspinbeat.currentContestId] = data;
$.juspinbeat.busy('history', false);
}
function initTable( contestId ) {
if( $.juspinbeat.busy() ) return;
$.juspinbeat.currentContestId = contestId;
$.juspinbeat.currentPage = 1;
// Contest Link
$('#link').html($('<li>').append(
$('<a>').text('EAGATE')
.attr({'href': CONTEST_BASE_URL + contestId, 'target': '_blank'})
));
// Record Table
if( $.juspinbeat.cache['record'][contestId] ) {
renderRecordTable($.juspinbeat.cache['record'][contestId]);
} else {
$.juspinbeat.busy('record', true);
$.getJSON(API_DOMAIN + '/contest/' + contestId + '?callback=?', renderRecordTable);
}
// History Table
if( $.juspinbeat.cache['history'][contestId] ) {
renderHistoryTable($.juspinbeat.cache['history'][contestId]);
} else {
$.juspinbeat.busy('history', true);
$.getJSON(API_DOMAIN + '/contest/' + contestId + '/history?callback=?', renderHistoryTable);
}
}
function removeTable() {
$('.history').remove();
$('.pager').remove();
$('.records').remove();
}
var contest = urlhash['contest']//params['contest'];
var has_contest = !('undefined' === typeof contest);
$.getJSON(API_DOMAIN + '/contest?callback=?', function(data) {
if( !dataValidate(data, ['current_contest_list']) ) {
return;
}
var contestList = data.current_contest_list;
if( contestList.length == 0 ) {
return;
}
contestList.forEach(function(_contest) {
$('<li>').append($('<a>').click(function() {
$('.dropdown-menu').toggle();
removeTable();
initTable(_contest.id);
location.hash = "/contest/"+_contest.id;
}).text(_contest.name).css('cursor','pointer')).appendTo('.dropdown-menu');
});
if ( !has_contest ) {
urlhash['contest'] = contestList[0].id;
location.hash = "/contest/"+contestList[0].id;
initTable(contestList[0].id);
}
});
(has_contest) && initTable(contest);
});
</script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.