<div>
  <script src="https://d3ah8o189k1llu.cloudfront.net/oneschema-filefeeds-0.1.latest.min.js"></script>
  <style>
  .oneschema-iframe {
    width: 100vw;
    height: 100vh;
    border: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1000;
  }
  </style>
  <script type="text/javascript">
/*
 * If you would like to use this sample in a JavaScript file as part of your
 * build you can install the npm package '@oneschema/filefeeds', copy this
 * sample into a new file, and add this import statement:
 * import oneschemaFileFeeds from '@oneschema/filefeeds'
 */
    const userJwt = "<USER_JWT>" // See "Authorization (using JWT)" page
    
    const importer = oneschemaFileFeeds({
      userJwt: userJwt,
      devMode: false,
    })

    function launchOneSchema() {
      importer.launch()

/**
 * This event is triggered after the iframe page is launched and is
 * ready to use.
 *
 * The `data` argument contains the file_feed_id and session_id values,
 * which can be used to identify the FileFeeds or Session for future
 * references.
 */
      importer.on("launch", (data) => {
        // TODO: handle launch
        console.log(data)
      })

/**
 * This event is triggered when the user hits the [ Save transforms ]
 * button.
 * 
 * The embedding page is expected to hide the iframe at this point.
 *
 * This event ends the current session. See "Authorization (using JWT)"
 * page on how to authorize creation of new sessions.
 *
 * The `data` argument contains details of the "Sample Files" uploaded
 * by the user, and their status (number of errors) in respect to the
 * transforms defined in the FileFeeds.
 */
      importer.on("save", (data) => {
        // TODO: handle save
        console.log(data)
      })

/**
 * This event is triggered when the user hits the [ Cancel ] button.
 *
 * The embedding page is expected to hide the iframe at this point.
 *
 * This event does NOT end the current session. However, if a new session
 * was created, then a new `userJwt` string will be needed to authorize
 * access to continue this session.
 */
      importer.on("cancel", () => {
        // TODO: handle cancel
      })

 /**
  * This event is triggered when the embedding faces unresolvable errors
  * and a new launch might be necessary to recover.
  */
      importer.on("error", (message) => {
        // TODO: handle errors
        console.log(message)
      })
    }
  </script>

  <button onclick="launchOneSchema()">Launch embed</button>
</div>