ISCN-AR Widget Reference

ISCN AR web widget API Reference

Base URL

Testnet: https://testnet.like.co/in/widget/iscn-ar

Production: https://like.co/in/widget/iscn-ar

Since postMessage() would be needed for operating this widget, caller is expected to use window.open on the above urls.

Input Params

Query strings are also passed into NFT Portal if user choose to mint NFT after ISCN is registered. Please refer to NFT Portal Reference for the supported query string.

PostMessage input format

Mark widget as ready

Send this action to switch widget to ready to accept mode.

{ action: 'INIT_WIDGET' }

Send ISCN Data

Submit ISCN data to widget

{
    action: 'SUBMIT_ISCN_DATA',
    data: {
      files: [
        {
          filename: 'index.html',
          mimeType: 'text/html',
          data: 'PCFET0NUWVBFIGh0bWw+PGh0bWw+Ci...',
        },
        {
          filename: 'wp-content/uploads/image.png',
          mimeType: 'image/png',
          data: 'iVBORw0KGgoAAAANSUhEUgAABAAAAA...',
        },
      ],
      metadata: {
        name: 'LikeCoin Update | Launching $LIKE Airdrop and Civic Likers Web3',
        tags: ['Airdrop', 'Civic Liker', 'Depub', 'LikeCoin', 'Progress Update'],
        author: 'likecoin',
        description: 'Launch of LikeCoin Airdrop The long-awaited 50 million...',
      }
    },
  }

Supported field for ISCN metadata

Required fields for data.files:

File data should be encoded in base64, with proper mimeType defined. filename can either be the actual filename, or include a directory path as prefix.

If multiple files are to be uploaded, an index.html must be included which would be shown as the default page when the files are accessed through Arweave or IPFS.

Emit event format

ISCN_WIDGET_READY

Fired when widget is ready to receive message

{ 
  action: 'ISCN_WIDGET_READY',
}

ARWEAVE_SUBMITTED

Fired when files are uploaded to Arweave and IPFS

{ 
  action: 'ARWEAVE_SUBMITTED',
  data: {
    ipfsHash,
    arweaveId,
  }
}

ISCN_SUBMITTED

Fired when content is submitted to ISCN

{ 
  action: 'ISCN_SUBMITTED',
  data: {
    tx_hash,
    iscnId,
  }
}
const w = window.open('https://like.co/in/widget/iscn-ar?opener=1&redirect_uri=https%3A%2F%2Flike.community');

const ISCN_WIDGET_ORIGIN = 'https://like.co';

function onPostMessage(event) {
  if (event.origin !== ISCN_WIDGET_ORIGIN) {
    return;
  }
  try {
    const { action, data } = JSON.parse(event.data);
    if (action === 'ISCN_WIDGET_READY') {
      w.postMessage(JSON.stringify({ action: 'INIT_WIDGET' }), ISCN_WIDGET_ORIGIN);
      sendISCNPayload();
    } else if (action === 'ARWEAVE_SUBMITTED') {
      const {
        ipfsHash, arweaveId,
      } = data;
      console.log(ipfsHash, arweaveId);
    } else if (action === 'ISCN_SUBMITTED') {
      const {
        tx_hash: txHash, iscnId,
      } = data;
      console.log(txHash, iscnId);
    } else {
      console.log(`Unknown event: ${action}`);
    }
  } catch (err) {
    console.error(err);
  }
}
window.addEventListener('message', onPostMessage, false);

function sendISCNPayload() {
  w.postMessage(JSON.stringify({
    action: 'SUBMIT_ISCN_DATA',
    data: {
      files: [
        {
          filename: 'index.html',
          mimeType: 'text/html',
          data: 'PCFET0NUWVBFIGh0bWw+PGh0bWw+Ci...',
          // bytes encoded in base64
        },
        {
          filename: 'wp-content/uploads/image.png',
          mimeType: 'image/png',
          data: 'iVBORw0KGgoAAAANSUhEUgAABAAAAA...',
        },
      ],
      metadata: {
        name: 'LikeCoin Update | Launching $LIKE Airdrop and Civic Likers Web3',
        tags: ['Airdrop', 'Civic Liker', 'Depub', 'LikeCoin', 'Progress Update'],
        author: 'likecoin',
        description: 'Launch of LikeCoin Airdrop The long-awaited 50 million...',
      }
    },

  }), ISCN_WIDGET_ORIGIN);
}

Interactive Demo

https://codesandbox.io/s/like-co-iscn-ar-demo-ynenq0?file=/pages/index.vue

Last updated