-
Notifications
You must be signed in to change notification settings - Fork 52
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1216 from thewtex/demo-app-viewer-version
demo app viewer version
- Loading branch information
Showing
5 changed files
with
187 additions
and
133 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
49 changes: 31 additions & 18 deletions
49
...s/downsample/typescript/test/browser/demo-app/downsample-bin-shrink-load-sample-inputs.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,33 +1,46 @@ | ||
| export default async function downsampleLoadSampleInputs (model, preRun=false) { | ||
| const downsampleButton = document.querySelector('#downsampleBinShrinkInputs sl-button[name=input-file-button]') | ||
| export default async function downsampleLoadSampleInputs( | ||
| model, | ||
| preRun = false, | ||
| ) { | ||
| const downsampleButton = document.querySelector( | ||
| "#downsampleBinShrinkInputs sl-button[name=input-file-button]", | ||
| ); | ||
| if (!preRun) { | ||
| downsampleButton.loading = true | ||
| downsampleButton.loading = true; | ||
| } | ||
|
|
||
| const fileName = "cthead1.png" | ||
| const response = await fetch(`https://bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua.ipfs.w3s.link/ipfs/bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua/input/${fileName}`) | ||
| const data = new Uint8Array(await response.arrayBuffer()) | ||
| const inputFile = { data, path: fileName } | ||
| const { image } = await globalThis.readImage(inputFile) | ||
| const fileName = "cthead1.png"; | ||
| const response = await fetch( | ||
| `https://bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua.ipfs.w3s.link/ipfs/bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua/input/${fileName}`, | ||
| ); | ||
| const data = new Uint8Array(await response.arrayBuffer()); | ||
| const inputFile = { data, path: fileName }; | ||
| const { image } = await globalThis.readImage(inputFile); | ||
|
|
||
| model.inputs.set('input', image) | ||
| model.options.set('shrinkFactors', [2, 2]) | ||
| model.inputs.set("input", image); | ||
| model.options.set("shrinkFactors", [2, 2]); | ||
|
|
||
| if (!preRun) { | ||
| const downsampleElement = document.getElementById('downsampleBinShrink-input-details') | ||
| downsampleElement.innerHTML = `<pre>${globalThis.escapeHtml(inputFile.path)}</pre>` | ||
| downsampleElement.disabled = false | ||
| const downsampleElement = document.getElementById( | ||
| "downsampleBinShrink-input-details", | ||
| ); | ||
| downsampleElement.setImage(image); | ||
| downsampleElement.disabled = false; | ||
|
|
||
| const shrinkFactorsElement = document.querySelector('#downsampleBinShrinkInputs sl-input[name=shrink-factors]') | ||
| shrinkFactorsElement.value = JSON.stringify(model.options.get('shrinkFactors')) | ||
| const shrinkFactorsElement = document.querySelector( | ||
| "#downsampleBinShrinkInputs sl-input[name=shrink-factors]", | ||
| ); | ||
| shrinkFactorsElement.value = JSON.stringify( | ||
| model.options.get("shrinkFactors"), | ||
| ); | ||
|
|
||
| downsampleButton.loading = false | ||
| downsampleButton.loading = false; | ||
| } | ||
|
|
||
| return model | ||
| return model; | ||
| } | ||
|
|
||
| // Use this function to run the pipeline when this tab group is select. | ||
| // This will load the web worker if it is not already loaded, download the wasm module, and allocate memory in the wasm model. | ||
| // Set this to `false` if sample inputs are very large or sample pipeline computation is long. | ||
| export const usePreRun = true | ||
| export const usePreRun = true; |
49 changes: 31 additions & 18 deletions
49
.../downsample/typescript/test/browser/demo-app/downsample-label-image-load-sample-inputs.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,33 +1,46 @@ | ||
| export default async function downsampleLoadSampleInputs (model, preRun=false) { | ||
| const downsampleButton = document.querySelector('#downsampleLabelImageInputs sl-button[name=input-file-button]') | ||
| export default async function downsampleLoadSampleInputs( | ||
| model, | ||
| preRun = false, | ||
| ) { | ||
| const downsampleButton = document.querySelector( | ||
| "#downsampleLabelImageInputs sl-button[name=input-file-button]", | ||
| ); | ||
| if (!preRun) { | ||
| downsampleButton.loading = true | ||
| downsampleButton.loading = true; | ||
| } | ||
|
|
||
| const fileName = "2th_cthead1.png" | ||
| const response = await fetch(`https://bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua.ipfs.w3s.link/ipfs/bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua/input/${fileName}`) | ||
| const data = new Uint8Array(await response.arrayBuffer()) | ||
| const inputFile = { data, path: fileName } | ||
| const { image } = await globalThis.readImage(inputFile) | ||
| const fileName = "2th_cthead1.png"; | ||
| const response = await fetch( | ||
| `https://bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua.ipfs.w3s.link/ipfs/bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua/input/${fileName}`, | ||
| ); | ||
| const data = new Uint8Array(await response.arrayBuffer()); | ||
| const inputFile = { data, path: fileName }; | ||
| const { image } = await globalThis.readImage(inputFile); | ||
|
|
||
| model.inputs.set('input', image) | ||
| model.options.set('shrinkFactors', [2, 2]) | ||
| model.inputs.set("input", image); | ||
| model.options.set("shrinkFactors", [2, 2]); | ||
|
|
||
| if (!preRun) { | ||
| const downsampleElement = document.getElementById('downsampleLabelImage-input-details') | ||
| downsampleElement.innerHTML = `<pre>${globalThis.escapeHtml(inputFile.path)}</pre>` | ||
| downsampleElement.disabled = false | ||
| const downsampleElement = document.getElementById( | ||
| "downsampleLabelImage-input-details", | ||
| ); | ||
| downsampleElement.setImage(image); | ||
| downsampleElement.disabled = false; | ||
|
|
||
| const shrinkFactorsElement = document.querySelector('#downsampleLabelImageInputs sl-input[name=shrink-factors]') | ||
| shrinkFactorsElement.value = JSON.stringify(model.options.get('shrinkFactors')) | ||
| const shrinkFactorsElement = document.querySelector( | ||
| "#downsampleLabelImageInputs sl-input[name=shrink-factors]", | ||
| ); | ||
| shrinkFactorsElement.value = JSON.stringify( | ||
| model.options.get("shrinkFactors"), | ||
| ); | ||
|
|
||
| downsampleButton.loading = false | ||
| downsampleButton.loading = false; | ||
| } | ||
|
|
||
| return model | ||
| return model; | ||
| } | ||
|
|
||
| // Use this function to run the pipeline when this tab group is select. | ||
| // This will load the web worker if it is not already loaded, download the wasm module, and allocate memory in the wasm model. | ||
| // Set this to `false` if sample inputs are very large or sample pipeline computation is long. | ||
| export const usePreRun = true | ||
| export const usePreRun = true; |
49 changes: 31 additions & 18 deletions
49
packages/downsample/typescript/test/browser/demo-app/downsample-load-sample-inputs.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,33 +1,46 @@ | ||
| export default async function downsampleLoadSampleInputs (model, preRun=false) { | ||
| const downsampleButton = document.querySelector('#downsampleInputs sl-button[name=input-file-button]') | ||
| export default async function downsampleLoadSampleInputs( | ||
| model, | ||
| preRun = false, | ||
| ) { | ||
| const downsampleButton = document.querySelector( | ||
| "#downsampleInputs sl-button[name=input-file-button]", | ||
| ); | ||
| if (!preRun) { | ||
| downsampleButton.loading = true | ||
| downsampleButton.loading = true; | ||
| } | ||
|
|
||
| const fileName = "cthead1.png" | ||
| const response = await fetch(`https://bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua.ipfs.w3s.link/ipfs/bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua/input/${fileName}`) | ||
| const data = new Uint8Array(await response.arrayBuffer()) | ||
| const inputFile = { data, path: fileName } | ||
| const { image } = await globalThis.readImage(inputFile) | ||
| const fileName = "cthead1.png"; | ||
| const response = await fetch( | ||
| `https://bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua.ipfs.w3s.link/ipfs/bafybeih4fck4ndvsvgo6774xy5w7ip3bzcvh7x7e527m4yvazgrxdzayua/input/${fileName}`, | ||
| ); | ||
| const data = new Uint8Array(await response.arrayBuffer()); | ||
| const inputFile = { data, path: fileName }; | ||
| const { image } = await globalThis.readImage(inputFile); | ||
|
|
||
| model.inputs.set('input', image) | ||
| model.options.set('shrinkFactors', [2, 2]) | ||
| model.inputs.set("input", image); | ||
| model.options.set("shrinkFactors", [2, 2]); | ||
|
|
||
| if (!preRun) { | ||
| const downsampleElement = document.getElementById('downsample-input-details') | ||
| downsampleElement.innerHTML = `<pre>${globalThis.escapeHtml(inputFile.path)}</pre>` | ||
| downsampleElement.disabled = false | ||
| const downsampleElement = document.getElementById( | ||
| "downsample-input-details", | ||
| ); | ||
| downsampleElement.setImage(image); | ||
| downsampleElement.disabled = false; | ||
|
|
||
| const shrinkFactorsElement = document.querySelector('#downsampleInputs sl-input[name=shrink-factors]') | ||
| shrinkFactorsElement.value = JSON.stringify(model.options.get('shrinkFactors')) | ||
| const shrinkFactorsElement = document.querySelector( | ||
| "#downsampleInputs sl-input[name=shrink-factors]", | ||
| ); | ||
| shrinkFactorsElement.value = JSON.stringify( | ||
| model.options.get("shrinkFactors"), | ||
| ); | ||
|
|
||
| downsampleButton.loading = false | ||
| downsampleButton.loading = false; | ||
| } | ||
|
|
||
| return model | ||
| return model; | ||
| } | ||
|
|
||
| // Use this function to run the pipeline when this tab group is select. | ||
| // This will load the web worker if it is not already loaded, download the wasm module, and allocate memory in the wasm model. | ||
| // Set this to `false` if sample inputs are very large or sample pipeline computation is long. | ||
| export const usePreRun = true | ||
| export const usePreRun = true; |
Oops, something went wrong.