Created
August 1, 2018 09:51
-
-
Save veggiesaurus/b8c377a364b4d38107f0e9a6e8cfc309 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
public render() { | |
const headerHeight = 25; | |
const titleClass = this.props.isSelected ? "floating-header selected" : "floating-header"; | |
const widgetConfig = this.props.widgetConfig; | |
return ( | |
<Rnd | |
className="floating-widget" | |
style={{zIndex: this.props.zIndex}} | |
default={{ | |
// Shift by 5 pixels to compensate for 5px CSS margins | |
x: widgetConfig.defaultX !== undefined ? widgetConfig.defaultX : this.props.appStore.floatingWidgetStore.defaultOffset + 5, | |
y: widgetConfig.defaultY !== undefined ? widgetConfig.defaultY : this.props.appStore.floatingWidgetStore.defaultOffset, | |
width: widgetConfig.defaultWidth, | |
height: widgetConfig.defaultHeight + headerHeight, | |
}} | |
resizeGrid={[25, 25]} | |
dragGrid={[25, 25]} | |
minWidth={widgetConfig.minWidth} | |
minHeight={widgetConfig.minHeight + headerHeight} | |
bounds={".gl-container"} | |
dragHandleClassName={"floating-title"} | |
onMouseDown={this.props.onSelected} | |
> | |
<div className={titleClass}> | |
<div className={"floating-title"}> | |
{widgetConfig.title} | |
</div> | |
{this.props.showPinButton && | |
<div className="floating-header-button" ref={ref => this.pinElementRef = ref}> | |
<Icon icon={"pin"}/> | |
</div> | |
} | |
{widgetConfig.isCloseable && | |
<div onMouseDown={this.props.onClosed} className="floating-header-button"> | |
<Icon icon={"cross"}/> | |
</div> | |
} | |
</div> | |
<div className="floating-content"> | |
{this.props.children} | |
</div> | |
</Rnd> | |
); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment