KinoraSDK
  • Overview
  • Quickstart
  • Contracts
  • Subgraphs
  • Open Source Code
  • SDK Reference
    • Envoker
      • Instantiate Envoker
      • Instantiate New Quest
      • Terminate & Withdraw
      • Delete Quest
      • Verify Player Milestone
    • Dispatch
      • Instantiate Dispatch
      • Join Quest
      • Milestone Eligibility Check
      • Complete Milestone
    • Kinora Player Wrapper
      • Kinora Provider
      • Kinora Player Wrapper
      • Send Metrics On-Chain
    • Helpers
  • Live
    • Quest No Code
    • Cypher Search
    • Chromadin
  • Architecture
    • Data Corruption Mitigation
  • Resources
    • Issues
    • Testing
    • Contributors
    • About the Devs
    • Storefront
  • Github
  • Livepeer Developer Docs
Powered by GitBook
On this page
  • Install the SDK
  • Envoker
  • Dispatch
  • Kinora Player Wrapper

Quickstart

The Quickest Route to Getting Started.

PreviousOverviewNextContracts

Last updated 1 year ago

Install the SDK

# Install via NPM
npm i kinora-sdk
# Install via yarn
yarn add kinora-sdk

import { Envoker } from "kinora-sdk";

const apolloClient = new ApolloClient({
  link: new HttpLink({ uri: 'https://api-v2.lens.dev/' }),
  headers: {
    "x-access-token": `Bearer ${authToken}`,
  },
  cache: new InMemoryCache(),
});

const polygonProvider = new ethers.providers.JsonRpcProvider(
    "https://polygonprovider.com",
    137,
  );

const newEnvoker = new Envoker({
    authedApolloClient: client,
    wallet: new ethers.Wallet(process.env.ENVOKER_PRIVATE_KEY, polygonProvider)
});

const { postId, factoryId, questId, transactionHash, factoryQuestData } = await newEnvoker.instantiateNewQuest({
  factoryId: 0,
  questDetails: {
    title: "Chromadin Chronicle",
    description: "Engage in a Chromadin video binge session for Season 1 and Season 2 of The Dial Pirate Radio . Interactions, mirrors and comments on episodes accrue bonus points.",
    cover: "ipfs://QmQk9TqFivUqc6ktosoZVVih9o1uiY3r5Z7F3GCC1FpaJS", 
    },
  maxPlayerCount: 100, 
  milestones,
  joinQuestTokenGatedLogic: tokenGatedLogic,
});
import { Dispatch } from "kinora-sdk";

const apolloClient = new ApolloClient({
  link: new HttpLink({ uri: 'https://api-v2.lens.dev/' }),
  headers: {
    "x-access-token": `Bearer ${authToken}`,
  },
  cache: new InMemoryCache(),
});

const polygonProvider = new ethers.providers.JsonRpcProvider(
    "https://polygonprovider.com",
    137,
  );

const newDispatch = new Dispatch({
    playerAuthedApolloClient: client
});

await newDispatch.playerJoinQuest(
    postId,
    new ethers.Wallet(process.env.PLAYER_PRIVATE_KEY, polygonProvider));
import { Player } from "@livepeer/react";
import dynamic from "next/dynamic";
import { useWalletClient } from 'wagmi';
import { KinoraProvider, KinoraPlayerWrapper } from "kinora-sdk";
import { apolloClient } from "../../lib/lens/client";
import { createReactClient, studioProvider, LivepeerConfig,} from "@livepeer/react";

const livepeerClient = createReactClient({
  provider: studioProvider({
    apiKey: process.env.LIVEPEER_STUDIO_KEY!,
  }),
});
 
function App() {
  return (
    <LivepeerConfig client={livepeerClient}>
      <KinoraProvider playerAuthedApolloClient={apolloClient}>
        <Component {...pageProps} />
      </KinoraProvider>
    </LivepeerConfig>
  )
}


function Page() {

return (
  <div id="parentId" className="w-20 h-20 flex">
    <KinoraPlayerWrapper
      parentId={"parentId"}
      postId={postId}
      customControls={true}
      fillWidthHeight={true}
      >
      {(setMediaElement: (node: HTMLVideoElement) => void) => (
        <Player
         mediaElementRef={setMediaElement}
         playbackId="f5eese9wwl88k4g8"
         objectFit="cover"
         />
       )}
    </KinoraPlayerWrapper>
   </div>
  );
}

Envoker
Dispatch
Kinora Player Wrapper