new.html

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<title>Create 1PIX map</title>

<a href="index.html">< Back</a>
<div class=omega><h1 id="name"></h1>
<h1 id=klk>Create New Map</h1>

Name: <input autocomplete=off id="waa"></input><br>
Description: <textarea id="desc"></textarea><br>
Mapper name: <input autocomplete=off id="mappr"></input><br><br>

<hr>Song link: <input autocomplete=off id="song"></input><br>
Song name: <input autocomplete=off id=songname></input>
Song artist: <input autocomplete=off id=art></input><br>
BPM: <input autocomplete=off type="number" class=c id="bpm" ></input>
<div id=rhr></div>
Song offset: <input autocomplete=off type="number" class=c id="off"></input><button class=class onclick=playoff() id='a'>Play</button><button onclick={if(document.getElementById("bpm").value!=""){kl=document.getElementById("bpm").value}else{kl=10000};document.getElementById("off").value=Math.round(Math.round(audio.currentTime/(60/kl))*(60/kl)*100)/100;resizeInpute.call(inpdsut)} class=class>Update</button><p id=timeee></p>
Difficuly: <input autocomplete=off type="number" max=15 min=0 id="stars" ></input>stars

<hr>		
Starting gamemode: <select class=29 id=gm>
<option id=0>clckr</option>
<option id=1>scrlr</option>
<option id=2>swppr</option>
<option id=3>spmmr</option>
<option id=4>ctrlr</option>
</select><br>
Click window: <input autocomplete=off id="window" type=number max=500 min=0></input> ms
<br>
CPS floor: <input autocomplete=off id=floor type=number max=20 min=1></input>
CPS cap: <input autocomplete=off id=cap type=number max=20 min=1></input>
<br>
<br>
<button onclick=exists() id="sjsj">Create</button>
</div>


<script>
dm="e"
document.getElementById("floor").value=3
document.getElementById("cap").value=12

wiwwiw=983183939183
function playoff(){
if (typeof audio=="undefined"){
audio = new Audio(document.getElementById('song').value)

}
if (wiwwiw!=document.getElementById('off').value){
document.getElementById("a").innerHTML="Pause"

audio.pause()
audio = new Audio(document.getElementById('song').value)
audio.currentTime=document.getElementById("off").value*1
audio.play()
  wiwwiw=document.getElementById('off').value
}
else{
  wiwwiw=document.getElementById('off').value

if (audio.paused==false){
document.getElementById("a").innerHTML="Play"
audio.pause()
}
else{
document.getElementById("a").innerHTML="Pause"

audio = new Audio(document.getElementById('song').value)
audio.currentTime=document.getElementById("off").value*1
audio.play()
}
}
}


document.getElementById("window").value=150
var inpdsut = document.getElementById("off"); // get the input element
inpdsut.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(inpdsut); // immediately call the function


async function exists(){

things()

}
function things(){
e=(false==isNaN(dm.duration))
error="lol"
if (document.getElementById("waa").value==""){
error="Enter a name!"
}
else if (document.getElementById("window").value==""){
error="Enter a click window!"
}
else if (Math.abs(document.getElementById("window").value)>=500){
error="Click window is too big! (must be under 500ms)"
}
else if (e==false&&document.getElementById("song").value!=""){
error="Invalid song URL!"
}
else if (document.getElementById("bpm").value==""&&document.getElementById("song").value!=""){
error='Enter a BPM! (search up "BPM counter")'
}
else if(document.getElementById("floor").value<=1||document.getElementById("floor").value>=20){
error="CPS floor is out of range! (must be between 1 and 20 CPS)"

}
else if(document.getElementById("cap").value<=1||document.getElementById("cap").value>=20){
error="CPS cap is out of range! (must be between 1 and 20 CPS)"
}
else if((document.getElementById("stars").value<=0||document.getElementById("stars").value>=15)&&document.getElementById("stars").value!=""){
error="Star count is out of range! (must be between 0 and 15)"
}
else{
if (Math.round(document.getElementById("cap").value)<=Math.round(document.getElementById("floor").value)){
lsls=Math.round(document.getElementById("floor").value).toString().padStart(2,0)+Math.round(document.getElementById("cap").value).toString().padStart(2,0)
}
else{
lsls=Math.round(document.getElementById("cap").value).toString().padStart(2,0)+Math.round(document.getElementById("floor").value).toString().padStart(2,0)

}
nm=document.getElementById("stars").value
if (nm==""){nm=16}
gp=''
if (id!="none"){
gp=localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[4].slice(0,-6)
}
qw=document.getElementById('waa').value+"޶޶޶"+document.getElementById('desc').value+"|||"+document.getElementById("mappr").value+"޶޶޶"+lsls+"޶޶޶"+[document.getElementById("song").value,document.getElementById("songname").value,document.getElementById("art").value,Math.round(document.getElementById("off").value*100).toString().padStart(5,0),document.getElementById("bpm").value].join("|||")+"޶޶޶"+gp+Math.round((["clckr","scrlr","swppr","spmmr","ctrlr"].indexOf(document.getElementById("gm").value)*1000+document.getElementById("window").value*1)**0.5*1000).toString().padStart(5,0)+"0123456789abcdef!"[Math.round(nm)]+"޶޶޶"
console.log(qw)

if (id=="none"){
localStorage.setItem("maps",localStorage.getItem("maps")+qw+"޶޶޶"+new Date()*1+"yours޶޶޶noth"+"杧杧杧")
}
else{
kaj=localStorage.getItem("maps").split("杧杧杧")
kaj[id]=qw+"޶޶޶"+new Date()*1+"yours޶޶޶"+kaj[id].split("޶޶޶")[7]
localStorage.setItem("maps",kaj.join("杧杧杧"))

}

location.href="edit.html?id="+(localStorage.getItem("maps").split("杧杧杧").length-2)

}
if (error!="lol"){
Swal.fire({
theme:"dark",
  html: error,
  timer: 1000,
  timerProgressBar: true,
  showConfirmButton:false
  })
}
}

