update demo parser

This commit is contained in:
Robin Appelman 2018-03-28 23:34:55 +02:00
commit b7119395e7
7 changed files with 990 additions and 71 deletions

946
package-lock.json generated
View file

@ -2,6 +2,16 @@
"requires": true,
"lockfileVersion": 1,
"dependencies": {
"@demostf/demo.js": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/@demostf/demo.js/-/demo.js-2.1.1.tgz",
"integrity": "sha512-0dDx2++f8ILRsHayPQK2aMzVIbkd5CO6Y8tykvwimrLE4y2CFHm2MgICSuDgSPcEeHc9UMHyRBXwy4XQWKgK2g==",
"requires": {
"bit-buffer": "0.2.3",
"snappyjs": "0.6.0",
"text-encoding-shim": "git+https://gitlab.com/hongaar/text-encoding-shim.git#83ff0f77f48d05b8ce83ddc7ca49d8df61363b31"
}
},
"@types/node": {
"version": "7.0.48",
"resolved": "https://registry.npmjs.org/@types/node/-/node-7.0.48.tgz",
@ -587,6 +597,7 @@
"requires": {
"anymatch": "1.3.2",
"async-each": "1.0.1",
"fsevents": "1.1.3",
"glob-parent": "2.0.0",
"inherits": "2.0.3",
"is-binary-path": "1.0.1",
@ -1651,6 +1662,910 @@
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
"dev": true
},
"fsevents": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.3.tgz",
"integrity": "sha512-WIr7iDkdmdbxu/Gh6eKEZJL6KPE74/5MEsf2whTOFNxbIoIixogroLdKYqB6FDav4Wavh/lZdzzd3b2KxIXC5Q==",
"dev": true,
"optional": true,
"requires": {
"nan": "2.10.0",
"node-pre-gyp": "0.6.39"
},
"dependencies": {
"abbrev": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
},
"ajv": {
"version": "4.11.8",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"co": "4.6.0",
"json-stable-stringify": "1.0.1"
}
},
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true
},
"aproba": {
"version": "1.1.1",
"bundled": true,
"dev": true,
"optional": true
},
"are-we-there-yet": {
"version": "1.1.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"delegates": "1.0.0",
"readable-stream": "2.2.9"
}
},
"asn1": {
"version": "0.2.3",
"bundled": true,
"dev": true,
"optional": true
},
"assert-plus": {
"version": "0.2.0",
"bundled": true,
"dev": true,
"optional": true
},
"asynckit": {
"version": "0.4.0",
"bundled": true,
"dev": true,
"optional": true
},
"aws-sign2": {
"version": "0.6.0",
"bundled": true,
"dev": true,
"optional": true
},
"aws4": {
"version": "1.6.0",
"bundled": true,
"dev": true,
"optional": true
},
"balanced-match": {
"version": "0.4.2",
"bundled": true,
"dev": true
},
"bcrypt-pbkdf": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"tweetnacl": "0.14.5"
}
},
"block-stream": {
"version": "0.0.9",
"bundled": true,
"dev": true,
"requires": {
"inherits": "2.0.3"
}
},
"boom": {
"version": "2.10.1",
"bundled": true,
"dev": true,
"requires": {
"hoek": "2.16.3"
}
},
"brace-expansion": {
"version": "1.1.7",
"bundled": true,
"dev": true,
"requires": {
"balanced-match": "0.4.2",
"concat-map": "0.0.1"
}
},
"buffer-shims": {
"version": "1.0.0",
"bundled": true,
"dev": true
},
"caseless": {
"version": "0.12.0",
"bundled": true,
"dev": true,
"optional": true
},
"co": {
"version": "4.6.0",
"bundled": true,
"dev": true,
"optional": true
},
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
},
"combined-stream": {
"version": "1.0.5",
"bundled": true,
"dev": true,
"requires": {
"delayed-stream": "1.0.0"
}
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
},
"core-util-is": {
"version": "1.0.2",
"bundled": true,
"dev": true
},
"cryptiles": {
"version": "2.0.5",
"bundled": true,
"dev": true,
"requires": {
"boom": "2.10.1"
}
},
"dashdash": {
"version": "1.14.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"assert-plus": "1.0.0"
},
"dependencies": {
"assert-plus": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
}
}
},
"debug": {
"version": "2.6.8",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ms": "2.0.0"
}
},
"deep-extend": {
"version": "0.4.2",
"bundled": true,
"dev": true,
"optional": true
},
"delayed-stream": {
"version": "1.0.0",
"bundled": true,
"dev": true
},
"delegates": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
},
"detect-libc": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
},
"ecc-jsbn": {
"version": "0.1.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"jsbn": "0.1.1"
}
},
"extend": {
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true
},
"extsprintf": {
"version": "1.0.2",
"bundled": true,
"dev": true
},
"forever-agent": {
"version": "0.6.1",
"bundled": true,
"dev": true,
"optional": true
},
"form-data": {
"version": "2.1.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"asynckit": "0.4.0",
"combined-stream": "1.0.5",
"mime-types": "2.1.15"
}
},
"fs.realpath": {
"version": "1.0.0",
"bundled": true,
"dev": true
},
"fstream": {
"version": "1.0.11",
"bundled": true,
"dev": true,
"requires": {
"graceful-fs": "4.1.11",
"inherits": "2.0.3",
"mkdirp": "0.5.1",
"rimraf": "2.6.1"
}
},
"fstream-ignore": {
"version": "1.0.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"fstream": "1.0.11",
"inherits": "2.0.3",
"minimatch": "3.0.4"
}
},
"gauge": {
"version": "2.7.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"aproba": "1.1.1",
"console-control-strings": "1.1.0",
"has-unicode": "2.0.1",
"object-assign": "4.1.1",
"signal-exit": "3.0.2",
"string-width": "1.0.2",
"strip-ansi": "3.0.1",
"wide-align": "1.1.2"
}
},
"getpass": {
"version": "0.1.7",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"assert-plus": "1.0.0"
},
"dependencies": {
"assert-plus": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
}
}
},
"glob": {
"version": "7.1.2",
"bundled": true,
"dev": true,
"requires": {
"fs.realpath": "1.0.0",
"inflight": "1.0.6",
"inherits": "2.0.3",
"minimatch": "3.0.4",
"once": "1.4.0",
"path-is-absolute": "1.0.1"
}
},
"graceful-fs": {
"version": "4.1.11",
"bundled": true,
"dev": true
},
"har-schema": {
"version": "1.0.5",
"bundled": true,
"dev": true,
"optional": true
},
"har-validator": {
"version": "4.2.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ajv": "4.11.8",
"har-schema": "1.0.5"
}
},
"has-unicode": {
"version": "2.0.1",
"bundled": true,
"dev": true,
"optional": true
},
"hawk": {
"version": "3.1.3",
"bundled": true,
"dev": true,
"requires": {
"boom": "2.10.1",
"cryptiles": "2.0.5",
"hoek": "2.16.3",
"sntp": "1.0.9"
}
},
"hoek": {
"version": "2.16.3",
"bundled": true,
"dev": true
},
"http-signature": {
"version": "1.1.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"assert-plus": "0.2.0",
"jsprim": "1.4.0",
"sshpk": "1.13.0"
}
},
"inflight": {
"version": "1.0.6",
"bundled": true,
"dev": true,
"requires": {
"once": "1.4.0",
"wrappy": "1.0.2"
}
},
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true
},
"ini": {
"version": "1.3.4",
"bundled": true,
"dev": true,
"optional": true
},
"is-fullwidth-code-point": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"requires": {
"number-is-nan": "1.0.1"
}
},
"is-typedarray": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
},
"isarray": {
"version": "1.0.0",
"bundled": true,
"dev": true
},
"isstream": {
"version": "0.1.2",
"bundled": true,
"dev": true,
"optional": true
},
"jodid25519": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"jsbn": "0.1.1"
}
},
"jsbn": {
"version": "0.1.1",
"bundled": true,
"dev": true,
"optional": true
},
"json-schema": {
"version": "0.2.3",
"bundled": true,
"dev": true,
"optional": true
},
"json-stable-stringify": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"jsonify": "0.0.0"
}
},
"json-stringify-safe": {
"version": "5.0.1",
"bundled": true,
"dev": true,
"optional": true
},
"jsonify": {
"version": "0.0.0",
"bundled": true,
"dev": true,
"optional": true
},
"jsprim": {
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"assert-plus": "1.0.0",
"extsprintf": "1.0.2",
"json-schema": "0.2.3",
"verror": "1.3.6"
},
"dependencies": {
"assert-plus": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
}
}
},
"mime-db": {
"version": "1.27.0",
"bundled": true,
"dev": true
},
"mime-types": {
"version": "2.1.15",
"bundled": true,
"dev": true,
"requires": {
"mime-db": "1.27.0"
}
},
"minimatch": {
"version": "3.0.4",
"bundled": true,
"dev": true,
"requires": {
"brace-expansion": "1.1.7"
}
},
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true
},
"mkdirp": {
"version": "0.5.1",
"bundled": true,
"dev": true,
"requires": {
"minimist": "0.0.8"
}
},
"ms": {
"version": "2.0.0",
"bundled": true,
"dev": true,
"optional": true
},
"node-pre-gyp": {
"version": "0.6.39",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"detect-libc": "1.0.2",
"hawk": "3.1.3",
"mkdirp": "0.5.1",
"nopt": "4.0.1",
"npmlog": "4.1.0",
"rc": "1.2.1",
"request": "2.81.0",
"rimraf": "2.6.1",
"semver": "5.3.0",
"tar": "2.2.1",
"tar-pack": "3.4.0"
}
},
"nopt": {
"version": "4.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"abbrev": "1.1.0",
"osenv": "0.1.4"
}
},
"npmlog": {
"version": "4.1.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"are-we-there-yet": "1.1.4",
"console-control-strings": "1.1.0",
"gauge": "2.7.4",
"set-blocking": "2.0.0"
}
},
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
},
"oauth-sign": {
"version": "0.8.2",
"bundled": true,
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
"bundled": true,
"dev": true,
"optional": true
},
"once": {
"version": "1.4.0",
"bundled": true,
"dev": true,
"requires": {
"wrappy": "1.0.2"
}
},
"os-homedir": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
},
"os-tmpdir": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
},
"osenv": {
"version": "0.1.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"os-homedir": "1.0.2",
"os-tmpdir": "1.0.2"
}
},
"path-is-absolute": {
"version": "1.0.1",
"bundled": true,
"dev": true
},
"performance-now": {
"version": "0.2.0",
"bundled": true,
"dev": true,
"optional": true
},
"process-nextick-args": {
"version": "1.0.7",
"bundled": true,
"dev": true
},
"punycode": {
"version": "1.4.1",
"bundled": true,
"dev": true,
"optional": true
},
"qs": {
"version": "6.4.0",
"bundled": true,
"dev": true,
"optional": true
},
"rc": {
"version": "1.2.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"deep-extend": "0.4.2",
"ini": "1.3.4",
"minimist": "1.2.0",
"strip-json-comments": "2.0.1"
},
"dependencies": {
"minimist": {
"version": "1.2.0",
"bundled": true,
"dev": true,
"optional": true
}
}
},
"readable-stream": {
"version": "2.2.9",
"bundled": true,
"dev": true,
"requires": {
"buffer-shims": "1.0.0",
"core-util-is": "1.0.2",
"inherits": "2.0.3",
"isarray": "1.0.0",
"process-nextick-args": "1.0.7",
"string_decoder": "1.0.1",
"util-deprecate": "1.0.2"
}
},
"request": {
"version": "2.81.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"aws-sign2": "0.6.0",
"aws4": "1.6.0",
"caseless": "0.12.0",
"combined-stream": "1.0.5",
"extend": "3.0.1",
"forever-agent": "0.6.1",
"form-data": "2.1.4",
"har-validator": "4.2.1",
"hawk": "3.1.3",
"http-signature": "1.1.1",
"is-typedarray": "1.0.0",
"isstream": "0.1.2",
"json-stringify-safe": "5.0.1",
"mime-types": "2.1.15",
"oauth-sign": "0.8.2",
"performance-now": "0.2.0",
"qs": "6.4.0",
"safe-buffer": "5.0.1",
"stringstream": "0.0.5",
"tough-cookie": "2.3.2",
"tunnel-agent": "0.6.0",
"uuid": "3.0.1"
}
},
"rimraf": {
"version": "2.6.1",
"bundled": true,
"dev": true,
"requires": {
"glob": "7.1.2"
}
},
"safe-buffer": {
"version": "5.0.1",
"bundled": true,
"dev": true
},
"semver": {
"version": "5.3.0",
"bundled": true,
"dev": true,
"optional": true
},
"set-blocking": {
"version": "2.0.0",
"bundled": true,
"dev": true,
"optional": true
},
"signal-exit": {
"version": "3.0.2",
"bundled": true,
"dev": true,
"optional": true
},
"sntp": {
"version": "1.0.9",
"bundled": true,
"dev": true,
"requires": {
"hoek": "2.16.3"
}
},
"sshpk": {
"version": "1.13.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"asn1": "0.2.3",
"assert-plus": "1.0.0",
"bcrypt-pbkdf": "1.0.1",
"dashdash": "1.14.1",
"ecc-jsbn": "0.1.1",
"getpass": "0.1.7",
"jodid25519": "1.0.2",
"jsbn": "0.1.1",
"tweetnacl": "0.14.5"
},
"dependencies": {
"assert-plus": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
}
}
},
"string-width": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"requires": {
"code-point-at": "1.1.0",
"is-fullwidth-code-point": "1.0.0",
"strip-ansi": "3.0.1"
}
},
"string_decoder": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"requires": {
"safe-buffer": "5.0.1"
}
},
"stringstream": {
"version": "0.0.5",
"bundled": true,
"dev": true,
"optional": true
},
"strip-ansi": {
"version": "3.0.1",
"bundled": true,
"dev": true,
"requires": {
"ansi-regex": "2.1.1"
}
},
"strip-json-comments": {
"version": "2.0.1",
"bundled": true,
"dev": true,
"optional": true
},
"tar": {
"version": "2.2.1",
"bundled": true,
"dev": true,
"requires": {
"block-stream": "0.0.9",
"fstream": "1.0.11",
"inherits": "2.0.3"
}
},
"tar-pack": {
"version": "3.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"debug": "2.6.8",
"fstream": "1.0.11",
"fstream-ignore": "1.0.5",
"once": "1.4.0",
"readable-stream": "2.2.9",
"rimraf": "2.6.1",
"tar": "2.2.1",
"uid-number": "0.0.6"
}
},
"tough-cookie": {
"version": "2.3.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"punycode": "1.4.1"
}
},
"tunnel-agent": {
"version": "0.6.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "5.0.1"
}
},
"tweetnacl": {
"version": "0.14.5",
"bundled": true,
"dev": true,
"optional": true
},
"uid-number": {
"version": "0.0.6",
"bundled": true,
"dev": true,
"optional": true
},
"util-deprecate": {
"version": "1.0.2",
"bundled": true,
"dev": true
},
"uuid": {
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true
},
"verror": {
"version": "1.3.6",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"extsprintf": "1.0.2"
}
},
"wide-align": {
"version": "1.1.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"string-width": "1.0.2"
}
},
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true
}
}
},
"function-bind": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
@ -2862,6 +3777,13 @@
"integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE=",
"dev": true
},
"nan": {
"version": "2.10.0",
"resolved": "https://registry.npmjs.org/nan/-/nan-2.10.0.tgz",
"integrity": "sha512-bAdJv7fBLhWC+/Bls0Oza+mvTaNQtP+1RyhhhvD95pgUJz6XM5IzgmxOkItJ9tkoCiplvAnXI1tNmmUD/eScyA==",
"dev": true,
"optional": true
},
"ncname": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz",
@ -5481,28 +6403,8 @@
"integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI=",
"dev": true
},
"tf2-demo": {
"version": "1.1.5",
"resolved": "https://registry.npmjs.org/tf2-demo/-/tf2-demo-1.1.5.tgz",
"integrity": "sha512-l3y2psB3Hd/lWWwhxWCxcuetK91LoOelsVFEWjjk1HXQdioNM2FqPsF5CG/Ph50K+RvJ8c5o04uarTxdIxBwdg==",
"requires": {
"bit-buffer": "0.2.3",
"clone": "2.1.1",
"minimist": "1.2.0",
"snappyjs": "0.6.0"
},
"dependencies": {
"clone": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/clone/-/clone-2.1.1.tgz",
"integrity": "sha1-0hfR6WERjjrJpLi7oyhVU79kfNs="
},
"minimist": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
}
}
"text-encoding-shim": {
"version": "git+https://gitlab.com/hongaar/text-encoding-shim.git#83ff0f77f48d05b8ce83ddc7ca49d8df61363b31"
},
"thunky": {
"version": "0.1.0",

View file

@ -20,6 +20,6 @@
"dependencies": {
"react": "^16.2.0",
"react-dom": "^16.2.0",
"tf2-demo": "^1.1.5"
"@demostf/demo.js": "^2.1.1"
}
}

