mirror-github-bspeice/speice.io
1
0
Fork 0
mirror of https://github.com/bspeice/speice.io synced 2025-12-14 17:17:28 -05:00
Code Issues Releases Wiki Activity

Auto-sizing canvas, starting cleanup for display on mobile browsers

Browse Source
This commit is contained in:
Bradlee Speice
2024-12-08 19:53:06 -05:00
parent 78d71cbc7b
commit 5ae6b82d26
13 changed files with 206 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
blog/2024-11-15-playing-with-fire/1-introduction/GasketWeighted.tsx
View File

@ -1,4 +1,4 @@
import {useEffect, useState, useContext} from "react";
import {useEffect, useState, useContext, useRef} from "react";
import {PainterContext} from "../src/Canvas";
import {chaosGameWeighted} from "./chaosGameWeighted";
import TeX from '@matejmazur/react-katex';
@ -30,7 +30,7 @@ export default function GasketWeighted() {
const weightInput = (title, weight, setWeight) => (
<>
<div className={styles.inputElement}>
<p><TeX>{title}</TeX> weight: {weight}</p>
<p><TeX>{title}</TeX>: {weight}</p>
<input type={'range'} min={0} max={1} step={.01} style={{width: '100%'}} value={weight}
onInput={e => setWeight(Number(e.currentTarget.value))}/>
</div>
@ -39,7 +39,7 @@ export default function GasketWeighted() {
return (
<>
<div className={styles.inputGroup} style={{display: 'grid', gridTemplateColumns: 'auto auto auto'}}>
<div className={styles.inputGroup} style={{display: 'grid', gridTemplateColumns: '1fr 1fr 1fr'}}>
{weightInput("F_0", f0Weight, setF0Weight)}
{weightInput("F_1", f1Weight, setF1Weight)}
{weightInput("F_2", f2Weight, setF2Weight)}