Removed redundant files

README.md

@@ -11,14 +11,70 @@
 
 Fullfledged example of the React HUD made for HUD Manager.
 
+## Preview
+
+![Preview of HUDs pick process](picking.png)
+![Preview of HUDs ingame part](ingame.png)
+![Preview of HUDs ending scoreboard](scoreboard.png)
+
+## Setting up
+Fork this repo, clone it, and then run `npm install` and `npm start`. HUD should start on the 3500 port. For this to work have HUD Manager opened so it will pass CS:GO data to the HUD.
+
+## Identifying HUD
+In `/public` directory edit hud.json so it fits you - fill HUD's name, author, version, specify the radar and killfeed functionalities. At the end replace the thumb.png with your icon :)
+
+## Building & distributing
+To build version to distribute and move around, in the root directory run `npm run pack`. It will create the zip file for distribution. Now you can just drag and drop this file into the HUD Managers upload area.
+
+## Signing
+
+To create Signed HUD to prevent at least from modyfing compiled Javascript files run `npm run sign`. It's the same as `npm run pack` command but with additional step of signing .js and .css files and hud.json.
+
+## `panel.json` API
+To get the incoming data from the HUD Manager, let's take a look at the `src/HUD/SideBoxes/SideBox.tsx` `componentDidMount()` method:
+```javascript
+import {configs} from  './../../App';
+...
+configs.onChange((data:any) => {
+	if(!data) return;
+	
+	const  display = data.display_settings;
+	
+	if(!display) return;
+	
+	if(display[`${this.props.side}_title`]){
+		this.setState({title:display[`${this.props.side}_title`]})
+	}
+	if(display[`${this.props.side}_subtitle`]){
+		this.setState({subtitle:display[`${this.props.side}_subtitle`]})
+	}
+	if(display[`${this.props.side}_image`]){
+		this.setState({image:display[`${this.props.side}_image`]})
+	}
+});
+```
+To retrieve incoming data, you should just import `configs` object and then listen for the changes with `onChange` method. Usually you want to check for the specific data, as in the callback it will always serve the full form from the Manager.
+However it looks different in the case of action input. In this case, let's look at the `src/HUD/Trivia/Trivia.tsx`:
+```javascript
+import {configs, actions} from  './../../App';
+...
+actions.on("triviaState", (state: any) => {
+	this.setState({show:  state === "show"})
+});
+```
+For the action input we need to import the `actions` object and create listener with the parameter on it.
+## `keybinds.json` API
+Keybinds API works in very similiar to `panel.json` action API. One more time the example will be from `src/HUD/Trivia/Trivia.tsx`:
+```javascript
+import {configs, actions} from  './../../App';
+...
+actions.on("toggleTrivia", () => {
+	this.setState({show: !this.state.show})
+});
+```
+Keybinds listener works on the same object as action input, in this case however there are no parameter to retrieve.
 
-## Keybinds & Panel:
-For keybinds & panel API read [csgo-react-hud docs](https://github.com/lexogrine/csgo-react-hud)
 
 # Download
 
 To download it just click here: [DOWNLOAD HUD](https://github.com/lexogrine/dota2-react-hud/releases/latest)
-
-# Note
-
-This is early beta of Dota 2 custom HUD. Current release is targeted for developers to gather their feedback.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "lexogrine_dota2_hud",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "homepage": "./",
   "private": true,
   "dependencies": {
@@ -24,7 +24,8 @@
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
-    "pack": "npm run build && npm run zip"
+    "pack": "npm run build && npm run zip",
+    "sign": "npm run build && node sign.js && npm-build-zip --name=signed"
   },
   "eslintConfig": {
     "extends": "react-app"
@@ -45,6 +46,7 @@
     "@types/history": "^4.7.5",
     "internal-ip": "^6.2.0",
     "npm-build-zip": "^1.0.2",
+    "jsonwebtoken": "^8.5.1",
     "open": "^8.0.2",
     "sass": "^1.32.5"
   }

public/hud.json

@@ -1,6 +1,6 @@
 {
-    "name":"exogrine Dota2 HUD",
+    "name":"Lexogrine Dota2 HUD",
-    "version":"1.1.0",
+    "version":"1.2.0",
     "author":"Lexogrine",
     "legacy": false,
     "radar": true,

src/HUD/GameHUD/gamehud.scss

@@ -123,7 +123,7 @@ body {
     position:fixed;
     align-items: center;
     bottom:0;
-    left:232px;
+    left:282px;
     transition: opacity 1s;
     opacity:1;
     &.hide {

src/HUD/Layout/Layout.tsx

@@ -12,20 +12,10 @@ import Statistics from "../GameHUD/ObservedStatistics";
 import TopSideBar from "../GameHUD/TopSideBar";
 import Scoreboard, { stringToClock } from "../Scoreboard/Scoreboard";
 
-import TwitchIcon from "./../Scoreboard/twitch.png";
-import FacebookIcon from './../Scoreboard/facebook.png';
-import TwitterIcon from "./../Scoreboard/twitter.png";
-import InstragramIcon from './../Scoreboard/instagram.png';
 
 import ObservedPlayer from "../GameHUD/Game";
 import { actions, configs } from "../../App";
 
-const icons = {
-  twitch: TwitchIcon,
-  facebook: FacebookIcon,
-  instagram: InstragramIcon,
-  twitter: TwitterIcon
-} as any;
 
 interface Props {
   game: Dota2,