From b8b743871ee797952a3316db4afa15557b8d4433 Mon Sep 17 00:00:00 2001 From: adrien Date: Wed, 11 Mar 2026 18:10:20 +0100 Subject: [PATCH] defaults, round --- css/_common.css | 8 ++--- css/tetrio-skin.css | 9 ++--- index.html | 2 +- js/app.js | 84 ++++++++++++++++----------------------------- js/interface.js | 7 ++-- 5 files changed, 41 insertions(+), 69 deletions(-) diff --git a/css/_common.css b/css/_common.css index 0c5ab83..9d5ab79 100644 --- a/css/_common.css +++ b/css/_common.css @@ -66,12 +66,12 @@ td#timeCell { } @keyframes hard-dropped-table-animation { - 25% { - transform: translateY(3px); + 50% { + transform: translate(0, 5px); } } .hard-dropped-table-animation { - animation: hard-dropped-table-animation .2s; + animation: hard-dropped-table-animation ease-in-out .2s; } tr.buffer-zone td:not(.mino) { @@ -296,4 +296,4 @@ tr.cleared-line-animation { .select2-results__group { display: inline-block; -} \ No newline at end of file +} diff --git a/css/tetrio-skin.css b/css/tetrio-skin.css index 9a17a5a..6e58b71 100644 --- a/css/tetrio-skin.css +++ b/css/tetrio-skin.css @@ -1,11 +1,12 @@ :root { --cell-size: 30px; - --sprite-size: calc(100% / 11); + --sprite-size: round(100% / 11, 1px); --skin-url: url(https://you.have.fail/ed/at/tetrioplus/data/content/skin/Haley%20Halcyon/tetrio_gameboy_plus.svg); } -.minoes-table { - border-collapse: collapse; +tr.matrix td:not(.mino) { + border-left: none; + border-bottom: none; } .mino { @@ -62,6 +63,7 @@ } .option { + --cell-size: 24px; display: inline-block; height: var(--cell-size); } @@ -71,7 +73,6 @@ } .select2-container:not(.select2-container--disabled) .selection { - --cell-size: 24px; --padded-cell-size: calc(var(--cell-size) + 1px); --nb-sprites: 4; --sprite-pos: 2; diff --git a/index.html b/index.html index da97fdf..558a067 100644 --- a/index.html +++ b/index.html @@ -93,7 +93,7 @@
diff --git a/js/app.js b/js/app.js index 840b525..bb68ab5 100644 --- a/js/app.js +++ b/js/app.js @@ -318,7 +318,33 @@ 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 + ? $(``) + : state.text +) +$.fn.select2.defaults.set("templateSelection", (state) => + state.id + ? $(``) + : state.text +) +$.fn.select2.defaults.set("theme", "bootstrap-5") +$.fn.select2.defaults.set("selectionCssClass", 'form-select') +$.fn.select2.defaults.set("dropdownParent", $('#settingsModal')) +$.fn.select2.defaults.set("dropdownAutoWidth", true) +$.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 (/^(https?:\/\/.*\.(?:png|jpg|jpeg|gif|bmp|webp|svg))$/i.test(url)) { + return { + id: url, + text: 'Source externe', + newTag: true, + }; + } +}); + stylesheetSelect.oninput = function (event) { selectedStyleSheet.href = this.value; @@ -342,33 +368,7 @@ stylesheetSelect.oninput = function (event) { data.push(groupData); } - $('#skinURLSelect').select2({ - data: data, - templateResult: state => - state.id - ? $(``) - : state.text, - templateSelection: state => - state.id - ? $(``) - : state.text, - theme: 'bootstrap-5', - selectionCssClass: 'form-select', - dropdownParent: $('#settingsModal'), - dropdownAutoWidth: true, - placeholder: "URL de l'image", - tags: true, - createTag: function (params) { - const url = encodeURI(params.term); - if (ImageURLPattern.test(url)) { - return { - id: url, - text: 'Source externe', - newTag: true, - }; - } - }, - }); + $('#skinURLSelect').select2({data: data}); }); break; case 'css/tetrio-skin.css': @@ -385,33 +385,7 @@ stylesheetSelect.oninput = function (event) { text:`${skin.name} (${skin.author})` } }) - $('#skinURLSelect').select2({ - data: data, - templateResult: state => - state.id - ? $(``) - : state.text, - templateSelection: state => - state.id - ? $(``) - : state.text, - theme: 'bootstrap-5', - selectionCssClass: 'form-select', - dropdownParent: $('#settingsModal'), - dropdownAutoWidth: true, - placeholder: "URL de l'image", - tags: true, - createTag: function (params) { - const url = encodeURI(params.term); - if (ImageURLPattern.test(url)) { - return { - id: url, - text: 'Source externe', - newTag: true, - }; - } - }, - }); + $('#skinURLSelect').select2({data: data}); }) break; diff --git a/js/interface.js b/js/interface.js index e576366..986d562 100644 --- a/js/interface.js +++ b/js/interface.js @@ -36,6 +36,7 @@ class Settings { this.form.querySelectorAll('[name]').forEach(element => { 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'); @@ -48,12 +49,8 @@ class Settings { ); $('#skinURLSelect').append(option).trigger('change'); } - document.documentElement.style.setProperty( - '--skin-url', - `url(${localStorage['skinURL']})`, - ); + skinURLSelect.oninput(); } - stylesheetSelect.oninput(); } save() {