addEventListener("load", (event) => { })

onload = (event) => {window.onload=resizeInpvut.call(document.getElementById("desc")); }
 // immediately call the function

id=parent.document.URL.substring(parent.document.URL.indexOf('?')+4, parent.document.URL.length);
if (id*1!=id){id="none"}
else{
jdj=localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[6]+""
if(jdj.includes("yours")==false){
location.href="new.html"
}

document.getElementById("sjsj").innerHTML="Update"
document.getElementById("klk").innerHTML="Edit metadata"

elid("waa",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[0])
elid("desc",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[1].split("|||")[0])
elid("mappr",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[1].split("|||")[1])
elid("song",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[3].split("|||")[0])
elid("songname",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[3].split("|||")[1])
elid("art",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[3].split("|||")[2])
elid("bpm",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[3].split("|||")[4])
elid("off",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[3].split("|||")[3]/100)
elid("stars",parseInt(localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[4].slice(-1),16))
elid("gm",["clckr","scrlr","swppr","spmmr","ctrlr"][Math.floor(localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[4].slice(-6,-1)**2/1000000000)])
elid("window",Math.round(localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[4].slice(-6,-1)**2/1000000%1000))
elid("floor",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[2].slice(2,4)*1)
elid("cap",localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[2].slice(0,2)*1)
if (parseInt(localStorage.getItem("maps").split("杧杧杧")[id].split("޶޶޶")[4].slice(-1),16).toString()=="NaN"){elid("stars","")}

resizeInpvut.call(document.getElementById("desc")); // immediately call the function
}
dm=new Audio(document.getElementById('song').value)


function playe(){
audio = new Audio(document.getElementById("song").value);
audio.play();   
}
function elid(a,b){document.getElementById(a).value=b}

function stope(){
audio.pause()
audio.currentTime=0
}

// Source - https://stackoverflow.com/a/69025039
// Posted by Shalom Alexander
// Retrieved 2026-04-12, License - CC BY-SA 4.0



//maps=[["Map 0000000",49,10.67,191919],["sup3r 3p1c l3v3l",9,4,919191],["SUPER IMPOSSIBLE",0.9,17,112334]]


var nput = document.getElementById("bpm"); // get the input element
nput.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(nput); // immediately call the function
var put = document.getElementById("mappr"); // get the input element
put.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(put); // immediately call the function
var ut = document.getElementById("songname"); // get the input element
ut.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(ut); // immediately call the function
var td = document.getElementById("art"); // get the input element
td.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(td); // immediately call the function
var input = document.getElementById("waa"); // get the input element
input.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(input); // immediately call the function
var inpdut = document.getElementById("song"); // get the input element
inpdut.addEventListener('input', resizeInpudt); // bind the "resizeInput" callback on "input" event
resizeInput.call(inpdut); // immediately call the function
var inpdsut = document.getElementById("off"); // get the input element
inpdsut.addEventListener('input', resizeInpute); // bind the "resizeInput" callback on "input" event
resizeInpute.call(inpdsut); // immediately call the function
var dinpdsut = document.getElementById("window"); // get the input element
dinpdsut.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(dinpdsut); // immediately call the function
var vdinpdsut = document.getElementById("desc"); // get the input element
vdinpdsut.addEventListener('input', resizeInpvut); // bind the "resizeInput" callback on "input" event
resizeInpvut.call(vdinpdsut); // immediately call the function
var qvdinpdsut = document.getElementById("cap"); // get the input element
qvdinpdsut.addEventListener('input', resizeInpvut); // bind the "resizeInput" callback on "input" event
resizeInput.call(qvdinpdsut); // immediately call the function
var vqvdinpdsut = document.getElementById("floor"); // get the input element
vqvdinpdsut.addEventListener('input', resizeInpvut); // bind the "resizeInput" callback on "input" event
resizeInput.call(vqvdinpdsut); // immediately call the function
var NOMORE = document.getElementById("stars"); // get the input element
NOMORE.addEventListener('input', resizeInput); // bind the "resizeInput" callback on "input" event
resizeInput.call(NOMORE); // immediately call the function


