Add element function

This commit is contained in:
LoveEevee 2018-09-09 07:11:05 +03:00
parent 1d67575b66
commit c7a47a56c6
3 changed files with 114 additions and 37 deletions

View File

@ -49,6 +49,7 @@
<script type='application/javascript' src='/src/js/gamepad.js'></script> <script type='application/javascript' src='/src/js/gamepad.js'></script>
<script type='application/javascript' src='/src/js/tutorial.js'></script> <script type='application/javascript' src='/src/js/tutorial.js'></script>
<script type='application/javascript' src='/src/js/scalablecanvas.js'></script> <script type='application/javascript' src='/src/js/scalablecanvas.js'></script>
<script type='application/javascript' src='/src/js/element.js'></script>
</head> </head>
<body> <body>

49
public/src/js/element.js Normal file
View File

@ -0,0 +1,49 @@
function element(){
var parent
var lasttag
var createdtag
var toreturn={}
for(var i=0;i<arguments.length;i++){
var current=arguments[i]
if(current){
if(current.nodeType){
parent=lasttag=current
}else if(Array.isArray(current)){
lasttag=parent
for(var j=0;j<current.length;j++){
if(current[j]){
if(j==0&&typeof current[j]=="string"){
var tagname=current[0].split("#")
lasttag=createdtag=document.createElement(tagname[0])
if(tagname[1]){
toreturn[tagname[1]]=createdtag
}
}else if(current[j].constructor==Object){
if(lasttag){
for(var value in current[j]){
if(value!="style"&&value in lasttag){
lasttag[value]=current[j][value]
}else{
lasttag.setAttribute(value,current[j][value])
}
}
}
}else{
var returned=element(lasttag,current[j])
for(var k in returned){
toreturn[k]=returned[k]
}
}
}
}
}else if(current){
createdtag=document.createTextNode(current)
}
if(parent&&createdtag){
parent.appendChild(createdtag)
}
createdtag=0
}
}
return toreturn
}

View File

@ -3,7 +3,6 @@ function SongSelect(){
var _this=this; var _this=this;
var _songs; var _songs;
var _selectedSong = {title:'', folder:'', difficulty:''}; var _selectedSong = {title:'', folder:'', difficulty:''};
var _code="";
var _preview; var _preview;
var _preview_to; var _preview_to;
var _diffNames={ var _diffNames={
@ -154,66 +153,94 @@ function SongSelect(){
setTimeout(function(){ setTimeout(function(){
assets.sounds["song-select"].playAsset(); assets.sounds["song-select"].playAsset();
}, 200); }, 200);
var songElements = [0]
for(var i=0; i<assets.songs.length; i++){ for(var i=0; i<assets.songs.length; i++){
var song = assets.songs[i]; var song = assets.songs[i];
var songDir = '/songs/' + song.id;
var songDifficulties = song.stars;
var songID = song.id;
var songTitle = song.title; var songTitle = song.title;
var songTitleSpace = songTitle.replace(/ /g, '&nbsp;');
var songPreview = song.preview;
var skipChars = []; var skipChars = [];
var charElements = [0]
var diffElements = [0]
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++) { for (var c=0; c<songTitle.length; c++) {
if (skipChars.indexOf(c) > -1) { if (skipChars.indexOf(c) > -1) {
continue; continue;
}; };
var ch = songTitle.charAt(c) == ' ' ? '&nbsp;' : songTitle.charAt(c); var ch = songTitle.charAt(c) == " " ? "\xa0" : songTitle.charAt(c);
var isApos = false; var isApos = false;
if (songTitle.charAt(c+1) == '\'') { if (songTitle.charAt(c+1) == "'") {
ch = ch + '\''; ch = ch + "'";
skipChars.push(c+1); skipChars.push(c+1);
isApos = true; isApos = true;
}; };
var cl = ch == '&nbsp;' ? 'song-title-char song-title-space' : 'song-title-char'; var cl = ch == "\xa0" ? "song-title-char song-title-space" : "song-title-char";
cl = isApos ? cl + ' song-title-apos' : cl; cl = isApos ? cl + " song-title-apos" : cl;
_code += '<span class="' + cl + '" alt="' + ch + '">' + ch + '</span>'; charElements.push(
["span", {
class: cl,
alt: ch
}, ch]
)
}; };
_code += "</div><ul class='difficulties'>";
for(var diff in _diffNames){ for(var diff in _diffNames){
var diffName = diff; var diffName = diff;
var diffLevel = songDifficulties[diff]; var diffLevel = song.stars[diff];
if (!diffLevel) { if (!diffLevel) {
continue; continue;
} }
var starsDisplay=""; var starsDisplay = [0]
for(var x=1; x<=diffLevel; x++){ for(var x=1; x<=diffLevel; x++){
starsDisplay+="&#9733;<br>"; starsDisplay.push("\u2605")
starsDisplay.push(["br"])
} }
var diffTxt=_diffNames[diffName] var diffTxt=_diffNames[diffName]
_code += "<li class='difficulty "+diffName+"'>"; diffElements.push(
_code+= "<span class='diffname'>"+diffTxt+"</span>"; ["li", {
_code+= "<span class='stars'>"+starsDisplay+"</span>"; class: "difficulty " + diffName
_code += "</li>"; },
["span", {
class: "diffname"
}, diffTxt],
["span", {
class: "stars"
}, starsDisplay]
]
)
} }
_code += "</ul></div>"; songElements.push(
["div", {
id: "song-" + song.id,
class: "song",
"data-title": songTitle,
"data-song-id": song.id,
"data-preview": song.preview
},
["div", {
class: /^[\x00-\xFF]*$/.test(songTitle) ? "song-title alpha-title" : "song-title"
}, charElements],
["ul", {
class: "difficulties"
}, diffElements]
]
)
} }
$("#song-container").html(_code); element(
document.getElementById("song-container"),
songElements
)
$('.difficulty').hide(); $('.difficulty').hide();
} }