kitchen-simulator 5.0.0-test.4 → 5.0.0-test.5

package/src/components/toolbar/main/Alert.js

@@ -1,122 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import CheckCircleIcon from '@material-ui/icons/CheckCircle';
-import ErrorIcon from '@material-ui/icons/Error';
-import InfoIcon from '@material-ui/icons/Info';
-import CloseIcon from '@material-ui/icons/Close';
-import { amber, green } from '@material-ui/core/colors';
-import IconButton from '@material-ui/core/IconButton';
-import Snackbar from '@material-ui/core/Snackbar';
-import SnackbarContent from '@material-ui/core/SnackbarContent';
-import WarningIcon from '@material-ui/icons/Warning';
-import { makeStyles } from '@material-ui/core/styles';
-
-const variantIcon = {
-  success: CheckCircleIcon,
-  warning: WarningIcon,
-  error: ErrorIcon,
-  info: InfoIcon
-};
-
-const useStyles1 = makeStyles(theme => ({
-  success: {
-    backgroundColor: green[600]
-  },
-  error: {
-    backgroundColor: theme.palette.error.dark
-  },
-  info: {
-    backgroundColor: theme.palette.primary.main
-  },
-  warning: {
-    backgroundColor: amber[700]
-  },
-  icon: {
-    fontSize: 20
-  },
-  iconVariant: {
-    opacity: 0.9,
-    marginRight: theme.spacing(1)
-  },
-  message: {
-    display: 'flex',
-    alignItems: 'center'
-  }
-}));
-
-function MySnackbarContentWrapper(props) {
-  const classes = useStyles1();
-  const { className, message, onClose, variant, ...other } = props;
-  const Icon = variantIcon[variant];
-
-  return (
-    <SnackbarContent
-      className={clsx(classes[variant], className)}
-      aria-describedby="client-snackbar"
-      message={
-        <span id="client-snackbar" className={classes.message}>
-          <Icon className={clsx(classes.icon, classes.iconVariant)} />
-          {message}
-        </span>
-      }
-      action={[
-        <IconButton
-          key="close"
-          aria-label="close"
-          color="inherit"
-          onClick={onClose}
-        >
-          <CloseIcon className={classes.icon} />
-        </IconButton>
-      ]}
-      {...other}
-    />
-  );
-}
-
-MySnackbarContentWrapper.propTypes = {
-  className: PropTypes.string,
-  message: PropTypes.string,
-  onClose: PropTypes.func,
-  variant: PropTypes.oneOf(['error', 'info', 'success', 'warning']).isRequired
-};
-
-export function Alert_Drawing_2D() {
-  const [open, setOpen] = React.useState(true);
-
-  const handleClose = (event, reason) => {
-    if (reason === 'clickaway') {
-      return;
-    }
-    setOpen(false);
-  };
-
-  return (
-    <Snackbar
-      anchorOrigin={{
-        vertical: 'bottom',
-        horizontal: 'left'
-      }}
-      open={open}
-      autoHideDuration={6000}
-      onClose={handleClose}
-    >
-      <MySnackbarContentWrapper
-        onClose={handleClose}
-        variant="info"
-        style={{
-          position: 'fixed',
-          top: '90px',
-          paddingRight: '35px',
-          borderRadius: '6px',
-          textAlign: 'center',
-          zIndex: '11',
-          backgroundColor: '#409bc5',
-          left: 'calc(50% - 136px)'
-        }}
-        message="Press ESC key to finish drawing!"
-      />
-    </Snackbar>
-  );
-}

package/src/components/toolbar/main/TakePictureModal.jsx

@@ -1,104 +0,0 @@
-import React, { useState, useCallback } from 'react';
-import { withStyles } from '@material-ui/core/styles';
-import Button from '@material-ui/core/Button';
-import MuiDialogContent from '@material-ui/core/DialogContent';
-import DialogActions from '@material-ui/core/DialogActions';
-import Cropper from 'react-easy-crop';
-import { TakePictureDialog } from './styles';
-
-const DialogContent = withStyles(theme => ({
-  root: {
-    padding: theme.spacing(0),
-    minWidth: 550,
-    minHeight: 335,
-    '&:first-child': {
-      paddingTop: 0
-    }
-  }
-}))(MuiDialogContent);
-
-export default function TakePictureModal(props) {
-  const [crop, setCrop] = useState({ x: 0, y: 0 });
-  const [zoom, setZoom] = useState(1);
-  const [cropped, setCropped] = useState({
-    width: 100,
-    height: 100,
-    x: 0,
-    y: 0
-  });
-  const onCropComplete = useCallback((croppedArea, croppedAreaPixels) => {
-    // console.log(croppedArea, croppedAreaPixels)
-    setCropped(croppedAreaPixels);
-  }, []);
-
-  return (
-    <TakePictureDialog
-      open={props.isModalVisible}
-      onClose={props.cancel}
-      aria-labelledby="alert-dialog-title"
-      aria-describedby="alert-dialog-description"
-    >
-      <DialogContent>
-        <Cropper
-          image={props.imageUri}
-          crop={crop}
-          zoom={zoom}
-          aspect={4 / 3}
-          onCropChange={setCrop}
-          onCropComplete={onCropComplete}
-          onZoomChange={setZoom}
-        />
-      </DialogContent>
-      <DialogActions style={{ backgroundColor: '#41403F' }}>
-        <Button
-          onClick={e => {
-            let img = new Image();
-            let canvas = document.createElement('canvas');
-            let ctx = canvas.getContext('2d');
-
-            // Set width and height for the new canvas
-            let heightAtt = document.createAttribute('height');
-            heightAtt.value = document.getElementsByClassName(
-              'reactEasyCrop_CropArea reactEasyCrop_CropAreaGrid'
-            )[0].clientHeight;
-            canvas.setAttributeNode(heightAtt);
-
-            let widthAtt = document.createAttribute('width');
-            widthAtt.value = document.getElementsByClassName(
-              'reactEasyCrop_CropArea reactEasyCrop_CropAreaGrid'
-            )[0].clientWidth;
-            canvas.setAttributeNode(widthAtt);
-
-            ctx.fillStyle = 'white';
-            ctx.fillRect(0, 0, canvas.width, canvas.height);
-
-            img.crossOrigin = 'anonymous';
-            img.src = props.imageUri;
-
-            img.onload = () => {
-              ctx.drawImage(
-                img,
-                cropped.x,
-                cropped.y,
-                cropped.width,
-                cropped.height,
-                0,
-                0,
-                canvas.width,
-                canvas.height
-              );
-              props.ok(canvas.toDataURL());
-            };
-          }}
-          color="primary"
-          style={{ minWidth: 80, marginLeft: '-35px' }}
-        >
-          Save
-        </Button>
-        <Button onClick={props.cancel} color="primary">
-          Cancel
-        </Button>
-      </DialogActions>
-    </TakePictureDialog>
-  );
-}

