Skip to content

Instantly share code, notes, and snippets.

@tangert

tangert/Renderer.sol

Last active January 13, 2022 19:35
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save tangert/1eceaf04f2877d84fb0e10681b39d7e3 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save tangert/1eceaf04f2877d84fb0e10681b39d7e3 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. tangert revised this gist Jan 7, 2022. No changes.
  2. tangert created this gist Jan 7, 2022.
    28 changes: 28 additions & 0 deletions Renderer.sol
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,28 @@
    pragma solidity ^0.8.0;

    import "hardhat/console.sol";
    import "@openzeppelin/contracts/utils/Strings.sol";

    contract Renderer {
    constructor() {
    console.log("Deploying render test");
    }

    function render() public view returns (string memory) {
    string memory ownerAddress = Strings.toHexString(
    uint256(uint160(msg.sender))
    );

    return
    string(
    abi.encodePacked(
    '<svg xmlns="http://www.w3.org/2000/svg" width="360" height="360">',
    '<rect x="0" y="0" width="100%" height="100%" fill="blue"></rect>',
    '<text x="20" y="40" fill="white" font-size="20px">',
    ownerAddress,
    "</text>",
    "</svg>"
    )
    );
    }
    }
    48 changes: 48 additions & 0 deletions server.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,48 @@
    // Extremely naive implementation of "hot reloading" (basically just autorefreshing) a web server that compiles a solidity contract with Hardhat, then outputs the rendered string into HTML.

    // This file should be placed into the "scripts" folder inside of your standard Hardhat project.

    const express = require('express')
    const hre = require('hardhat')

    const app = express()

    app.get('/', async (_, res) => {
    try {
    // will recompile if there are changes
    await hre.run('compile')

    // Grab SVG content from renderer
    const Renderer = await hre.ethers.getContractFactory('Renderer')
    const renderer = await Renderer.deploy()
    await renderer.deployed()
    const toRender = await renderer.render()

    // Will refresh every 1 second
    res.send(`
    <html>
    <head>
    <meta http-equiv="refresh" content="1">
    </head>
    <body>
    ${toRender}
    </body>
    <style>body{margin:0;padding:0;}</style>
    </html>
    `)
    } catch (e) {
    // in case you grab compiler errors
    res.send(`
    <html>
    <head>
    <meta http-equiv="refresh" content="1">
    </head>
    ${e}
    </html>
    `)
    }
    })

    app.listen(3000, () => {
    console.log('server started')
    })