overwolf-hooks
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.1 • Public • Published

    Overwolf Hooks

    Custom hooks to help use overwolf api with the new react hooks technology.

    NPM JavaScript Style Guide

    Install

    npm install --save overwolf-hooks

    How to use

    Hooks

    1. useWindow.tsx
    import { useWindow } from 'overwolf-hooks'
    
    const Panel = () => {
    
    const [desktopWindow] = useWindow("desktop", { displayLog: true });
    
    return (
        <div>
          <h1>Desktop Window</h1>
          <button onClick={()=> desktopWindow?.minimize()}>Minimize</button>
          <button onClick={()=> desktopWindow?.restore()}>Restore</button>
          <button onClick={()=> desktopWindow?.maximize()}>Maximize</button>
          <button onClick={()=> desktopWindow?.close()}>Close</button>
        </div>
      )
    }
    1. useDrag.tsx
    import { useEffect, useCallback } from "react";
    import { useDrag, useWindow } from 'overwolf-hooks'
    
    const Header = () => {
    
    const [desktopWindow] = useWindow("desktop", { displayLog: true });
    const { onDragStart, onMouseMove, setCurrentWindowID } = useDrag(null, { displayLog: true });
    
    const updateDragWindow = useCallback(() => {
      if (desktopWindow?.id) setCurrentWindowID(desktopWindow.id);
    }, [desktopWindow, setCurrentWindowID]);
    
    useEffect(updateDragWindow, [updateDragWindow])
    
    return (
        <header
          onMouseDown={event => onDragStart(event)}
          onMouseMove={event => onMouseMove(event)}>
            Header Text
        </header>
      )
    }
    1. useGameEventProvider.tsx
    import { useEffect } from "react";
    import { useGameEventProvider } from 'overwolf-hooks'
    
    const Overlay = () => {
    
    const [{ event, info }, setGameFeatures] = useGameEventProvider<
        GameExample.Info, //change with your GAME INTERFACE <OPTIONAL>
        GameExample.Event //change with your GAME INTERFACE <OPTIONAL>
      >({ displayLog: true });
    
      useEffect(() => {
        console.info("event", event); // or use https://github.com/AlbericoD/overwolf-modern-react-boilerplate#-remote-redux-debug
      }, [event]);
    
      useEffect(() => {
        console.info("info", info); // or use https://github.com/AlbericoD/overwolf-modern-react-boilerplate#-remote-redux-debug
      }, [info]);
    
    return <p>Overlay Window</p>
    
    }
    1. useRunningGame.tsx
    import { useEffect } from "react";
    import { useGameEventProvider } from 'overwolf-hooks'
    
    const Alert = () => {
    
      const [currentGame] = useRunningGame({ displayLog: true });
    
      useEffect(() => {
        console.info("currentGame", currentGame);
      }, [currentGame]);
    
    return <p>Alert Window</p>
    
    }

    License

    MIT © AlbericoD

    Keywords

    none

    Install

    npm i overwolf-hooks

    DownloadsWeekly Downloads

    35

    Version

    2.0.1

    License

    MIT

    Unpacked Size

    138 kB

    Total Files

    41

    Last publish

    Collaborators

    • alberico