Compare commits
2 Commits
81b243bd85
...
f87af4fa7e
| Author | SHA1 | Date | |
|---|---|---|---|
|
f87af4fa7e
|
|||
|
980715c72f
|
@@ -30,6 +30,10 @@ body {
|
||||
background-color: #25292d;
|
||||
}
|
||||
|
||||
#statsTable th {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#matrixCard {
|
||||
background-image: radial-gradient(#222, #25292d);
|
||||
}
|
||||
@@ -43,11 +47,6 @@ body {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
#statsTable td,
|
||||
#statsModal td {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
td#timeCell {
|
||||
min-width: 10ch;
|
||||
}
|
||||
@@ -274,20 +273,22 @@ tr.cleared-line-animation {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
#statsModal th {
|
||||
#statsModal td {
|
||||
padding-left: 0;
|
||||
padding-right: 0.5rem;
|
||||
padding-bottom: 0.2rem;
|
||||
border-left: 0.5rem solid transparent;
|
||||
border-right: 0;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
#statsModal td {
|
||||
#statsModal th {
|
||||
padding-left: 0.5rem;
|
||||
padding-right: 0;
|
||||
padding-bottom: 0.2rem;
|
||||
border-left: 0;
|
||||
border-right: 0.5rem solid transparent;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#statsModal tr:last-child th,
|
||||
|
||||
25
index.html
25
index.html
@@ -143,11 +143,11 @@
|
||||
</div>
|
||||
<div class="card shadow">
|
||||
<table id="statsTable" class="table mb-0">
|
||||
<tr class="card-header fw-bold text-uppercase"><th>Score</th><td id="scoreCell">0</td> </tr>
|
||||
<tr><th>Meilleur<br/>score</th><td id="highScoreCell"><script>document.write(Number(localStorage["highScore"]) || 0)</script></td></tr>
|
||||
<tr><th>Niveau</th><td id="levelCell">0</td> </tr>
|
||||
<tr><th>But</th> <td id="goalCell">0</td> </tr>
|
||||
<tr><th>Temps</th> <td id="timeCell">00:00:00</td></tr>
|
||||
<tr class="card-header fw-bold text-uppercase"><td>Score</td><th id="scoreCell">0</th> </tr>
|
||||
<tr><td>Meilleur<br/>score</td><th id="highScoreCell"><script>document.write(Number(localStorage["highScore"]) || 0)</script></th></tr>
|
||||
<tr><td>Niveau</td><th id="levelCell">0</th> </tr>
|
||||
<tr><td>But</td> <th id="goalCell">0</th> </tr>
|
||||
<tr><td>Temps</td> <th id="timeCell">00:00:00</th></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
@@ -226,11 +226,16 @@
|
||||
</div>
|
||||
<div class="modal-body p-0">
|
||||
<table class="table mb-0">
|
||||
<tr><th>Score</th> <td id="statsModalScoreCell"></td> <th>Quatuors</th> <td id="statsModalNbQuatuors"></td> </tr>
|
||||
<tr><th>Meilleur score</th><td id="statsModalHighScoreCell"></td> <th>Pirouettes</th> <td id="statsModalNbTSpin"></td> </tr>
|
||||
<tr><th>Temps</th> <td id="statsModalTimeCell"></td> <th>Plus long combo</th> <td id="statsModalMaxCombo"></td> </tr>
|
||||
<tr><th>Niveau</th> <td id="statsModalLevelCell"></td> <th>Plus long bout à bout</th><td id="statsModalMaxB2B"></td> </tr>
|
||||
<tr><th>Lignes</th> <td id="statsModaltotalClearedLines"></td><th>Lignes par minute</th> <td id="statsModaltotalClearedLinesPM"></td></tr>
|
||||
<tr><td>Score</td> <th id="statsModalScoreCell"></th> </tr>
|
||||
<tr><td>Meilleur score</td> <th id="statsModalHighScoreCell"></th> </tr>
|
||||
<tr><td>Niveau</td> <th id="statsModalLevelCell"></th> </tr>
|
||||
<tr><td>Temps</td> <th id="statsModalTimeCell"></th> </tr>
|
||||
<tr><td>Lignes</td> <th id="statsModaltotalClearedLines"></th> </tr>
|
||||
<tr><td>Lignes par minute</td> <th id="statsModaltotalClearedLinesPM"><htd></tr>
|
||||
<tr><td>Quatuors</td> <th id="statsModalNbQuatuors"></th> </tr>
|
||||
<tr><td>Pirouettes</td> <th id="statsModalNbTSpin"></th> </tr>
|
||||
<tr><td>Plus long combo</td> <th id="statsModalMaxCombo"></th> </tr>
|
||||
<tr><td>Plus long bout à bout</td><th id="statsModalMaxB2B"></th> </tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
|
||||
48
js/app.js
48
js/app.js
@@ -323,7 +323,6 @@ sceneDiv.onwheel = function (event) {
|
||||
screenRow.style.setProperty('--tZ', tZ + 'px');
|
||||
};
|
||||
|
||||
const ImageURLPattern = /^(https?:\/\/.*\.(?:png|jpg|jpeg|gif|bmp|webp|svg))$/i
|
||||
$.fn.select2.defaults.set("templateResult", (state) =>
|
||||
state.id
|
||||
? $(`<img class="preview" src="${state.id}" title="${state.text}" loading="lazy"/>`)
|
||||
@@ -331,12 +330,12 @@ $.fn.select2.defaults.set("templateResult", (state) =>
|
||||
)
|
||||
$.fn.select2.defaults.set("templateSelection", (state) =>
|
||||
state.id
|
||||
? $(`
|
||||
? $(`
|
||||
<table class="minoes-table preview" style="--skin-url: url(${state.id});">
|
||||
<tr><td class="Z mino"></td><td class="O mino"></td><td class="T mino"></td><td class="I mino"></td></tr>
|
||||
</table>
|
||||
`)
|
||||
: state.text
|
||||
: state.text
|
||||
)
|
||||
$.fn.select2.defaults.set("theme", "bootstrap-5")
|
||||
$.fn.select2.defaults.set("selectionCssClass", 'form-select')
|
||||
@@ -346,7 +345,7 @@ $.fn.select2.defaults.set("placeholder", "URL de l'image")
|
||||
$.fn.select2.defaults.set("tags", true)
|
||||
$.fn.select2.defaults.set("createTag", function (params) {
|
||||
const url = encodeURI(params.term);
|
||||
if (ImageURLPattern.test(url)) {
|
||||
if (/^(https?:\/\/.*\.(?:png|jpg|jpeg|gif|bmp|webp|svg))$/i.test(url)) {
|
||||
return {
|
||||
id: url,
|
||||
text: 'Source externe',
|
||||
@@ -357,13 +356,13 @@ $.fn.select2.defaults.set("createTag", function (params) {
|
||||
|
||||
stylesheetSelect.oninput = function (event) {
|
||||
selectedStyleSheet.href = this.value;
|
||||
|
||||
$("#skinURLSelect").empty();
|
||||
var skinURL = skinURLSelect.value
|
||||
|
||||
switch (this.value) {
|
||||
case 'css/tetrio-skin.css':
|
||||
skinURLSelect.disabled = false;
|
||||
|
||||
localStorage[skinURLSelect.name] = skinURLSelect.value
|
||||
skinURLSelect.name = "tetrioSkinURL"
|
||||
$("#skinURLSelect").empty();
|
||||
const baseURL = "https://you.have.fail/tetrioplus/data"
|
||||
fetch(`${baseURL}/data.json`)
|
||||
.then((resp) => resp.json())
|
||||
@@ -376,7 +375,7 @@ stylesheetSelect.oninput = function (event) {
|
||||
children: skins.map((skin) => {
|
||||
return {
|
||||
id: `${baseURL}/${encodeURI(skin.path)}`,
|
||||
text:`${skin.name}\n${skin.description}`
|
||||
text: skin.description? `${skin.name}\n${skin.description}` : `${skin.name}`
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -389,13 +388,25 @@ stylesheetSelect.oninput = function (event) {
|
||||
}]
|
||||
})
|
||||
data.sort((group1, group2) => group1.text > group2.text)
|
||||
$('#skinURLSelect').select2({data: data});
|
||||
|
||||
skinURLSelect.disabled = false;
|
||||
$('#skinURLSelect').select2({data: data})
|
||||
if (skinURL = localStorage['tetrioSkinURL']) {
|
||||
if ($('#skinURLSelect').find(`option[value='${skinURL}']`).length) {
|
||||
$('#skinURLSelect').val(skinURL).trigger('change');
|
||||
} else {
|
||||
var option = new Option('Sample sauvegardé', skinURL);
|
||||
$('#skinURLSelect').append(option).trigger('change');
|
||||
}
|
||||
skinURLSelect.oninput();
|
||||
}
|
||||
})
|
||||
break;
|
||||
|
||||
case 'css/jstris-skin.css':
|
||||
skinURLSelect.disabled = false;
|
||||
|
||||
localStorage[skinURLSelect.name] = skinURLSelect.value
|
||||
skinURLSelect.name = "jstrisSkinURL"
|
||||
$("#skinURLSelect").empty();
|
||||
fetch('https://konsola5.github.io/jstris-customization-database/jstrisCustomizationDatabase.json')
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
@@ -410,7 +421,18 @@ stylesheetSelect.oninput = function (event) {
|
||||
};
|
||||
data.push(groupData);
|
||||
}
|
||||
$('#skinURLSelect').select2({data: data});
|
||||
|
||||
skinURLSelect.disabled = false;
|
||||
$('#skinURLSelect').select2({data: data})
|
||||
if (skinURL = localStorage['jstrisSkinURL']) {
|
||||
if ($('#skinURLSelect').find(`option[value='${skinURL}']`).length) {
|
||||
$('#skinURLSelect').val(skinURL).trigger('change');
|
||||
} else {
|
||||
var option = new Option('Sample sauvegardé', skinURL);
|
||||
$('#skinURLSelect').append(option).trigger('change');
|
||||
}
|
||||
skinURLSelect.oninput();
|
||||
}
|
||||
});
|
||||
break;
|
||||
|
||||
|
||||
@@ -37,15 +37,6 @@ class Settings {
|
||||
if (element.name in localStorage) element.value = localStorage[element.name];
|
||||
});
|
||||
stylesheetSelect.oninput();
|
||||
if (localStorage['skinURL']) {
|
||||
if ($('#skinURLSelect').find("option[value='" + localStorage['skinURL'] + "']").length) {
|
||||
$('#skinURLSelect').val(localStorage['skinURL']).trigger('change');
|
||||
} else {
|
||||
var option = new Option('Sample sauvegardé', localStorage['skinURL']);
|
||||
$('#skinURLSelect').append(option).trigger('change');
|
||||
}
|
||||
skinURLSelect.oninput();
|
||||
}
|
||||
}
|
||||
|
||||
save() {
|
||||
|
||||
Reference in New Issue
Block a user