Requesting Dynamic HTML
ScriptyBuilder supports injecting dynamically created scripts between statically stored scripts.
If the scriptContent field of requests is not empty, then ScriptyBuilder will use scriptContent instead of fetching the script from a contract.
Inline Script Request
InlineScriptRequest[] memory requests = new InlineScriptRequest[](2);
requests[0].name = "three.js";
requests[0].contractAddress = scriptyStorageContractAddress;
requests[1].scriptContent = 'console.log("hello world!")';Wrapped Script Request
WrappedScriptRequest[] memory requests = new WrappedScriptRequest[](2);
requests[0].name = "three.js";
requests[0].contractAddress = scriptyStorageContractAddress;
requests[1].wrapType = 0;
requests[1].scriptContent = 'console.log("hello world!")';You can set different wrapping options for dynamically created scripts. For more about wrapping options please check here.
Example
Here we are requesting three.js and some generative art named cubes that depends on three.js. By itself, cubes script does nothing. A controller script is created with on-chain values and it initiates cubes script.
InlineScriptRequest[] memory requests = new InlineScriptRequest[](3);
requests[0].name = "three.js";
requests[1].name = "cubes";
// Calculate this off-chain:
uint256 bufferSizeForStoredScripts = 100000;
bytes memory controllerScript = abi.encodePacked(
'let cubes = new Cubes("',
LibString.toString(block.timestamp),
'");'
);
requests[2].scriptContent = controllerScript;
// New buffer size to cover dynamically
// created script
uint256 bufferSize = bufferSizeForStoredScripts + controllerScript.length;
bytes memory htmlFile = IScriptyBuilder(
scriptyBuilderAddress
).getHTMLInline(
requests,
controllerScript,
bufferSize
);When it's controllerScript becomes something like this:
let cubes = new Cubes("1671835245");Final output looks like this:
<html>
<body style='margin:0;'>
<script>
[three.js]
[cubes]
let cubes = new Cubes("1671835245");
</script>
</body>
</html>You can check this example(contract, deployment script) which uses dynamic script to generate HTML files.
Last updated