[Pas2js] Initial resource linking support added.

[Michael Van Canneyt]

Hello,

I have added initial support for resource linking.

This means that directives like

{$R *.html}

or

{$R left.png}

{$R right.png}

{$R up.png}

{$R down.png}


Will now actually do something.

The mechanism is pluggable, and the compiler currently supports 2 mechanisms:

- The resources are added to a javascript structure in the generated
   javascript.

- The resources are emitted to a file with html snippet.
   this will look like this:

     <link rel="preload" id="resource-testres" data-unit="consoledemo" href="data:text/html;base64,PGgzPlRlc3QgcmVzb3VyY2UgaW4gSFRNTDwvaDM+ClRoaXMgaXMgYSBtYWluIHByb2dyYW0gZmlsZSByZXNvdXJjZSBpbiBIVE1MLgo=" />
     <link rel="preload" id="resource-testb" data-unit="unitb" href="data:text/html;base64,PGgzPkhlbGxvIFJlc291cmNlIFdvcmxkIFBhcnQgQjwvaDM+CjxwPgpUaGlzIG1lc3NhZ2UgaXMgc2F2ZWQgaW4gYSByZXNvdXJjZSBmaWxlIChQYXJ0IEIpLgo8L3A+Cgo=" />
     <link rel="preload" id="resource-testa" data-unit="unita" href="data:text/html;base64,PGgzPkhlbGxvIFJlc291cmNlIFdvcmxkIFBhcnQgQTwvaDM+CjxwPgpUaGlzIG1lc3NhZ2UgaXMgc2F2ZWQgaW4gYSByZXNvdXJjZSBmaWxlIChQYXJ0IEEpLgo8L3A+Cgo=" />

   This html can be pasted into the HTML file of your project.
   Or the HTML snippet can be loaded dynamically.

In both cases, the resource is base64-encoded before including it.

Other mechanisms can probably be invented, but I thought the above 2 are the simplest and easiest.

There are 3 "bare bones" demoes:

Using javascript-embedded resources:

https://www.freepascal.org/~michael/pas2js-demos/resources/htmldemo.html

Using HTML <link> resources:

https://www.freepascal.org/~michael/pas2js-demos/resources/htmllinkdemo.html

Using dynamically loaded HTML <link> resources:

https://www.freepascal.org/~michael/pas2js-demos/resources/htmlloadlinkdemo.html

As you can see in these demoes, there is an API (unit p2jsres) for getting resource
information, as well as a calll to dynamically load the resources from the
compiler-generated snippet. The API is the same for both kind of resources,
this is transparant.

There is also a nodejs demo, but this one needs to be compiled from source
and run on your local machine.

This is just an initial implementation.

Planned:

- Support {$R *.res}
   This will need to extract the actual resources from the *.res file and add them separately to the JS/HTML.
   I only plan this for the native pas2js compiler, not yet for the javascript version.

- Add support in the Lazarus IDE to specify what resources you want to use,
   and automatically include the generated HTML snippet into the project HTML.

- Any suggestions you may have...

Enjoy !

Michael.