laive

Laive is the platform to broadcast a live streaming into Living Apps. The main goal is to generate the necessary keys to broadcast to a rtmp and build a hls stream to consum.

To use laive in your Living App you need to have a credentials to connect (To get more info contact us).

Events data model

The events are the data piece needed to schedule a live streaming into Laive.

event: {
  background: urlImage,
  ended: bool,
  hls: urlHls, // not abailable if the event !isPublic
  isPublic: bool, // false: the user need validate a ticker to get the hls url
  startAt: Date,
  thumbnail: urlImage,
  title: string,
  status: 'idle' // idle, live, ended
}

Laive service

Singleton service to consume lives into your Living App.

import { Laive } from 'laive'

const laiveService = Laive()

// get the events that are in live
// An event is consider in live 30 mins before start (event.startAt)
laiveService.getLiveEvents({ appName: 'testing' }).then(({ events }) => {
  console.log(events)
})

// used to validate tickets, use it to get the hls url with ticketing events
laiveService.validateTicket({ 
  appName: 'testing', 
  eventId: 'event123', 
  ticket: '123456', 
  adminCode: 'codeXXX' 
}).then(({ valid, hls: data.hls }) => {
  // valid truo | false
  // hls url to consume the video
})

// this method is to count a user as viewer 
laiveService.createPresence({ 
  appName: 'testing', 
  eventId: 'event123' 
})

// Cancel the previus presence
laiveService.createPresence()

// get the total amount of users are viewing the live
const countUsers = laiveService.countUsers({ appName: 'testing', eventId: 'event123' })

useLaive

To use laive service as singleton into react.

import react, { useEffect, useState } from 'react'
import { useLaive } from 'laive'


// SplashScreen.js
export const SplashScreen = () => {
  const { initLaiveService } = useLaive()
  useEffect(() => {
    // execute it oly one time into the app
    // then you will be able use the service in this screen or other one
    initLaiveService()
  }, [])

  return ...
}

// LandingScreen.js
export const LandingScreen = () => {
  const { laiveService } = useLaive()
  useEffect(() => {
    // use any laiveService method
    laiveService.countUsers({ appName: 'testing', eventId: 'event123' })
  }, [])

  return ...
}

BackOffice

Service used to manage (create, edit, delete) events.

import { BackOffice } from 'laive'

const backOfficeService = BackOffice({ FIREBASE_APP_NAME: 'living_app_name' })


backOfficeService.login({ email: '[email protected]', password: '123456' }).then(user => {
  user
})

backOfficeService.logout()

backOfficeService.createEvent({ backgroundFile, thumbnailFile, ...EventModel }).then(() => ...)
// backgroundFile and thumbnailFile are optional
backOfficeService.updateEvent = async ({ eventId, backgroundFile, thumbnailFile, ...EventModel }).then(() => ...)
backOfficeService.getEvent({ eventId }).then(event => ...)
// forceRecreate -> If the event has already create tickets use it to force recreate them
backOfficeService.setTicketingEvent({ eventId, length = 10, forceRecreate = false })
backOfficeService.getEventTickets({ eventId })