alexandre/PaletteSwitcher
1
0
Fork 0
Code Issues 4 Pull Requests 9 Actions Packages Projects Releases Activity

Removed wasm stuff

Browse Source
This commit is contained in:
Alexandre Bruyant 2024-01-23 20:32:29 +01:00
parent e719223d3b
commit d919b1a26d
4 changed files with 27 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
palette-switcher-v2/index.html
View File

@ -11,7 +11,7 @@
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
<script src="/src/wasm-exec.js"></script> <!-- <script src="/src/wasm-exec.js"></script> -->
<script src="/src/index.tsx" type="module"></script> <script src="/src/index.tsx" type="module"></script>
</body> </body>
</html> </html>

4
palette-switcher-v2/src/lib/ditherer.ts
View File

@ -9,7 +9,9 @@ const [start, stop] = createSignaledWorker({
input: job, input: job,
output: setImage, output: setImage,
func: function process(job: Job) { func: function process(job: Job) {
return "OK ?"; console.log("Job triggered");
return job.kind;
}, },
}); });

38
palette-switcher-v2/src/pages/Switcher.tsx
View File

@ -1,19 +1,30 @@
import { Component } from "solid-js"; import { Component, JSX, splitProps } from "solid-js";
import { setJob, image } from "../lib/ditherer"; import { image, setJob } from "../lib/ditherer";
import { Job } from "../lib/job";
type DefaultButtonProps = { children?: JSX.Element } & JSX.HTMLAttributes<HTMLButtonElement>;
const DefaultButton: Component<DefaultButtonProps> = (props) => {
const [, rest] = splitProps(props, ["children"]);
return <button
{...rest}
type="button"
class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800"
>
{props.children}
</button>
}
const Switcher: Component = () => { const Switcher: Component = () => {
const handler = () => { const handler = () => {
const job: Job = { setJob({
kind: "FLOYD_STEINBERG", kind: "FLOYD_STEINBERG",
image: new ArrayBuffer(1), image: new ArrayBuffer(1),
palette: ["FFFFFF"], palette: ["FFFFFF"],
}; });
setJob(job);
}; };
return ( return (
<div class="mx-auto max-w-7xl py-6 sm:px-6 lg:px-8" onClick={handler}> <div class="mx-auto max-w-7xl py-6 sm:px-6 lg:px-8">
<main class="p-4 h-auto"> <main class="p-4 h-auto">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-4"> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-4">
<div class="border-2 border-dashed border-gray-300 rounded-lg dark:border-gray-600 h-32 md:h-64"></div> <div class="border-2 border-dashed border-gray-300 rounded-lg dark:border-gray-600 h-32 md:h-64"></div>
@ -22,14 +33,9 @@ const Switcher: Component = () => {
<div class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-32 md:h-64"></div> <div class="border-2 border-dashed rounded-lg border-gray-300 dark:border-gray-600 h-32 md:h-64"></div>
</div> </div>
</main> </main>
<button <DefaultButton onClick={handler}>Trigger</DefaultButton>
onClick={handler} <span>{image()}</span>
type="button" </div >
class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800"
>
Trigger
</button>
</div>
); );
}; };

1
palette-switcher-v2/tsconfig.json
View File

@ -1,5 +1,6 @@
{ {
"compilerOptions": { "compilerOptions": {
"allowJs": true,
"strict": true, "strict": true,
"target": "ESNext", "target": "ESNext",
"module": "ESNext", "module": "ESNext",