Skip to content

Commit 4dd44bf

Browse files
iislucasiislucas
authored
Merge pull request #63 from PAIR-code/iislucas-29-dec-2024-exp-ui-with-cells
Created new UI for interacting with, and visualizing tiny in browser models
2 parents d970c48 + 40f8ce5 commit 4dd44bf

File tree

146 files changed

+11583
-6088
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

146 files changed

+11583
-6088
lines changed

‎animated-transformer/README.md‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,45 @@ NOTE: The dev server listens on 127.0.0.1. If you intend to access the
2323
dev server from another machine, you'll need to tunnel the traffic using `ssh`'s
2424
`-L` flag.
2525

26+
In additon to the angular build server, the current setup assumes an additional
27+
server on port 9000, that serves some library JS files for web-workers to
28+
import. This is done via the command:
29+
30+
```sh
31+
npx ts-node src/weblab-examples/build.script.ts --mode=serve
32+
```
33+
34+
This combination allows scripts `src/weblab-examples/` to be served at `http://localhost:4200/scripts/`
35+
36+
And in particular, `lib.worker.js` to be served so that it can be imported into
37+
WebWorkers with:
38+
39+
```ts
40+
importScripts('/scripts/lib.worker.js');
41+
```
42+
43+
## Adding an icon
44+
45+
1. Download the SVG of an icon, e.g. from: https://fonts.google.com/icons into
46+
the `src/assets/icons` directory, e.g. the [`settings`](https://fonts.google.com/icons?selected=Material+Symbols+Outlined:settings:FILL@0;wght@400;GRAD@0;opsz@24&icon.size=24&icon.color=%235f6368) icon.
47+
1. Make the component import `MatIconModule`, and add code like this to the
48+
constructor:
49+
50+
```ts
51+
const iconRegistry = inject(MatIconRegistry);
52+
const sanitizer = inject(DomSanitizer);
53+
function addIcons(names: string[]) {
54+
for (const name of names) {
55+
iconRegistry.addSvgIcon(
56+
name,
57+
sanitizer.bypassSecurityTrustResourceUrl(`assets/icons/${name}.svg`),
58+
);
59+
}
60+
}
61+
addIcons(['settings']);
62+
```
63+
64+
2665
## Code scaffolding
2766

2867
Run `ng generate component component-name` to generate a new component. You can

‎animated-transformer/angular.json‎

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
"projectType": "application",
88
"schematics": {
99
"@schematics/angular:component": {
10-
"style": "scss"
10+
"style": "scss",
11+
"changeDetection": "OnPush"
1112
}
1213
},
1314
"root": "",
@@ -26,7 +27,12 @@
2627
"inlineStyleLanguage": "scss",
2728
"assets": [
2829
"src/favicon.ico",
29-
"src/assets"
30+
"src/assets",
31+
{
32+
"glob": "**/*",
33+
"input": "src/assets/",
34+
"output": "/assets/"
35+
}
3036
],
3137
"styles": [
3238
"src/styles.scss"
@@ -70,7 +76,11 @@
7076
"buildTarget": "tiny-transformers:build:development"
7177
}
7278
},
73-
"defaultConfiguration": "development"
79+
"defaultConfiguration": "development",
80+
"options": {
81+
"proxyConfig": "./proxy.conf.json",
82+
"verbose": true
83+
}
7484
},
7585
"extract-i18n": {
7686
"builder": "@angular-devkit/build-angular:extract-i18n",

‎animated-transformer/experiment-server/README.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# README
2+
3+
Start the Deno Server
4+
5+
```
6+
deno run -A experiment-server/server.ts --pathToExp=src/weblab-examples
7+
```

‎animated-transformer/experiment-server/data.json‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
[
2+
{
3+
"name": "Aardonyx",
4+
"description": "An early stage in the evolution of sauropods."
5+
},
6+
{
7+
"name": "Abelisaurus",
8+
"description": "\"Abel's lizard\" has been reconstructed from a single skull."
9+
},
10+
{
11+
"name": "Abrictosaurus",
12+
"description": "An early relative of Heterodontosaurus."
13+
},
14+
{
15+
"name": "Abrosaurus",
16+
"description": "A close Asian relative of Camarasaurus."
17+
}
18+
]

‎animated-transformer/experiment-server/deno.json‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"tasks": {
3+
"dev": "deno run --watch server.ts"
4+
},
5+
"imports": {
6+
"@std/assert": "jsr:@std/assert@1",
7+
"@std/path": "jsr:@std/path@^1.0.6",
8+
"@trpc/client": "npm:@trpc/client@^11.0.0-rc.730",
9+
"@trpc/server": "npm:@trpc/server@^11.0.0-rc.730",
10+
"zod": "npm:zod@^3.23.8"
11+
}
12+
}

‎animated-transformer/experiment-server/deno.lock‎

Lines changed: 59 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎animated-transformer/experiment-server/index.html‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<html>
2+
WebSocket server is running.
3+
</html>

‎animated-transformer/experiment-server/main.ts‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
/* Copyright 2023 Google LLC. All Rights Reserved.
2+
3+
Licensed under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License.
5+
You may obtain a copy of the License at
6+
7+
http://www.apache.org/licenses/LICENSE-2.0
8+
9+
Unless required by applicable law or agreed to in writing, software
10+
distributed under the License is distributed on an "AS IS" BASIS,
11+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
See the License for the specific language governing permissions and
13+
limitations under the License.
14+
==============================================================================*/
15+
16+
import { createHTTPServer } from '@trpc/server/adapters/standalone';
17+
import { join } from '@std/path';
18+
// import { appRouter } from './index.ts';
19+
20+
const initDir = Deno.cwd();
21+
console.log(initDir);
22+
23+
// type Dino = { name: string; description: string };
24+
25+
// const dataPath = join('data', 'data.json');
26+
27+
// async function readData(): Promise<Dino[]> {
28+
// const data = await Deno.readTextFile(dataPath);
29+
// return JSON.parse(data);
30+
// }
31+
32+
// async function writeData(dinos: Dino[]): Promise<void> {
33+
// await Deno.writeTextFile(dataPath, JSON.stringify(dinos, null, 2));
34+
// }

‎animated-transformer/experiment-server/main_test.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { assertEquals } from '@std/assert';
2+
// import { add } from "./main.ts";
3+
4+
// Deno.test(function addTest() {
5+
// assertEquals(add(2, 3), 5);
6+
// });

‎animated-transformer/experiment-server/server.ts‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
/* Copyright 2023 Google LLC. All Rights Reserved.
2+
3+
Licensed under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License.
5+
You may obtain a copy of the License at
6+
7+
http://www.apache.org/licenses/LICENSE-2.0
8+
9+
Unless required by applicable law or agreed to in writing, software
10+
distributed under the License is distributed on an "AS IS" BASIS,
11+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12+
See the License for the specific language governing permissions and
13+
limitations under the License.
14+
==============================================================================*/
15+
16+
import { createHTTPServer } from '@trpc/server/adapters/standalone';
17+
import { z } from 'zod';
18+
import { publicProcedure, router } from './trpc.ts';
19+
20+
import { parseArgs } from 'jsr:@std/cli/parse-args';
21+
const flags = parseArgs(Deno.args, {
22+
// boolean: ['help', 'color'],
23+
string: ['port', 'pathToExp'],
24+
default: { port: '9000' },
25+
// negatable: ['color'],
26+
});
27+
28+
if (!flags.pathToExp) {
29+
throw new Error('--pathToExp must be defined.');
30+
}
31+
32+
Deno.chdir(flags.pathToExp);
33+
console.log(`running in dir: ${Deno.cwd()}`);
34+
console.log(`URL: http://localhost:${flags.port}/`);
35+
36+
const appRouter = router({
37+
curPath: publicProcedure.query(async () => {
38+
return Deno.cwd();
39+
}),
40+
loadArray: publicProcedure.input(z.string()).query(async (opts) => {
41+
const subPath = opts.input;
42+
const uintArr = await Deno.readFile(subPath);
43+
return uintArr;
44+
}),
45+
loadStr: publicProcedure.input(z.string()).query(async (opts) => {
46+
const subPath = opts.input;
47+
const str = await Deno.readTextFile(subPath);
48+
return str;
49+
}),
50+
saveStr: publicProcedure
51+
.input(z.object({ path: z.string(), str: z.string(), force: z.boolean() }))
52+
.mutation(async (opts) => {
53+
await Deno.writeTextFile(opts.input.path, opts.input.str, {
54+
createNew: !opts.input.force,
55+
});
56+
return;
57+
}),
58+
});
59+
60+
export type ExperimentServerRouter = typeof appRouter;
61+
62+
const server = createHTTPServer({
63+
router: appRouter,
64+
});
65+
66+
server.listen(flags.port);

0 commit comments

Comments
 (0)