Giter Club home page Giter Club logo

sample-app's Introduction

Overwolf sample app

This repository contains sample apps that demonstrate some basic points and flows that are relevant when developing Overwolf apps:

  • The apps will launch automatically when a supported starts
  • Register to the overwolf.games.events API in order to receive real time events from the game.
  • Define a custom hotkey to be used in-game
  • Communication between the app windows according to our best practices

Sample app versions

This repository contains two variants of the sample app:

  • native - pure js version without any external js framework.
  • ts - typeScript version of the app, that uses external packages,etc.

In the future we will add more variants like React, Vue, etc.

How to load the app

Download from the store

It's highly recommended to follow the build steps for setting up the sample app, including downloading the source code and building it manually. For those who need it, we can provide a pre-built and pre-packaged version. Contact us at [email protected] for more details.

Load as unpacked extension.

You can load the native version of the sample app "as is", without any build process. Just download the repo and under Overwolf's settings, choose Support tab and then Development options. Click the Load unpacked button and choose the relevant folder of the native folder from the repository you just downloaded.

  • In order to load an app as "unpacked", you'll first have to be whitelisted as an Overwolf dev. More details on how to be whitelisted can be found here
  • To load the typescript version, first you should build it. More details on the readme page under the "ts" folder in this repo.

Notes

Editing the author or app name in the manifest will prevent loading the app as unpacked app.

For any further information or questions, contact [email protected]

sample-app's People

Contributors

anthornet avatar antonk777 avatar bl0n avatar dependabot[bot] avatar dudekiller82 avatar eransharv avatar itaygli avatar odeditkinow avatar omer-schapiro avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sample-app's Issues

Typescript version does not display game events and does not refresh info updates

Hello,
I've been trying the sample app (ts version) with Valorant v3.03 and it will not display any game events at all or will refresh any info updates. The only way to get info updates is if I relaunch the sample app after an update has happened.
For example when I die or get a kill in game nothing gets logged in either events or updates, but if I close the application and relaunch it through the package manager, while still in-game, I get the log entry (only as an update though, nothing on info).

This does not happen with the native version. The native one works as expected.

Can you please assist with this as I am trying to figure out for days what is the issue?

I have downloaded the sample application as is and all I have changed is the game Id and the interestingFeatures under ts/src/consts.ts

Calling minimize starts a process

Hey,

I think this is an issue:
I pretty much reused your sample app. When I click on my DESKTOP window and minimize the app it calls this function in the BG screen. Calling this.windowsService.minimize(kWindowNames.IN_GAME) boots up the ingame process. I think this is really unwanted behaviour.
My desktop and in-game apps look the same they have the same code. I inject the Advertisement SDK when the app is opened. Because of this it happens that the SDK code runs twice at the same time and I happen to fail the review process.

Do you guys think that there should be a handle in this function to only call minimize when the window is really open?

https://github.com/overwolf/sample-app/blob/master/native/windows/background/background-controller.js

  async minimize() {
    await Promise.all([
      this.windowsService.minimize(kWindowNames.DESKTOP),
      this.windowsService.minimize(kWindowNames.IN_GAME)
    ]);
  }

Closing causes unhandled exception

Reproduce: I open the game, have in-game window open, close the game. I marked which window close is causing the problem.

Screenshot 2021-10-31 210350

    if (!isGameRunning) {
      // Open desktop window
      await this.windowsService.restore(kWindowNames.DESKTOP);
      // Close in-game window
 ->     await this.windowsService.close(kWindowNames.IN_GAME);
      return;
    }

    const gameInfo = await this.runningGameService.getRunningGameInfo();

    if (!gameInfo || !gameInfo.isRunning) {
      this.windowsService.restore(kWindowNames.DESKTOP);
      return;
    }

    const gameClassId = gameInfo.classId;

    if (!kGameClassIds.includes(gameClassId)) {
      return;
    }

    const gameFeatures = kGamesFeatures.get(gameClassId);

    if (gameFeatures && gameFeatures.length) {
      // Register to game events
      this.gepService.setRequiredFeatures(
        gameFeatures,
        e => this._onGameEvents(e),
        e => this._onInfoUpdate(e)
      );
    }

    // Open in-game window
    await this.windowsService.restore(kWindowNames.IN_GAME);
    // Close desktop window
    await this.windowsService.close(kWindowNames.DESKTOP);
  }

Issue in onStateChanged implementation

I think this has an implementation issue based on my logs:
https://github.com/overwolf/sample-app/blob/master/native/windows/background/background-controller.js#L41

