BetterYTM-Mirror/assets

Asset formats explained

Images:

• Own PNG/JPG/GIF images are stored in assets/images
• External images are stored in assets/images/external
• The BYTM logo files are in assets/images/logo
• SVG icons are stored in assets/icons
• CSS stylesheets are in assets/style
• Translations are in assets/translations

JSON file formats:

[!NOTE]
Note: If a property is followed by a question mark, that means it is optional

locales.json

This file contains a definition of the available locales and translations.
The keys of the object are the locale codes, and the values are the locale objects, with the following properties:

Property	Type	Description
name	string	The name of the locale in the locale's language
nameEnglish	string	The name of the locale in English
emoji	string	The flag emoji of the locale
userscriptDesc	string	The description of the userscript in the locale's language
authors	string[]	The authors of the translations

plugins.json

(Not implemented yet. As soon as a plugin is added, this needs to be fleshed out)

resources.json

This file contains the resources that are loaded into the runtime through the @resource userscript directive.
That includes all icons, images, CSS files, fonts, translations and other assets.

Inside the file is an object, whose keys are the resource names and the values are the path to the resource or a configuration object.
The path to the resource can be relative, in which case it's resolved relative to the assets directory.
If it starts with a slash, it will be resolved relative to the project root (where package.json is).

All values will be run through the function resolveResourceVal() in src/tools/post-build.ts to replace placeholders with dynamic values.
For example, $BRANCH will be replaced with the branch name. Find all possible replacements in that function's declaration.

The configuration object can have the following properties: | Property | Type | Description | | :------- | :------- | :----------------------- | | path | string | The path to the resource | | ref? | string | The GitHub ref to use for the resource, e.g. main, a Git tag like v2.0.0 or a commit hash - defaults to the branch resolved in src/tools/post-build.ts |

require.json

This file contains the npm libraries that are loaded into the runtime through the @require userscript directive.
This is done to massively reduce the bundle size and make use of the userscript extension's caching.
Each library will be set as an external in the Rollup configuration to prevent it from including it in the bundle.
The version of each package will be inferred from package.json to ensure consistent versions across the project.

Inside the file is an array of objects, which each have one of the following properties:

Using npm packages through a CDN: | Property | Type | Description | | :--------- | :-------- | :---------------------------------------------------------------------------------- | | pkgName | string | The name of the npm package, as in npm i <pkgName> | | path | string | The path to the file that should be loaded, relative to the library root dir | | global | string | The name of the global variable that the library exports | | baseUrl? | string | Base URL of the CDN to use - https://cdn.jsdelivr.net/npm/ by default - package will be appended as pkgName@versionFromPkgJson | | link? | boolean | Whether npm link is active and the library should be force-included in the bundle |

Using a direct URL: | Property | Type | Description | | :------- | :-------- | :---------------------------------------------------------------------------------- | | url | string | URL to the file to include | | global | string | The name of the global variable that the library exports | | link? | boolean | Whether npm link is active and the library should be force-included in the bundle |