replay-viewer
Version:
Rocket League replay viewer React component and tooling
105 lines • 4.48 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var _a;
import Button from "@mui/material/Button";
import Dialog from "@mui/material/Dialog";
import List from "@mui/material/List";
import ListItem from "@mui/material/ListItem";
import Typography from "@mui/material/Typography";
import React, { PureComponent } from "react";
import styled from "styled-components";
import CameraManager from "../../managers/CameraManager";
var options = [
"blue",
"orange",
"center",
"freecam",
];
var optionNames = {
blue: "Blue Goal",
orange: "Orange Goal",
center: "Above Field",
freecam: "Free Cam",
};
var orthographicOptions = [
"orthographic-above-field",
"orthographic-blue-left",
"orthographic-blue-right",
"orthographic-orange-left",
"orthographic-orange-right",
];
var orthographicOptionNames = (_a = {},
_a["orthographic-above-field"] = "Above Field",
_a["orthographic-blue-left"] = "Blue Left",
_a["orthographic-blue-right"] = "Blue Right",
_a["orthographic-orange-left"] = "Orange Left",
_a["orthographic-orange-right"] = "Orange Right",
_a);
var FieldCameraControls = /** @class */ (function (_super) {
__extends(FieldCameraControls, _super);
function FieldCameraControls(props) {
var _this = _super.call(this, props) || this;
_this.toggleDialog = function () {
var dialogOpen = !_this.state.dialogOpen;
_this.setState({
dialogOpen: dialogOpen,
});
};
_this.onFieldClick = function (fieldLocation) {
return function () {
if (_this.state.dialogOpen) {
_this.setState({
dialogOpen: false,
});
}
CameraManager.getInstance().setCameraLocation({ fieldLocation: fieldLocation });
};
};
_this.state = {
dialogOpen: false,
};
return _this;
}
FieldCameraControls.prototype.renderFieldButtons = function () {
var _this = this;
return options.map(function (option) {
return (React.createElement(FieldButton, { key: option, variant: "outlined", onClick: _this.onFieldClick(option) }, optionNames[option || "center"]));
});
};
FieldCameraControls.prototype.renderOrthographicOptions = function () {
var _this = this;
return (React.createElement(Dialog, { open: this.state.dialogOpen, onClose: this.toggleDialog },
React.createElement(List, null, orthographicOptions.map(function (option) {
return (React.createElement(ListItem, { key: option, onClick: _this.onFieldClick(option), style: { cursor: "pointer" } },
React.createElement(Typography, null, orthographicOptionNames[option || "orthographic-orange-right"])));
}))));
};
FieldCameraControls.prototype.render = function () {
return (React.createElement("div", null,
this.renderFieldButtons(),
React.createElement(FieldButton, { onClick: this.toggleDialog, variant: "outlined" }, "Orthographic"),
this.renderOrthographicOptions()));
};
return FieldCameraControls;
}(PureComponent));
var FieldButton = styled(Button)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n && {\n margin: 6px;\n }\n"], ["\n && {\n margin: 6px;\n }\n"])));
export default FieldCameraControls;
var templateObject_1;
//# sourceMappingURL=FieldCameraControls.js.map