ORE ID Web Widget Popup

Popup Web User Experience for ORE ID

This library can be used in any web application. However, if you are using React, you should use the React alternative to this library instead oreid-react.

Overview

This library works with oreid-js to provide a web pop-up user experince for common ORE ID flows - like logging-in and signing a transaction

Start a flow by triggering the user popup:

``
oreid.popup.auth({
provider: 'google'
})
.then(onSuccess)
.catch(onError);
`

This will launch a pop-up. When the user finishes the flow, the onError or onSuccess callback will be called.

This library works with oreid-js to save a users' accessToken after login to LocalStorage as well as perform other housekeeping functions.

Important

- This library must be used within browser or a web wrapper component that has a window object
- The auth login flow should be triggered by the user clicking on a button, link, or some other item that causes an Event. This will help get around pop-up blockers

Installation

`
npm install oreid-js oreid-webwidget
`

or

`
yarn add oreid-js oreid-webwidget
`

Sample Code

$3

`ts
import { OreId } from 'oreid-js'
import { WebWidget } from 'oreid-webwidget'

// Initialize libraries
const oreId = new OreId({ appId, apiKey, plugins:{ popup: WebWidget() }});
oreId.init().then(
// oreid is ready
)
`

$3

`html
import { oreId, isInitialized } from "./bootstrap";


Auth
`

$3

`html
import { oreId, isInitialized } from "./bootstrap";


Sign Transaction
`

$3

`html
import { oreId, isInitialized } from "./bootstrap";


Create New Chain Account
`

$3



Initialize oreid-js once and pass the single instance around within your app. You can use a pattern like the one below .

`ts
// bootstrap.ts
import { OreId } from "oreid-js";

export let oreId: OreId;
export let isInitialized: boolean = false;
const appId = "MY_APP_ID";

// Initialize libraries
() => {
if(initialized) return;
oreId = new OreId({ appId, plugins:{ popup: WebWidget() }}); // apiKey is required for some features
oreId.init().then(() => {
// webwidget is ready to use
isInitialized = true
})
}();
``