schuelerlabor-cleverlab/smarti
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

link id to 5 digits

Browse Source
This commit is contained in:
fab-scm 2022-08-12 10:28:10 +02:00
parent 89a5c838bf
commit 57142dc8a1
1 changed files with 30 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/components/Workspace/ShareProject.js
View File

@ -4,6 +4,7 @@ import { connect } from "react-redux";
import { shareProject } from "../../actions/projectActions"; import { shareProject } from "../../actions/projectActions";
import { clearMessages } from "../../actions/messageActions"; import { clearMessages } from "../../actions/messageActions";
import QRCode from 'qrcode.react'; import QRCode from 'qrcode.react';
import { createId } from "mnemonic-id";
import moment from "moment"; import moment from "moment";
@ -135,7 +136,7 @@ class WorkspaceFunc extends Component {
const requestOptions = { const requestOptions = {
method: 'POST', method: 'POST',
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ "slug": `blockly-${id}`, "url": `${window.location.origin}/share/${id}` }) body: JSON.stringify({ "slug": `blockly-${createId(5)}`, "url": `${window.location.origin}/share/${id}` })
}; };
fetch('https://www.snsbx.de/api/shorty', requestOptions) fetch('https://www.snsbx.de/api/shorty', requestOptions)
.then(response => response.json()) .then(response => response.json())
@ -191,34 +192,37 @@ class WorkspaceFunc extends Component {
<Typography> <Typography>
Über den folgenden Link kannst du dein Programm teilen: Über den folgenden Link kannst du dein Programm teilen:
</Typography> </Typography>
<a <div style={{ textAlign: "center" }}>
href={this.state.shortLink} <a
onClick={() => this.toggleDialog()} href={this.state.shortLink}
className={this.props.classes.link} onClick={() => this.toggleDialog()}
target="_blank" className={this.props.classes.link}
>{this.state.shortLink}</a> target="_blank"
<Tooltip rel="noreferrer"
>{this.state.shortLink}</a>
<Tooltip
title={Blockly.Msg.tooltip_copy_link} title={Blockly.Msg.tooltip_copy_link}
arrow arrow
style={{ marginRight: "5px" }} style={{ marginRight: "5px" }}
>
<IconButton
onClick={() => {
navigator.clipboard.writeText(
this.state.shortLink
);
this.setState({
snackbar: true,
key: Date.now(),
message: Blockly.Msg.messages_copylink_success,
type: "success",
});
}}
> >
<FontAwesomeIcon icon={faCopy} size="xs" /> <IconButton
</IconButton> onClick={() => {
</Tooltip> navigator.clipboard.writeText(
<div style={{ display: 'flex', justifyContent: 'center' }}> this.state.shortLink
);
this.setState({
snackbar: true,
key: Date.now(),
message: Blockly.Msg.messages_copylink_success,
type: "success",
});
}}
>
<FontAwesomeIcon icon={faCopy} size="xs" />
</IconButton>
</Tooltip>
</div>
<div style={{ marginTop: "10px", display: 'flex', justifyContent: 'center' }}>
<QRCode <QRCode
id="qr-gen" id="qr-gen"
value={this.state.shortLink} value={this.state.shortLink}
@ -227,12 +231,7 @@ class WorkspaceFunc extends Component {
includeMargin={false} includeMargin={false}
/> />
</div> </div>
<div style={{ display: 'flex', justifyContent: 'center', marginTop: '10px'}}> <div style={{ display: 'flex', justifyContent: 'center', marginTop: '20px'}}>
{/* <Tooltip title={Blockly.Msg.tooltip_download_qrcode} arrow>
<IconButton onClick={() => this.downloadQRCode()} className={`download QR Code ${this.props.classes.button}`}>
<FontAwesomeIcon icon={faDownload} size="xs" />
</IconButton>
</Tooltip> */}
<Button className={`download QR Code ${this.props.classes.button}`} onClick={() => this.downloadQRCode()} variant="contained" startIcon={<FontAwesomeIcon icon={faDownload} size="xs" />}> <Button className={`download QR Code ${this.props.classes.button}`} onClick={() => this.downloadQRCode()} variant="contained" startIcon={<FontAwesomeIcon icon={faDownload} size="xs" />}>
Download QR code Download QR code
</Button> </Button>