Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { Component } from 'react';
- import { Button } from 'react-bootstrap';
- import { Tooltip } from 'react-bootstrap';
- import "./SelectedIngredient.scss";
- export default class SelectedIngredient extends Component {
- constructor(props) {
- super(props);
- this.getIngredientImage = this.getIngredientImage.bind(this);
- this.getSlotImage = this.getSlotImage.bind(this);
- this.onMouseDown = this.onMouseDown.bind(this)
- this.state = {
- rotate: false
- }
- }
- handleDrop(index, event) {
- // this.props.onDragEndSelectedIngredientCallback();
- // callback(index);
- }
- rotateFunction() {
- this.setState({ rotate: true });
- }
- onMouseDown() {
- this.props.onMouseDown();
- }
- getIngredientImage() {
- if (this.props.selected_ingredient != null) {
- //if (!this.state.rotate ){
- return <div onMouseDown={this.onMouseDown.bind(this)}> <img className="top-img" draggable="false" src={"/images/" + (this.props.selected_ingredient.category == "glasses" ? "glasses/" : "ingredients/") + this.props.selected_ingredient.name + ".png"} alt={"Missing Image: " + this.props.selected_ingredient.name} /> </div>
- // }
- /*else {
- return <div> <img className="rotImg" onClick={this.rotateFunction.bind(this)} draggable="false" src={"/images/" + (this.props.selected_ingredient.category == "glasses" ? "glasses/" : "ingredients/") + this.props.selected_ingredient.name + ".png"} alt={"Missing Image: " + this.props.selected_ingredient.name} /> </div>
- }*/
- {/* <span className="tooltiptext" >
- {this.props.inventory[index].actionStack.map((item) => {
- return (<p key={item.name}>{item.name}</p>);
- })}
- </span> */}
- } else {
- return <div id="tooltip" onMouseDown={this.onMouseDown.bind(this)}>
- <img className="bottom-img" src="/images/actions/empty_spot.png" alt="empty spot" />
- <span className="tooltiptext">There's nothing in this space!</span>
- </div>
- }
- }
- getSlotImage() {
- if (this.props.selected_bar != null) {
- if (this.props.selected_bar.bar == "quick") {
- var glass = this.props.selected_bar.data.glass;
- var actionBar = this.props.selected_bar.data.actionStack;
- var callback = this.props.renderGlass;
- return callback(glass, actionBar);
- } else if (this.props.selected_bar.bar == "action") {
- var slot = this.props.selected_bar.slot
- return this.props.renderActionBarItem(slot)
- }
- } else {
- return <div id="tooltip">
- <img className="bottom-img" src="/images/actions/empty_spot.png" alt="empty spot" />
- <span className="tooltiptext">There's nothing in this space!</span>
- </div>
- }
- }
- render() {
- return (
- <div className="selected_ingredient">
- <div onDrop={this.handleDrop.bind(this, 0)} onDragOver={(e) => e.preventDefault()} draggable>
- {
- this.getIngredientImage()
- }
- </div>
- <div className="selected-slot" onDrop={this.handleDrop.bind(this, 1)} onDragOver={(e) => e.preventDefault()} draggable>
- {
- this.getSlotImage()
- }
- </div>
- </div>
- );
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement