node: added url support to loadFile (#6507)

This commit is contained in:
FloVanGH 2024-10-10 11:43:32 +00:00 committed by GitHub
parent be2af11a08
commit f01ac8fc39
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 95 additions and 89 deletions

View file

@ -57,7 +57,7 @@ Combining these two steps leads us to the obligatory "Hello World" example:
```js
import * as slint from "slint-ui";
let ui = slint.loadFile(".ui/main.slint");
let ui = slint.loadFile(new URL(".ui/main.slint", import.meta.url));
let main = new ui.Main();
main.run();
```
@ -94,7 +94,7 @@ an object which allow to initialize the value of public properties or callbacks.
import * as slint from "slint-ui";
// In this example, the main.slint file exports a module which
// has a counter property and a clicked callback
let ui = slint.loadFile("ui/main.slint");
let ui = slint.loadFile(new URL("ui/main.slint", import.meta.url));
let component = new ui.MainWindow({
counter: 42,
clicked: function() { console.log("hello"); }
@ -135,7 +135,7 @@ The callbacks in Slint are exposed as properties in JavaScript and that can be c
```js
import * as slint from "slint-ui";
let ui = slint.loadFile("ui/my-component.slint");
let ui = slint.loadFile(new URL("ui/my-component.slint", import.meta.url));
let component = new ui.MyComponent();
// connect to a callback
@ -168,7 +168,7 @@ If the function is marked `public`, it can also be called from JavaScript.
```js
import * as slint from "slint-ui";
let ui = slint.loadFile("ui/my-component.slint");
let ui = slint.loadFile(new URL("ui/my-component.slint", import.meta.url));
let component = new ui.MyComponent();
// call a public function
@ -297,7 +297,7 @@ export component MyComponent inherits Window {
import * as slint from "slint-ui";
let ui = slint.loadFile("my-component.slint");
let ui = slint.loadFile(new URL("my-component.slint", import.meta.url));
let component = new ui.MyComponent();
// object literal
@ -333,7 +333,7 @@ export component MyComponent inherits Window {
import * as slint from "slint-ui";
let ui = slint.loadFile("my-component.slint");
let ui = slint.loadFile(new URL("my-component.slint", import.meta.url));
let component = new ui.MyComponent();
// set enum value as string

View file

@ -605,7 +605,7 @@ function loadSlint(loadData: LoadData): Object {
* main.greeting = "Hello friends";
* ```
*
* @param filePath The path to the file to load. Relative paths are resolved against the process' current working directory.
* @param filePath The path to the file to load as `string` or `URL`. Relative paths are resolved against the process' current working directory.
* @param options An optional {@link LoadFileOptions} to configure additional Slint compilation settings,
* such as include search paths, library imports, or the widget style.
* @returns Returns an object that is immutable and provides a constructor function for each exported Window component found in the `.slint` file.
@ -614,9 +614,13 @@ function loadSlint(loadData: LoadData): Object {
* For further information on the available properties, refer to [Instantiating A Component](../index.html#md:instantiating-a-component).
* @throws {@link CompileError} if errors occur during compilation.
*/
export function loadFile(filePath: string, options?: LoadFileOptions): Object {
export function loadFile(
filePath: string | URL,
options?: LoadFileOptions,
): Object {
const pathname = filePath instanceof URL ? filePath.pathname : filePath;
return loadSlint({
fileData: { filePath, options },
fileData: { filePath: pathname, options },
from: "file",
});
}

View file

@ -18,9 +18,7 @@
"organizeImports": { "enabled": false },
"linter": {
"enabled": true,
"ignore": [
"api/node/docs/assets/**"
],
"ignore": ["api/node/docs/assets/**"],
"rules": {
"recommended": false,
"complexity": {
@ -34,7 +32,7 @@
"useImportType": "error",
"useNodejsImportProtocol": "error"
},
"suspicious": {
"suspicious": {
"noDoubleEquals": "error",
"noRedundantUseStrict": "warn",
"noImplicitAnyLet": "error"

View file

@ -31,7 +31,7 @@ in a [`slint::VectorModel`](https://slint.dev/docs/cpp/api/classslint_1_1vectorm
Change `main.js` to the following:
:::{literalinclude} main_tiles_from_js.js
:lines: 6-21
:lines: 6-23
:::
The code takes the list of tiles, duplicates it, and shuffles it, accessing the `memory_tiles` property through the JavaScript code.

View file

@ -83,7 +83,7 @@ a player can't click anything during this time.
Insert this code before the `mainWindow.run()` call:
:::{literalinclude} main_game_logic.js
:lines: 23-63
:lines: 24-57
:::
::::

View file

@ -1,48 +1,43 @@
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
// main.js
import * as slint from "slint-ui";
let ui = slint.loadFile("./memory.slint");
let mainWindow = new ui.MainWindow();
const ui = slint.loadFile(new URL("./memory.slint", import.meta.url));
const mainWindow = new ui.MainWindow();
let initial_tiles = mainWindow.memory_tiles;
let tiles = initial_tiles.concat(initial_tiles.map((tile) => Object.assign({}, tile)));
const initial_tiles = mainWindow.memory_tiles;
const tiles = initial_tiles.concat(
initial_tiles.map((tile) => Object.assign({}, tile)),
);
for (let i = tiles.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * i);
[tiles[i], tiles[j]] = [tiles[j], tiles[i]];
}
let model = new slint.ArrayModel(tiles);
const model = new slint.ArrayModel(tiles);
mainWindow.memory_tiles = model;
// ANCHOR: game_logic
mainWindow.check_if_pair_solved = function () {
let flipped_tiles = [];
const flipped_tiles = [];
tiles.forEach((tile, index) => {
if (tile.image_visible && !tile.solved) {
flipped_tiles.push({
index,
tile
tile,
});
}
});
if (flipped_tiles.length == 2) {
let {
tile: tile1,
index: tile1_index
} = flipped_tiles[0];
if (flipped_tiles.length === 2) {
const { tile: tile1, index: tile1_index } = flipped_tiles[0];
let {
tile: tile2,
index: tile2_index
} = flipped_tiles[1];
const { tile: tile2, index: tile2_index } = flipped_tiles[1];
let is_pair_solved = tile1.image.path === tile2.image.path;
const is_pair_solved = tile1.image.path === tile2.image.path;
if (is_pair_solved) {
tile1.solved = true;
model.setRowData(tile1_index, tile1);
@ -56,10 +51,9 @@ mainWindow.check_if_pair_solved = function () {
model.setRowData(tile1_index, tile1);
tile2.image_visible = false;
model.setRowData(tile2_index, tile2);
}, 1000)
}, 1000);
}
}
};
// ANCHOR_END: game_logic
await mainWindow.run();
await mainWindow.run();

View file

@ -5,8 +5,8 @@
// main.js
import * as slint from "slint-ui";
let ui = slint.loadFile("./ui/app-window.slint");
let mainWindow = new ui.MainWindow();
const ui = slint.loadFile(new URL("./ui/app-window.slint", import.meta.url));
const mainWindow = new ui.MainWindow();
await mainWindow.run();
// ANCHOR_END: main

View file

@ -4,18 +4,20 @@
// ANCHOR: main
// main.js
import * as slint from "slint-ui";
let ui = slint.loadFile("./ui/app-window.slint");
let mainWindow = new ui.MainWindow();
const ui = slint.loadFile(new URL("./ui/app-window.slint", import.meta.url));
const mainWindow = new ui.MainWindow();
let initial_tiles = mainWindow.memory_tiles;
let tiles = initial_tiles.concat(initial_tiles.map((tile) => Object.assign({}, tile)));
const initial_tiles = mainWindow.memory_tiles;
const tiles = initial_tiles.concat(
initial_tiles.map((tile) => Object.assign({}, tile)),
);
for (let i = tiles.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * i);
[tiles[i], tiles[j]] = [tiles[j], tiles[i]];
}
let model = new slint.ArrayModel(tiles);
const model = new slint.ArrayModel(tiles);
mainWindow.memory_tiles = model;
await mainWindow.run();

View file

@ -11,7 +11,7 @@ class Filter {
constructor(
name: string,
applyFunction: (image: slint.ImageData) => slint.ImageData
applyFunction: (image: slint.ImageData) => slint.ImageData,
) {
this.name = name;
this.applyFunction = applyFunction;
@ -44,10 +44,14 @@ class Filters extends slint.Model<string> {
}
}
const demo = slint.loadFile("../ui/main.slint") as any;
const demo = slint.loadFile(
new URL("../ui/main.slint", import.meta.url),
) as any;
const mainWindow = new demo.MainWindow();
const sourceImage = await Jimp.read("../assets/cat.jpg");
const sourceImage = await Jimp.read(
new URL("../assets/cat.jpg", import.meta.url).pathname,
);
mainWindow.original_image = sourceImage.bitmap;

View file

@ -4,43 +4,39 @@
import * as slint from "slint-ui";
let ui = slint.loadFile("memory.slint");
let window = new ui.MainWindow();
const ui = slint.loadFile(new URL("memory.slint", import.meta.url));
const window = new ui.MainWindow();
let initial_tiles = [...window.memory_tiles];
let tiles = initial_tiles.concat(initial_tiles.map((tile) => Object.assign({}, tile)));
const initial_tiles = [...window.memory_tiles];
const tiles = initial_tiles.concat(
initial_tiles.map((tile) => Object.assign({}, tile)),
);
for (let i = tiles.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * i);
[tiles[i], tiles[j]] = [tiles[j], tiles[i]];
}
let model = new slint.ArrayModel(tiles);
const model = new slint.ArrayModel(tiles);
window.memory_tiles = model;
window.check_if_pair_solved = function () {
let flipped_tiles = [];
const flipped_tiles = [];
tiles.forEach((tile, index) => {
if (tile.image_visible && !tile.solved) {
flipped_tiles.push({
index,
tile
tile,
});
}
});
if (flipped_tiles.length == 2) {
let {
tile: tile1,
index: tile1_index
} = flipped_tiles[0];
if (flipped_tiles.length === 2) {
const { tile: tile1, index: tile1_index } = flipped_tiles[0];
let {
tile: tile2,
index: tile2_index
} = flipped_tiles[1];
const { tile: tile2, index: tile2_index } = flipped_tiles[1];
let is_pair_solved = tile1.image.path === tile2.image.path;
const is_pair_solved = tile1.image.path === tile2.image.path;
if (is_pair_solved) {
tile1.solved = true;
model.setRowData(tile1_index, tile1);
@ -55,7 +51,6 @@ window.check_if_pair_solved = function () {
tile2.image_visible = false;
model.setRowData(tile2_index, tile2);
}, 1000);
}
}
};

View file

@ -4,13 +4,16 @@
import * as slint from "slint-ui";
let demo = slint.loadFile("../ui/printerdemo.slint");
let window = new demo.MainWindow();
const demo = slint.loadFile(
new URL("../ui/printerdemo.slint", import.meta.url),
);
const window = new demo.MainWindow();
window.ink_levels = [
{ color: "#00ffff", level: 0.30 },
{ color: "#ff00ff", level: 0.80 },
{ color: "#ffff00", level: 0.60 },
{ color: "#000000", level: 0.90 }];
{ color: "#00ffff", level: 0.3 },
{ color: "#ff00ff", level: 0.8 },
{ color: "#ffff00", level: 0.6 },
{ color: "#000000", level: 0.9 },
];
window.run();

View file

@ -3,17 +3,23 @@
// SPDX-License-Identifier: MIT
import * as slint from "slint-ui";
let demo = slint.loadFile("../ui/printerdemo.slint");
let window = new demo.MainWindow();
const demo = slint.loadFile(
new URL("../ui/printerdemo.slint", import.meta.url),
);
const window = new demo.MainWindow();
window.ink_levels = [
{ color: "#00ffff", level: 0.30 },
{ color: "#ff00ff", level: 0.80 },
{ color: "#ffff00", level: 0.60 },
{ color: "#000000", level: 0.90 }];
{ color: "#00ffff", level: 0.3 },
{ color: "#ff00ff", level: 0.8 },
{ color: "#ffff00", level: 0.6 },
{ color: "#000000", level: 0.9 },
];
window.fax_number_erase = function () {
window.fax_number = window.fax_number.substring(0, window.fax_number.length - 1);
window.fax_number = window.fax_number.substring(
0,
window.fax_number.length - 1,
);
};
window.fax_send = function () {
console.log("Send fax to " + window.fax_number);

View file

@ -4,47 +4,47 @@
import * as slint from "slint-ui";
let demo = slint.loadFile("../ui/todo.slint");
let app = new demo.MainWindow();
const demo = slint.loadFile(new URL("../ui/todo.slint", import.meta.url));
const app = new demo.MainWindow();
let model = new slint.ArrayModel([
const model = new slint.ArrayModel([
{
title: "Implement the .slint file",
checked: true
checked: true,
},
{
title: "Do the Rust part",
checked: false
checked: false,
},
{
title: "Make the C++ code",
checked: false
checked: false,
},
{
title: "Write some JavaScript code",
checked: true
checked: true,
},
{
title: "Test the application",
checked: false
checked: false,
},
{
title: "Ship to customer",
checked: false
checked: false,
},
{
title: "???",
checked: false
checked: false,
},
{
title: "Profit",
checked: false
checked: false,
},
]);
app.todo_model = model;
app.todo_added = function (text) {
model.push({ title: text, checked: false })
model.push({ title: text, checked: false });
};
app.remove_done = function () {