@ftge/use-arena-screensaver
TypeScript icon, indicating that this package has built-in type declarations

1.3.8 • Public • Published

useArenaScreensaver 🌐

A simple hook that will overlay a screensaver of images from an are.na 🌐 channel when users of your site become idle.

Usage

Installation 🌱

npm i use-arena-screensaver

or

yarn add use-arena-screensaver

Importing

import useArenaScreensaver from 'use-arena-screensaver'

Options

option type description example
timeout number Time a user needs to be idle on site before screensaver becomes active 1000 * 60 * 2
timeBetween number Time between images appearing once screensaver is active 500
arenaSlug string Slug of the are.na channel you want the screensaver to pull from things-i-saved-to-my-camera-roll
backgroundOpacity number how dark the background tint should be 0.4

Example

Using this channel that has the slug rocks-xxbfv_ntyau

import useArenaScreensaver from 'use-arena-screensaver';

function App() {
  useArenaScreensaver({ arenaSlug: "rocks-xxbfv_ntyau", timeout: 1000 * 60 * 5 });
  return (
    ...
  );
}

Screen Shot 2022-05-16 at 4 48 55 PM

Package Sidebar

Install

npm i @ftge/use-arena-screensaver

Weekly Downloads

9

Version

1.3.8

License

MIT

Unpacked Size

51.8 kB

Total Files

41

Last publish

Collaborators

  • ftge