jchudzynski/Faucet.html

## Faucet.html
<html>
    <head>
        <script
          src="https://code.jquery.com/jquery-3.6.0.slim.min.js"
          integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI="
          crossorigin="anonymous">
        </script>
        <script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
        <script type="module">
          import { ethers } from "https://cdn.ethers.io/lib/ethers-5.2.esm.min.js";
          var contract
          // A Web3Provider wraps a standard Web3 provider, which is
          // what MetaMask injects as window.ethereum into each page
          const provider = new ethers.providers.Web3Provider(window.ethereum)

          // MetaMask requires requesting permission to connect users accounts
          provider.send("eth_requestAccounts", []).then(handleAccountsChanged)
          .catch((err) => {
            console.log("Error:")
            console.log(err);
          })

          const abi = [{
            "stateMutability": "payable",
            "type": "fallback"
          },
          {
            "stateMutability": "payable",
            "type": "receive"
          },
          {
            "inputs": [
              {
                "internalType": "address payable",
                "name": "requestor",
                "type": "address"
              }
            ],
            "name": "requestTokens",
            "outputs": [],
            "stateMutability": "nonpayable",
            "type": "function"
          },
          {
            "inputs": [],
            "name": "getBalance",
            "outputs": [
              {
                "internalType": "uint256",
                "name": "",
                "type": "uint256"
              }
            ],
            "stateMutability": "view",
            "type": "function"
          }
        ];

        function handleAccountsChanged() {
        // The MetaMask plugin also allows signing transactions to
        // send ether and pay to change state within the blockchain.
        // For this, you need the account signer...
          const signer = provider.getSigner()
          contract = new ethers.Contract('0xFb89cc197F1e936D40048f4F524fE4Fb38a71bbC', abi, signer)
          displayBalance()
        }

        async function displayBalance() {
          let balance = await contract.getBalance()
          $("#balance").text(balance.toString())
        }

        function requestEther() {

          let address = $("#address").val()
          console.log("Ether Requested" + address)
          contract.requestTokens(address).then((response)=>{ console.log(response) }).catch((err)=>{console.log(err)})
        }

        $("#submitButton").click(requestEther)


    </script>
    </head>
    <body>
      <p>Balance:</p>
      <p id="balance"></p>
        <input type="text" id="address" placeholder="Your Address">
        <input type="button" id="submitButton" value="Request Ether">
    </body>
</html>
	<html>
	<head>
	<script
	src="https://code.jquery.com/jquery-3.6.0.slim.min.js"
	integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI="
	crossorigin="anonymous">
	</script>
	<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
	<script type="module">
	import { ethers } from "https://cdn.ethers.io/lib/ethers-5.2.esm.min.js";
	var contract
	// A Web3Provider wraps a standard Web3 provider, which is
	// what MetaMask injects as window.ethereum into each page
	const provider = new ethers.providers.Web3Provider(window.ethereum)

	// MetaMask requires requesting permission to connect users accounts
	provider.send("eth_requestAccounts", []).then(handleAccountsChanged)
	.catch((err) => {
	console.log("Error:")
	console.log(err);
	})

	const abi = [{
	"stateMutability": "payable",
	"type": "fallback"
	},
	{
	"stateMutability": "payable",
	"type": "receive"
	},
	{
	"inputs": [
	{
	"internalType": "address payable",
	"name": "requestor",
	"type": "address"
	}
	],
	"name": "requestTokens",
	"outputs": [],
	"stateMutability": "nonpayable",
	"type": "function"
	},
	{
	"inputs": [],
	"name": "getBalance",
	"outputs": [
	{
	"internalType": "uint256",
	"name": "",
	"type": "uint256"
	}
	],
	"stateMutability": "view",
	"type": "function"
	}
	];

	function handleAccountsChanged() {
	// The MetaMask plugin also allows signing transactions to
	// send ether and pay to change state within the blockchain.
	// For this, you need the account signer...
	const signer = provider.getSigner()
	contract = new ethers.Contract('0xFb89cc197F1e936D40048f4F524fE4Fb38a71bbC', abi, signer)
	displayBalance()
	}

	async function displayBalance() {
	let balance = await contract.getBalance()
	$("#balance").text(balance.toString())
	}

	function requestEther() {

	let address = $("#address").val()
	console.log("Ether Requested" + address)
	contract.requestTokens(address).then((response)=>{ console.log(response) }).catch((err)=>{console.log(err)})
	}

	$("#submitButton").click(requestEther)


	</script>
	</head>
	<body>
	<p>Balance:</p>
	<p id="balance"></p>
	<input type="text" id="address" placeholder="Your Address">
	<input type="button" id="submitButton" value="Request Ether">
	</body>
	</html>