restructure
This commit is contained in:
Bui
227
public/src/js/songselect.js
Normal file
227
public/src/js/songselect.js
Normal file
@@ -0,0 +1,227 @@
|
||||
function SongSelect(){
|
||||
|
||||
var _this=this;
|
||||
var _songs;
|
||||
var _selectedSong = {title:'', folder:'', difficulty:''};
|
||||
var _code="";
|
||||
var _preview;
|
||||
var _preview_to;
|
||||
|
||||
this.startPreview = function(id, prvtime, first_open=true) {
|
||||
var start = Date.now();
|
||||
setTimeout(function(){
|
||||
bgm.pause();
|
||||
}, 400);
|
||||
|
||||
_preview = new Audio('/songs/' + id + '/main.mp3');
|
||||
_preview.onloadeddata = function() {
|
||||
var end = Date.now();
|
||||
var delay = end - start;
|
||||
var no_delay = first_open ? 0 : 300;
|
||||
|
||||
_preview.currentTime = prvtime/1000;
|
||||
_preview.volume = 0.5;
|
||||
|
||||
_preview.addEventListener('ended', function(){
|
||||
this.currentTime = prvtime/1000;
|
||||
this.play();
|
||||
}, false);
|
||||
|
||||
_preview_to = setTimeout(function(){
|
||||
_preview.play();
|
||||
}, delay <= 1000 && first_open ? 1000 : no_delay);
|
||||
}
|
||||
};
|
||||
|
||||
this.endPreview = function() {
|
||||
clearTimeout(_preview_to);
|
||||
_preview.pause();
|
||||
};
|
||||
|
||||
this.run = function(){
|
||||
|
||||
_this.createCode();
|
||||
_this.display();
|
||||
$(window).resize(_this.display);
|
||||
|
||||
var menuLoop = setInterval(_this.refresh, 20);
|
||||
$("#song-container").show();
|
||||
|
||||
$(".difficulty").click(function(e){
|
||||
_this.endPreview();
|
||||
assets.sounds["diffsel"].pause();
|
||||
assets.sounds["diffsel"].currentTime = 0;
|
||||
assets.sounds["don"].play();
|
||||
|
||||
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').data('title');
|
||||
_selectedSong.folder = songID;
|
||||
|
||||
bgm.pause();
|
||||
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").click(function(e){
|
||||
if (!$(e.target).parents('.difficulties').length) {
|
||||
if ($(".opened").length && $(".opened").attr('id') == $(this).attr('id')) {
|
||||
_this.endPreview();
|
||||
bgm.play();
|
||||
assets.sounds["cancel"].play();
|
||||
$(".difficulty").hide();
|
||||
$(".opened").removeClass("opened", 300);
|
||||
|
||||
assets.sounds["diffsel"].pause();
|
||||
assets.sounds["diffsel"].currentTime = 0;
|
||||
setTimeout(function(){
|
||||
assets.sounds["song-select"].play();
|
||||
}, 300);
|
||||
|
||||
$('.songsel-title').fadeOut(200, function(){
|
||||
$('.songsel-title').attr('alt', '曲をえらぶ').html('曲をえらぶ').css('left', -300);
|
||||
$('.songsel-title').animate({left:0, opacity:"show"}, 400);
|
||||
});
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
if(!$('.opened').length) {
|
||||
_this.startPreview($(this).data('song-id'), $(this).data('preview'));
|
||||
assets.sounds["don"].play();
|
||||
assets.sounds["song-select"].pause();
|
||||
assets.sounds["song-select"].currentTime = 0;
|
||||
setTimeout(function(){
|
||||
assets.sounds["diffsel"].play();
|
||||
}, 300);
|
||||
|
||||
$('.songsel-title').fadeOut(200, function(){
|
||||
$('.songsel-title').attr('alt', 'むずかしさをえらぶ').html('むずかしさをえらぶ').css('left', -300);
|
||||
$('.songsel-title').animate({left:0, opacity:"show"}, 400);
|
||||
});
|
||||
} else {
|
||||
_preview.pause();
|
||||
_this.startPreview($(this).data('song-id'), $(this).data('preview'), false);
|
||||
assets.sounds["ka"].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(){
|
||||
bgm = new BufferedLoop(
|
||||
{url: '/assets/audio/bgm_songsel.ogg', duration: 1.442},
|
||||
{url: '/assets/audio/bgm_songsel_loop.ogg', duration: 2.064}
|
||||
);
|
||||
bgm.play();
|
||||
|
||||
setTimeout(function(){
|
||||
assets.sounds["song-select"].play();
|
||||
}, 200);
|
||||
for(var i=0; i<assets.songs.length; i++){
|
||||
|
||||
var song = assets.songs[i];
|
||||
var songDir = '/songs/' + song.id;
|
||||
var songDifficulties = song.stars;
|
||||
var songID = song.id;
|
||||
var songTitle = song.title;
|
||||
var songTitleSpace = songTitle.replace(/ /g, ' ');
|
||||
var songPreview = song.preview;
|
||||
var skipChars = [];
|
||||
|
||||
var cl = /^[\x00-\xFF]*$/.test(songTitle) ? 'song-title alpha-title' : 'song-title';
|
||||
_code += "<div id='song-"+songID+"' class='song' data-title='"+songTitle+"' data-song-id='"+songID+"' data-preview='"+songPreview+"'><div class='"+cl+"'>";
|
||||
for (var c=0; c<songTitle.length; c++) {
|
||||
if (skipChars.indexOf(c) > -1) {
|
||||
continue;
|
||||
};
|
||||
|
||||
var ch = songTitle.charAt(c) == ' ' ? ' ' : songTitle.charAt(c);
|
||||
|
||||
var isApos = false;
|
||||
if (songTitle.charAt(c+1) == '\'') {
|
||||
ch = ch + '\'';
|
||||
skipChars.push(c+1);
|
||||
isApos = true;
|
||||
};
|
||||
|
||||
var cl = ch == ' ' ? 'song-title-char song-title-space' : 'song-title-char';
|
||||
cl = isApos ? cl + ' song-title-apos' : cl;
|
||||
|
||||
_code += '<span class="' + cl + '" alt="' + ch + '">' + ch + '</span>';
|
||||
};
|
||||
_code += "</div><ul class='difficulties'>";
|
||||
|
||||
for(var diff in songDifficulties){
|
||||
var diffName = diff;
|
||||
var diffLevel = songDifficulties[diff];
|
||||
if (!diffLevel) {
|
||||
continue;
|
||||
}
|
||||
|
||||
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);
|
||||
$('.difficulty').hide();
|
||||
}
|
||||
|
||||
this.display = function(){
|
||||
}
|
||||
|
||||
this.refresh = function(){
|
||||
|
||||
}
|
||||
|
||||
$("#screen").load("/src/views/songselect.html", _this.run);
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user