View file

@ -1,7 +1,7 @@
import * as React from 'react';
import {Demo} from 'tf2-demo/build/Demo';
import {World} from 'tf2-demo/build/Data/World';
import {DemoViewer} from "./DemoViewer";
import {Demo} from '@demostf/demo.js/build/Demo';
import {World} from '@demostf/demo.js/build/Data/World';
import {DemoViewer} from './DemoViewer';
export interface AppState {
@ -14,11 +14,14 @@ export interface AppState {
x: number;
y: number,
imageWidth: number,
imageHeight: number
imageHeight: number,
packets: IterableIterator<Packet> | null,
match: Match | null
}
import './App.css';
import {MapContainer} from "./MapContainer";
import {MapContainer} from './MapContainer';
import {Match, Packet} from '@demostf/demo.js/build';
export class App extends React.Component<{}, AppState> {
state: AppState = {
@ -34,7 +37,9 @@ export class App extends React.Component<{}, AppState> {
x: 0,
y: 0,
imageHeight: 1000,
imageWidth: 1000
imageWidth: 1000,
packets: null,
match: null
};
onNumberInputChange(key, event) {
@ -50,14 +55,15 @@ export class App extends React.Component<{}, AppState> {
reader.onload = () => {
const fileData = reader.result as ArrayBuffer;
const demo = new Demo(fileData);
const parser = demo.getParser();
parser.readHeader();
const match = parser.match;
const analyser = demo.getAnalyser();
const match = analyser.match;
const packets = analyser.getPackets();
while (match.world.boundaryMin.x === 0) {
parser.tick();
packets.next();
}
this.setState({demo, world: match.world});
console.log(match.world);
this.setState({demo, world: match.world, packets, match});
};
reader.readAsArrayBuffer(file);
};
@ -80,7 +86,7 @@ export class App extends React.Component<{}, AppState> {
reader.readAsDataURL(file);
};
getDimensions(): { width: number, height: number } {
getDimensions(): {width: number, height: number} {
const originalHeight = 1024 * this.state.scale; // 1024 is a magic number straight from cl_leveloverview code
const originalWidth = originalHeight * (this.state.originalWidth / this.state.originalHeight);
@ -106,7 +112,7 @@ export class App extends React.Component<{}, AppState> {
x: this.state.x + Math.floor(width / 2),
y: this.state.y + Math.floor(height / 2)
}
}
};
}
render() {
@ -119,8 +125,8 @@ export class App extends React.Component<{}, AppState> {
return <div>
<input onChange={this.onNumberInputChange.bind(this, 'scale')}
placeholder="scale" type="number"
value={this.state.scale}/>
placeholder="scale" type="number"
value={this.state.scale}/>
<input
onChange={this.onNumberInputChange.bind(this, 'originalHeight')}
placeholder="screen height" type="number"
@ -132,20 +138,24 @@ export class App extends React.Component<{}, AppState> {
<input onChange={this.onSelectDemo} type="file"/>
<MapContainer contentSize={{width: demoWidth, height: demoHeight}}>
<img className="background" src={this.state.background || ''}
width={width / 10}
height={height / 10}
style={{
top: offsetY + 'px',
left: offsetX + 'px',
}}/>
width={width / 10}
height={height / 10}
style={{
top: offsetY + 'px',
left: offsetX + 'px',
}}/>
<DemoViewer className="viewer" height={demoHeight}
width={demoWidth}
demo={this.state.demo}/>
width={demoWidth}
demo={this.state.demo}
world={this.state.world}
packets={this.state.packets}
match={this.state.match}
/>
</MapContainer>
<input onChange={this.onSelectImage} type="file"/>
<input onChange={this.onNumberInputChange.bind(this, 'x')}
placeholder="x" type="number"
value={this.state.x}/>
placeholder="x" type="number"
value={this.state.x}/>
<input
onChange={this.onNumberInputChange.bind(this, 'y')}
placeholder="y" type="number"

View file

@ -1,34 +1,36 @@
import {Demo} from 'tf2-demo/build/Demo';
import {Demo} from '@demostf/demo.js/build/Demo';
import {Match, Packet, World} from '@demostf/demo.js/build';
export class DemoRender {
static render(canvas: HTMLCanvasElement, demo: Demo, width: number, height: number) {
static render(
canvas: HTMLCanvasElement,
demo: Demo,
width: number,
height: number,
packets: IterableIterator<Packet>,
world: World,
match: Match
) {
const ctx = <CanvasRenderingContext2D>canvas.getContext('2d');
const parser = demo.getParser();
const match = parser.match;
const scaleX = width / (match.world.boundaryMax.x - match.world.boundaryMin.x);
const scaleY = height / (match.world.boundaryMax.y - match.world.boundaryMin.y);
const scale = Math.max(scaleX, scaleY);
const boundaryMin = match.world.boundaryMin;
const boundaryMax = match.world.boundaryMax;
console.log(boundaryMin, boundaryMax, width, height);
const boundaryMin = world.boundaryMin;
const boundaryMax = world.boundaryMax;
const translatePosition = (position) => {
return {
x: Math.floor(position.x - boundaryMin.x) * scale,
y: Math.floor(boundaryMax.y - position.y) * scale
}
};
};
const drawScale = Math.max(width, height) / 1500;
const drawTick = () => {
for (const player of match.players) {
if (!player.user.team) {
continue;// spec
}
for (const player of Array.from(match.playerEntityMap.values())) {
if (player.team === 2) {
ctx.fillStyle = 'red';
} else {
@ -45,16 +47,17 @@ export class DemoRender {
};
const drawNext = () => {
let tick;
let next = packets.next();
for (let i = 0; i < 1000; i++) {
tick = parser.tick();
if (tick) {
if (next.value) {
drawTick();
} else {
console.log(match.playerEntityMap);
return;
}
next = packets.next();
}
if (tick) {
if (!next.done) {
// queue up the next batch of ticks
requestAnimationFrame(drawNext);
}

View file

@ -1,12 +1,16 @@
import * as React from 'react';
import {Demo} from 'tf2-demo/build/Demo';
import {Demo} from '@demostf/demo.js/build/Demo';
import {DemoRender} from './DemoRender';
import {Match, Packet, World} from '@demostf/demo.js/build';
export interface DemoViewerProps {
demo: Demo | null;
width: number;
height: number;
className?: string;
packets: IterableIterator<Packet> | null;
world: World | null;
match: Match | null;
}
export class DemoViewer extends React.Component<DemoViewerProps, {}> {
@ -17,8 +21,8 @@ export class DemoViewer extends React.Component<DemoViewerProps, {}> {
}
updateCanvas() {
if (this.props.demo) {
DemoRender.render(this.canvas, this.props.demo, this.props.width, this.props.height);
if (this.props.demo && this.props.packets && this.props.world && this.props.match) {
DemoRender.render(this.canvas, this.props.demo, this.props.width, this.props.height, this.props.packets, this.props.world, this.props.match);
}
}

View file

@ -3,11 +3,12 @@
"lib": [
"dom",
"es2015.promise",
"es6"
"es5",
"ES2017"
],
"module": "ES6",
"moduleResolution": "node",
"target": "ES5",
"target": "ES6",
"declaration": true,
"strictNullChecks": true,
"sourceMap": true,

View file

@ -30,7 +30,6 @@ module.exports = {
}),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin(),
new webpack.DefinePlugin({
'process.env': {
// Useful to reduce the size of client-side libraries, e.g. react