mirror of
https://github.com/jiojciojsioe3/a3cjroijsiojiorj.git
synced 2024-11-15 07:21:50 +08:00
Merge pull request #12 from LoveEevee/multiplayer
Add online 2-player mode [untested]
This commit is contained in:
Bui
GitHub
commit
a8b05df75e
@ -45,6 +45,7 @@
|
|||||||
<script src="/src/js/scalablecanvas.js"></script>
|
<script src="/src/js/scalablecanvas.js"></script>
|
||||||
<script src="/src/js/element.js"></script>
|
<script src="/src/js/element.js"></script>
|
||||||
<script src="/src/js/soundbuffer.js"></script>
|
<script src="/src/js/soundbuffer.js"></script>
|
||||||
|
<script src="/src/js/p2.js"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
@ -75,6 +75,7 @@ ul li{
|
|||||||
box-shadow: 2px 2px 10px black;
|
box-shadow: 2px 2px 10px black;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.opened{
|
.opened{
|
||||||
@ -127,3 +128,12 @@ ul li{
|
|||||||
.difficulty:hover .stars{
|
.difficulty:hover .stars{
|
||||||
color:white;
|
color:white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.song.p2:not(.opened)::after,
|
||||||
|
.difficulty.p2::after{
|
||||||
|
content:"P2";
|
||||||
|
display:block;
|
||||||
|
position:absolute;
|
||||||
|
bottom:0;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|||||||
@ -1,226 +1,220 @@
|
|||||||
function Controller(selectedSong, songData, autoPlayEnabled){
|
class Controller{
|
||||||
|
constructor(selectedSong, songData, autoPlayEnabled, multiplayer){
|
||||||
|
this.selectedSong = selectedSong
|
||||||
|
this.songData = songData
|
||||||
|
this.autoPlayEnabled = autoPlayEnabled
|
||||||
|
this.multiplayer = multiplayer
|
||||||
|
this.pauseMenu = false
|
||||||
|
|
||||||
var _this = this;
|
var backgroundURL = "/songs/" + this.selectedSong.folder + "/bg.png"
|
||||||
var _backgroundURL = "/songs/"+selectedSong.folder+"/bg.png";
|
var songParser = new ParseSong(songData)
|
||||||
|
this.parsedSongData = songParser.getData()
|
||||||
|
|
||||||
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, selectedSong.title, selectedSong.difficulty);
|
|
||||||
var _mekadon = new Mekadon(this, _game);
|
|
||||||
var _keyboard = new Keyboard(this);
|
|
||||||
var _mainLoop;
|
|
||||||
var _pauseMenu = false;
|
|
||||||
var _mainAsset
|
|
||||||
assets.songs.forEach(song => {
|
assets.songs.forEach(song => {
|
||||||
if(song.id == selectedSong.folder){
|
if(song.id == this.selectedSong.folder){
|
||||||
_mainAsset = song.sound
|
this.mainAsset = song.sound
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
this.autoPlayEnabled = autoPlayEnabled
|
this.game = new Game(this, this.selectedSong, this.parsedSongData)
|
||||||
|
this.view = new View(this, backgroundURL, this.selectedSong.title, this.selectedSong.difficulty)
|
||||||
this.run = function(){
|
this.mekadon = new Mekadon(this, this.game)
|
||||||
|
this.keyboard = new Keyboard(this)
|
||||||
_this.loadUIEvents();
|
|
||||||
_game.run();
|
|
||||||
_view.run();
|
|
||||||
_this.startMainLoop();
|
|
||||||
}
|
}
|
||||||
|
run(syncWith){
|
||||||
this.loadUIEvents = function(){
|
this.loadUIEvents()
|
||||||
$("#song-selection-butt").click(function(){
|
this.game.run()
|
||||||
assets.sounds["don"].play();
|
this.view.run()
|
||||||
_this.songSelection();
|
this.startMainLoop()
|
||||||
});
|
if(syncWith){
|
||||||
$("#restart-butt").click(function(){
|
syncWith.game.getElapsedTime = () => {
|
||||||
assets.sounds["don"].play();
|
return this.game.elapsedTime
|
||||||
_this.restartSong();
|
|
||||||
});
|
|
||||||
$("#continue-butt").click(function(){
|
|
||||||
_this.togglePauseMenu();
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
this.game.setElapsedTime =
|
||||||
this.startMainLoop = function(){
|
syncWith.game.setElapsedTime = time => {
|
||||||
|
this.game.elapsedTime.ms = time
|
||||||
var started=false;
|
syncWith.game.elapsedTime.ms = time
|
||||||
_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 shall starts
|
syncWith.run()
|
||||||
_mainAsset.play(_songData.generalInfo.audioWait)
|
this.syncWith = syncWith
|
||||||
started=true;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if(started){ //Game start here
|
|
||||||
if(!_game.isPaused()){
|
|
||||||
_game.update();
|
|
||||||
_view.refresh();
|
|
||||||
_keyboard.checkGameKeys();
|
|
||||||
}
|
}
|
||||||
_keyboard.checkMenuKeys();
|
loadUIEvents(){
|
||||||
|
$("#song-selection-butt").click(() => {
|
||||||
|
assets.sounds["don"].play()
|
||||||
|
this.songSelection()
|
||||||
|
})
|
||||||
|
$("#restart-butt").click(() => {
|
||||||
|
assets.sounds["don"].play()
|
||||||
|
this.restartSong()
|
||||||
|
})
|
||||||
|
$("#continue-butt").click(() => {
|
||||||
|
this.togglePauseMenu()
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
startMainLoop(){
|
||||||
}, 20);
|
this.mainLoopStarted = false
|
||||||
|
this.mainLoopRunning = true
|
||||||
|
this.mainLoop()
|
||||||
}
|
}
|
||||||
|
mainLoop(){
|
||||||
this.getDistanceForCircle = function(){
|
if(this.mainLoopRunning){
|
||||||
return _view.getDistanceForCircle();
|
if(this.multiplayer != 2){
|
||||||
|
requestAnimationFrame(() => {
|
||||||
|
if(this.syncWith){
|
||||||
|
this.syncWith.game.elapsedTime.ms = this.game.elapsedTime.ms
|
||||||
}
|
}
|
||||||
|
this.mainLoop()
|
||||||
this.togglePauseMenu = function(){
|
if(this.syncWith){
|
||||||
_this.togglePause();
|
this.syncWith.mainLoop()
|
||||||
_view.togglePauseMenu();
|
|
||||||
}
|
}
|
||||||
|
})
|
||||||
this.displayResults = function(){
|
}
|
||||||
clearInterval(_mainLoop);
|
var ms = this.game.getElapsedTime().ms
|
||||||
|
if(!this.game.isPaused()){
|
||||||
|
if(ms >= 0 && !this.mainLoopStarted){
|
||||||
var score = _this.getGlobalScore();
|
this.mainLoopStarted = true
|
||||||
|
}
|
||||||
|
if(ms < 0){
|
||||||
|
this.game.updateTime()
|
||||||
|
}
|
||||||
|
if(this.mainLoopStarted){
|
||||||
|
this.game.update()
|
||||||
|
this.game.playMainMusic()
|
||||||
|
}
|
||||||
|
this.view.refresh()
|
||||||
|
this.keyboard.checkGameKeys()
|
||||||
|
}
|
||||||
|
this.keyboard.checkMenuKeys()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
getDistanceForCircle(){
|
||||||
|
return this.view.getDistanceForCircle()
|
||||||
|
}
|
||||||
|
togglePauseMenu(){
|
||||||
|
this.togglePause()
|
||||||
|
this.view.togglePauseMenu()
|
||||||
|
}
|
||||||
|
displayResults(){
|
||||||
|
var score = this.getGlobalScore()
|
||||||
|
var vp
|
||||||
if (score.fail == 0) {
|
if (score.fail == 0) {
|
||||||
vp = 'fullcombo';
|
vp = "fullcombo"
|
||||||
_this.playSoundMeka('fullcombo', 1.350);
|
this.playSoundMeka("fullcombo", 1.350)
|
||||||
} else if (score.hp >= 50) {
|
} else if (score.hp >= 50) {
|
||||||
vp = 'clear';
|
vp = "clear"
|
||||||
} else {
|
} else {
|
||||||
vp = 'fail';
|
vp = "fail"
|
||||||
}
|
}
|
||||||
|
assets.sounds["game" + vp].play()
|
||||||
assets.sounds['game' + vp].play();
|
setTimeout(() => {
|
||||||
|
this.mainLoopRunning = false
|
||||||
setTimeout(function(){
|
if(this.multiplayer != 2){
|
||||||
new Scoresheet(_this, _this.getGlobalScore());
|
new Scoresheet(this, this.getGlobalScore())
|
||||||
}, 7000);
|
|
||||||
}
|
}
|
||||||
|
}, 7000)
|
||||||
this.displayScore = function(score, notPlayed){
|
|
||||||
_view.displayScore(score, notPlayed);
|
|
||||||
}
|
}
|
||||||
|
displayScore(score, notPlayed){
|
||||||
this.fadeOutOver = function(){
|
this.view.displayScore(score, notPlayed)
|
||||||
_game.fadeOutOver();
|
|
||||||
_this.displayResults();
|
|
||||||
}
|
}
|
||||||
|
fadeOutOver(){
|
||||||
this.getCurrentTimingPoint = function(){
|
this.game.fadeOutOver()
|
||||||
return _game.getCurrentTimingPoint();
|
this.displayResults()
|
||||||
}
|
}
|
||||||
|
getCurrentTimingPoint(){
|
||||||
this.songSelection = function(){
|
return this.game.getCurrentTimingPoint()
|
||||||
$("#main-music").remove();
|
|
||||||
$("#music-bg").remove();
|
|
||||||
clearInterval(_mainLoop);
|
|
||||||
new SongSelect();
|
|
||||||
}
|
}
|
||||||
|
songSelection(){
|
||||||
this.restartSong = function(){
|
$("#music-bg").remove()
|
||||||
_mainAsset.stop()
|
this.mainLoopRunning = false
|
||||||
clearInterval(_mainLoop);
|
new SongSelect()
|
||||||
$("#screen").load("/src/views/game.html", function(){
|
|
||||||
var taikoGame = new Controller(selectedSong, songData, autoPlayEnabled);
|
|
||||||
taikoGame.run();
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
restartSong(){
|
||||||
this.playSoundMeka = function(soundID, time){
|
this.mainAsset.stop()
|
||||||
assets.sounds[soundID + (autoPlayEnabled ? '-meka' : '')].play(time)
|
this.mainLoopRunning = false
|
||||||
|
$("#screen").load("/src/views/game.html", () => {
|
||||||
|
var taikoGame = new Controller(this.selectedSong, this.songData, this.autoPlayEnabled)
|
||||||
|
taikoGame.run()
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
playSoundMeka(soundID, time){
|
||||||
this.initTiming = function(){
|
var meka = ""
|
||||||
_game.initTiming();
|
if(this.autoPlayEnabled && !this.multiplayer){
|
||||||
|
meka = "-meka"
|
||||||
}
|
}
|
||||||
|
assets.sounds[soundID + meka].play(time)
|
||||||
this.setHitcircleSpeed = function(speed){
|
|
||||||
_view.setHitcircleSpeed(speed);
|
|
||||||
}
|
}
|
||||||
|
initTiming(){
|
||||||
this.getHitcircleSpeed = function(){
|
this.game.initTiming()
|
||||||
return _game.getHitcircleSpeed();
|
|
||||||
}
|
}
|
||||||
|
setHitcircleSpeed(speed){
|
||||||
this.toggleMainMusic = function(){
|
this.view.setHitcircleSpeed(speed)
|
||||||
_game.toggleMainMusic();
|
|
||||||
}
|
}
|
||||||
|
getHitcircleSpeed(){
|
||||||
this.togglePause = function(){
|
return this.game.getHitcircleSpeed()
|
||||||
_game.togglePause();
|
|
||||||
}
|
}
|
||||||
|
toggleMainMusic(){
|
||||||
this.isPaused = function(){
|
this.game.toggleMainMusic()
|
||||||
return _game.isPaused();
|
|
||||||
}
|
}
|
||||||
|
togglePause(){
|
||||||
this.getKeys = function(){
|
if(this.syncWith){
|
||||||
return _keyboard.getKeys();
|
this.syncWith.game.togglePause()
|
||||||
}
|
}
|
||||||
|
this.game.togglePause()
|
||||||
this.setKey = function(keyCode, down){
|
|
||||||
return _keyboard.setKey(keyCode, down);
|
|
||||||
}
|
}
|
||||||
|
isPaused(){
|
||||||
this.getBindings = function(){
|
return this.game.isPaused()
|
||||||
return _keyboard.getBindings();
|
|
||||||
}
|
}
|
||||||
|
getKeys(){
|
||||||
this.getSongData = function(){
|
return this.keyboard.getKeys()
|
||||||
return _game.getSongData();
|
|
||||||
}
|
}
|
||||||
|
setKey(keyCode, down){
|
||||||
this.getEllapsedTime = function(){
|
return this.keyboard.setKey(keyCode, down)
|
||||||
return _game.getEllapsedTime();
|
|
||||||
}
|
}
|
||||||
|
getBindings(){
|
||||||
this.getCircles = function(){
|
return this.keyboard.getBindings()
|
||||||
return _game.getCircles();
|
|
||||||
}
|
}
|
||||||
|
getSongData(){
|
||||||
this.getCurrentCircle = function(){
|
return this.game.getSongData()
|
||||||
return _game.getCurrentCircle();
|
|
||||||
}
|
}
|
||||||
|
getElapsedTime(){
|
||||||
this.updateCurrentCircle = function(){
|
return this.game.getElapsedTime()
|
||||||
_game.updateCurrentCircle();
|
|
||||||
}
|
}
|
||||||
|
getCircles(){
|
||||||
this.isWaitingForKeyup = function(key, type){
|
return this.game.getCircles()
|
||||||
return _keyboard.isWaitingForKeyup(key, type);
|
|
||||||
}
|
}
|
||||||
|
getCurrentCircle(){
|
||||||
this.waitForKeyup = function(key, type){
|
return this.game.getCurrentCircle()
|
||||||
_keyboard.waitForKeyup(key, type);
|
|
||||||
}
|
}
|
||||||
|
updateCurrentCircle(){
|
||||||
this.getKeyTime = function(){
|
this.game.updateCurrentCircle()
|
||||||
return _keyboard.getKeyTime();
|
|
||||||
}
|
}
|
||||||
|
isWaitingForKeyup(key, type){
|
||||||
this.updateCombo = function(score){
|
return this.keyboard.isWaitingForKeyup(key, type)
|
||||||
_game.updateCombo(score);
|
|
||||||
}
|
}
|
||||||
|
waitForKeyup(key, type){
|
||||||
this.getCombo = function(){
|
this.keyboard.waitForKeyup(key, type)
|
||||||
return _game.getCombo();
|
|
||||||
}
|
}
|
||||||
|
getKeyTime(){
|
||||||
this.getGlobalScore = function(){
|
return this.keyboard.getKeyTime()
|
||||||
return _game.getGlobalScore();
|
|
||||||
}
|
}
|
||||||
|
updateCombo(score){
|
||||||
this.updateGlobalScore = function(score){
|
this.game.updateCombo(score)
|
||||||
_game.updateGlobalScore(score);
|
}
|
||||||
|
getCombo(){
|
||||||
|
return this.game.getCombo()
|
||||||
|
}
|
||||||
|
getGlobalScore(){
|
||||||
|
return this.game.getGlobalScore()
|
||||||
|
}
|
||||||
|
updateGlobalScore(score){
|
||||||
|
this.game.updateGlobalScore(score)
|
||||||
|
}
|
||||||
|
autoPlay(circle){
|
||||||
|
if(this.multiplayer){
|
||||||
|
p2.play(circle, this.mekadon)
|
||||||
|
}else{
|
||||||
|
this.mekadon.play(circle)
|
||||||
}
|
}
|
||||||
|
|
||||||
this.autoPlay = function(circle){
|
|
||||||
_mekadon.play(circle)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -2,7 +2,7 @@ function Game(controller, selectedSong, songData){
|
|||||||
|
|
||||||
var _this = this;
|
var _this = this;
|
||||||
var _selectedSong = selectedSong;
|
var _selectedSong = selectedSong;
|
||||||
var _ellapsedTime; //current time in ms from the beginning of the song
|
this.elapsedTime = {} //current time in ms from the beginning of the song
|
||||||
var _offsetDate; //date when the chrono is started (before the game begins)
|
var _offsetDate; //date when the chrono is started (before the game begins)
|
||||||
var _startDate; //real start date (when the chrono will be 0)
|
var _startDate; //real start date (when the chrono will be 0)
|
||||||
var _currentDate; // refreshed date
|
var _currentDate; // refreshed date
|
||||||
@ -14,9 +14,9 @@ function Game(controller, selectedSong, songData){
|
|||||||
var _HPGain= 100/_songData.circles.length;
|
var _HPGain= 100/_songData.circles.length;
|
||||||
var _paused=false;
|
var _paused=false;
|
||||||
var _started=false;
|
var _started=false;
|
||||||
var _mainMusicPlaying=true;
|
var _mainMusicPlaying=false;
|
||||||
var _latestDate;
|
var _latestDate;
|
||||||
var _ellapsedTimeSincePause=0;
|
var _elapsedTimeSincePause=0;
|
||||||
var _musicFadeOut=0;
|
var _musicFadeOut=0;
|
||||||
var _fadeOutStarted=false;
|
var _fadeOutStarted=false;
|
||||||
var _currentTimingPoint=0;
|
var _currentTimingPoint=0;
|
||||||
@ -31,35 +31,28 @@ function Game(controller, selectedSong, songData){
|
|||||||
})
|
})
|
||||||
|
|
||||||
this.run = function(){
|
this.run = function(){
|
||||||
_timeForDistanceCircle=((20*controller.getDistanceForCircle())/_hitcircleSpeed);
|
_timeForDistanceCircle=2500
|
||||||
_this.initTiming();
|
_this.initTiming();
|
||||||
}
|
}
|
||||||
|
|
||||||
this.initTiming = function(){
|
this.initTiming = function(){
|
||||||
|
|
||||||
_offsetDate = new Date();
|
_offsetDate = new Date();
|
||||||
|
_this.setElapsedTime(-_timeForDistanceCircle |0)
|
||||||
_ellapsedTime = {
|
_offsetTime = _timeForDistanceCircle |0
|
||||||
ms:-parseInt(_timeForDistanceCircle),
|
|
||||||
sec:0,
|
|
||||||
min:0,
|
|
||||||
hour:0
|
|
||||||
}
|
|
||||||
_offsetTime = parseInt(_timeForDistanceCircle);
|
|
||||||
_startDate = new Date();
|
_startDate = new Date();
|
||||||
_startDate.setMilliseconds(_startDate.getMilliseconds()+_offsetTime); //The real start for the game will start when chrono will reach 0
|
// The real start for the game will start when chrono will reach 0
|
||||||
|
_startDate.setMilliseconds(_startDate.getMilliseconds()+_offsetTime);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.update = function(){
|
this.update = function(){
|
||||||
|
|
||||||
/* Main operations */
|
// Main operations
|
||||||
_this.updateTime();
|
_this.updateTime();
|
||||||
_this.checkTiming();
|
_this.checkTiming();
|
||||||
_this.updateCirclesStatus();
|
_this.updateCirclesStatus();
|
||||||
_this.checkPlays();
|
_this.checkPlays();
|
||||||
|
|
||||||
/* Event operations */
|
// Event operations
|
||||||
_this.whenFadeoutMusic();
|
_this.whenFadeoutMusic();
|
||||||
_this.whenLastCirclePlayed();
|
_this.whenLastCirclePlayed();
|
||||||
|
|
||||||
@ -77,9 +70,10 @@ function Game(controller, selectedSong, songData){
|
|||||||
|
|
||||||
if(!circle.getPlayed()){
|
if(!circle.getPlayed()){
|
||||||
|
|
||||||
var currentTime = _ellapsedTime.ms;
|
var currentTime = _this.getElapsedTime().ms;
|
||||||
var startingTime = circle.getMS()-_timeForDistanceCircle;
|
var startingTime = circle.getMS()-_timeForDistanceCircle;
|
||||||
var finishTime = circle.getMS(); //at circle.getMS(), the cirlce fits the slot
|
// At circle.getMS(), the circle fits the slot
|
||||||
|
var finishTime = circle.getMS();
|
||||||
|
|
||||||
if( currentTime >= startingTime && currentTime <= finishTime+200){
|
if( currentTime >= startingTime && currentTime <= finishTime+200){
|
||||||
|
|
||||||
@ -95,7 +89,7 @@ function Game(controller, selectedSong, songData){
|
|||||||
|
|
||||||
}
|
}
|
||||||
else if(currentTime>finishTime+200 && currentTime<=finishTime+300){
|
else if(currentTime>finishTime+200 && currentTime<=finishTime+300){
|
||||||
|
if(controller.multiplayer != 2){
|
||||||
circle.updateStatus(-1);
|
circle.updateStatus(-1);
|
||||||
_currentScore=0;
|
_currentScore=0;
|
||||||
circle.played(_currentScore);
|
circle.played(_currentScore);
|
||||||
@ -103,6 +97,12 @@ function Game(controller, selectedSong, songData){
|
|||||||
_this.updateCurrentCircle();
|
_this.updateCurrentCircle();
|
||||||
_this.updateCombo(_currentScore);
|
_this.updateCombo(_currentScore);
|
||||||
_this.updateGlobalScore(_currentScore);
|
_this.updateGlobalScore(_currentScore);
|
||||||
|
}
|
||||||
|
if(controller.multiplayer == 1){
|
||||||
|
p2.send("note", {
|
||||||
|
score: -1
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -149,6 +149,12 @@ function Game(controller, selectedSong, songData){
|
|||||||
circle.played(score);
|
circle.played(score);
|
||||||
_this.updateCurrentCircle();
|
_this.updateCurrentCircle();
|
||||||
controller.waitForKeyup(keyCode, "score");
|
controller.waitForKeyup(keyCode, "score");
|
||||||
|
if(controller.multiplayer == 1){
|
||||||
|
p2.send("note", {
|
||||||
|
score: score,
|
||||||
|
ms: circle.getMS() - _this.getElapsedTime().ms
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -190,8 +196,8 @@ function Game(controller, selectedSong, songData){
|
|||||||
this.whenLastCirclePlayed = function(){
|
this.whenLastCirclePlayed = function(){
|
||||||
var circles = _songData.circles;
|
var circles = _songData.circles;
|
||||||
var lastCircle = circles[_songData.circles.length-1];
|
var lastCircle = circles[_songData.circles.length-1];
|
||||||
if(!_fadeOutStarted && _ellapsedTime.ms>=lastCircle.getMS()+2000){
|
if(!_fadeOutStarted && _this.getElapsedTime().ms>=lastCircle.getMS()+2000){
|
||||||
_fadeOutStarted=_ellapsedTime.ms
|
_fadeOutStarted=_this.getElapsedTime().ms
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -199,23 +205,27 @@ function Game(controller, selectedSong, songData){
|
|||||||
if(_fadeOutStarted){
|
if(_fadeOutStarted){
|
||||||
if(_musicFadeOut==0){
|
if(_musicFadeOut==0){
|
||||||
snd.musicGain.fadeOut(1.6)
|
snd.musicGain.fadeOut(1.6)
|
||||||
|
_musicFadeOut++
|
||||||
|
if(controller.multiplayer == 1){
|
||||||
|
p2.send("gameend")
|
||||||
}
|
}
|
||||||
if(_ellapsedTime.ms>=_fadeOutStarted+1600){
|
}
|
||||||
|
if(_musicFadeOut==1 && _this.getElapsedTime().ms>=_fadeOutStarted+1600){
|
||||||
controller.fadeOutOver()
|
controller.fadeOutOver()
|
||||||
_mainAsset.stop()
|
_mainAsset.stop()
|
||||||
|
_musicFadeOut++
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
snd.musicGain.fadeIn()
|
snd.musicGain.fadeIn()
|
||||||
snd.musicGain.unmute()
|
snd.musicGain.unmute()
|
||||||
}, 1000)
|
}, 1000)
|
||||||
}
|
}
|
||||||
_musicFadeOut++;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.checkTiming = function(){
|
this.checkTiming = function(){
|
||||||
|
|
||||||
if(_songData.timingPoints[_currentTimingPoint+1]){
|
if(_songData.timingPoints[_currentTimingPoint+1]){
|
||||||
if(_this.getEllapsedTime().ms>=_songData.timingPoints[_currentTimingPoint+1].start){
|
if(_this.getElapsedTime().ms>=_songData.timingPoints[_currentTimingPoint+1].start){
|
||||||
_currentTimingPoint++;
|
_currentTimingPoint++;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -225,19 +235,18 @@ function Game(controller, selectedSong, songData){
|
|||||||
return _songData.timingPoints[_currentTimingPoint];
|
return _songData.timingPoints[_currentTimingPoint];
|
||||||
}
|
}
|
||||||
|
|
||||||
this.toggleMainMusic = function(){
|
this.playMainMusic = function(){
|
||||||
if(_mainMusicPlaying){
|
var ms = _this.getElapsedTime().ms
|
||||||
_mainAsset.stop();
|
if(!_mainMusicPlaying && (!_fadeOutStarted || ms<_fadeOutStarted+1600)){
|
||||||
_mainMusicPlaying=false;
|
if(controller.multiplayer != 2){
|
||||||
|
_mainAsset.play((ms < 0 ? -ms : 0) / 1000, false, Math.max(0, ms / 1000));
|
||||||
}
|
}
|
||||||
else{
|
|
||||||
_mainAsset.play(0, false, _this.getEllapsedTime().ms / 1000);
|
|
||||||
_mainMusicPlaying=true;
|
_mainMusicPlaying=true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.fadeOutOver = function(){
|
this.fadeOutOver = function(){
|
||||||
_fadeOutStarted=false;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
this.getHitcircleSpeed = function(){
|
this.getHitcircleSpeed = function(){
|
||||||
@ -249,15 +258,15 @@ function Game(controller, selectedSong, songData){
|
|||||||
assets.sounds["pause"].play();
|
assets.sounds["pause"].play();
|
||||||
_paused=true;
|
_paused=true;
|
||||||
_latestDate = new Date();
|
_latestDate = new Date();
|
||||||
_this.toggleMainMusic();
|
_mainAsset.stop();
|
||||||
|
_mainMusicPlaying=false;
|
||||||
|
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
assets.sounds["cancel"].play();
|
assets.sounds["cancel"].play();
|
||||||
_paused=false;
|
_paused=false;
|
||||||
var currentDate = new Date();
|
var currentDate = new Date();
|
||||||
_ellapsedTimeSincePause = _ellapsedTimeSincePause + Math.abs(currentDate.getTime() - _latestDate.getTime());
|
_elapsedTimeSincePause = _elapsedTimeSincePause + currentDate.getTime() - _latestDate.getTime();
|
||||||
_this.toggleMainMusic();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -265,30 +274,33 @@ function Game(controller, selectedSong, songData){
|
|||||||
return _paused;
|
return _paused;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.getEllapsedTime = function(){
|
this.getElapsedTime = function(){
|
||||||
return _ellapsedTime;
|
return this.elapsedTime;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.setElapsedTime = function(time){
|
||||||
|
this.elapsedTime.ms = time
|
||||||
|
this.elapsedTime.sec = (this.elapsedTime.ms / 1000 |0) % 60
|
||||||
|
this.elapsedTime.min = (this.elapsedTime.ms / 1000 / 60 |0) % 60
|
||||||
|
this.elapsedTime.hour = (this.elapsedTime.ms / 1000 / 60 / 60 |0) % 60
|
||||||
}
|
}
|
||||||
|
|
||||||
this.updateTime = function(){
|
this.updateTime = function(){
|
||||||
|
|
||||||
_currentDate = new Date();
|
_currentDate = new Date();
|
||||||
|
var time = _this.getElapsedTime()
|
||||||
|
|
||||||
if(_ellapsedTime.ms<0){
|
if(time.ms<0){
|
||||||
_ellapsedTime.ms = _currentDate.getTime() - _startDate.getTime();
|
_this.setElapsedTime(_currentDate.getTime() - _startDate.getTime() - _elapsedTimeSincePause)
|
||||||
}
|
}
|
||||||
else if(_ellapsedTime.ms>=0 && !_started){
|
else if(time.ms>=0 && !_started){
|
||||||
_startDate = new Date();
|
_startDate = new Date();
|
||||||
_ellapsedTime.ms = Math.abs(_startDate.getTime() - _currentDate.getTime());
|
_elapsedTimeSincePause = 0;
|
||||||
|
_this.setElapsedTime(_currentDate.getTime() - _startDate.getTime())
|
||||||
_started=true;
|
_started=true;
|
||||||
}
|
}
|
||||||
else if(_ellapsedTime.ms>=0 && _started){
|
else if(time.ms>=0 && _started){
|
||||||
_ellapsedTime.ms = Math.abs(_startDate.getTime() - _currentDate.getTime()) - _ellapsedTimeSincePause;
|
_this.setElapsedTime(_currentDate.getTime() - _startDate.getTime() - _elapsedTimeSincePause)
|
||||||
}
|
}
|
||||||
|
|
||||||
_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(){
|
this.getCircles = function(){
|
||||||
|
|||||||
@ -65,15 +65,22 @@ function Keyboard(controller){
|
|||||||
}
|
}
|
||||||
|
|
||||||
this.checkMenuKeys = function(){
|
this.checkMenuKeys = function(){
|
||||||
|
if(!controller.multiplayer){
|
||||||
_gamepad.play(1)
|
_gamepad.play(1)
|
||||||
_this.checkKey(_kbd["back"], "menu", function(){
|
|
||||||
controller.togglePause();
|
|
||||||
controller.songSelection();
|
|
||||||
})
|
|
||||||
_this.checkKey(_kbd["pause"], "menu", function(){
|
_this.checkKey(_kbd["pause"], "menu", function(){
|
||||||
controller.togglePauseMenu();
|
controller.togglePauseMenu();
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
if(controller.multiplayer != 2){
|
||||||
|
_this.checkKey(_kbd["back"], "menu", function(){
|
||||||
|
if(controller.multiplayer == 1){
|
||||||
|
p2.send("gameend")
|
||||||
|
}
|
||||||
|
controller.togglePause();
|
||||||
|
controller.songSelection();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
this.checkKey = function(keyCode, keyup, callback){
|
this.checkKey = function(keyCode, keyup, callback){
|
||||||
if(_keys[keyCode] && !_this.isWaitingForKeyup(keyCode, keyup)){
|
if(_keys[keyCode] && !_this.isWaitingForKeyup(keyCode, keyup)){
|
||||||
@ -85,7 +92,7 @@ function Keyboard(controller){
|
|||||||
this.checkKeySound = function(keyCode, sound){
|
this.checkKeySound = function(keyCode, sound){
|
||||||
_this.checkKey(keyCode, "sound", function(){
|
_this.checkKey(keyCode, "sound", function(){
|
||||||
assets.sounds["note_"+sound].play()
|
assets.sounds["note_"+sound].play()
|
||||||
_keyTime[sound] = controller.getEllapsedTime().ms
|
_keyTime[sound] = controller.getElapsedTime().ms
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -51,6 +51,8 @@ class Loader{
|
|||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
|
|
||||||
|
p2 = new P2Connection()
|
||||||
|
|
||||||
this.promises.push(ajax("/api/songs").then(songs => {
|
this.promises.push(ajax("/api/songs").then(songs => {
|
||||||
assets.songs = JSON.parse(songs)
|
assets.songs = JSON.parse(songs)
|
||||||
}))
|
}))
|
||||||
@ -100,4 +102,5 @@ function promiseLoad(asset){
|
|||||||
}
|
}
|
||||||
|
|
||||||
var snd = {}
|
var snd = {}
|
||||||
|
var p2
|
||||||
new Loader()
|
new Loader()
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
class loadSong{
|
class loadSong{
|
||||||
constructor(selectedSong, autoPlayEnabled){
|
constructor(selectedSong, autoPlayEnabled, multiplayer){
|
||||||
this.selectedSong = selectedSong
|
this.selectedSong = selectedSong
|
||||||
|
this.multiplayer = multiplayer
|
||||||
this.autoPlayEnabled = autoPlayEnabled
|
this.autoPlayEnabled = autoPlayEnabled
|
||||||
|
this.diff = this.selectedSong.difficulty.slice(0, -4)
|
||||||
this.songFilePath = "/songs/" + this.selectedSong.folder + "/" + this.selectedSong.difficulty
|
this.songFilePath = "/songs/" + this.selectedSong.folder + "/" + this.selectedSong.difficulty
|
||||||
$("#screen").load("/src/views/loadsong.html", () => {
|
$("#screen").load("/src/views/loadsong.html", () => {
|
||||||
this.run()
|
this.run()
|
||||||
@ -42,11 +44,46 @@ class loadSong{
|
|||||||
|
|
||||||
Promise.all(promises).then(() => {
|
Promise.all(promises).then(() => {
|
||||||
$("#screen").load("/src/views/game.html", () => {
|
$("#screen").load("/src/views/game.html", () => {
|
||||||
var taikoGame = new Controller(this.selectedSong, this.songData, this.autoPlayEnabled)
|
this.setupMultiplayer()
|
||||||
taikoGame.run()
|
|
||||||
})
|
})
|
||||||
}, () => {
|
}, error => {
|
||||||
|
console.error(error)
|
||||||
alert("An error occurred, please refresh")
|
alert("An error occurred, please refresh")
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
setupMultiplayer(){
|
||||||
|
if(this.multiplayer){
|
||||||
|
this.song2Data = this.songData
|
||||||
|
this.selectedSong2 = this.selectedSong
|
||||||
|
p2.onmessage("gamestart", () => {
|
||||||
|
var taikoGame1 = new Controller(this.selectedSong, this.songData, false, 1)
|
||||||
|
var taikoGame2 = new Controller(this.selectedSong2, this.song2Data, true, 2)
|
||||||
|
taikoGame1.run(taikoGame2)
|
||||||
|
}, true)
|
||||||
|
p2.onmessage("gameload", response => {
|
||||||
|
if(response == this.diff){
|
||||||
|
p2.send("gamestart")
|
||||||
|
}else{
|
||||||
|
this.selectedSong2 = {
|
||||||
|
title: this.selectedSong.title,
|
||||||
|
folder: this.selectedSong.folder,
|
||||||
|
difficulty: response + ".osu"
|
||||||
}
|
}
|
||||||
|
ajax("/songs/" + this.selectedSong2.folder + "/" + this.selectedSong2.difficulty).then(data => {
|
||||||
|
this.song2Data = data.replace(/\0/g, "").split("\n")
|
||||||
|
p2.send("gamestart")
|
||||||
|
}, () => {
|
||||||
|
p2.send("gamestart")
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}, true)
|
||||||
|
p2.send("join", {
|
||||||
|
id: this.selectedSong.folder,
|
||||||
|
diff: this.diff
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
var taikoGame = new Controller(this.selectedSong, this.songData, this.autoPlayEnabled)
|
||||||
|
taikoGame.run()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -7,6 +7,28 @@ class Mekadon{
|
|||||||
}
|
}
|
||||||
play(circle){
|
play(circle){
|
||||||
if(circle.getStatus() == 450){
|
if(circle.getStatus() == 450){
|
||||||
|
return this.playNow(circle)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
playAt(circle, ms, score){
|
||||||
|
var currentMs = circle.getMS() - this.controller.getElapsedTime().ms
|
||||||
|
if(ms > currentMs - 10){
|
||||||
|
return this.playNow(circle, score)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
miss(circle){
|
||||||
|
var currentMs = circle.getMS() - this.controller.getElapsedTime().ms
|
||||||
|
if(0 > currentMs - 10){
|
||||||
|
circle.updateStatus(-1)
|
||||||
|
circle.played(0)
|
||||||
|
this.controller.displayScore(0, true)
|
||||||
|
this.game.updateCurrentCircle()
|
||||||
|
this.game.updateCombo(0)
|
||||||
|
this.game.updateGlobalScore(0)
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
playNow(circle, score){
|
||||||
var kbd = this.controller.getBindings()
|
var kbd = this.controller.getBindings()
|
||||||
if(circle.getType() == "don"){
|
if(circle.getType() == "don"){
|
||||||
this.setKey(this.lr ? kbd["don_l"] : kbd["don_r"])
|
this.setKey(this.lr ? kbd["don_l"] : kbd["don_r"])
|
||||||
@ -23,10 +45,17 @@ class Mekadon{
|
|||||||
this.setKey(kbd["ka_r"])
|
this.setKey(kbd["ka_r"])
|
||||||
this.lr = false
|
this.lr = false
|
||||||
}
|
}
|
||||||
var score = this.game.checkScore(circle);
|
if(typeof score == "undefined"){
|
||||||
circle.played(score);
|
score = this.game.checkScore(circle)
|
||||||
this.game.updateCurrentCircle();
|
}else{
|
||||||
|
this.controller.displayScore(score)
|
||||||
|
this.game.updateCombo(score)
|
||||||
|
this.game.updateGlobalScore(score)
|
||||||
}
|
}
|
||||||
|
circle.updateStatus(score)
|
||||||
|
circle.played(score)
|
||||||
|
this.game.updateCurrentCircle()
|
||||||
|
return true
|
||||||
}
|
}
|
||||||
setKey(keyCode){
|
setKey(keyCode){
|
||||||
var self = this
|
var self = this
|
||||||
|
|||||||
132
public/src/js/p2.js
Normal file
132
public/src/js/p2.js
Normal file
@ -0,0 +1,132 @@
|
|||||||
|
class P2Connection{
|
||||||
|
constructor(){
|
||||||
|
this.closed = true
|
||||||
|
this.lastMessages = {}
|
||||||
|
this.msgCallbacks = {}
|
||||||
|
this.closeCallbacks = new Set()
|
||||||
|
this.openCallbacks = new Set()
|
||||||
|
this.notes = []
|
||||||
|
this.otherConnected = false
|
||||||
|
this.onmessage("gamestart", () => {
|
||||||
|
this.otherConnected = true
|
||||||
|
this.notes = []
|
||||||
|
})
|
||||||
|
this.onmessage("gameend", () => {
|
||||||
|
this.otherConnected = false
|
||||||
|
})
|
||||||
|
this.onmessage("note", response => {
|
||||||
|
this.notes.push(response)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
open(){
|
||||||
|
this.closed = false
|
||||||
|
var wsProtocol = location.protocol == "https:" ? "wss:" : "ws:"
|
||||||
|
this.socket = new WebSocket(wsProtocol + "//" + location.host + "/p2")
|
||||||
|
var events = ["open", "close", "message"]
|
||||||
|
events.forEach(eventName => {
|
||||||
|
this.socket.addEventListener(eventName, event => {
|
||||||
|
this[eventName + "Event"](event)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
openEvent(event){
|
||||||
|
this.openCallbacks.forEach(obj => {
|
||||||
|
obj.callback()
|
||||||
|
if(obj.once){
|
||||||
|
this.openCallbacks.delete(obj)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
onopen(callback, once){
|
||||||
|
this.openCallbacks.add({
|
||||||
|
callback: callback,
|
||||||
|
once: once
|
||||||
|
})
|
||||||
|
}
|
||||||
|
close(){
|
||||||
|
this.closed = true
|
||||||
|
this.socket.close()
|
||||||
|
}
|
||||||
|
closeEvent(event){
|
||||||
|
if(!this.closed){
|
||||||
|
setTimeout(() => {
|
||||||
|
if(this.socket.readyState != this.socket.OPEN){
|
||||||
|
this.open()
|
||||||
|
}
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
|
this.closeCallbacks.forEach(obj => {
|
||||||
|
obj.callback()
|
||||||
|
if(obj.once){
|
||||||
|
this.closeCallbacks.delete(obj)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
onclose(callback, once){
|
||||||
|
this.closeCallbacks.add({
|
||||||
|
callback: callback,
|
||||||
|
once: once
|
||||||
|
})
|
||||||
|
}
|
||||||
|
send(type, value){
|
||||||
|
if(this.socket.readyState == this.socket.OPEN){
|
||||||
|
if(typeof value == "undefined"){
|
||||||
|
this.socket.send(JSON.stringify({type: type}))
|
||||||
|
}else{
|
||||||
|
this.socket.send(JSON.stringify({type: type, value: value}))
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
this.onopen(() => {
|
||||||
|
this.send(type, value)
|
||||||
|
}, true)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
messageEvent(event){
|
||||||
|
try{
|
||||||
|
var data = JSON.parse(event.data)
|
||||||
|
}catch(e){
|
||||||
|
var data = {}
|
||||||
|
}
|
||||||
|
this.lastMessages[data.type] = data.value
|
||||||
|
if(this.msgCallbacks[data.type]){
|
||||||
|
this.msgCallbacks[data.type].forEach(obj => {
|
||||||
|
obj.callback(data.value)
|
||||||
|
if(obj.once){
|
||||||
|
delete this.msgCallbacks[obj]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
onmessage(type, callback, once){
|
||||||
|
if(!(type in this.msgCallbacks)){
|
||||||
|
this.msgCallbacks[type] = new Set()
|
||||||
|
}
|
||||||
|
this.msgCallbacks[type].add({
|
||||||
|
callback: callback,
|
||||||
|
once: once
|
||||||
|
})
|
||||||
|
}
|
||||||
|
getMessage(type, callback){
|
||||||
|
if(type in this.lastMessages){
|
||||||
|
callback(this.lastMessages[type])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
play(circle, mekadon){
|
||||||
|
if(this.otherConnected){
|
||||||
|
if(this.notes.length == 0){
|
||||||
|
mekadon.play(circle)
|
||||||
|
}else{
|
||||||
|
var note = this.notes[0]
|
||||||
|
if(note.score >= 0){
|
||||||
|
if(mekadon.playAt(circle, note.ms, note.score)){
|
||||||
|
this.notes.shift()
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(mekadon.miss(circle)){
|
||||||
|
this.notes.shift()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -56,6 +56,7 @@ function SongSelect(){
|
|||||||
|
|
||||||
this.run = function(){
|
this.run = function(){
|
||||||
_this.createCode();
|
_this.createCode();
|
||||||
|
_this.startP2();
|
||||||
|
|
||||||
$("#song-container").show();
|
$("#song-container").show();
|
||||||
|
|
||||||
@ -84,7 +85,7 @@ function SongSelect(){
|
|||||||
_selectedSong.folder = songID;
|
_selectedSong.folder = songID;
|
||||||
|
|
||||||
snd.musicGain.fadeIn()
|
snd.musicGain.fadeIn()
|
||||||
new loadSong(_selectedSong, e.shiftKey);
|
new loadSong(_selectedSong, e.shiftKey, e.ctrlKey);
|
||||||
});
|
});
|
||||||
|
|
||||||
$(".song").hover(function(){
|
$(".song").hover(function(){
|
||||||
@ -236,6 +237,41 @@ function SongSelect(){
|
|||||||
$('.difficulty').hide();
|
$('.difficulty').hide();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.onusers = function(response){
|
||||||
|
var oldP2Elements = document.getElementsByClassName("p2")
|
||||||
|
for(var i = oldP2Elements.length; i--;){
|
||||||
|
oldP2Elements[i].classList.remove("p2")
|
||||||
|
}
|
||||||
|
if(response){
|
||||||
|
response.forEach(idDiff => {
|
||||||
|
id = idDiff.id |0
|
||||||
|
diff = idDiff.diff
|
||||||
|
if(diff in _diffNames){
|
||||||
|
var idElement = document.getElementById("song-" + id)
|
||||||
|
if(idElement){
|
||||||
|
idElement.classList.add("p2")
|
||||||
|
var diffElement = idElement.getElementsByClassName("difficulty " + diff)[0]
|
||||||
|
if(diffElement){
|
||||||
|
diffElement.classList.add("p2")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.startP2 = function(){
|
||||||
|
p2.getMessage("users", response =>{
|
||||||
|
this.onusers(response)
|
||||||
|
})
|
||||||
|
p2.onmessage("users", response => {
|
||||||
|
this.onusers(response)
|
||||||
|
})
|
||||||
|
if(p2.closed){
|
||||||
|
p2.open()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
$("#screen").load("/src/views/songselect.html", _this.run);
|
$("#screen").load("/src/views/songselect.html", _this.run);
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -4,7 +4,14 @@ class View{
|
|||||||
this.bg = bg
|
this.bg = bg
|
||||||
this.diff = diff
|
this.diff = diff
|
||||||
|
|
||||||
|
if(this.controller.multiplayer == 2){
|
||||||
|
this.canvas = new ScalableCanvas("canvas-p2", $(window).width(), $(window).height() / 3 * 2)
|
||||||
|
this.canvas.canvas.style.position = "absolute"
|
||||||
|
this.canvas.canvas.style.top = "33%"
|
||||||
|
document.getElementById("game").appendChild(this.canvas.canvas)
|
||||||
|
}else{
|
||||||
this.canvas = new ScalableCanvas("canvas", $(window).width(), $(window).height())
|
this.canvas = new ScalableCanvas("canvas", $(window).width(), $(window).height())
|
||||||
|
}
|
||||||
this.winW = this.canvas.scaledWidth
|
this.winW = this.canvas.scaledWidth
|
||||||
this.winH = this.canvas.scaledHeight
|
this.winH = this.canvas.scaledHeight
|
||||||
this.ctx = this.canvas.ctx
|
this.ctx = this.canvas.ctx
|
||||||
@ -50,9 +57,16 @@ class View{
|
|||||||
|
|
||||||
positionning(){
|
positionning(){
|
||||||
this.canvas.rescale()
|
this.canvas.rescale()
|
||||||
this.canvas.resize($(window).width(), $(window).height())
|
var height = $(window).height()
|
||||||
|
if(this.controller.multiplayer == 2){
|
||||||
|
height = height / 3 * 2
|
||||||
|
}
|
||||||
|
this.canvas.resize($(window).width(), height)
|
||||||
this.winW = this.canvas.scaledWidth
|
this.winW = this.canvas.scaledWidth
|
||||||
this.winH = this.canvas.scaledHeight
|
this.winH = this.canvas.scaledHeight
|
||||||
|
if(this.controller.multiplayer == 2){
|
||||||
|
this.winH = this.winH / 2 * 3
|
||||||
|
}
|
||||||
|
|
||||||
this.barY = 0.25 * this.winH
|
this.barY = 0.25 * this.winH
|
||||||
this.barH = 0.23 * this.winH
|
this.barH = 0.23 * this.winH
|
||||||
@ -113,7 +127,7 @@ class View{
|
|||||||
}
|
}
|
||||||
|
|
||||||
updateDonFaces(){
|
updateDonFaces(){
|
||||||
if(this.controller.getEllapsedTime().ms >= this.nextBeat){
|
if(this.controller.getElapsedTime().ms >= this.nextBeat){
|
||||||
this.nextBeat += this.controller.getSongData().beatInfo.beatInterval
|
this.nextBeat += this.controller.getSongData().beatInfo.beatInterval
|
||||||
if(this.controller.getCombo() >= 50){
|
if(this.controller.getCombo() >= 50){
|
||||||
this.currentBigDonFace = (this.currentBigDonFace + 1) % 2
|
this.currentBigDonFace = (this.currentBigDonFace + 1) % 2
|
||||||
@ -190,7 +204,7 @@ class View{
|
|||||||
|
|
||||||
drawMeasures(){
|
drawMeasures(){
|
||||||
var measures = this.controller.getSongData().measures
|
var measures = this.controller.getSongData().measures
|
||||||
var currentTime = this.controller.getEllapsedTime().ms
|
var currentTime = this.controller.getElapsedTime().ms
|
||||||
|
|
||||||
measures.forEach((measure, index)=>{
|
measures.forEach((measure, index)=>{
|
||||||
var timeForDistance = 70 / this.circleSize * this.distanceForCircle / measure.speed
|
var timeForDistance = 70 / this.circleSize * this.distanceForCircle / measure.speed
|
||||||
@ -206,7 +220,7 @@ class View{
|
|||||||
|
|
||||||
drawMeasure(measure){
|
drawMeasure(measure){
|
||||||
var z = this.canvas.scale
|
var z = this.canvas.scale
|
||||||
var currentTime = this.controller.getEllapsedTime().ms
|
var currentTime = this.controller.getElapsedTime().ms
|
||||||
var measureX = this.slotX + measure.speed / (70 / this.circleSize) * (measure.ms - currentTime)
|
var measureX = this.slotX + measure.speed / (70 / this.circleSize) * (measure.ms - currentTime)
|
||||||
this.ctx.strokeStyle = "#bab8b8"
|
this.ctx.strokeStyle = "#bab8b8"
|
||||||
this.ctx.lineWidth = 2
|
this.ctx.lineWidth = 2
|
||||||
@ -388,7 +402,7 @@ class View{
|
|||||||
for(var i = circles.length; i--;){
|
for(var i = circles.length; i--;){
|
||||||
var circle = circles[i]
|
var circle = circles[i]
|
||||||
|
|
||||||
var currentTime = this.controller.getEllapsedTime().ms
|
var currentTime = this.controller.getElapsedTime().ms
|
||||||
var timeForDistance = 70 / this.circleSize * this.distanceForCircle / circle.getSpeed() + this.bigCircleSize / 2
|
var timeForDistance = 70 / this.circleSize * this.distanceForCircle / circle.getSpeed() + this.bigCircleSize / 2
|
||||||
var startingTime = circle.getMS() - timeForDistance
|
var startingTime = circle.getMS() - timeForDistance
|
||||||
// At circle.getMS(), the cirlce fits the slot
|
// At circle.getMS(), the cirlce fits the slot
|
||||||
@ -459,7 +473,7 @@ class View{
|
|||||||
|
|
||||||
var fill, size, faceID
|
var fill, size, faceID
|
||||||
if(!circlePos){
|
if(!circlePos){
|
||||||
var currentTime = this.controller.getEllapsedTime().ms
|
var currentTime = this.controller.getElapsedTime().ms
|
||||||
circlePos = {
|
circlePos = {
|
||||||
x: this.slotX + circle.getSpeed() / (70 / this.circleSize) * (circle.getMS() - currentTime),
|
x: this.slotX + circle.getSpeed() / (70 / this.circleSize) * (circle.getMS() - currentTime),
|
||||||
y: this.circleY
|
y: this.circleY
|
||||||
@ -549,7 +563,7 @@ class View{
|
|||||||
|
|
||||||
drawTime(){
|
drawTime(){
|
||||||
var z = this.canvas.scale
|
var z = this.canvas.scale
|
||||||
var time = this.controller.getEllapsedTime()
|
var time = this.controller.getElapsedTime()
|
||||||
|
|
||||||
this.ctx.globalAlpha = 0.7
|
this.ctx.globalAlpha = 0.7
|
||||||
this.ctx.fillStyle = "#000"
|
this.ctx.fillStyle = "#000"
|
||||||
@ -579,7 +593,7 @@ class View{
|
|||||||
this.ctx.closePath()
|
this.ctx.closePath()
|
||||||
this.ctx.fill()
|
this.ctx.fill()
|
||||||
|
|
||||||
var currentTime = this.controller.getEllapsedTime().ms
|
var currentTime = this.controller.getElapsedTime().ms
|
||||||
var keyTime = this.controller.getKeyTime()
|
var keyTime = this.controller.getKeyTime()
|
||||||
var sound = keyTime["don"] > keyTime["ka"] ? "don" : "ka"
|
var sound = keyTime["don"] > keyTime["ka"] ? "don" : "ka"
|
||||||
if(keyTime[sound] > currentTime - 200){
|
if(keyTime[sound] > currentTime - 200){
|
||||||
|
|||||||
168
server.py
Normal file
168
server.py
Normal file
@ -0,0 +1,168 @@
|
|||||||
|
#!/usr/bin/env python
|
||||||
|
|
||||||
|
import asyncio
|
||||||
|
import websockets
|
||||||
|
import json
|
||||||
|
|
||||||
|
users = []
|
||||||
|
server_status = {
|
||||||
|
"waiting": {}
|
||||||
|
}
|
||||||
|
|
||||||
|
def msgobj(type, value=None):
|
||||||
|
if value == None:
|
||||||
|
return json.dumps({"type": type})
|
||||||
|
else:
|
||||||
|
return json.dumps({"type": type, "value": value})
|
||||||
|
|
||||||
|
def status_event():
|
||||||
|
value = []
|
||||||
|
for id, userDiff in server_status["waiting"].items():
|
||||||
|
value.append({
|
||||||
|
"id": id,
|
||||||
|
"diff": userDiff["diff"]
|
||||||
|
})
|
||||||
|
return msgobj("users", value)
|
||||||
|
|
||||||
|
async def notify_status():
|
||||||
|
ready_users = [user for user in users if "ws" in user and user["action"] == "ready"]
|
||||||
|
if ready_users:
|
||||||
|
sent_msg = status_event()
|
||||||
|
await asyncio.wait([user["ws"].send(sent_msg) for user in ready_users])
|
||||||
|
|
||||||
|
async def connection(ws, path):
|
||||||
|
# User connected
|
||||||
|
user = {
|
||||||
|
"ws": ws,
|
||||||
|
"action": "ready"
|
||||||
|
}
|
||||||
|
users.append(user)
|
||||||
|
try:
|
||||||
|
# Notify user about other users
|
||||||
|
await ws.send(status_event())
|
||||||
|
while True:
|
||||||
|
try:
|
||||||
|
message = await asyncio.wait_for(ws.recv(), timeout=5)
|
||||||
|
except asyncio.TimeoutError:
|
||||||
|
# Keep user connected
|
||||||
|
pong_waiter = await ws.ping()
|
||||||
|
try:
|
||||||
|
await asyncio.wait_for(pong_waiter, timeout=5)
|
||||||
|
except asyncio.TimeoutError:
|
||||||
|
# Disconnect
|
||||||
|
break
|
||||||
|
else:
|
||||||
|
# Message received
|
||||||
|
try:
|
||||||
|
data = json.loads(message)
|
||||||
|
except json.decoder.JSONDecodeError:
|
||||||
|
data = {}
|
||||||
|
action = user["action"]
|
||||||
|
type = data["type"] if "type" in data else None
|
||||||
|
value = data["value"] if "value" in data else None
|
||||||
|
if action == "ready":
|
||||||
|
# Not playing or waiting
|
||||||
|
if type == "join":
|
||||||
|
waiting = server_status["waiting"]
|
||||||
|
id = value["id"] if "id" in value else None
|
||||||
|
diff = value["diff"] if "diff" in value else None
|
||||||
|
if not id or not diff:
|
||||||
|
continue
|
||||||
|
if id not in waiting:
|
||||||
|
# Wait for another user
|
||||||
|
user["action"] = "waiting"
|
||||||
|
user["gameid"] = id
|
||||||
|
waiting[id] = {
|
||||||
|
"user": user,
|
||||||
|
"diff": diff
|
||||||
|
}
|
||||||
|
await ws.send(msgobj("waiting"))
|
||||||
|
else:
|
||||||
|
# Join the other user and start game
|
||||||
|
user["other_user"] = waiting[id]["user"]
|
||||||
|
waiting_diff = waiting[id]["diff"]
|
||||||
|
del waiting[id]
|
||||||
|
if "ws" in user["other_user"]:
|
||||||
|
user["action"] = "loading"
|
||||||
|
user["other_user"]["action"] = "loading"
|
||||||
|
user["other_user"]["other_user"] = user
|
||||||
|
await asyncio.wait([
|
||||||
|
ws.send(msgobj("gameload", waiting_diff)),
|
||||||
|
user["other_user"]["ws"].send(msgobj("gameload", diff))
|
||||||
|
])
|
||||||
|
else:
|
||||||
|
# Wait for another user
|
||||||
|
user["action"] = "waiting"
|
||||||
|
user["gameid"] = id
|
||||||
|
waiting[id] = {
|
||||||
|
"user": user,
|
||||||
|
"diff": diff
|
||||||
|
}
|
||||||
|
await ws.send(msgobj("waiting"))
|
||||||
|
# Update others on waiting players
|
||||||
|
await notify_status()
|
||||||
|
elif action == "waiting" or action == "loading" or action == "loaded":
|
||||||
|
# Waiting for another user
|
||||||
|
if type == "leave":
|
||||||
|
# Stop waiting
|
||||||
|
del server_status["waiting"][user["gameid"]]
|
||||||
|
del user["gameid"]
|
||||||
|
user["action"] = "ready"
|
||||||
|
await asyncio.wait([
|
||||||
|
ws.send(msgobj("left")),
|
||||||
|
notify_status()
|
||||||
|
])
|
||||||
|
if action == "loading":
|
||||||
|
if type == "gamestart":
|
||||||
|
user["action"] = "loaded"
|
||||||
|
if user["other_user"]["action"] == "loaded":
|
||||||
|
user["action"] = "playing"
|
||||||
|
user["other_user"]["action"] = "playing"
|
||||||
|
sent_msg = msgobj("gamestart")
|
||||||
|
await asyncio.wait([
|
||||||
|
ws.send(sent_msg),
|
||||||
|
user["other_user"]["ws"].send(sent_msg)
|
||||||
|
])
|
||||||
|
elif action == "playing":
|
||||||
|
# Playing with another user
|
||||||
|
if "other_user" in user and "ws" in user["other_user"]:
|
||||||
|
if type == "note":
|
||||||
|
await user["other_user"]["ws"].send(msgobj("note", value))
|
||||||
|
if type == "gameend":
|
||||||
|
# User wants to disconnect
|
||||||
|
user["action"] = "ready"
|
||||||
|
user["other_user"]["action"] = "ready"
|
||||||
|
sent_msg1 = msgobj("gameend")
|
||||||
|
sent_msg2 = status_event()
|
||||||
|
await asyncio.wait([
|
||||||
|
ws.send(sent_msg1),
|
||||||
|
ws.send(sent_msg2),
|
||||||
|
user["other_user"]["ws"].send(sent_msg1),
|
||||||
|
user["other_user"]["ws"].send(sent_msg2)
|
||||||
|
])
|
||||||
|
del user["other_user"]
|
||||||
|
else:
|
||||||
|
# Other user disconnected
|
||||||
|
user["action"] = "ready"
|
||||||
|
await asyncio.wait([
|
||||||
|
ws.send(msgobj("gameend")),
|
||||||
|
ws.send(status_event())
|
||||||
|
])
|
||||||
|
finally:
|
||||||
|
# User disconnected
|
||||||
|
del user["ws"]
|
||||||
|
del users[users.index(user)]
|
||||||
|
if "other_user" in user and "ws" in user["other_user"]:
|
||||||
|
user["other_user"]["action"] = "ready"
|
||||||
|
await asyncio.wait([
|
||||||
|
user["other_user"]["ws"].send(msgobj("gameend")),
|
||||||
|
user["other_user"]["ws"].send(status_event())
|
||||||
|
])
|
||||||
|
if user["action"] == "waiting":
|
||||||
|
del server_status["waiting"][user["gameid"]]
|
||||||
|
await notify_status()
|
||||||
|
|
||||||
|
asyncio.get_event_loop().run_until_complete(
|
||||||
|
websockets.serve(connection, "localhost", 34802)
|
||||||
|
)
|
||||||
|
asyncio.get_event_loop().run_forever()
|
||||||
Loading…
Reference in New Issue
Block a user