81 lines
1.6 KiB
TypeScript
81 lines
1.6 KiB
TypeScript
/**
|
|
* @author Martin Karkowski
|
|
* @email m.karkowski@zema.de
|
|
* @create date 2021-04-20 18:51:42
|
|
* @modify date 2021-04-20 18:55:10
|
|
* @desc [description]
|
|
*/
|
|
|
|
import React from "react";
|
|
|
|
/**
|
|
* A Component, used to Render the Staus of a Host.
|
|
*
|
|
*/
|
|
export class CustomIFrame extends React.Component<
|
|
{
|
|
height?: number;
|
|
width?: number;
|
|
link: string;
|
|
altText?: string;
|
|
},
|
|
{
|
|
height: number;
|
|
width: number;
|
|
}
|
|
> {
|
|
ref: React.RefObject<HTMLDivElement>;
|
|
|
|
/**
|
|
* Create the Status to Render.
|
|
* @param props
|
|
*/
|
|
constructor(props) {
|
|
super(props);
|
|
this.ref = React.createRef();
|
|
this.state = {
|
|
height: 200,
|
|
width: 500
|
|
};
|
|
}
|
|
|
|
protected _handleResize: () => void;
|
|
|
|
componentDidMount() {
|
|
const _this = this;
|
|
this._handleResize = () => {
|
|
setTimeout(() => {
|
|
const size = {
|
|
width:
|
|
_this.props.width |
|
|
(_this.ref.current.parentElement.clientWidth - 40),
|
|
height:
|
|
_this.props.height |
|
|
(_this.ref.current.parentElement.clientHeight - 40)
|
|
};
|
|
console.log(size, _this.ref);
|
|
_this.setState(size);
|
|
}, 200);
|
|
};
|
|
|
|
this._handleResize();
|
|
window.addEventListener("resize", this._handleResize);
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
window.removeEventListener("resize", this._handleResize);
|
|
}
|
|
|
|
render(): JSX.Element {
|
|
return (
|
|
<div ref={this.ref}>
|
|
<iframe
|
|
src={this.props.link}
|
|
height={this.state.height}
|
|
width={this.state.width}
|
|
></iframe>
|
|
</div>
|
|
);
|
|
}
|
|
}
|