function resizeInput() {
  this.style.width = this.value.length*1+5 + "ch";
}	
function resizeInpute() {
  this.style.width = this.value.length*1+5 + "ch";
if (document.getElementById("a").innerHTML="Pause"){
document.getElementById("a").innerHTML="Play"
}
}
function resizeInpvut() {
if (this.value.length*1+3<=40){
  this.style.width = this.value.length*1+5 + "ch";
  this.style.height = "38px";
  
}	
else{
  this.style.width = "40ch"
  this.style.height = this.scrollHeight*1 + "px";

}
}

function resizeInpudt() {
  this.style.width = this.value.length*1+5 + "ch";
  
dm=new Audio(document.getElementById('song').value)
}	


function find(hh){
r={'noth':'0000','fcfc':'10000'}
kj=hh.match(/.{1,4}/g) ?? []
sum=0
kj.filter(item=>item!="noth").map(item => r[item] !== undefined ? r[item] : item).map(item=>item*1).forEach(item=>sum+=item)
return [Math.max(...kj.map(item => r[item] !== undefined ? r[item] : item).map(item=>item*1)),kj.reduce((total,x) => total+(x=="fcfc"), 0),kj.reduce((total,x) => total+(x=="noth"), 0)-1,sum / kj.length-1]
}
</script>

<style>
input:focus, button:focus, textarea:focus {
  outline: none;
  border: none;
}  	
h1{
color:#FFFFFF;
text-align:center;
}
html{
background-color:#101010;
font-family: Verdana;
color: white;
font-size:18px;
}
.e{
float:right;
}
.a{
float: left;
}	
input{
font-family: Verdana;
border:none;
font-size:15px;
border-radius:5px;
padding:5px;
transition:0.3s ease-in-out;
}
button{
padding:10px;
border: none;
border-radius:10px;
font-size:30px;
transition: 0.3;
}
.p{
font-size:12px;
}
.29{
width:150px;
text-align:center;
}
.omega{
margin-top: 0px;
text-align:center;
}
tiny{
font-size:14px;
}
.eee{
margin:10px;
background-color:#eeeeee;
}
a{
color: #c4e8e8;
text-decoration:none;
transition: 0.4s;

}
a:hover{
transition: 0.4s;

color: #ec2d2d;
}	
input{
font-size:20px;
margin:15px;
min-width:50px;
text-align:center;

}
#bpm{
width:100px;
}
.c{
width:70px;
}
.ww{
background-color:#00000000;
color:#ffffff;	
}
.ww:hover{
color:#ff6666;	
}
option{
font-size:20px;
text-align:center;

}
select{
font-size:20px;
font-family:Verdana;
border-radius:5px;
}
.class{
font-size:20px;
height:40px;
margin:5px;
}
#off{
text-align:center;

}
#window{

}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}
textarea {
font-family:Verdana;
border-radius:5px;
padding-top:6px;
padding-bottom:6px;

font-size:20px;
min-width:50px;
text-align:center;
resize: none; 
height:38px;

    /* Hide scrollbar in WebKit (Chrome, Safari, newer Opera) */
    &::-webkit-scrollbar {
        display: none;
    }
    
    /* Hide scrollbar in Firefox */
    -moz-scrollbars-none: none; /* Note: Firefox uses 'overflow: -moz-scrollbars-none' on the element itself */
    overflow: -moz-scrollbars-none;
    
    /* Hide scrollbar in Internet Explorer + Edge */
    -ms-overflow-style: none;
    scrollbar-width: none;
}   
hr{
width:300px;
border-top:dotted;
border-bottom:none;
border-left:none;
border-right:none;

}
/*
Source - https://stackoverflow.com/a/67784289
Posted by Arun P, modified by community. See post 'Timeline' for change history
Retrieved 2026-04-15, License - CC BY-SA 4.0
*/

.swal2-popup {
font-weight:normal;
  font-family: Verdana, serif;
}
button:hover{
background:#dddddd;
}
.ww:hover{
background:#67676700;
}
</style>