fix with new demos

This commit is contained in:
Robin Appelman 2017-12-08 00:02:15 +01:00
commit d6ebc070e5
4 changed files with 6160 additions and 20 deletions

6130
package-lock.json generated Normal file

File diff suppressed because it is too large Load diff

View file

@ -1,20 +1,25 @@
{ {
"devDependencies": { "devDependencies": {
"@types/node": "^7.0.12", "@types/node": "^7.0.48",
"@types/react": "^15.0.21", "@types/react": "^15.6.7",
"@types/react-dom": "^0.14.23", "@types/react-dom": "^0.14.23",
"clean-webpack-plugin": "^0.1.16", "clean-webpack-plugin": "^0.1.17",
"css-loader": "^0.28.0", "css-loader": "^0.28.7",
"extract-text-webpack-plugin": "^2.1.0", "extract-text-webpack-plugin": "^2.1.2",
"html-webpack-plugin": "^2.28.0", "html-webpack-plugin": "^2.30.1",
"postcss-cssnext": "^2.10.0", "postcss-cssnext": "^2.11.0",
"postcss-loader": "^1.3.3", "postcss-loader": "^1.3.3",
"postcss-nested": "^1.0.1", "postcss-nested": "^1.0.1",
"react-hot-loader": "^3.0.0-beta.6", "react-hot-loader": "^3.1.3",
"style-loader": "^0.16.1", "style-loader": "^0.16.1",
"ts-loader": "^2.0.3", "ts-loader": "^2.3.7",
"typescript": "^2.2.2", "typescript": "^2.6.2",
"webpack": "^2.4.1", "webpack": "^2.7.0",
"webpack-dev-server": "^2.4.2" "webpack-dev-server": "^2.9.7"
},
"dependencies": {
"react": "^16.2.0",
"react-dom": "^16.2.0",
"tf2-demo": "^1.1.5"
} }
} }

View file

@ -1,6 +1,6 @@
import * as React from 'react'; import * as React from 'react';
import {Demo} from 'tf2-demo/build/Demo'; import {Demo} from 'tf2-demo/build/Demo';
import {DemoRender} from "./DemoRender"; import {DemoRender} from './DemoRender';
export interface DemoViewerProps { export interface DemoViewerProps {
demo: Demo | null; demo: Demo | null;
@ -39,7 +39,9 @@ export class DemoViewer extends React.Component<DemoViewerProps, {}> {
height={this.props.height} height={this.props.height}
className={this.props.className} className={this.props.className}
ref={(canvas) => { ref={(canvas) => {
this.canvas = canvas if (canvas) {
}}/> this.canvas = canvas;
}
}}/>;
} }
} }

View file

@ -1,5 +1,5 @@
import * as React from 'react'; import * as React from 'react';
import {Panner} from "./Panner/Panner"; import {Panner} from './Panner/Panner';
import './MapContainer.css'; import './MapContainer.css';
@ -18,7 +18,7 @@ export class MapContainerState {
} }
export class MapContainer extends React.Component<MapContainerProps, MapContainerState> { export class MapContainer extends React.Component<MapContainerProps, MapContainerState> {
container: Element; container: Element | null;
state: MapContainerState = { state: MapContainerState = {
width: 500, width: 500,
height: 800 height: 800
@ -26,6 +26,9 @@ export class MapContainer extends React.Component<MapContainerProps, MapContaine
sendScale = false; sendScale = false;
componentDidMount() { componentDidMount() {
if (!this.container) {
return;
}
if (this.container.clientWidth == this.state.width && this.container.clientHeight == this.state.height) { if (this.container.clientWidth == this.state.width && this.container.clientHeight == this.state.height) {
return; return;
} }
@ -49,11 +52,11 @@ export class MapContainer extends React.Component<MapContainerProps, MapContaine
return ( return (
<div className="map-container" ref={(div) => this.container = div}> <div className="map-container" ref={(div) => this.container = div}>
<Panner width={this.state.width} height={this.state.height} <Panner width={this.state.width} height={this.state.height}
scale={scale} contentSize={this.props.contentSize} scale={scale} contentSize={this.props.contentSize}
onScale={this.props.onScale}> onScale={this.props.onScale}>
{this.props.children} {this.props.children}
</Panner> </Panner>
</div> </div>
) );
} }
} }