# Verify

The library can be downloaded here: {{ link }}

Full working example can be downloaded here: {{ link }}

{% hint style="info" %}
This template require http protocol to work properly or you may get a CORS Policy error.\
To test locally, a server (wamp, node server etc) is required to access the index.html through http(s):// and not file:///C:/...
{% endhint %}

**First, you need to create an html page and include the library call:**&#x20;

```
<script src="assets/js/signchain-signer.min.js"></script>
```

**To init the library you need to do the following at the start of your javascript code:**

```
let network = "T" // W for mainnet, T for testnet
let Signchain = new window.signchain(network)
```

**HTML EXAMPLE**

```
<!DOCTYPE html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Verification</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="assets/css/bs.css">
    <link rel="stylesheet" href="assets/css/style.css">
  </head>
  <body>
    <div class="container">
      <div class="row">

        <div class="col-lg-12 mt-4">
          <div class="mb-4">
            School address:<br/><strong class="address">3MvujUZTtoANRzrKYKzx99Vtb9TUh6VPCDm</strong>
          </div>
          <div class="wrapper mt-4">
            <h2>Verify</h2>
            <div class="mb-4">
              <input type="file" id="selectFileVerify" />
              <div id="fileInfosVerify" class="mt-2"></div>
            </div>
            <button id="verify" class="btn btn-primary">VERIFY</button>
            <!-- Result go in #resultVerify -->
            <div id="resultVerify" class="mt-2"></div>
          </div>
        </div>

      </div>
  </div>
  <script src="assets/js/signchain-signer.min.js"></script>
  <script src="assets/js/widget.js"></script>
  </body>
</html>
```

**JAVASCRIPT EXAMPLE**

```
let network = "T" // W for mainnet, T for testnet
let explorerHost = network == "T" ? "https://testnet.wavesexplorer.com" : "https://wavesexplorer.com"
let verifyAddress = "3MvujUZTtoANRzrKYKzx99Vtb9TUh6VPCDm"
let Signchain = new window.signchain(network)
let storeDataVerify = null

// ADD THE LISTENER TO YOUR VERIFY INPUT FIELD
document.getElementById("selectFileVerify").addEventListener("change", async function (event) {

  if(event.target.files[0]){

    let file = event.target.files[0]
    await Signchain.hash(file, function (res) {
      storeDataVerify = res;
      document.getElementById("fileInfosVerify").innerHTML = "Sha256 file hash: " + storeDataVerify.hash
    });

  }else{

    document.getElementById("fileInfosVerify").innerHTML = ""
    storeDataVerify = null;
    
  }

});

// ADD VERIFICATION CLICK EVENT ON VERIFY BUTTON
document.getElementById("verify").addEventListener("click", async function (e) {

  let template
  document.getElementById("resultVerify").innerHTML = ""
  let checkData = await Signchain.verify(storeDataVerify.hash, verifyAddress)
  
  if(checkData.valid){
    let certificationDate = JSON.parse(checkData.data[0].value).timestamp

    template = `
    <div class="p-4">
      <strong class="valid">Certification valid</strong>
      and certified on ${new Date(certificationDate)} 
      <a href="${explorerHost+'/tx/'+checkData.data[0].txid}" target="_blank">See on the Blockchain</a>
    </div>
    `

  }else{
    template = `<strong class="invalid">Certification not found</strong>`
  }

  document.getElementById("resultVerify").innerHTML = template;

})


```

**There is 4 important elements in the HTML example:**

```
<input type="file" id="selectFileVerify" />
<div id="fileInfosVerify" class="mt-2"></div>
<button id="verify" class="btn btn-primary">VERIFY</button>
<div id="resultVerify" class="mt-2"></div>
```

If you change the identifiants (css ids) of these elements, you will have to also change it in the javascript example.

**EDIT THE RESULT**

To edit the result, simply change the html of the variable "template" in the javascript example:

```
template = `
    <div class="p-4">
      <strong class="valid">Certification valid</strong>
      and certified on ${new Date(certificationDate)} 
      <a href="${explorerHost+'/tx/'+checkData.data[0].txid}" target="_blank">See on the Blockchain</a>
    </div>
    `
```
