diff --git a/src/components/Blockly/msg/de/ui.js b/src/components/Blockly/msg/de/ui.js index 1c46bfe..9513304 100644 --- a/src/components/Blockly/msg/de/ui.js +++ b/src/components/Blockly/msg/de/ui.js @@ -39,6 +39,7 @@ export const UI = { tooltip_trashcan_delete: 'Blöcke endgültig löschen', tooltip_project_title: "Titel des Projektes", tooltip_check_solution: "Lösung kontrollieren", + tooltip_copy_code: "Code in die Zwischenablage kopieren", /** * Messages @@ -62,6 +63,7 @@ export const UI = { messages_newblockly_text: "Die neue Blockly-Version befindet sich derzeit in der Testphase. Wenn Sie einen Fehler finden, melden Sie diesen bitte in unserem [Forum](https://forum.sensebox.de/t/neue-blockly-version-beta-test-und-feedback/1176). Eine Übersicht über alle neuen Funktionen finden Sie [hier](/news)", messages_GET_TUTORIAL_FAIL: 'Zurück zur Tutorials-Übersicht', messages_LOGIN_FAIL: 'Der Benutzername oder das Passwort ist nicht korrekt.', + messages_copy_code: "Code wurde in die Zwischenablage kopiert", /** * Share Dialog */ diff --git a/src/components/Blockly/msg/en/ui.js b/src/components/Blockly/msg/en/ui.js index 7f2c061..eb11219 100644 --- a/src/components/Blockly/msg/en/ui.js +++ b/src/components/Blockly/msg/en/ui.js @@ -41,6 +41,7 @@ export const UI = { tooltip_trashcan_delete: "empty trashcan", tooltip_project_title: "Project title", tooltip_check_solution: "Check solution", + tooltip_copy_code: "Copy Code to clipboard", /** * Messages @@ -65,6 +66,7 @@ export const UI = { messages_GET_TUTORIAL_FAIL: 'Back to tutorials overview', messages_LOGIN_FAIL: 'The username or password is incorrect.', messages_login_error: "Enter both a username and a password.", + messages_copy_code: "Copy code to clipboard succesfull", /** * Share Dialog */ diff --git a/src/components/Workspace/CopyCode.js b/src/components/Workspace/CopyCode.js new file mode 100644 index 0000000..99b148b --- /dev/null +++ b/src/components/Workspace/CopyCode.js @@ -0,0 +1,99 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; +import { workspaceName } from '../../actions/workspaceActions'; + +import { withStyles } from '@material-ui/core/styles'; +import Button from '@material-ui/core/Button'; +import IconButton from '@material-ui/core/IconButton'; +import Tooltip from '@material-ui/core/Tooltip'; + +import { faCopy } from "@fortawesome/free-solid-svg-icons"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import * as Blockly from 'blockly/core'; +import Snackbar from '../Snackbar'; + + +const styles = (theme) => ({ + backdrop: { + zIndex: theme.zIndex.drawer + 1, + color: '#fff', + }, + iconButton: { + backgroundColor: theme.palette.primary.main, + color: theme.palette.primary.contrastText, + width: '40px', + height: '40px', + '&:hover': { + backgroundColor: theme.palette.primary.main, + color: theme.palette.primary.contrastText, + } + }, + button: { + backgroundColor: theme.palette.button.copycode, + color: theme.palette.primary.contrastText, + '&:hover': { + backgroundColor: theme.palette.button.copycode, + color: theme.palette.primary.contrastText, + } + } +}); + + +class CopyCode extends Component { + + constructor(props) { + super(props); + this.state = { + snackbar: false, + }; + } + + + copyCode = () => { + navigator.clipboard.writeText(this.props.arduino) + this.setState({ snackbar: true, type: 'success', key: Date.now(), message: Blockly.Msg.messages_copy_code }); + } + + render() { + return ( +
+ {this.props.iconButton ? + + this.copyCode()} + > + + + + : + + } + + +
+ ); + }; +} + +CopyCode.propTypes = { + arduino: PropTypes.string.isRequired, + name: PropTypes.string, + workspaceName: PropTypes.func.isRequired +}; + +const mapStateToProps = state => ({ + arduino: state.workspace.code.arduino, + name: state.workspace.name +}); + + +export default connect(mapStateToProps, { workspaceName })(withStyles(styles, { withTheme: true })(CopyCode)); diff --git a/src/components/Workspace/WorkspaceFunc.js b/src/components/Workspace/WorkspaceFunc.js index 8c8ae31..68e3741 100644 --- a/src/components/Workspace/WorkspaceFunc.js +++ b/src/components/Workspace/WorkspaceFunc.js @@ -12,6 +12,7 @@ import Screenshot from './Screenshot'; import ShareProject from './ShareProject'; import ResetWorkspace from './ResetWorkspace'; import DeleteProject from './DeleteProject'; +import CopyCode from './CopyCode'; class WorkspaceFunc extends Component { @@ -21,7 +22,7 @@ class WorkspaceFunc extends Component { {!this.props.assessment ? - : !this.props.multiple ? + : !this.props.multiple ? + : null} + + {!this.props.multiple ? + : null} - {this.props.user && !this.props.multiple? + + {this.props.user && !this.props.multiple ? - : null} + : null} {!this.props.multiple ? - - : null} + + : null} - {!this.props.assessment && !this.props.multiple? + + {!this.props.assessment && !this.props.multiple ? - : null} + : null} - {!this.props.assessment && !this.props.multiple? - - : null} + {!this.props.assessment && !this.props.multiple ? + + : null} {this.props.projectType !== 'gallery' && !this.props.assessment ? - :null} + : null} {!this.props.multiple ? - - : null} + : null} {!this.props.assessment && (this.props.projectType === 'project' || this.props.projectType === 'gallery') && this.props.user && this.props.user.email === this.props.project.creator ? - :null} + : null} );