ByteDice/ByteDiceWeb
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

added mobile support & fixed bugs

Browse Source
This commit is contained in:
ByteDice
2026-07-19 10:59:31 +02:00
parent a7b92c2072
commit 8df6d0f779
4 changed files with 28 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
toys/crafting/script.js
+21 -13
View File
@@ -19,12 +19,6 @@ let scale = 1
let isCollapsed = false
document.addEventListener("mousemove", function(event) {
mouseX = event.clientX;
mouseY = event.clientY;
})
function collapseInput() {
const COLLAPSE = "collapse 0.5s cubic-bezier(0, 0, 0, 1.46) forwards"
tomlInputContainer.style.animation = COLLAPSE
@@ -58,11 +52,6 @@ function drag_trees(mouse_offset) {
trees.style.transform = `translate(${dragX}px, ${dragY}px)`
}
function on_start_drag() {
dragOffsetX = mouseX - dragX * scale
dragOffsetY = mouseY - dragY * scale
isDragging = true
}
function dragLoop() {
if (isDragging) { drag_trees() }
@@ -70,12 +59,31 @@ function dragLoop() {
}
treeStatic.onmousedown = on_start_drag
document.addEventListener("mouseup", function() { isDragging = false })
treeStatic.addEventListener("pointerdown", function(event) {
mouseX = event.clientX
mouseY = event.clientY
dragOffsetX = mouseX - dragX * scale
dragOffsetY = mouseY - dragY * scale
isDragging = true
treeStatic.setPointerCapture(event.pointerId);
event.preventDefault()
})
document.addEventListener("pointerup", function()
{ isDragging = false })
document.addEventListener("pointercancel", function()
{ isDragging = false })
treeStatic.addEventListener("wheel", function(event) {
scale += (-event.deltaY / 500)
scale = Math.max(0.2, scale)
treeScale.style.transform = `scale(${scale})`
})
document.addEventListener("pointermove", function(event) {
mouseX = event.clientX;
mouseY = event.clientY;
})
document.addEventListener("DOMContentLoaded", dragLoop)
toys/crafting/style.css
+1 -1
View File
@@ -13,7 +13,7 @@
box-sizing: border-box;
width: calc(60px * var(--pxDensity));
/*height: calc(100px * var(--pxDensity));*/
height: 65vh;
height: 45vh;
color: inherit;
display: inline-block;
text-align: left;
toys/index.html
+4 -1
View File
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=no">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, interactive-widget=resize-content">
<link rel="stylesheet" href="/global/navBar.css">
<link rel="stylesheet" href="/global/globalStyle.css">
@@ -59,6 +59,9 @@
</div>
</button>
</div>
<!-- To scroll further, width is needed for some reason -->
<div style="margin-top: 50vh; width: 1px"></div>
</div>
<div id="navBarContainer" data-alt="byte"></div>
toys/style.css
+2
View File
@@ -51,6 +51,8 @@ button:active {
flex-wrap: wrap;
gap: calc(6px * var(--pxDensity));
margin: 0 auto;
overflow-y: scroll;
max-height: 100vh;
}
.toyLi {
margin: 0;