package/src/components/toolbar/main/confirm-popup.jsx

@@ -1,99 +0,0 @@
-import React from 'react';
-import styled from 'styled-components';
-import Dialog from '@material-ui/core/Dialog';
-import {
-  DEFAULT_FONT_FAMILY,
-  TEXT_COLOR_NEUTRAL_1,
-  SECONDARY_PURPLE_COLOR,
-  BG_COLOR_HOVER
-} from '../../../constants';
-
-const StyledDialog = styled(Dialog)`
-  .MuiDialog-paperWidthSm {
-    border-radius: 10px;
-  }
-`;
-
-const StyledDialogContent = styled.span`
-  font-family: ${DEFAULT_FONT_FAMILY};
-  color: ${TEXT_COLOR_NEUTRAL_1};
-  padding: 25px 30px;
-  padding-bottom: 10px;
-`;
-
-const StyledDialogAction = styled.div`
-  display: flex;
-  justify-content: space-evenly;
-  padding: 10px 30px 25px;
-`;
-
-const StyledButton = styled.div`
-  padding: 10px 20px;
-  cursor: pointer;
-  margin-right: 10px;
-  color: ${SECONDARY_PURPLE_COLOR};
-  font-weight: bold;
-  font-family: ${DEFAULT_FONT_FAMILY};
-  font-size: 16px;
-  border-radius: 20px;
-  :hover {
-    background-color: ${BG_COLOR_HOVER};
-  }
-`;
-
-class ConfirmPopup extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  closePanel() {
-    this.props.handleConfirmLoad();
-  }
-  render() {
-    let { visible } = this.props;
-    return (
-      <StyledDialog open={visible} onClose={() => this.closePanel()}>
-        <StyledDialogContent>
-          All items will be removed from the canvas.
-          <br />
-          Are you sure?
-        </StyledDialogContent>
-        <StyledDialogAction>
-          <StyledButton onClick={() => this.props.submit()}>OK</StyledButton>
-          <StyledButton onClick={() => this.closePanel()}>Cancel</StyledButton>
-        </StyledDialogAction>
-      </StyledDialog>
-      // <div style={{ width: '100%', height: '100%', display: visible ? 'block' : 'none', userSelect: 'none' }}>
-      //   <S.Div>
-      //     <div style={{ backgroundColor: '#1183B7', height: '30px', paddingRight: '6px' }}>
-      //       <div style={{ float: 'right', marginTop: '4px' }} onClick={() => this.closePanel()}>
-      //         <S.IconButton><FaTimes /></S.IconButton>
-      //       </div>
-      //     </div>
-      //     <div style={{ fontSize: 14, marginTop: 20, marginLeft: 40 }}>
-      //       All items will be removed from the canvas.<br/>
-      //       Are you sure?
-      //     </div>
-      //     <div style={{ fontSize: 12, display: 'flex', flexDirection: 'column', position: 'relative' }}>
-      //     </div>
-      //     <div style={{ display: 'flex', position: 'relative'}}>
-      //       <div style={{ width: '70px', marginLeft: '90px', marginTop: '15px', cursor: 'pointer' }} onClick={() => { this.props.submit()}}>
-      //         <img width={'80px'} style={{ float: 'right' }} src={'/assets/img/svg/toolbar/use_button.svg'} />
-      //         <S.ButtonTitle1>
-      //           {'Yes'}
-      //         </S.ButtonTitle1>
-      //       </div>
-      //       <div style={{ width: '70px', marginLeft: '40px', marginTop: '15px', cursor: 'pointer' }} onClick={() => this.closePanel()}>
-      //         <img width={'80px'} style={{ float: 'right' }} src={'/assets/img/svg/toolbar/cancel_button.svg'} />
-      //         <S.ButtonTitle2>
-      //           {'No'}
-      //         </S.ButtonTitle2>
-      //       </div>
-      //     </div>
-      //   </S.Div>
-      // </div>
-    );
-  }
-}
-
-export default ConfirmPopup;