Loaders are transformations that are applied to the source code of a module or a script. They allow you to pre-process files or html with javascript inside as you import or “load” them. Thus, loaders are kind of like “tasks” in other build tools and provide a powerful way to handle front-end build steps.
The idea is to download a JS programm and run it native locally in a runtime browser (webview2) with some modifications in it, based on a script you deliver before. I call this a multiple deployment as a fixture:
const
SINWAVES2URL= 'https://raw.githack.com/maxkleiner/maXbox4/master/assets/sinwavesjs.html';
aMS:= TMemoryStream.Create;
try
HttpGet(SINWAVES2URL, amS)
writeln('urlcontent size: '+itoa((ams.size)));
aMS.Seek(0, 0);
memoHTML.lines.loadfromstream(aMs);
//javascript fixture_
memoHTML.text:= StringReplace(memoHtml.text,'frequency = 20;','frequency = 30;',[rfReplaceAll]);
memoHTML.text:= StringReplace(memoHtml.text,'Sine Wave</h3>','Sine Wave F30</h3>',[rfReplaceAll]);
navigatetoString(memoHTML.text);
finally
aMS.Free
end;
For example, you can use loaders to tell a website to load a CSS with javascript file and to modify parameters in JavaScript before you run it in a local browser webview2.
Loaders can be chained. Each loader in the chain applies transformations to the processed resource for example load the url as a stream in a memo with lines, modify two parameters (frequency and title in our example) an run it with navigatetoString(memoHTML.text); on a browser:
with TEdgeViewForm.create(self) do begin
PageControl1.ActivePageIndex := 1;
edit1.text:= SINWAVES2URL;
aMS:= TMemoryStream.Create;
try
HttpGet(SINWAVES2URL, amS)
writeln('urlcontent size: '+itoa((ams.size)));
aMS.Seek(0, 0);
memoHTML.lines.loadfromstream(aMs);
//javascript fixture_
memoHTML.text:= StringReplace(memoHtml.text,'frequency = 20;','frequency = 30;',[rfReplaceAll]);
memoHTML.text:= StringReplace(memoHtml.text,'Sine Wave</h3>','Sine Wave F30</h3>',[rfReplaceAll]);
navigatetoString(memoHTML.text);
finally
aMS.Free
end;
showmodal
free;
end;
Top comments (0)