First upload
This commit is contained in:
Clement Gournay
42
src/css/game.css
Normal file
42
src/css/game.css
Normal file
@@ -0,0 +1,42 @@
|
||||
#game{
|
||||
width:100%;
|
||||
height:100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#canvas{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
#pause-menu{
|
||||
display:none;
|
||||
width:100%;
|
||||
height:100%;
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
background:rgba(0,0,0,0.75);
|
||||
}
|
||||
|
||||
#pause-menu button{
|
||||
|
||||
width: 90%;
|
||||
height: 25%;
|
||||
display: block;
|
||||
margin: auto auto 30px;
|
||||
cursor: pointer;
|
||||
border:5px solid #ae7a26;
|
||||
background: rgb(255, 255, 255);
|
||||
color: black;
|
||||
font-family: TnT;
|
||||
font-size: 5vmin;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#pause-menu button:hover{
|
||||
border-color:#fa5d3a;
|
||||
color:white;
|
||||
background:#0c6577;
|
||||
}
|
||||
|
||||
28
src/css/loader.css
Normal file
28
src/css/loader.css
Normal file
@@ -0,0 +1,28 @@
|
||||
#loader{
|
||||
width:90%;
|
||||
height:10%;
|
||||
border:1px solid black;
|
||||
position: fixed;
|
||||
top:50%;
|
||||
left:5%;
|
||||
background: rgba(0,0,0,0.65);
|
||||
}
|
||||
|
||||
#loader .progress{
|
||||
width:0%;
|
||||
height: 100%;
|
||||
background: #b52a2a;
|
||||
opacity: 0.90;
|
||||
}
|
||||
|
||||
#loader .percentage{
|
||||
margin:auto;
|
||||
width:100%;
|
||||
text-align: center;
|
||||
font-size: 5vmin;
|
||||
color: white;
|
||||
position:fixed;
|
||||
top:53%;
|
||||
margin-left:-30px;
|
||||
|
||||
}
|
||||
31
src/css/loadsong.css
Normal file
31
src/css/loadsong.css
Normal file
@@ -0,0 +1,31 @@
|
||||
#load-song{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin:0;
|
||||
padding: 0%;
|
||||
}
|
||||
|
||||
#loading-song{
|
||||
width:20%;
|
||||
height:30%;
|
||||
position: absolute;
|
||||
top:35%;
|
||||
left:40%;
|
||||
background: rgba(0,0,0,0.75);
|
||||
border-radius: 5px;
|
||||
border:3px solid white;
|
||||
}
|
||||
|
||||
#loading-don{
|
||||
position: relative;
|
||||
width:50%;
|
||||
height:65%;
|
||||
top: 12%;
|
||||
left: 30%;
|
||||
}
|
||||
|
||||
#loading-song p{
|
||||
position: absolute;
|
||||
left:28%;
|
||||
font-size: 3vmin;
|
||||
}
|
||||
46
src/css/main.css
Normal file
46
src/css/main.css
Normal file
@@ -0,0 +1,46 @@
|
||||
@font-face {
|
||||
font-family: 'TnT';
|
||||
src: url('../../assets/fonts/TnT.ttf') format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Kozuka';
|
||||
src: url('../../assets/fonts/KozGoPro-Bold.otf') format('truetype');
|
||||
}
|
||||
|
||||
html, body{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
background: black;
|
||||
color:white;
|
||||
}
|
||||
|
||||
#screen{
|
||||
width:100%;
|
||||
height:100%;
|
||||
margin:0;
|
||||
padding:0;
|
||||
background: url('/assets/img/bg-pattern-1.png');
|
||||
}
|
||||
|
||||
#assets{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.window{
|
||||
font-size: 14pt;
|
||||
width: 30%;
|
||||
height: 30%;
|
||||
padding: 30px;
|
||||
color: black;
|
||||
background: rgba(255, 220, 47, 0.95);
|
||||
border: 7px outset #f4ae00;
|
||||
position:relative;
|
||||
box-shadow: 2px 2px 10px black;
|
||||
top: 35%;
|
||||
left: 35%;
|
||||
|
||||
}
|
||||
|
||||
172
src/css/scoresheet.css
Normal file
172
src/css/scoresheet.css
Normal file
@@ -0,0 +1,172 @@
|
||||
#scoresheet{
|
||||
width:100%;
|
||||
height:100%;
|
||||
background: #e84019;
|
||||
color:black;
|
||||
font-family: TnT;
|
||||
background: url('/assets/img/bg-pattern-2.png');
|
||||
}
|
||||
|
||||
#scoresheet h2{
|
||||
|
||||
position:absolute;
|
||||
top:1%;
|
||||
left:1%;
|
||||
font-size: 7vmin;
|
||||
margin:0;
|
||||
color: white;
|
||||
-webkit-text-stroke-width: 1px;
|
||||
-webkit-text-stroke-color: black;
|
||||
|
||||
}
|
||||
|
||||
#result-window{
|
||||
width:70%;
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
#scoresheet button{
|
||||
|
||||
height: 15%;
|
||||
width:20%;
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
border:5px solid #ae7a26;
|
||||
background: rgb(255, 255, 255);
|
||||
color: black;
|
||||
font-family: TnT;
|
||||
font-size: 5vmin;
|
||||
border-radius: 10px;
|
||||
outline: none;
|
||||
top:10%;
|
||||
}
|
||||
|
||||
#replay{
|
||||
left:1%;
|
||||
}
|
||||
|
||||
#song-select{
|
||||
left:23%;
|
||||
}
|
||||
|
||||
#scoresheet button:hover{
|
||||
border-color:#fa5d3a;
|
||||
color:white;
|
||||
background:#0c6577;
|
||||
}
|
||||
|
||||
#result-bar{
|
||||
width: 100%;
|
||||
height:40%;
|
||||
position:absolute;
|
||||
top:10%;
|
||||
left:0;
|
||||
border-bottom:10px inset #b6361d;
|
||||
border-top:5px solid #b23111;
|
||||
min-height: 200px;
|
||||
|
||||
}
|
||||
|
||||
#score-cont{
|
||||
position:absolute;
|
||||
right:1%;
|
||||
width:60%;
|
||||
height:80%;
|
||||
background:rgba(255,255,255,0.7);
|
||||
border-radius:15px;
|
||||
}
|
||||
|
||||
#score-hp-bar-bg{
|
||||
position: absolute;
|
||||
margin-top:2%;
|
||||
margin-left:5%;
|
||||
background: url("/assets/img/hp-bar-bg.png");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
}
|
||||
|
||||
#score-hp-bar-colour{
|
||||
position:absolute;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#score-hp-bar-colour img{
|
||||
position:absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
#score-points{
|
||||
width:30%;
|
||||
height:18%;
|
||||
background:black;
|
||||
border:5px solid #ae7a26;
|
||||
border-radius: 10px;
|
||||
position:absolute;
|
||||
bottom:5%;
|
||||
left:5%;
|
||||
color: white;
|
||||
font-size: 5vmin;
|
||||
text-align: right;
|
||||
padding-right:2%;
|
||||
}
|
||||
|
||||
#score-details{
|
||||
position: absolute;
|
||||
right:5%;
|
||||
width:50%;
|
||||
height:50%;
|
||||
color:white;
|
||||
-webkit-text-stroke-width: 2px;
|
||||
-webkit-text-stroke-color: black;
|
||||
|
||||
}
|
||||
|
||||
#score-details td{
|
||||
font-size: 3vmin;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.floatLeft{
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.value{
|
||||
width:25%;
|
||||
}
|
||||
|
||||
#bottom-part{
|
||||
width:100%;
|
||||
position: absolute;
|
||||
-webkit-box-shadow: inset 0px 10px 20px -5px #ee6d46;
|
||||
-moz-box-shadow: inset 0px 10px 20px -5px #ee6d46;
|
||||
box-shadow: inset 0px 10px 20px -5px #ee6d46;
|
||||
}
|
||||
|
||||
#score-mark{
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.gradient-overlay{
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(255,165,100,0.64) 62%, rgba(255,165,100,0.65) 63%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(62%,rgba(255,165,100,0.64)), color-stop(63%,rgba(255,165,100,0.65))); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(255,165,100,0.64) 62%,rgba(255,165,100,0.65) 63%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(255,165,100,0.64) 62%,rgba(255,165,100,0.65) 63%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(255,165,100,0.64) 62%,rgba(255,165,100,0.65) 63%); /* IE10+ */
|
||||
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(255,165,100,0.64) 62%,rgba(255,165,100,0.65) 63%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6ffa564',GradientType=0 ); /* IE6-9 */
|
||||
|
||||
}
|
||||
|
||||
#top-part{
|
||||
width:100%;
|
||||
height:10%;
|
||||
background:#e84019;
|
||||
}
|
||||
112
src/css/songselect.css
Normal file
112
src/css/songselect.css
Normal file
@@ -0,0 +1,112 @@
|
||||
@-webkit-keyframes bgscroll {
|
||||
from {background-position:0 0;}
|
||||
to {background-position:-200px 0;}
|
||||
}
|
||||
|
||||
@keyframes bgscroll {
|
||||
from {background-position:0 0;}
|
||||
to {background-position:-200px 0;}
|
||||
}
|
||||
|
||||
#song-select{
|
||||
width: 100%;
|
||||
height:100%;
|
||||
background: url('/assets/img/bg-pattern-1.png');
|
||||
animation: bgscroll 3s infinite linear;
|
||||
-webkit-animation: bgscroll 3s infinite linear;
|
||||
}
|
||||
|
||||
#song-container{
|
||||
width:98%;
|
||||
height:90%;
|
||||
padding:1%;
|
||||
}
|
||||
|
||||
ul li{
|
||||
list-style:none;
|
||||
}
|
||||
|
||||
.difficulties{
|
||||
float:left;
|
||||
display:inline-block;
|
||||
width:70%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.song-title{
|
||||
float:right;
|
||||
display:inline-block;
|
||||
width:20px;
|
||||
height: 100%;
|
||||
padding:10px;
|
||||
word-wrap: break-word;
|
||||
font-size: 28pt;
|
||||
color:white;
|
||||
margin-right:10px;
|
||||
-webkit-text-stroke-width: 2px;
|
||||
-webkit-text-stroke-color: black;
|
||||
}
|
||||
|
||||
.song{
|
||||
font-size: 14pt;
|
||||
width: 60px;
|
||||
margin-right:20px;
|
||||
height:100%;
|
||||
color: black;
|
||||
display: inline-block;
|
||||
background: rgba(255, 220, 47, 0.90);
|
||||
border: 7px outset #f4ae00;
|
||||
box-shadow: 2px 2px 10px black;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.opened{
|
||||
width:375px;
|
||||
}
|
||||
|
||||
.difficulty{
|
||||
display:none;
|
||||
cursor:pointer;
|
||||
width: 35px;
|
||||
height: 70%;
|
||||
border-radius: 5px;
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
float: left;
|
||||
background:white;
|
||||
border:10px solid #ae7a26;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.difficulty .diffname{
|
||||
word-wrap: break-word;
|
||||
width: 20px;
|
||||
display: block;
|
||||
margin: auto;
|
||||
margin-top:10px;
|
||||
font-size: 20pt;
|
||||
}
|
||||
|
||||
.difficulty .stars{
|
||||
position:absolute;
|
||||
color: #f12b69;
|
||||
text-align: center;
|
||||
width:100%;
|
||||
bottom:10px;
|
||||
}
|
||||
|
||||
.difficulty:hover{
|
||||
border-color:#fa5d3a;
|
||||
color:white;
|
||||
background:#0c6577;
|
||||
}
|
||||
|
||||
.difficulty:hover .diffname{
|
||||
-webkit-text-stroke-width: 1px;
|
||||
-webkit-text-stroke-color: black;
|
||||
}
|
||||
|
||||
.difficulty:hover .stars{
|
||||
color:white;
|
||||
}
|
||||
52
src/css/titlescreen.css
Normal file
52
src/css/titlescreen.css
Normal file
@@ -0,0 +1,52 @@
|
||||
@keyframes toggleFade {
|
||||
|
||||
0%{
|
||||
opacity:1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#title-screen{
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100%;
|
||||
height:100%;
|
||||
display: none;
|
||||
margin:0px;
|
||||
cursor: pointer;
|
||||
background: url('/assets/img/title-screen.png');
|
||||
-webkit-background-size: cover; /* pour Chrome et Safari */
|
||||
-moz-background-size: cover; /* pour Firefox */
|
||||
-o-background-size: cover; /* pour Opera */
|
||||
background-size: cover; /* version standardis<69>e */
|
||||
}
|
||||
|
||||
#logo-big-cont{
|
||||
position:absolute;
|
||||
max-width: 654px;
|
||||
max-height: 300px;
|
||||
}
|
||||
|
||||
#logo-big-cont img{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.click-to-continue{
|
||||
|
||||
display:block;
|
||||
font-size: 10vmin;
|
||||
color:white;
|
||||
text-align: center;
|
||||
position:absolute;
|
||||
bottom:2%;
|
||||
width:100%;
|
||||
animation: toggleFade 1s infinite ease-out;
|
||||
-webkit-text-stroke-width: 2px;
|
||||
-webkit-text-stroke-color: black;
|
||||
|
||||
}
|
||||
49
src/js/assets.js
Normal file
49
src/js/assets.js
Normal file
@@ -0,0 +1,49 @@
|
||||
var assets = {
|
||||
|
||||
img: new Array(
|
||||
'background.png',
|
||||
'title-screen.png',
|
||||
'logo-big.png',
|
||||
'don-0.png',
|
||||
'don-1.png',
|
||||
'big-don-0.png',
|
||||
'big-don-1.png',
|
||||
'taiko.png',
|
||||
'taiko-key-blue.png',
|
||||
'taiko-key-red.png',
|
||||
'hp-bar-bg.png',
|
||||
'hp-bar-colour.png',
|
||||
'score-0.png',
|
||||
'score-0-b.png',
|
||||
'score-230.png',
|
||||
'score-450.png',
|
||||
'dancing-don.gif',
|
||||
'scoresheet.jpg',
|
||||
'bg-pattern-1.png',
|
||||
'bg-pattern-2.png',
|
||||
'ranking-S.png',
|
||||
'ranking-X.png'
|
||||
),
|
||||
|
||||
audio: new Array(
|
||||
'start.wav',
|
||||
'don.wav',
|
||||
'ka.wav',
|
||||
'combo-50.wav',
|
||||
'combo-100.wav',
|
||||
'combo-200.wav',
|
||||
'combo-300.wav',
|
||||
'combo-400.wav',
|
||||
'combo-500.wav',
|
||||
'combo-600.wav',
|
||||
'combo-700.wav'
|
||||
),
|
||||
|
||||
songs: new Array(),
|
||||
|
||||
fonts: new Array(
|
||||
'Kozuka',
|
||||
'TnT'
|
||||
)
|
||||
|
||||
};
|
||||
104
src/js/circle.js
Normal file
104
src/js/circle.js
Normal file
@@ -0,0 +1,104 @@
|
||||
function Circle(id, ms, type){
|
||||
|
||||
var _id=id;
|
||||
var _ms = ms;
|
||||
var _type = type;
|
||||
var _played = false;
|
||||
var _pos={x:0, y:0};
|
||||
var _animating = false;
|
||||
var _animT = 0;
|
||||
var _score=0;
|
||||
var _lastFrame = ms+100;
|
||||
var _animationEnded = false;
|
||||
|
||||
var played=false; //if cirlce has been played
|
||||
var _status=-1; //check if circle is playable
|
||||
|
||||
// -1 : Not playable
|
||||
// 0 : Playable, giving 0 points if played at current time (fail)
|
||||
// 50 : Playable, giving 50 points if played at current time (pass)
|
||||
// 100 : Playable, giving 100 points if played at current time (good)
|
||||
|
||||
this.getMS = function(){
|
||||
return _ms;
|
||||
}
|
||||
|
||||
this.getType = function(){
|
||||
return _type;
|
||||
}
|
||||
|
||||
this.getLastFrame = function(){
|
||||
return _lastFrame;
|
||||
}
|
||||
|
||||
this.incFrame = function(){
|
||||
_lastFrame+=20;
|
||||
}
|
||||
|
||||
this.animate = function(){
|
||||
_animating=true;
|
||||
}
|
||||
|
||||
this.isAnimated = function(){
|
||||
return _animating;
|
||||
}
|
||||
|
||||
this.setInitPos = function(initPos){
|
||||
_pos.x = initPos.x;
|
||||
_pos.y = initPos.y
|
||||
}
|
||||
|
||||
this.move = function(pxPerFrame){
|
||||
_pos.x -= pxPerFrame;
|
||||
}
|
||||
|
||||
this.getAnimT = function(){
|
||||
return _animT;
|
||||
}
|
||||
|
||||
this.incAnimT = function(){
|
||||
_animT+=0.05;
|
||||
}
|
||||
|
||||
this.moveTo = function(x, y){
|
||||
_pos.x=x;
|
||||
_pos.y=y;
|
||||
}
|
||||
|
||||
this.getPos = function(){
|
||||
return _pos;
|
||||
}
|
||||
|
||||
this.updateStatus = function(status){
|
||||
_status=status;
|
||||
}
|
||||
|
||||
this.getStatus = function(){
|
||||
return _status;
|
||||
}
|
||||
|
||||
this.getPlayed = function(){
|
||||
return _played;
|
||||
}
|
||||
|
||||
this.isAnimationFinished = function(){
|
||||
return _animationEnded;
|
||||
}
|
||||
|
||||
this.endAnimation = function(){
|
||||
_animationEnded = true;
|
||||
}
|
||||
|
||||
this.played = function(score){
|
||||
_score=score;
|
||||
_played=true;
|
||||
}
|
||||
|
||||
this.getScore = function(){
|
||||
return _score;
|
||||
}
|
||||
|
||||
this.getID = function(){
|
||||
return _id;
|
||||
}
|
||||
}
|
||||
185
src/js/controller.js
Normal file
185
src/js/controller.js
Normal file
@@ -0,0 +1,185 @@
|
||||
function Controller(selectedSong, songData){
|
||||
|
||||
var _this = this;
|
||||
var _backgroundURL = "/songs/"+selectedSong.folder+"/bg.png";
|
||||
|
||||
var _songParser = new ParseSong(songData); //get file content
|
||||
var _songData = _songParser.getData();
|
||||
|
||||
var _game = new Game(this, selectedSong, _songData);
|
||||
var _view = new View(this, _backgroundURL);
|
||||
var _keyboard = new Keyboard(this);
|
||||
var _mainLoop;
|
||||
var _pauseMenu = false;
|
||||
|
||||
this.run = function(){
|
||||
|
||||
_this.loadUIEvents();
|
||||
_game.run();
|
||||
_view.run();
|
||||
_this.startMainLoop();
|
||||
}
|
||||
|
||||
this.loadUIEvents = function(){
|
||||
$("#song-selection-butt").click(function(){
|
||||
_this.songSelection();
|
||||
});
|
||||
$("#restart-butt").click(function(){
|
||||
_this.restartSong();
|
||||
});
|
||||
}
|
||||
|
||||
this.startMainLoop = function(){
|
||||
|
||||
var started=false;
|
||||
_mainLoop = setInterval(function(){
|
||||
|
||||
var ms = _game.getEllapsedTime().ms;
|
||||
if(ms<0){ //before starting game, offseting the circles
|
||||
_game.updateTime();
|
||||
_view.refresh();
|
||||
}
|
||||
else if(ms>=0 && !started){ //when music starts
|
||||
_game.playSound("main-music");
|
||||
started=true;
|
||||
}
|
||||
|
||||
if(started){ //Game start here
|
||||
if(!_game.isPaused()){
|
||||
_game.update();
|
||||
_view.refresh();
|
||||
_keyboard.checkGameKeys();
|
||||
}
|
||||
_keyboard.checkMenuKeys();
|
||||
}
|
||||
|
||||
}, 20);
|
||||
|
||||
}
|
||||
|
||||
this.getDistanceForCircle = function(){
|
||||
return _view.getDistanceForCircle();
|
||||
}
|
||||
|
||||
this.togglePauseMenu = function(){
|
||||
_this.togglePause();
|
||||
_view.togglePauseMenu();
|
||||
}
|
||||
|
||||
this.displayResults = function(){
|
||||
clearInterval(_mainLoop);
|
||||
var scoresheet = new Scoresheet(_this, _this.getGlobalScore());
|
||||
scoresheet.run();
|
||||
}
|
||||
|
||||
this.displayScore = function(score, notPlayed){
|
||||
_view.displayScore(score, notPlayed);
|
||||
}
|
||||
|
||||
this.fadeOutOver = function(){
|
||||
_game.fadeOutOver();
|
||||
_this.displayResults();
|
||||
}
|
||||
|
||||
this.getCurrentTimingPoint = function(){
|
||||
return _game.getCurrentTimingPoint();
|
||||
}
|
||||
|
||||
this.songSelection = function(){
|
||||
$("#main-music").remove();
|
||||
$("#music-bg").remove();
|
||||
clearInterval(_mainLoop);
|
||||
new SongSelect();
|
||||
}
|
||||
|
||||
this.restartSong = function(){
|
||||
_game.pauseSound("main-music", true);
|
||||
clearInterval(_mainLoop);
|
||||
//songData.circles.forEach(function(circle){
|
||||
$("#screen").load("/src/views/game.html", function(){
|
||||
var taikoGame = new Controller(selectedSong, songData);
|
||||
taikoGame.run();
|
||||
});
|
||||
}
|
||||
|
||||
this.playSound = function(soundID){
|
||||
_game.playSound(soundID);
|
||||
}
|
||||
|
||||
this.pauseSound = function(soundID, stop){
|
||||
_game.pauseSound(soundID, stop);
|
||||
}
|
||||
|
||||
this.initTiming = function(){
|
||||
_game.initTiming();
|
||||
}
|
||||
|
||||
this.setHitcircleSpeed = function(speed){
|
||||
_view.setHitcircleSpeed(speed);
|
||||
}
|
||||
|
||||
this.getHitcircleSpeed = function(){
|
||||
return _game.getHitcircleSpeed();
|
||||
}
|
||||
|
||||
this.toggleMainMusic = function(){
|
||||
_game.toggleMainMusic();
|
||||
}
|
||||
|
||||
this.togglePause = function(){
|
||||
_game.togglePause();
|
||||
}
|
||||
|
||||
this.isPaused = function(){
|
||||
return _game.isPaused();
|
||||
}
|
||||
|
||||
this.getKeys = function(){
|
||||
return _keyboard.getKeys();
|
||||
}
|
||||
|
||||
this.getSongData = function(){
|
||||
return _game.getSongData();
|
||||
}
|
||||
|
||||
this.getEllapsedTime = function(){
|
||||
return _game.getEllapsedTime();
|
||||
}
|
||||
|
||||
this.getCircles = function(){
|
||||
return _game.getCircles();
|
||||
}
|
||||
|
||||
this.getCurrentCircle = function(){
|
||||
return _game.getCurrentCircle();
|
||||
}
|
||||
|
||||
this.updateCurrentCircle = function(){
|
||||
_game.updateCurrentCircle();
|
||||
}
|
||||
|
||||
this.isWaitingForKeyup = function(key, type){
|
||||
return _keyboard.isWaitingForKeyup(key, type);
|
||||
}
|
||||
|
||||
this.waitForKeyup = function(key, type){
|
||||
_keyboard.waitForKeyup(key, type);
|
||||
}
|
||||
|
||||
this.updateCombo = function(score){
|
||||
_game.updateCombo(score);
|
||||
}
|
||||
|
||||
this.getCombo = function(){
|
||||
return _game.getCombo();
|
||||
}
|
||||
|
||||
this.getGlobalScore = function(){
|
||||
return _game.getGlobalScore();
|
||||
}
|
||||
|
||||
this.updateGlobalScore = function(score){
|
||||
_game.updateGlobalScore(score);
|
||||
}
|
||||
|
||||
}
|
||||
412
src/js/game.js
Normal file
412
src/js/game.js
Normal file
@@ -0,0 +1,412 @@
|
||||
function Game(controller, selectedSong, songData){
|
||||
|
||||
var _this = this;
|
||||
var _selectedSong = selectedSong;
|
||||
var _ellapsedTime; //current time in ms from the beginning of the song
|
||||
var _offsetDate; //date when the chrono is started (before the game begins)
|
||||
var _startDate; //real start date (when the chrono will be 0)
|
||||
var _currentDate; // refreshed date
|
||||
var _soundSystem = new soundSystem(controller);
|
||||
var _songData=songData;
|
||||
var _currentCircle=0;
|
||||
var _currentScore=0;
|
||||
var _combo=0;
|
||||
var _globalScore={points:0, great:0, good:0, fail:0, maxCombo:0, hp:0};
|
||||
var _HPGain= 100/_songData.circles.length;
|
||||
var _paused=false;
|
||||
var _started=false;
|
||||
var _mainMusicPlaying=true;
|
||||
var _latestDate;
|
||||
var _ellapsedTimeSincePause=0;
|
||||
var _musicFadeOut=0;
|
||||
var _fadeOutStarted=false;
|
||||
var _currentTimingPoint=0;
|
||||
var _offsetTime=0;
|
||||
var _hitcircleSpeed=_songData.difficulty.sliderMultiplier*8;
|
||||
var _timeForDistanceCircle;
|
||||
|
||||
this.run = function(){
|
||||
_timeForDistanceCircle=((20*controller.getDistanceForCircle())/_hitcircleSpeed);
|
||||
_this.initTiming();
|
||||
}
|
||||
|
||||
this.initTiming = function(){
|
||||
|
||||
_offsetDate = new Date();
|
||||
|
||||
_ellapsedTime = {
|
||||
ms:-parseInt(_timeForDistanceCircle),
|
||||
sec:0,
|
||||
min:0,
|
||||
hour:0
|
||||
}
|
||||
_offsetTime = parseInt(_timeForDistanceCircle);
|
||||
_startDate = new Date();
|
||||
_startDate.setMilliseconds(_startDate.getMilliseconds()+_offsetTime); //The real start for the game will start when chrono will reach 0
|
||||
|
||||
}
|
||||
|
||||
this.update = function(){
|
||||
|
||||
/* Main operations */
|
||||
_this.updateTime();
|
||||
_this.checkTiming();
|
||||
_this.updateCirclesStatus();
|
||||
_this.checkPlays();
|
||||
|
||||
/* Event operations */
|
||||
_this.whenFadeoutMusic();
|
||||
_this.whenLastCirclePlayed();
|
||||
|
||||
}
|
||||
|
||||
this.getCircles = function(){
|
||||
return _songData.circles;
|
||||
}
|
||||
|
||||
this.updateCirclesStatus = function(){
|
||||
|
||||
var circles = _songData.circles;
|
||||
|
||||
circles.forEach(function(circle){
|
||||
|
||||
if(!circle.getPlayed()){
|
||||
|
||||
var currentTime = _ellapsedTime.ms;
|
||||
var startingTime = circle.getMS()-_timeForDistanceCircle;
|
||||
var finishTime = circle.getMS(); //at circle.getMS(), the cirlce fits the slot
|
||||
|
||||
if( currentTime >= startingTime && currentTime <= finishTime+200){
|
||||
|
||||
if(currentTime>= finishTime-50 && currentTime < finishTime-30){
|
||||
circle.updateStatus(0);
|
||||
}
|
||||
else if(currentTime>= finishTime-30 && currentTime < finishTime){
|
||||
circle.updateStatus(230);
|
||||
}
|
||||
else if(currentTime >= finishTime && currentTime < finishTime+200){
|
||||
circle.updateStatus(450);
|
||||
}
|
||||
|
||||
}
|
||||
else if(currentTime>finishTime+200 && currentTime<=finishTime+300){
|
||||
|
||||
circle.updateStatus(-1);
|
||||
_currentScore=0;
|
||||
circle.played(_currentScore);
|
||||
controller.displayScore(_currentScore, true);
|
||||
_this.updateCurrentCircle();
|
||||
_this.updateCombo(_currentScore);
|
||||
_this.updateGlobalScore(_currentScore);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.setHPGain = function(gain){
|
||||
_HPGain=gain;
|
||||
}
|
||||
|
||||
this.checkPlays = function(){
|
||||
|
||||
var circles = _songData.circles;
|
||||
var circle = circles[_currentCircle];
|
||||
|
||||
if(circle){
|
||||
|
||||
if(controller.getKeys()[86]){
|
||||
if(!circle.getPlayed() && !controller.isWaitingForKeyup(86, "score") && circle.getStatus()!=-1){
|
||||
var score = _this.checkScore(circle);
|
||||
circle.played(score);
|
||||
_this.updateCurrentCircle();
|
||||
controller.waitForKeyup(86, "score");
|
||||
}
|
||||
}
|
||||
if(controller.getKeys()[66]){
|
||||
if(!circle.getPlayed() && !controller.isWaitingForKeyup(66, "score") && circle.getStatus()!=-1){
|
||||
var score = _this.checkScore(circle);
|
||||
circle.played(score);
|
||||
_this.updateCurrentCircle();
|
||||
controller.waitForKeyup(66, "score");
|
||||
}
|
||||
}
|
||||
if(controller.getKeys()[67]){
|
||||
if(!circle.getPlayed() && !controller.isWaitingForKeyup(67, "score") && circle.getStatus()!=-1){
|
||||
var score = _this.checkScore(circle);
|
||||
circle.played(score);
|
||||
_this.updateCurrentCircle();
|
||||
controller.waitForKeyup(67, "score");
|
||||
}
|
||||
}
|
||||
if(controller.getKeys()[78]){
|
||||
if(!circle.getPlayed() && !controller.isWaitingForKeyup(78, "score") && circle.getStatus()!=-1){
|
||||
var score = _this.checkScore(circle);
|
||||
circle.played(score);
|
||||
_this.updateCurrentCircle();
|
||||
controller.waitForKeyup(78, "score");
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.checkScore = function(circle){
|
||||
|
||||
if(
|
||||
((controller.getKeys()[86] || controller.getKeys()[66]) && (circle.getType()=="don" || circle.getType()=="daiDon")) ||
|
||||
((controller.getKeys()[67] || controller.getKeys()[78]) && (circle.getType()=="ka" || circle.getType()=="daiKa"))
|
||||
){
|
||||
|
||||
switch(circle.getStatus()){
|
||||
|
||||
case 230:
|
||||
_currentScore=230;
|
||||
break;
|
||||
|
||||
case 450:
|
||||
_currentScore=450;
|
||||
break;
|
||||
|
||||
}
|
||||
controller.displayScore(_currentScore);
|
||||
|
||||
}
|
||||
else{
|
||||
_currentScore=0;
|
||||
controller.displayScore(_currentScore, true);
|
||||
}
|
||||
|
||||
|
||||
_this.updateCombo(_currentScore);
|
||||
_this.updateGlobalScore(_currentScore);
|
||||
return _currentScore;
|
||||
}
|
||||
|
||||
this.whenLastCirclePlayed = function(){
|
||||
var circles = _songData.circles;
|
||||
var lastCircle = circles[_songData.circles.length-1];
|
||||
if(_ellapsedTime.ms>=lastCircle.getMS()+2000){
|
||||
_fadeOutStarted=true;
|
||||
}
|
||||
}
|
||||
|
||||
this.whenFadeoutMusic = function(){
|
||||
if(_fadeOutStarted){
|
||||
if(_musicFadeOut%8==0){
|
||||
_soundSystem.fadeOutMusic();
|
||||
_musicFadeOut++;
|
||||
}
|
||||
else{
|
||||
_musicFadeOut++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.checkTiming = function(){
|
||||
|
||||
if(_songData.timingPoints[_currentTimingPoint+1]){
|
||||
if(_this.getEllapsedTime().ms>=_songData.timingPoints[_currentTimingPoint+1].start){
|
||||
_currentTimingPoint++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.getCurrentTimingPoint = function(){
|
||||
return _songData.timingPoints[_currentTimingPoint];
|
||||
}
|
||||
|
||||
this.toggleMainMusic = function(){
|
||||
if(_mainMusicPlaying){
|
||||
_soundSystem.pauseSound("main-music", false);
|
||||
_mainMusicPlaying=false;
|
||||
}
|
||||
else{
|
||||
_soundSystem.playSound("main-music");
|
||||
_mainMusicPlaying=true;
|
||||
}
|
||||
}
|
||||
|
||||
this.fadeOutOver = function(){
|
||||
_fadeOutStarted=false;
|
||||
}
|
||||
|
||||
this.playSound = function(soundID){
|
||||
_soundSystem.playSound(soundID);
|
||||
}
|
||||
|
||||
this.pauseSound = function(soundID, stop){
|
||||
_soundSystem.pauseSound(soundID, stop);
|
||||
}
|
||||
|
||||
this.getHitcircleSpeed = function(){
|
||||
return _hitcircleSpeed;
|
||||
}
|
||||
|
||||
this.togglePause = function(){
|
||||
if(!_paused){
|
||||
_paused=true;
|
||||
_latestDate = new Date();
|
||||
_this.toggleMainMusic();
|
||||
|
||||
}
|
||||
else{
|
||||
_paused=false;
|
||||
var currentDate = new Date();
|
||||
_ellapsedTimeSincePause = _ellapsedTimeSincePause + Math.abs(currentDate.getTime() - _latestDate.getTime());
|
||||
_this.toggleMainMusic();
|
||||
}
|
||||
}
|
||||
|
||||
this.isPaused = function(){
|
||||
return _paused;
|
||||
}
|
||||
|
||||
this.getEllapsedTime = function(){
|
||||
return _ellapsedTime;
|
||||
}
|
||||
|
||||
this.updateTime = function(){
|
||||
|
||||
_currentDate = new Date();
|
||||
|
||||
if(_ellapsedTime.ms<0){
|
||||
_ellapsedTime.ms = _currentDate.getTime() - _startDate.getTime();
|
||||
}
|
||||
else if(_ellapsedTime.ms>=0 && !_started){
|
||||
_startDate = new Date();
|
||||
_ellapsedTime.ms = Math.abs(_startDate.getTime() - _currentDate.getTime());
|
||||
_started=true;
|
||||
}
|
||||
else if(_ellapsedTime.ms>=0 && _started){
|
||||
_ellapsedTime.ms = Math.abs(_startDate.getTime() - _currentDate.getTime()) - _ellapsedTimeSincePause;
|
||||
}
|
||||
|
||||
_ellapsedTime.sec = parseInt(_ellapsedTime.ms / 1000) % 60;
|
||||
_ellapsedTime.min = parseInt(_ellapsedTime.ms / (1000 * 60)) % 60;
|
||||
_ellapsedTime.hour = parseInt(_ellapsedTime.ms / (1000 * 60 * 60)) % 60;
|
||||
|
||||
}
|
||||
|
||||
this.getCircles = function(){
|
||||
return _songData.circles;
|
||||
}
|
||||
|
||||
this.getSongData = function(){
|
||||
return _songData;
|
||||
}
|
||||
|
||||
this.updateCurrentCircle = function(){
|
||||
_currentCircle++;
|
||||
}
|
||||
|
||||
this.getCurrentCircle = function(){
|
||||
return _currentCircle;
|
||||
}
|
||||
|
||||
this.updateCombo = function(score){
|
||||
|
||||
(score!=0) ? _combo++ : _combo=0;
|
||||
|
||||
if(_combo>_globalScore.maxCombo) _globalScore.maxCombo = _combo;
|
||||
|
||||
switch(_combo){
|
||||
case 50:
|
||||
controller.playSound("combo-50");
|
||||
break;
|
||||
case 100:
|
||||
controller.playSound("combo-100");
|
||||
break;
|
||||
case 200:
|
||||
controller.playSound("combo-200");
|
||||
break;
|
||||
case 300:
|
||||
controller.playSound("combo-300");
|
||||
break;
|
||||
case 400:
|
||||
controller.playSound("combo-400");
|
||||
break;
|
||||
case 500:
|
||||
controller.playSound("combo-500");
|
||||
break;
|
||||
case 600:
|
||||
controller.playSound("combo-600");
|
||||
break;
|
||||
case 700:
|
||||
controller.playSound("combo-700");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.getCombo = function(){
|
||||
return _combo;
|
||||
}
|
||||
|
||||
this.getGlobalScore = function(){
|
||||
return _globalScore;
|
||||
}
|
||||
|
||||
this.updateGlobalScore = function(score){
|
||||
|
||||
/* Circle score */
|
||||
switch(score){
|
||||
case 450:
|
||||
_globalScore.great++;
|
||||
break;
|
||||
case 230:
|
||||
_globalScore.good++;
|
||||
break;
|
||||
case 0:
|
||||
_globalScore.fail++;
|
||||
break;
|
||||
}
|
||||
|
||||
/* HP Update */
|
||||
if(score!=0){
|
||||
_globalScore.hp+=_HPGain;
|
||||
}
|
||||
else{
|
||||
if(_globalScore.hp-_HPGain>0)
|
||||
_globalScore.hp-=_HPGain;
|
||||
else
|
||||
_globalScore.hp=0;
|
||||
}
|
||||
|
||||
/* Points update */
|
||||
if(_combo>=11 && _combo<=20){
|
||||
score+=100;
|
||||
}
|
||||
else if(_combo>=21 && _combo<=30){
|
||||
score+=200;
|
||||
}
|
||||
else if(_combo>=31 && _combo<=40){
|
||||
score+=300;
|
||||
}
|
||||
else if(_combo>=41 && _combo<=50){
|
||||
score+=400;
|
||||
}
|
||||
else if(_combo>=51 && _combo<=60){
|
||||
score+=500;
|
||||
}
|
||||
else if(_combo>=61 && _combo<=70){
|
||||
score+=500;
|
||||
}
|
||||
else if(_combo>=71 && _combo<=80){
|
||||
score+=600;
|
||||
}
|
||||
else if(_combo>=81 && _combo<=90){
|
||||
score+=700;
|
||||
}
|
||||
else if(_combo>=91 && _combo<=100){
|
||||
score+=800;
|
||||
}
|
||||
|
||||
_globalScore.points+=score;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
78
src/js/keyboard.js
Normal file
78
src/js/keyboard.js
Normal file
@@ -0,0 +1,78 @@
|
||||
function Keyboard(controller){
|
||||
|
||||
var _this = this;
|
||||
var _keys = {};
|
||||
var _waitKeyupScore = {};
|
||||
var _waitKeyupSound = {};
|
||||
var _waitKeyupMenu = {};
|
||||
|
||||
$(document).keydown(function(e){
|
||||
|
||||
if (e.which === 8 && !$(e.target).is("input, textarea"))//disable back navigation when pressing backspace
|
||||
e.preventDefault();
|
||||
|
||||
_keys[e.which]=true;
|
||||
});
|
||||
|
||||
$(document).keyup(function(e){
|
||||
delete _keys[e.which];
|
||||
delete _waitKeyupScore[e.which];
|
||||
delete _waitKeyupSound[e.which];
|
||||
delete _waitKeyupMenu[e.which];
|
||||
});
|
||||
|
||||
this.checkGameKeys = function(){
|
||||
|
||||
if(_keys[86] && !_this.isWaitingForKeyup(86, "sound")){//if press v, play 'don' sound
|
||||
controller.playSound('don');
|
||||
_this.waitForKeyup(86, "sound");
|
||||
}
|
||||
if(_keys[66] && !_this.isWaitingForKeyup(66, "sound")){//if press b, play 'don' sound
|
||||
controller.playSound('don');
|
||||
_this.waitForKeyup(66, "sound");
|
||||
}
|
||||
|
||||
if(_keys[67] && !_this.isWaitingForKeyup(67, "sound")){//if press c, play 'ka' sound
|
||||
controller.playSound('ka');
|
||||
_this.waitForKeyup(67, "sound");
|
||||
}
|
||||
if(_keys[78] && !_this.isWaitingForKeyup(78, "sound")){//if press n, play 'ka' sound
|
||||
controller.playSound('ka');
|
||||
_this.waitForKeyup(78, "sound");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.checkMenuKeys = function(){
|
||||
|
||||
if(_keys[8] && !_this.isWaitingForKeyup(8, "menu")){//If press return key, go back to song selection
|
||||
_this.waitForKeyup(8, "menu");
|
||||
controller.pauseSound("main-music", true);
|
||||
controller.songSelection();
|
||||
}
|
||||
if(_keys[27] && !_this.isWaitingForKeyup(27, "menu")){//if press escape key, pause the game
|
||||
_this.waitForKeyup(27, "menu");
|
||||
controller.togglePauseMenu();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.getKeys = function(){
|
||||
return _keys;
|
||||
}
|
||||
|
||||
this.isWaitingForKeyup = function(key, type){
|
||||
var isWaiting;
|
||||
if(type == "score") isWaiting = _waitKeyupScore[key];
|
||||
else if(type == "sound") isWaiting = _waitKeyupSound[key];
|
||||
else if(type == "menu") isWaiting = _waitKeyupMenu[key];
|
||||
return isWaiting;
|
||||
}
|
||||
|
||||
this.waitForKeyup = function(key, type){
|
||||
if(type == "score") _waitKeyupScore[key] = true;
|
||||
else if(type == "sound") _waitKeyupSound[key] = true;
|
||||
else if(type == "menu") _waitKeyupMenu[key] = true;
|
||||
}
|
||||
|
||||
}
|
||||
1
src/js/lib/fontdetect.min.js
vendored
Normal file
1
src/js/lib/fontdetect.min.js
vendored
Normal file
@@ -0,0 +1 @@
|
||||
FontDetect=function(){function e(){if(!n){n=!0;var e=document.body,t=document.body.firstChild,i=document.createElement("div");i.id="fontdetectHelper",r=document.createElement("span"),r.innerText="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ",i.appendChild(r),e.insertBefore(i,t),i.style.position="absolute",i.style.visibility="hidden",i.style.top="-200px",i.style.left="-100000px",i.style.width="100000px",i.style.height="200px",i.style.fontSize="100px"}}function t(e,t){return e instanceof Element?window.getComputedStyle(e).getPropertyValue(t):window.jQuery?$(e).css(t):""}var n=!1,i=["serif","sans-serif","monospace","cursive","fantasy"],r=null;return{onFontLoaded:function(t,i,r,o){if(t){var s=o&&o.msInterval?o.msInterval:100,a=o&&o.msTimeout?o.msTimeout:2e3;if(i||r){if(n||e(),this.isFontLoaded(t))return void(i&&i(t));var l=this,f=(new Date).getTime(),d=setInterval(function(){if(l.isFontLoaded(t))return clearInterval(d),void i(t);var e=(new Date).getTime();e-f>a&&(clearInterval(d),r&&r(t))},s)}}},isFontLoaded:function(t){var o=0,s=0;n||e();for(var a=0;a<i.length;++a){if(r.style.fontFamily='"'+t+'",'+i[a],o=r.offsetWidth,a>0&&o!=s)return!1;s=o}return!0},whichFont:function(e){for(var n=t(e,"font-family"),r=n.split(","),o=r.shift();o;){o=o.replace(/^\s*['"]?\s*([^'"]*)\s*['"]?\s*$/,"$1");for(var s=0;s<i.length;s++)if(o==i[s])return o;if(this.isFontLoaded(o))return o;o=r.shift()}return null}}}();
|
||||
16617
src/js/lib/jquery-ui.js
vendored
Normal file
16617
src/js/lib/jquery-ui.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
4
src/js/lib/jquery.js
vendored
Normal file
4
src/js/lib/jquery.js
vendored
Normal file
File diff suppressed because one or more lines are too long
71
src/js/loader.js
Normal file
71
src/js/loader.js
Normal file
@@ -0,0 +1,71 @@
|
||||
function Loader(){
|
||||
|
||||
var _this=this;
|
||||
var _loadedAssets=0;
|
||||
var _percentage=0;
|
||||
var _nbAssets=assets.audio.length+assets.img.length+assets.fonts.length+1; //+1 for song structures
|
||||
|
||||
this.run = function(){
|
||||
|
||||
assets.fonts.forEach(function(name){
|
||||
var font = $("<h1 style='font-family:"+name+"'>I am a font</h1>");
|
||||
font.appendTo("#assets");
|
||||
FontDetect.onFontLoaded (name, _this.assetLoaded, _this.fontFailed, {msTimeout: 90000});
|
||||
});
|
||||
|
||||
assets.img.forEach(function(name){
|
||||
var id = name.substr(0, name.length-4);
|
||||
var image = $("<img id='"+id+"' src='/assets/img/"+name+"' />");
|
||||
image.appendTo("#assets");
|
||||
image.load(function(){
|
||||
_this.assetLoaded();
|
||||
});
|
||||
});
|
||||
|
||||
assets.audio.forEach(function(name){
|
||||
var id = name.substr(0, name.length-4);
|
||||
var audio = $("<audio id='"+id+"' src='/assets/audio/"+name+"' />");
|
||||
audio.appendTo("#assets");
|
||||
audio.on('canplay', function(){
|
||||
_this.assetLoaded();
|
||||
});
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
async:true,
|
||||
type:"POST",
|
||||
url:"/src/php/getsongs.php",
|
||||
success:function(songs){
|
||||
assets.songs = $.parseJSON(songs);
|
||||
_this.assetLoaded();
|
||||
},
|
||||
error:function(){
|
||||
alert("An error occured, please refresh");
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.fontFailed = function(){
|
||||
alert("An error occured, please refresh");
|
||||
}
|
||||
|
||||
this.assetLoaded = function(){
|
||||
_loadedAssets++;
|
||||
_percentage=parseInt((_loadedAssets*100)/_nbAssets);
|
||||
$("#loader .progress").css("width", _percentage+"%");
|
||||
$("#loader .percentage").html(_percentage+"%");
|
||||
_this.checkIfEverythingLoaded();
|
||||
}
|
||||
|
||||
this.checkIfEverythingLoaded = function(){
|
||||
if(_percentage==100){
|
||||
new Titlescreen();
|
||||
//var globalScore={points:1000, great:100, good:60, fail:10, maxCombo:50, hp:90};
|
||||
//new Scoresheet(null, globalScore);
|
||||
}
|
||||
}
|
||||
|
||||
$("#screen").load("/src/views/loader.html", _this.run);
|
||||
|
||||
}
|
||||
49
src/js/loadsong.js
Normal file
49
src/js/loadsong.js
Normal file
@@ -0,0 +1,49 @@
|
||||
function loadSong(selectedSong){
|
||||
|
||||
var _this = this;
|
||||
var _selectedSong=selectedSong;
|
||||
var _bgLoaded=false;
|
||||
var _musicLoaded=false;
|
||||
var _songDataLoaded=false;
|
||||
var _songFilePath = '/songs/'+_selectedSong.folder+'/'+_selectedSong.difficulty;
|
||||
var _songData;
|
||||
|
||||
this.run = function(){
|
||||
|
||||
document.getElementById("start").play();
|
||||
$("#assets").append("<audio id='main-music' src='/songs/"+_selectedSong.folder+"/"+_selectedSong.title+".mp3'></audio>");
|
||||
$("#assets").append("<img id='music-bg' src='/songs/"+_selectedSong.folder+"/bg.png' />");
|
||||
|
||||
$("#music-bg").load(function(){
|
||||
_bgLoaded=true;
|
||||
_this.checkIfEverythingLoaded();
|
||||
});
|
||||
|
||||
$("#main-music").on('canplay', function(){
|
||||
_musicLoaded=true;
|
||||
_this.checkIfEverythingLoaded();
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
url : _songFilePath,
|
||||
dataType: "text",
|
||||
success : function (data) {
|
||||
_songData = data.split("\n");
|
||||
_songDataLoaded=true;
|
||||
_this.checkIfEverythingLoaded();
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.checkIfEverythingLoaded = function(){
|
||||
if(_musicLoaded && _songDataLoaded && _bgLoaded){
|
||||
$("#screen").load("/src/views/game.html", function(){
|
||||
var taikoGame = new Controller(_selectedSong, _songData);
|
||||
taikoGame.run();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
$("#screen").load("/src/views/loadsong.html", _this.run);
|
||||
}
|
||||
7
src/js/main.js
Normal file
7
src/js/main.js
Normal file
@@ -0,0 +1,7 @@
|
||||
$(document).ready(function(){
|
||||
|
||||
new Loader();
|
||||
|
||||
});
|
||||
|
||||
|
||||
253
src/js/parsesong.js
Normal file
253
src/js/parsesong.js
Normal file
@@ -0,0 +1,253 @@
|
||||
function ParseSong(fileContent){
|
||||
|
||||
var _this = this;
|
||||
var _data = fileContent;
|
||||
var _generalInfo={audioFilename:""};
|
||||
var _metadata={title:'', artist:''};
|
||||
var _difficulty={sliderMultiplier:0, sliderTickRate:0, approachRate:0};
|
||||
var _beatInfo={beatInterval:0, bpm:0};
|
||||
var _editor={distanceSpacing:0, beatDivisor:0, gridSize:0};
|
||||
var _circleID=0;
|
||||
var _circles=[];
|
||||
var _timingPoints=[];
|
||||
var _measures=[];
|
||||
|
||||
this.getStartEndIndexes = function(type){
|
||||
|
||||
var indexes = {start:0, end:0};
|
||||
|
||||
while(indexes.start<_data.length){
|
||||
if(_data[indexes.start].match(type))
|
||||
break;
|
||||
else
|
||||
indexes.start++;
|
||||
}
|
||||
indexes.start++;
|
||||
|
||||
indexes.end = indexes.start;
|
||||
while(indexes.end<_data.length){
|
||||
if(_data[indexes.end].match(/^\s*$/))
|
||||
break;
|
||||
else
|
||||
indexes.end++;
|
||||
}
|
||||
indexes.end--;
|
||||
|
||||
return indexes;
|
||||
}
|
||||
|
||||
this.parseDifficulty = function(){
|
||||
|
||||
var indexes = _this.getStartEndIndexes("Difficulty");
|
||||
|
||||
for(var i=indexes.start; i<= indexes.end; i++){
|
||||
|
||||
var splitted = _data[i].split(":");
|
||||
var item = splitted[0];
|
||||
var key = splitted[1];
|
||||
|
||||
switch(item){
|
||||
|
||||
case 'SliderMultiplier':
|
||||
_difficulty.sliderMultiplier = key;
|
||||
break;
|
||||
case 'SliderTickRate':
|
||||
_difficulty.sliderTickRate = key;
|
||||
break;
|
||||
case 'ApproachRate':
|
||||
_difficulty.approachRate = key;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.parseTiming = function(){
|
||||
|
||||
var indexes = _this.getStartEndIndexes("TimingPoints");
|
||||
var lastBeatInterval = parseInt(_data[indexes.start].split(",")[1]);
|
||||
|
||||
for(var i=indexes.start; i<= indexes.end; i++){
|
||||
|
||||
var values = _data[i].split(",");
|
||||
|
||||
var sliderMultiplier;
|
||||
if(i==indexes.start){
|
||||
_beatInfo.beatInterval=parseFloat(values[1]);
|
||||
_beatInfo.bpm=parseInt((1000/_beatInfo.beatInterval)*60);
|
||||
sliderMultiplier=1;
|
||||
}
|
||||
else{
|
||||
sliderMultiplier=Math.abs(parseFloat(values[1]))/100;
|
||||
}
|
||||
|
||||
_timingPoints.push({
|
||||
start:parseInt(values[0]),
|
||||
sliderMultiplier:sliderMultiplier,
|
||||
measure:parseInt(values[2]),
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
var measureNumber=0;
|
||||
for(var i=0; i<_timingPoints.length; i++){
|
||||
var limit = (_timingPoints[i+1]) ? _timingPoints[i+1].start : _circles[_circles.length-1].getMS();
|
||||
for(var j=_timingPoints[i].start; j<=limit; j+=_beatInfo.beatInterval){
|
||||
|
||||
_measures.push({ms:j, x:$(window).width(), nb:measureNumber});
|
||||
measureNumber++;
|
||||
if(measureNumber==_timingPoints[i].measure+1){
|
||||
measureNumber=0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.parseGeneralInfo = function(){
|
||||
|
||||
var indexes = _this.getStartEndIndexes("General");
|
||||
|
||||
for(var i=indexes.start; i<= indexes.end; i++){
|
||||
|
||||
var splitted = _data[i].split(":");
|
||||
var item = splitted[0];
|
||||
var key = splitted[1];
|
||||
|
||||
switch(item){
|
||||
|
||||
case 'SliderMultiple':
|
||||
_generalInfo.audioFilename = key;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.parseMetadata = function(){
|
||||
|
||||
var indexes = _this.getStartEndIndexes("Metadata");
|
||||
|
||||
for(var i=indexes.start; i<= indexes.end; i++){
|
||||
|
||||
var splitted = _data[i].split(":");
|
||||
var item = splitted[0];
|
||||
var key = splitted[1];
|
||||
|
||||
switch(item){
|
||||
|
||||
case 'TitleUnicode':
|
||||
_metadata.title = key;
|
||||
break;
|
||||
|
||||
case 'ArtistUnicode':
|
||||
_metadata.artist = key;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.parseEditor = function(){
|
||||
|
||||
var indexes = _this.getStartEndIndexes("Editor");
|
||||
|
||||
for(var i=indexes.start; i<= indexes.end; i++){
|
||||
|
||||
var splitted = _data[i].split(":");
|
||||
var item = splitted[0];
|
||||
var key = splitted[1];
|
||||
|
||||
switch(item){
|
||||
|
||||
case 'DistanceSpacing':
|
||||
_editor.distanceSpacing = parseFloat(key);
|
||||
break;
|
||||
|
||||
case 'BeatDivisor':
|
||||
_editor.beatDivisor = parseInt(key);
|
||||
break;
|
||||
|
||||
case 'GridSize':
|
||||
_editor.gridSize = parseInt(key);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.parseCircles = function(){
|
||||
|
||||
var indexes = _this.getStartEndIndexes("HitObjects");
|
||||
|
||||
for(var i=indexes.start; i<= indexes.end; i++){
|
||||
|
||||
_circleID++;
|
||||
var values = _data[i].split(",");
|
||||
|
||||
var type;
|
||||
var txt;
|
||||
var emptyValue=false;
|
||||
|
||||
switch(values[4]){
|
||||
case '0':
|
||||
type="don";
|
||||
txt="ドン";
|
||||
break;
|
||||
case '2':
|
||||
type="ka";
|
||||
txt="カッ";
|
||||
break;
|
||||
case '4':
|
||||
type="daiDon";
|
||||
txt="ドン";
|
||||
break;
|
||||
case '6':
|
||||
type="daiKa";
|
||||
txt="カッ";
|
||||
break;
|
||||
case '8':
|
||||
type="ka";
|
||||
txt="カッ";
|
||||
break;
|
||||
case '10':
|
||||
type="ka";
|
||||
txt="カッ";
|
||||
break;
|
||||
case '12':
|
||||
type="daiKa";
|
||||
txt="カッ";
|
||||
break;
|
||||
case '14':
|
||||
type="daiKa";
|
||||
txt="カッ";
|
||||
break;
|
||||
default:
|
||||
emptyValue=true;
|
||||
break;
|
||||
}
|
||||
if(!emptyValue)
|
||||
_circles.push(new Circle(_circleID, parseInt(values[2]),type,txt));
|
||||
}
|
||||
}
|
||||
|
||||
_this.parseGeneralInfo();
|
||||
_this.parseMetadata();
|
||||
_this.parseCircles();
|
||||
_this.parseEditor();
|
||||
_this.parseTiming();
|
||||
_this.parseDifficulty();
|
||||
|
||||
this.getData = function(){
|
||||
return {
|
||||
generalInfo: _generalInfo,
|
||||
metaData: _metadata,
|
||||
editor: _editor,
|
||||
beatInfo: _beatInfo,
|
||||
difficulty: _difficulty,
|
||||
timingPoints: _timingPoints,
|
||||
circles: _circles,
|
||||
measures: _measures
|
||||
};
|
||||
}
|
||||
}
|
||||
92
src/js/scoresheet.js
Normal file
92
src/js/scoresheet.js
Normal file
@@ -0,0 +1,92 @@
|
||||
function Scoresheet(controller, score){
|
||||
|
||||
var _this = this;
|
||||
var _score = score;
|
||||
var _mark;
|
||||
|
||||
this.setResults = function(){
|
||||
|
||||
if(_score.hp==100)
|
||||
_mark="double-gold";
|
||||
else if(_score.hp>=90 && _score.hp<100)
|
||||
_mark="gold";
|
||||
else if(_score.hp>=70 && _score.hp<90)
|
||||
_mark="silver";
|
||||
|
||||
var imgW = (_score.hp*$("#score-hp-bar-colour").width())/100;
|
||||
$("#score-hp-bar-colour img").css("clip", "rect(0, "+imgW+"px, "+$("#score-hp-bar-colour").height()+"px, 0)");
|
||||
|
||||
if(_mark=="double-gold") $("#score-mark").attr("src", $("#ranking-X").attr("src"));
|
||||
else if(_mark=="gold") $("#score-mark").attr("src", $("#ranking-S").attr("src"));
|
||||
else $("#score-mark").remove();
|
||||
|
||||
$("#score-points").html(_score.points+"点");
|
||||
$("#nb-great").html(_score.great);
|
||||
$("#nb-good").html(_score.good);
|
||||
$("#nb-fail").html(_score.fail);
|
||||
$("#max-combo").html(_score.maxCombo);
|
||||
|
||||
}
|
||||
|
||||
this.positionning = function(){
|
||||
|
||||
$("#score-cont").css("top", $("#result-bar").height()/2 - ($("#score-cont").height()/2));
|
||||
|
||||
var markSize = 0.1*$("#score-cont").width();
|
||||
var markX = $("#score-cont").offset().left - markSize - (0.5*markSize);
|
||||
var markY = $("#score-cont").offset().top;
|
||||
|
||||
$("#score-mark").width(markSize);
|
||||
$("#score-mark").height(markSize);
|
||||
$("#score-mark").css("left", markX);
|
||||
$("#score-mark").css("top", markY);
|
||||
|
||||
var scoreBarW = 0.9*$("#score-cont").width();
|
||||
|
||||
$("#score-hp-bar-bg").width(scoreBarW);
|
||||
$("#score-hp-bar-bg").height((51/703)*scoreBarW);
|
||||
|
||||
var bgW = $("#score-hp-bar-bg").width();
|
||||
var bgH = $("#score-hp-bar-bg").height();
|
||||
var bgX = $("#score-hp-bar-bg").position().left;
|
||||
var bgY = $("#score-hp-bar-bg").position().top;
|
||||
|
||||
$("#score-hp-bar-colour").css("left", bgX+(0.008*bgW));
|
||||
$("#score-hp-bar-colour").css("top", bgY+(0.15*bgH));
|
||||
$("#score-hp-bar-colour").width(bgW-(0.08*bgW));
|
||||
$("#score-hp-bar-colour").height(bgH-(0.25*bgH));
|
||||
|
||||
$("#score-details").css("top", bgY+bgH+(bgH));
|
||||
|
||||
var barY = $("#result-bar").position().top;
|
||||
var barH = $("#result-bar").height();
|
||||
|
||||
var bottomY = barY+barH+15;
|
||||
var bottomH = $(window).height()-bottomY;
|
||||
|
||||
$("#bottom-part").css("top", bottomY);
|
||||
$("#bottom-part").height(bottomH);
|
||||
|
||||
|
||||
}
|
||||
|
||||
this.run = function(){
|
||||
|
||||
_this.positionning();
|
||||
_this.setResults();
|
||||
|
||||
$("#song-select").click(function(){
|
||||
controller.songSelection();
|
||||
});
|
||||
|
||||
$("#replay").click(function(){
|
||||
controller.restartSong();
|
||||
});
|
||||
|
||||
$(window).resize(_this.positionning);
|
||||
|
||||
}
|
||||
|
||||
$("#screen").load("/src/views/scoresheet.html", _this.run);
|
||||
|
||||
}
|
||||
123
src/js/songselect.js
Normal file
123
src/js/songselect.js
Normal file
@@ -0,0 +1,123 @@
|
||||
function SongSelect(){
|
||||
|
||||
var _this=this;
|
||||
var _songs;
|
||||
var _selectedSong = {title:'', folder:'', difficulty:''};
|
||||
var _code="";
|
||||
|
||||
this.run = function(){
|
||||
|
||||
_this.createCode();
|
||||
_this.display();
|
||||
$(window).resize(_this.display);
|
||||
|
||||
var menuLoop = setInterval(_this.refresh, 20);
|
||||
$("#song-container").show();
|
||||
|
||||
$(".difficulty").click(function(e){
|
||||
|
||||
clearInterval(menuLoop);
|
||||
var difficultyElement = (e.target.className=="stars" || e.target.className=="diffname") ? e.target.parentElement : e.target;
|
||||
_selectedSong.difficulty = difficultyElement.classList[1]+'.osu';
|
||||
var parentID = $(this).parent().closest(".song").attr("id");
|
||||
var songID = parseInt(parentID.substr(5, parentID.length-1));
|
||||
_selectedSong.title = $(this).parent().closest('.song').find('.song-title').html();
|
||||
_selectedSong.folder = songID+" "+_selectedSong.title;
|
||||
|
||||
new loadSong(_selectedSong);
|
||||
|
||||
});
|
||||
|
||||
$(".song").hover(function(){
|
||||
if(!$(this).hasClass("opened"))
|
||||
$(this).css("background", "rgba(255, 233, 125, 0.90)");
|
||||
},
|
||||
function(){
|
||||
if(!$(this).hasClass("opened"))
|
||||
$(this).css("background", "rgba(255, 220, 47, 0.90)");
|
||||
});
|
||||
|
||||
$(".song:not(.opened)").click(function(){
|
||||
document.getElementById("don").play();
|
||||
$(".difficulty").hide();
|
||||
$(".opened").removeClass("opened", 300);
|
||||
$(this).addClass("opened", 300, "linear", function(){
|
||||
$(this).find(".difficulty").show();
|
||||
$(this).css("background", "rgba(255, 220, 47, 0.90)");
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.createCode = function(){
|
||||
|
||||
for(var i=0; i<assets.songs.length; i++){
|
||||
|
||||
var songDir = assets.songs[i].songDir;
|
||||
var songDifficulties = assets.songs[i].files;
|
||||
var titleSplit = songDir.split(" ");
|
||||
var songID = titleSplit[0];
|
||||
var songTitle = songDir.substr(songID.length+1, songDir.length-(songID.length+1));
|
||||
|
||||
songDifficulties.sort(function(a, b){
|
||||
if(a.difficulty < b.difficulty)
|
||||
return -1;
|
||||
if(a.difficulty > b.difficulty)
|
||||
return 1;
|
||||
return 0;
|
||||
});
|
||||
|
||||
_code += "<div id='song-"+songID+"' class='song'><div class='song-title'>"+songTitle+'</div>';
|
||||
_code += "<ul class='difficulties'>";
|
||||
|
||||
for(var j=0; j<songDifficulties.length; j++){
|
||||
|
||||
var diffName = songDifficulties[j].songFile;
|
||||
diffName = diffName.substr(0, diffName.length-4);
|
||||
var diffLevel = songDifficulties[j].difficulty;
|
||||
|
||||
var starsDisplay="";
|
||||
for(var x=1; x<=diffLevel; x++){
|
||||
starsDisplay+="★<br>";
|
||||
}
|
||||
|
||||
var diffTxt;
|
||||
switch(diffName){
|
||||
case 'easy':
|
||||
diffTxt="かんたん";
|
||||
break;
|
||||
case 'normal':
|
||||
diffTxt="ふつう";
|
||||
break;
|
||||
case 'hard':
|
||||
diffTxt="むずかしい";
|
||||
break;
|
||||
case 'oni':
|
||||
diffTxt="おに";
|
||||
break;
|
||||
}
|
||||
|
||||
_code += "<li class='difficulty "+diffName+"'>";
|
||||
_code+= "<span class='diffname'>"+diffTxt+"</span>";
|
||||
_code+= "<span class='stars'>"+starsDisplay+"</span>";
|
||||
_code += "</li>";
|
||||
|
||||
}
|
||||
|
||||
_code += "</ul></div>";
|
||||
|
||||
}
|
||||
|
||||
$("#song-container").html(_code);
|
||||
}
|
||||
|
||||
this.display = function(){
|
||||
}
|
||||
|
||||
this.refresh = function(){
|
||||
|
||||
}
|
||||
|
||||
$("#screen").load("/src/views/songselect.html", _this.run);
|
||||
|
||||
}
|
||||
65
src/js/soundsystem.js
Normal file
65
src/js/soundsystem.js
Normal file
@@ -0,0 +1,65 @@
|
||||
function soundSystem(controller){
|
||||
|
||||
var _this = this;
|
||||
var _speed=0;
|
||||
var _circles = [];
|
||||
var _circleID = -1;
|
||||
var _measures = [];
|
||||
var _channel_max = 10;// number of channels
|
||||
var _mainMusicChannel=-1;
|
||||
|
||||
var _audiochannels = new Array();
|
||||
|
||||
for (var a=0;a<_channel_max;a++) {// prepare the channels
|
||||
_audiochannels[a] = new Array();
|
||||
_audiochannels[a]['channel'] = new Audio(); // create a new audio object
|
||||
_audiochannels[a]['finished'] = -1; // expected end time for this channel
|
||||
}
|
||||
|
||||
this.playSound = function(soundID){
|
||||
|
||||
if(soundID=="main-music" && _mainMusicChannel!=-1 && _mainMusicChannel.currentTime>0 ){//if music was paused but is going to be played
|
||||
_mainMusicChannel.play();
|
||||
}
|
||||
else{
|
||||
|
||||
for(var i=0;i<_audiochannels.length;i++){
|
||||
|
||||
var thistime = new Date();
|
||||
if (_audiochannels[i]['finished'] < thistime.getTime()) {// is this channel finished?
|
||||
_audiochannels[i]['finished'] = thistime.getTime() + document.getElementById(soundID).duration*1000;
|
||||
_audiochannels[i]['channel'].src = document.getElementById(soundID).src;
|
||||
_audiochannels[i]['channel'].load();
|
||||
_audiochannels[i]['channel'].play();
|
||||
|
||||
if(soundID=="main-music" && _mainMusicChannel==-1){
|
||||
_mainMusicChannel=_audiochannels[i]['channel'];
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.pauseSound = function(soundID, stop){
|
||||
for (var i=0;i<_audiochannels.length;i++){
|
||||
if(_audiochannels[i]['channel'].src == document.getElementById(soundID).src){
|
||||
_audiochannels[i]['channel'].pause();
|
||||
if(stop) _audiochannels[i]['channel'].currentTime=0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.fadeOutMusic = function(){
|
||||
|
||||
if(_mainMusicChannel.volume.toFixed(1)!=0.0){
|
||||
_mainMusicChannel.volume-=0.1;
|
||||
}
|
||||
else{
|
||||
_mainMusicChannel.pause();
|
||||
controller.fadeOutOver();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
44
src/js/titlescreen.js
Normal file
44
src/js/titlescreen.js
Normal file
@@ -0,0 +1,44 @@
|
||||
function Titlescreen(){
|
||||
|
||||
var _this = this;
|
||||
$("body").css("font-family", "TnT");
|
||||
|
||||
this.positionning = function(){
|
||||
|
||||
var width = 0.70*$(window).width();
|
||||
var logoW = (width>=654) ? 654 : width;
|
||||
var logoH = logoW/2.18;
|
||||
|
||||
$("#logo-big-cont").width(logoW);
|
||||
$("#logo-big-cont").height(logoH);
|
||||
$("#logo-big-cont").css("left", $(window).width()/2-($("#logo-big-cont").width()/2));
|
||||
$("#logo-big-cont").css("top", $(window).height()/2-($("#logo-big-cont").height()/2));
|
||||
|
||||
}
|
||||
|
||||
this.run = function(){
|
||||
|
||||
$(document).keypress(function(e){
|
||||
if(e.keyCode==13 && $("#screen").find("#title-screen").html())
|
||||
_this.goNext();
|
||||
});
|
||||
|
||||
$("#screen").find("#title-screen").click(function(){
|
||||
_this.goNext();
|
||||
});
|
||||
|
||||
|
||||
_this.positionning();
|
||||
$("#screen").find("#title-screen").show();
|
||||
$(window).resize(_this.positionning);
|
||||
|
||||
}
|
||||
|
||||
this.goNext = function(){
|
||||
document.getElementById("don").play();
|
||||
new SongSelect();
|
||||
}
|
||||
|
||||
$("#screen").load("/src/views/titlescreen.html", _this.run);
|
||||
|
||||
}
|
||||
562
src/js/view.js
Normal file
562
src/js/view.js
Normal file
@@ -0,0 +1,562 @@
|
||||
function View(controller, bg){
|
||||
|
||||
var _this = this;
|
||||
var _canvas = document.getElementById('canvas');
|
||||
var _ctx = _canvas.getContext('2d');
|
||||
|
||||
var _winW = $(window).width();
|
||||
var _winH = $(window).height();
|
||||
|
||||
/* Positionning and size variables */
|
||||
var _barH;
|
||||
var _barY;
|
||||
var _lyricsBarH;
|
||||
var _taikoW;
|
||||
var _taikoH;
|
||||
var _taikoX;
|
||||
var _taikoY;
|
||||
var _taikoSquareW = _winW/4;
|
||||
var _slotX = _taikoSquareW+100;;
|
||||
var _scoreSquareW;
|
||||
var _scoreSquareH;
|
||||
var _circleSize;
|
||||
var _bigCircleSize;
|
||||
var _circleY;
|
||||
var _lyricsSize;
|
||||
var _HPBarW;
|
||||
var _HPBarH;
|
||||
var _HPBarX;
|
||||
var _HPBarY;
|
||||
var _HPbarColX;
|
||||
var _HPbarColY;
|
||||
var _HPBarColMaxW;
|
||||
var _HPBarColH;7
|
||||
var _HPBarColWImage;
|
||||
var _HPBarColWCanvas;
|
||||
|
||||
var _circleAnimatorT;
|
||||
var _animationStartPos;
|
||||
|
||||
var _currentScore = 0;
|
||||
var _special="";
|
||||
var _scoreDispCount = -1;
|
||||
var _scoreOpacity = 1.0;
|
||||
|
||||
var _mainTextColor = "white";
|
||||
var _mainFont = "normal 14pt TnT";
|
||||
|
||||
var _lastMeasure = 0;
|
||||
var _currentTimingPoint=0;
|
||||
var _distanceForCircle=(_winW - _slotX); //Distance to be done by the circle
|
||||
var _timeForDistanceCircle;
|
||||
|
||||
var _currentCircleFace=0;
|
||||
|
||||
var _currentDonFace=0;
|
||||
var _currentBigDonFace=1;
|
||||
|
||||
var _nextBeat=0;
|
||||
|
||||
this.run = function(){
|
||||
_ctx.font = _mainFont;
|
||||
_this.setBackground();
|
||||
_this.refresh();
|
||||
}
|
||||
|
||||
this.setBackground = function(){
|
||||
$("#game").css("background", "url('"+bg+"')");
|
||||
$("#game").css("-webkit-background-size", "cover");
|
||||
$("#game").css("-moz-background-size", "cover");
|
||||
$("#game").css("-o-background-size", "cover");
|
||||
$("#game").css("background-size", "cover");
|
||||
}
|
||||
|
||||
this.getDistanceForCircle = function(){
|
||||
return _distanceForCircle;
|
||||
}
|
||||
|
||||
this.positionning = function(){
|
||||
|
||||
_winW = $(window).width();
|
||||
_winH = $(window).height();
|
||||
_canvas.width = _winW;
|
||||
_canvas.height = _winH;
|
||||
_barY = 0.25*_winH;
|
||||
_barH = 0.23*_winH;
|
||||
_lyricsBarH = 0.2*_barH;
|
||||
_taikoH = _barH;
|
||||
_taikoW = _taikoH/1.2;
|
||||
_taikoX = _taikoSquareW-_taikoW-20;
|
||||
_taikoY = _barY+5;
|
||||
_taikoSquareW = _winW/4;
|
||||
_slotX = _taikoSquareW+100;
|
||||
_scoreSquareW = 0.55*_taikoSquareW;
|
||||
_scoreSquareH = 0.25*_barH;
|
||||
_circleSize = 0.15*_barH;
|
||||
_bigCircleSize = 0.25*_barH;
|
||||
_circleY = (_barY+((_barH-_lyricsBarH)/2));
|
||||
_lyricsSize = 0.6*_lyricsBarH;
|
||||
_HPBarW = 2.475*_taikoSquareW;
|
||||
_HPBarH = 0.35*_barH;
|
||||
_HPBarX = _taikoSquareW+1.15*_taikoW;
|
||||
_HPBarY = _barY-_HPBarH;
|
||||
_HPbarColX = _HPBarX+0.008*_HPBarW;
|
||||
_HPbarColY = _HPBarY+0.14*_HPBarH;
|
||||
_HPBarColMaxW = _HPBarW-(0.075*_HPBarW);
|
||||
_HPBarColH = _HPBarH-(0.2*_HPBarH);
|
||||
|
||||
var circles = controller.getCircles();
|
||||
var currentCircle = controller.getCurrentCircle();
|
||||
if(currentCircle==0){
|
||||
_HPBarColWImage = (controller.getGlobalScore().hp*650)/100;
|
||||
_HPBarColWCanvas = (controller.getGlobalScore().hp*_HPBarColMaxW)/100;
|
||||
}
|
||||
else if(circles[currentCircle-1]){
|
||||
if(circles[currentCircle-1].isAnimationFinished() || circles[currentCircle-1].getScore()==0){
|
||||
_HPBarColWImage = (controller.getGlobalScore().hp*650)/100;
|
||||
_HPBarColWCanvas = (controller.getGlobalScore().hp*_HPBarColMaxW)/100;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.refresh = function(){
|
||||
|
||||
_this.positionning();
|
||||
_distanceForCircle=(_winW - _slotX);
|
||||
_timeForDistanceCircle=((20*_distanceForCircle)/controller.getHitcircleSpeed());
|
||||
|
||||
/* Draw */
|
||||
this.drawBar();
|
||||
this.drawSlot();
|
||||
this.drawMeasures();
|
||||
this.drawHPBar();
|
||||
this.drawCircles();
|
||||
this.drawTaikoSquare();
|
||||
this.drawScore();
|
||||
this.drawPressedKeys();
|
||||
this.drawCombo();
|
||||
this.drawGlobalScore();
|
||||
this.drawTime();
|
||||
|
||||
this.updateDonFaces();//animate circle face when combo superior to 50
|
||||
|
||||
}
|
||||
|
||||
this.updateDonFaces = function(){
|
||||
|
||||
if(controller.getEllapsedTime().ms>=_nextBeat){
|
||||
_nextBeat+=controller.getSongData().beatInfo.beatInterval;
|
||||
if(controller.getCombo()>=50){
|
||||
_currentBigDonFace=(_currentBigDonFace+1)%2;
|
||||
_currentDonFace=(_currentDonFace+1)%2;
|
||||
}
|
||||
else{
|
||||
_currentBigDonFace=1;
|
||||
_currentDonFace=0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.drawHPBar = function(){
|
||||
|
||||
var bottomSquareX = _taikoSquareW;
|
||||
var borderSize = 0.2*_HPBarH;
|
||||
_ctx.fillStyle = "black";
|
||||
_ctx.beginPath();
|
||||
_ctx.fillRect(_HPBarX+_HPBarW-(0.2*_HPBarY), _HPBarY, 0.2*_HPBarW, _HPBarH);//right hand black square
|
||||
_ctx.fillRect(bottomSquareX+borderSize, _HPBarY+0.435*_HPBarH, 0.5*_HPBarW, _HPBarH/2);
|
||||
_ctx.fillRect(bottomSquareX, _HPBarY+0.68*_HPBarH, 0.8*_HPBarW, _HPBarH/4);
|
||||
_ctx.arc(bottomSquareX+borderSize,_HPBarY+(0.435*_HPBarH)+borderSize,borderSize,0,Math.PI*2);
|
||||
_ctx.fill();
|
||||
_ctx.closePath();
|
||||
|
||||
var barBG = document.getElementById('hp-bar-bg');
|
||||
var barColour = document.getElementById('hp-bar-colour');
|
||||
|
||||
_ctx.drawImage(barBG, _HPBarX, _HPBarY, _HPBarW, _HPBarH);
|
||||
_ctx.drawImage(barColour, 0, 0, _HPBarColWImage, 40, _HPbarColX, _HPbarColY, _HPBarColWCanvas, _HPBarColH);
|
||||
|
||||
}
|
||||
|
||||
this.drawMeasures = function(){
|
||||
|
||||
var measures = controller.getSongData().measures;
|
||||
var currentTime = controller.getEllapsedTime().ms;
|
||||
|
||||
measures.forEach(function(measure, index){
|
||||
if(currentTime>=measure.ms-_timeForDistanceCircle && currentTime<=measure.ms+350 && measure.nb==0){
|
||||
_this.drawMeasure(measure);
|
||||
measure.x-=controller.getHitcircleSpeed();
|
||||
}
|
||||
else{
|
||||
measure.x=_winW; //set initial position to the extreme right of the screen
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.drawMeasure = function(measure){
|
||||
_ctx.strokeStyle = "#bab8b8";
|
||||
_ctx.lineWidth = "5.0";
|
||||
_ctx.beginPath();
|
||||
_ctx.moveTo(measure.x, _barY+5);
|
||||
_ctx.lineTo(measure.x, _barY+_barH-_lyricsBarH-5);
|
||||
_ctx.closePath();
|
||||
_ctx.stroke();
|
||||
}
|
||||
|
||||
this.drawCombo = function(){
|
||||
if(controller.getCombo()>=10){
|
||||
var comboY = _barY+(_barH/2);
|
||||
var fontSize = (0.4)*_taikoH;
|
||||
_ctx.font = "normal "+fontSize+"px TnT";
|
||||
_ctx.textAlign = "center";
|
||||
_ctx.strokeStyle = "black";
|
||||
_ctx.strokeText(controller.getCombo(), _taikoSquareW-20-(_taikoW/2), comboY);
|
||||
_ctx.fillStyle = "white";
|
||||
_ctx.fillText(controller.getCombo(), _taikoSquareW-20-(_taikoW/2), comboY);
|
||||
|
||||
var fontSize = (0.12)*_taikoH;
|
||||
_ctx.font = "normal "+fontSize+"px TnT";
|
||||
_ctx.textAlign = "center";
|
||||
_ctx.strokeStyle = "black";
|
||||
_ctx.strokeText("コンボ", _taikoSquareW-20-(_taikoW/2), comboY+1.5*fontSize);
|
||||
_ctx.fillStyle = "white";
|
||||
_ctx.fillText("コンボ", _taikoSquareW-20-(_taikoW/2), comboY+1.5*fontSize);
|
||||
_scoreDispCount++;
|
||||
}
|
||||
}
|
||||
|
||||
this.drawGlobalScore = function(){
|
||||
|
||||
/* Draw score square */
|
||||
_ctx.fillStyle="black";
|
||||
_ctx.beginPath();
|
||||
_ctx.fillRect(0,_barY,_scoreSquareW,_scoreSquareH-10);
|
||||
_ctx.fillRect(0,_barY,_scoreSquareW-10,_scoreSquareH);
|
||||
_ctx.arc(_scoreSquareW-10,_barY+(_scoreSquareH-10),10,0,Math.PI*2);
|
||||
_ctx.fill();
|
||||
_ctx.closePath();
|
||||
|
||||
var fontSize = 0.7*_scoreSquareH;
|
||||
/* Draw score text */
|
||||
_ctx.font = "normal "+fontSize+"px TnT";
|
||||
_ctx.fillStyle = "white";
|
||||
_ctx.textAlign = "right";
|
||||
_ctx.fillText(controller.getGlobalScore().points, _scoreSquareW-20, _barY+0.7*_scoreSquareH);
|
||||
}
|
||||
|
||||
this.drawPressedKeys = function(){
|
||||
|
||||
var keyRed = document.getElementById("taiko-key-red");
|
||||
var keyBlue = document.getElementById("taiko-key-blue");
|
||||
|
||||
if(controller.getKeys()[67]){
|
||||
var elemW = 0.45*_taikoW;
|
||||
_ctx.drawImage(keyBlue, 0, 0, 68, 124, _taikoX+0.05*_taikoW, _taikoY+0.03*_taikoH, elemW, (124/68)*elemW);
|
||||
}
|
||||
|
||||
if(controller.getKeys()[86]){
|
||||
var elemW = 0.35*_taikoW;
|
||||
_ctx.drawImage(keyRed, 0, 0, 53, 100, _taikoX+0.15*_taikoW, _taikoY+0.09*_taikoH, elemW, (100/53)*elemW);
|
||||
}
|
||||
|
||||
if(controller.getKeys()[66]){
|
||||
var elemW = 0.35*_taikoW;
|
||||
_ctx.drawImage(keyRed, 53, 0, 53, 100, (_taikoX+0.15*_taikoW)+elemW, _taikoY+0.09*_taikoH, elemW, (100/53)*elemW);
|
||||
}
|
||||
|
||||
if(controller.getKeys()[78]){
|
||||
var elemW = 0.45*_taikoW;
|
||||
_ctx.drawImage(keyBlue, 68, 0, 68, 124, (_taikoX+0.05*_taikoW)+elemW, _taikoY+0.03*_taikoH, elemW, (124/68)*elemW);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.displayScore = function(score, notPlayed){
|
||||
_currentScore=score;
|
||||
_special = (notPlayed) ? "-b" : "";
|
||||
_scoreDispCount=0;
|
||||
_scoreOpacity=1.0;
|
||||
}
|
||||
|
||||
this.drawScore = function(){
|
||||
|
||||
if(_scoreDispCount>=0 && _scoreDispCount<=20){
|
||||
_ctx.globalAlpha = _scoreOpacity;
|
||||
var scoreIMG = document.getElementById("score-"+_currentScore+_special);
|
||||
_ctx.drawImage(scoreIMG, _slotX-(_barH/2), (_barY+((_barH-_lyricsBarH)/2))-(_barH/2), _barH, _barH);
|
||||
_scoreDispCount++;
|
||||
if(_scoreOpacity-0.1>=0 && _currentScore!=0) _scoreOpacity-=0.1;
|
||||
}
|
||||
else if(_scoreDispCount==21){
|
||||
_scoreDispCount=-1;
|
||||
}
|
||||
_ctx.globalAlpha=1;
|
||||
|
||||
}
|
||||
|
||||
this.drawCircles = function(){
|
||||
|
||||
var circles = controller.getCircles();
|
||||
circles.forEach(function(circle){
|
||||
|
||||
var currentTime = controller.getEllapsedTime().ms;
|
||||
var startingTime = circle.getMS()-_timeForDistanceCircle;
|
||||
var finishTime = circle.getMS()+100; //at circle.getMS(), the cirlce fits the slot
|
||||
|
||||
if(!circle.getPlayed()){
|
||||
|
||||
if(currentTime <= startingTime){
|
||||
var initPoint = {x:_winW, y:_circleY};
|
||||
circle.setInitPos(initPoint); //set initial position to the extreme right of the screen
|
||||
}
|
||||
if(currentTime > startingTime && currentTime <= finishTime){
|
||||
_this.drawCircle(circle);
|
||||
circle.move(controller.getHitcircleSpeed());
|
||||
}
|
||||
|
||||
}
|
||||
else{ //Animate circle to the HP bar
|
||||
|
||||
var animationDuration=470; //ms
|
||||
|
||||
if(currentTime>finishTime && !circle.isAnimated() && circle.getScore()!=0){
|
||||
circle.animate();//start animation to HP bar
|
||||
_animationStartPos=circle.getPos().x;
|
||||
_this.drawCircle(circle);
|
||||
}
|
||||
else if(currentTime>finishTime && currentTime<=finishTime+animationDuration && circle.isAnimated()){
|
||||
|
||||
var curveDistance = (_HPbarColX+_HPBarColWCanvas)-_animationStartPos;
|
||||
var circleBezP0={
|
||||
x:_animationStartPos,
|
||||
y:_circleY
|
||||
};
|
||||
|
||||
var circleBezP1={
|
||||
x:_animationStartPos+(0.25*curveDistance),
|
||||
y:0.5*_barH
|
||||
};
|
||||
|
||||
var circleBezP2={
|
||||
x:_animationStartPos+(0.75*curveDistance),
|
||||
y:-_barH
|
||||
};
|
||||
|
||||
var circleBezP3={
|
||||
x:_animationStartPos+curveDistance,
|
||||
y:_HPbarColY
|
||||
};
|
||||
var bezierPoint = _this.calcBezierPoint(circle.getAnimT(), circleBezP0, circleBezP1, circleBezP2, circleBezP3);
|
||||
circle.moveTo(bezierPoint.x, bezierPoint.y);
|
||||
_this.drawCircle(circle);
|
||||
|
||||
if(currentTime>=circle.getLastFrame()){//update animation frame
|
||||
circle.incAnimT();
|
||||
circle.incFrame();
|
||||
}
|
||||
}
|
||||
else if(currentTime>finishTime+animationDuration && circle.isAnimated()){
|
||||
circle.endAnimation();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.calcBezierPoint = function(t, p0, p1, p2, p3){
|
||||
|
||||
var data = [p0, p1, p2, p3];
|
||||
var at = 1-t;
|
||||
|
||||
for(var i=1; i<data.length; i++){
|
||||
for(var k=0; k<data.length-i; k++){
|
||||
data[k] = {
|
||||
x: data[k].x * at + data[k+1].x *t,
|
||||
y: data[k].y * at + data[k+1].y *t
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return data[0];
|
||||
}
|
||||
|
||||
this.drawCircle = function(circle){
|
||||
|
||||
var size, color, txt;
|
||||
var offsetBigY=0;
|
||||
var suppBig=0;
|
||||
var faceID;
|
||||
|
||||
switch(circle.getType()){
|
||||
|
||||
case 'don':
|
||||
color = "#f54c25";
|
||||
size = _circleSize;
|
||||
txt = "ドン";
|
||||
faceID = "don-"+_currentDonFace;
|
||||
break;
|
||||
|
||||
case 'ka':
|
||||
color = "#75CEE9";
|
||||
size = _circleSize;
|
||||
txt="カッ";
|
||||
faceID = "don-"+_currentDonFace;
|
||||
break;
|
||||
|
||||
case 'daiDon':
|
||||
color = "#f54c25";
|
||||
size = _bigCircleSize;
|
||||
txt = "ドン(大）";
|
||||
offsetBigY=5;
|
||||
suppBig=10;
|
||||
faceID = "big-don-"+_currentBigDonFace;
|
||||
break;
|
||||
|
||||
case 'daiKa':
|
||||
color = "#75CEE9";
|
||||
size = _bigCircleSize;
|
||||
txt="カッ(大）";
|
||||
offsetBigY=5;
|
||||
suppBig=10;
|
||||
faceID = "big-don-"+_currentBigDonFace;
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
//Main circle
|
||||
_ctx.fillStyle = color;
|
||||
_ctx.beginPath();
|
||||
_ctx.arc(circle.getPos().x, circle.getPos().y, size, 0, 2*Math.PI);
|
||||
_ctx.closePath();
|
||||
_ctx.fill();
|
||||
|
||||
//Face on circle
|
||||
var face = document.getElementById(faceID);
|
||||
_ctx.drawImage(face, circle.getPos().x-size-2, circle.getPos().y-size-4, (size*2)+5, (size*2)+6);
|
||||
|
||||
if(!circle.isAnimated()){
|
||||
//text
|
||||
_ctx.font = "normal bold "+_lyricsSize+"px Kozuka";
|
||||
_ctx.textAlign = "center";
|
||||
_ctx.strokeStyle = "black";
|
||||
_ctx.strokeText(txt, circle.getPos().x+size/2, _barY+_barH-(0.3*_lyricsBarH));
|
||||
_ctx.fillStyle = "white";
|
||||
_ctx.fillText(txt, circle.getPos().x+size/2, _barY+_barH-(0.3*_lyricsBarH));
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.togglePauseMenu = function(){
|
||||
$("#pause-menu").is(":visible") ? $("#pause-menu").hide() : $("#pause-menu").show();
|
||||
}
|
||||
|
||||
this.drawTime = function(){
|
||||
|
||||
var time = controller.getEllapsedTime();
|
||||
|
||||
_ctx.globalAlpha = 0.7;
|
||||
_ctx.fillStyle = "black";
|
||||
_ctx.fillRect(_winW-110, _winH-60, _winW, _winH);
|
||||
|
||||
_ctx.globalAlpha = 1.0;
|
||||
_ctx.fillStyle = "white";
|
||||
|
||||
var formatedH = ('0' + time.hour).slice(-2);
|
||||
var formatedM = ('0' + time.min).slice(-2);
|
||||
var formatedS = ('0' + time.sec).slice(-2);
|
||||
|
||||
_ctx.font = "normal "+_barH/12+"px Kozuka";
|
||||
_ctx.fillText(formatedH+':'+formatedM+':'+formatedS, _winW-10, _winH-30);
|
||||
_ctx.fillText(time.ms, _winW-10, _winH-10);
|
||||
|
||||
}
|
||||
|
||||
this.drawBar = function(){
|
||||
|
||||
var grd;
|
||||
if(controller.getKeys()[86] || controller.getKeys()[66]){ //keys v, b
|
||||
grd = _ctx.createLinearGradient(0, _barY, _winW, _barH);
|
||||
grd.addColorStop(0,"#f54c25");
|
||||
grd.addColorStop(1,"#232323");
|
||||
}
|
||||
else if(controller.getKeys()[67] || controller.getKeys()[78]){ //keys c, n
|
||||
grd = _ctx.createLinearGradient(0, _barY, _winW, _barH);
|
||||
grd.addColorStop(0,"#75CEE9");
|
||||
grd.addColorStop(1,"#232323");
|
||||
}
|
||||
else{
|
||||
grd="#232323";
|
||||
}
|
||||
|
||||
_ctx.strokeStyle = "black";
|
||||
_ctx.fillStyle = grd;
|
||||
_ctx.lineWidth = 10;
|
||||
_ctx.beginPath();
|
||||
_ctx.rect(0,_barY,_winW,_barH);
|
||||
_ctx.closePath();
|
||||
_ctx.fill();
|
||||
_ctx.stroke();
|
||||
|
||||
/* Lyrics bar */
|
||||
_ctx.fillStyle = "#888888";
|
||||
_ctx.beginPath();
|
||||
_ctx.rect(0,_barY+_barH-_lyricsBarH,_winW,_lyricsBarH);
|
||||
_ctx.closePath();
|
||||
_ctx.fill();
|
||||
_ctx.stroke();
|
||||
|
||||
|
||||
}
|
||||
|
||||
this.drawSlot = function(){
|
||||
|
||||
/* Main circle */
|
||||
var normalSize = _circleSize-(0.2*_circleSize);
|
||||
_ctx.fillStyle = "#6f6f6e";
|
||||
_ctx.beginPath();
|
||||
_ctx.arc(_slotX, _circleY, normalSize,0,2*Math.PI);
|
||||
_ctx.closePath();
|
||||
_ctx.fill();
|
||||
|
||||
/* Big stroke circle */
|
||||
var bigSize = _circleSize;
|
||||
_ctx.strokeStyle = "#9e9f9f";
|
||||
_ctx.lineWidth = 3;
|
||||
_ctx.beginPath();
|
||||
_ctx.arc(_slotX, _circleY, bigSize,0,2*Math.PI);
|
||||
_ctx.closePath();
|
||||
_ctx.stroke();
|
||||
|
||||
/* Bigger stroke circle */
|
||||
var bigSize = _bigCircleSize;
|
||||
_ctx.strokeStyle = "#6f6f6e";
|
||||
_ctx.lineWidth = 3;
|
||||
_ctx.beginPath();
|
||||
_ctx.arc(_slotX, _circleY, bigSize,0,2*Math.PI);
|
||||
_ctx.closePath();
|
||||
_ctx.stroke();
|
||||
|
||||
}
|
||||
|
||||
this.drawTaikoSquare = function(){
|
||||
|
||||
/* Taiko square */
|
||||
_ctx.lineWidth = 7;
|
||||
_ctx.fillStyle = "#ff3c00";
|
||||
_ctx.strokeStyle = "black";
|
||||
_ctx.beginPath();
|
||||
_ctx.rect(0,_barY, _taikoSquareW,_barH);
|
||||
_ctx.fill();
|
||||
_ctx.closePath();
|
||||
_ctx.stroke();
|
||||
|
||||
var taiko = document.getElementById("taiko");
|
||||
_ctx.drawImage(taiko, _taikoX, _taikoY, _taikoW, _taikoH);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
56
src/php/getsongs.php
Normal file
56
src/php/getsongs.php
Normal file
@@ -0,0 +1,56 @@
|
||||
<?php
|
||||
|
||||
$songDirs = scandir('../../songs');
|
||||
|
||||
$songs = array();
|
||||
|
||||
foreach($songDirs as $songDir){
|
||||
|
||||
if($songDir!='.' && $songDir!='..'){
|
||||
|
||||
$songFiles = scandir('../../songs/'.$songDir);
|
||||
|
||||
$files = array();
|
||||
|
||||
foreach($songFiles as $songFile){
|
||||
|
||||
$extension = pathinfo('../../songs/'.$songDir.'/'.$songFile)['extension'];
|
||||
if($extension=='osu'){
|
||||
|
||||
$fileContent = file_get_contents('../../songs/'.$songDir.'/'.$songFile);
|
||||
$rows = explode("\n", $fileContent);
|
||||
array_shift($rows);
|
||||
$difficulty="";
|
||||
|
||||
foreach($rows as $row => $data){
|
||||
$row_data = explode(':', $data);
|
||||
if($row_data[0]=='OverallDifficulty'){
|
||||
$difficulty=intval($row_data[1]);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
$file = array(
|
||||
"songFile" => $songFile,
|
||||
"difficulty" => $difficulty
|
||||
);
|
||||
|
||||
array_push($files, $file);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$song = array(
|
||||
"songDir" => $songDir,
|
||||
"files" => $files
|
||||
);
|
||||
|
||||
array_push($songs, $song);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
echo json_encode($songs);
|
||||
|
||||
?>
|
||||
12
src/views/game.html
Normal file
12
src/views/game.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<div id='game'>
|
||||
|
||||
<canvas id='canvas'></canvas>
|
||||
|
||||
<div id='pause-menu'>
|
||||
<div class='window'>
|
||||
<button type='button' id='restart-butt'>Restart</button>
|
||||
<button type='button' id='song-selection-butt'>Song selection</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
4
src/views/loader.html
Normal file
4
src/views/loader.html
Normal file
@@ -0,0 +1,4 @@
|
||||
<div id="loader">
|
||||
<div class='progress'></div>
|
||||
<span class='percentage'>0%</span>
|
||||
</div>
|
||||
6
src/views/loadsong.html
Normal file
6
src/views/loadsong.html
Normal file
@@ -0,0 +1,6 @@
|
||||
<div id='load-song'>
|
||||
<div id='loading-song'>
|
||||
<img id='loading-don' src="/assets/img/dancing-don.gif" />
|
||||
<p>Loading...</p>
|
||||
</div>
|
||||
</div>
|
||||
42
src/views/scoresheet.html
Normal file
42
src/views/scoresheet.html
Normal file
@@ -0,0 +1,42 @@
|
||||
<div id='scoresheet'>
|
||||
|
||||
<div id='top-part'>
|
||||
<h2>成績発表</h2>
|
||||
</div>
|
||||
|
||||
<div id='result-bar'>
|
||||
|
||||
<img id='score-mark' />
|
||||
|
||||
<div id='score-cont'>
|
||||
<div id='score-hp-bar-bg'>
|
||||
<div id='score-hp-bar-colour'>
|
||||
<img src="/assets/img/hp-bar-colour.png" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id='score-points'></div>
|
||||
<table id='score-details'>
|
||||
<tr>
|
||||
<td class='floatLeft'>良</td><td class='value' id='nb-great'></td>
|
||||
<td>最大コンボ数</td><td class='value' id='max-combo'></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class='floatLeft'>可</td><td class='value' id='nb-good'></td>
|
||||
<!--<td>連打数</td><td id='nb-rendasu'></td>-->
|
||||
</tr>
|
||||
<tr>
|
||||
<td class='floatLeft'>不可</td><td class='value' id='nb-fail'></td>
|
||||
<td></td><td></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id='bottom-part'>
|
||||
<div class='gradient-overlay'></div>
|
||||
<button type='button' id='song-select'>Song select</button>
|
||||
<button type='button' id='replay'>Replay</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
3
src/views/songselect.html
Normal file
3
src/views/songselect.html
Normal file
@@ -0,0 +1,3 @@
|
||||
<div id="song-select">
|
||||
<div id='song-container'></div>
|
||||
</div>
|
||||
4
src/views/titlescreen.html
Normal file
4
src/views/titlescreen.html
Normal file
@@ -0,0 +1,4 @@
|
||||
<div id='title-screen'>
|
||||
<div id='logo-big-cont'><img src="/assets/img/logo-big.png" alt="太鼓の達人ウェブ" /></div>
|
||||
<h2 class='click-to-continue'>Click or press enter</h2>
|
||||
</div>
|
||||
Reference in New Issue
Block a user