// Listen to changes in windows
    overwolf.windows.onStateChanged.addListener(async () => {
      const windowsStates = await this.windowsService.getWindowsStates();
      console.log('windowsStates', JSON.stringify(windowsStates));
      // If all UI (non-background) windows are closed, close the app
      const shouldClose = Object.entries(windowsStates)
        .filter(([windowName, windowState]) => {
          console.log('in filter - windowName', windowName);
          return windowName !== 'background';
        })
        .every(([windowName, windowState]) => {
          console.log('in every - windowState', windowState);
          return windowState === 'closed';
        });

      if (shouldClose) {
        window.close();
      }
windowsStates {"success":true,"status":"success","result":{"background":"minimized","nodge":"closed","ingame":"closed","desktop":"closed"},"resultV2":{"background":"hidden","nodge":"closed","ingame":"closed","desktop":"closed"}}
background-controller.js:48 in filter - windowName success
background-controller.js:48 in filter - windowName status
background-controller.js:48 in filter - windowName result
background-controller.js:48 in filter - windowName resultV2
background-controller.js:52 in every - windowState true

Commit 5d6e61c broke overwolf.d.ts

As stated in the title, commit 5d6e61c pushed some changes that broke overwof.d.ts functionality.

On line 1017 the removal of the WindowState enum breaks in_game.ts, as it is imported in line 5 and used in some comparations in setToggleHotkeyBehavior().

Below I attach some screenshots of the relevant lines of code.

image

image

image

Doesnt work

Get error when running npm install and build.
Will be clearing all files and installs for this until further notice.

Irrelevant but 99% of things I tried building with stuff from github always ends up with errors. Stuff like this puts me off coding so badly :/

Not sure if I'm just stupid?

PS C:! folder! - Overwolf app\Sample\ts> npm install
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
added 450 packages from 243 contributors and audited 521 packages in 35.206s

15 packages are looking for funding
run npm fund for details

found 5 low severity vulnerabilities
run npm audit fix to fix them, or npm audit for details
PS C:! folder! - Overwolf app\Sample\ts> npm run build

[email protected] build C:! folder! - Overwolf app\Sample\ts
webpack --mode=development

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
-> The base directory (absolute path!) for resolving the entry option. If output.pathinfo is set, the included pathinfo is shortened to this directory.

  • configuration.output.path: The provided value "C:\! folder\! - Overwolf app\Sample\ts/dist" contains exclamation mark (!) which is not allowed because it's reserved for loader syntax.
    -> The output directory as absolute path (required).
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! [email protected] build: webpack --mode=development
    npm ERR! Exit status 1
    npm ERR!
    npm ERR! Failed at the [email protected] build script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! C:\Users\name\AppData\Roaming\npm-cache_logs\2020-07-14T13_58_18_257Z-debug.log
PS C:! folder! - Overwolf app\Sample\ts> npm fund
[email protected]
+-- https://opencollective.com/webpack
| -- [email protected] +-- https://github.com/sponsors/ljharb | -- [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected]
+-- https://github.com/sponsors/jonschlinkert
| -- [email protected] +-- https://github.com/sponsors/isaacs | -- [email protected]
-- https://github.com/sponsors/sindresorhus -- [email protected]

PS C:! folder! - Overwolf app\Sample\ts> npm install
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

audited 521 packages in 5.52s

15 packages are looking for funding
run npm fund for details

found 5 low severity vulnerabilities
run npm audit fix to fix them, or npm audit for details
PS C:! folder! - Overwolf app\Sample\ts> npm audit fix
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN notsup Not compatible with your version of node/npm: [email protected]
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules\watchpack-chokidar2\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN [email protected] No repository field.

added 11 packages from 13 contributors, updated 9 packages and moved 2 packages in 3.827s

15 packages are looking for funding
run npm fund for details

fixed 5 of 5 vulnerabilities in 521 scanned packages
PS C:! folder! - Overwolf app\Sample\ts> npm fund
[email protected]
+-- https://opencollective.com/webpack
| -- [email protected] +-- https://github.com/sponsors/ljharb | -- [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], is-d+-- https://github.com/sponsors/jonschlinkert
| -- [email protected] +-- https://github.com/sponsors/isaacs | -- [email protected]
-- https://github.com/sponsors/sindresorhus -- [email protected]

PS C:! folder! - Overwolf app\Sample\ts> npm run build

[email protected] build C:! folder! - Overwolf app\Sample\ts
webpack --mode=development

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
-> The base directory (absolute path!) for resolving the entry option. If output.pathinfo is set, the included pathinfo is shortened to this directory.

  • configuration.output.path: The provided value "C:\! folder\! - Overwolf app\Sample\ts/dist" contains exclamation mark (!) which is not allowed because it's reserved for loader syntax.
    -> The output directory as absolute path (required).
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! [email protected] build: webpack --mode=development
    npm ERR! Exit status 1
    npm ERR!
    npm ERR! Failed at the [email protected] build script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\name\AppData\Roaming\npm-cache_logs\2020-07-14T13_59_45_838Z-debug.log
PS C:! folder! - Overwolf app\Sample\ts> npm install
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\watchpack-chokidar2\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

audited 463 packages in 1.824s

15 packages are looking for funding
run npm fund for details

found 0 vulnerabilities

PS C:! folder! - Overwolf app\Sample\ts> npm audit fix
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\watchpack-chokidar2\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

up to date in 1.582s

15 packages are looking for funding
run npm fund for details

fixed 0 of 0 vulnerabilities in 463 scanned packages
PS C:! folder! - Overwolf app\Sample\ts>

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.