lfajardo
/
cloud_bbb
mirror of https://github.com/sualko/cloud_bbb
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: add copy to clipboard for readonly inputs 

password field and moderator url
pull/120/head
sualko 2021-01-23 12:02:38 +01:00
parent 88a992fa12
commit 24094b6d79
2 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ts/Manager/App.scss
View File

@ -224,6 +224,12 @@ pre {
background-color: var(--color-success) !important;
}
}
input.icon-clippy {
background-position: 8px center;
cursor: pointer;
padding-left: 32px;
}
}
.bbb-form-element {

5
ts/Manager/EditRoomDialog.tsx
View File

@ -1,4 +1,5 @@
import React, { useState, useEffect } from 'react';
import { CopyToClipboard } from 'react-copy-to-clipboard';
import { Access, Room, Permission, RoomShare, api, Restriction } from '../Common/Api';
import Dialog from './Dialog';
import ShareWith from './ShareWith';
@ -80,7 +81,7 @@ const EditRoomDialog: React.FC<Props> = ({ room, restriction, updateProperty, op
return <option key={key} value={key}>{label}</option>;
})}
</select>
{(value === Access.Password && room.password) && <input type="text" readOnly={true} value={room.password} />}
{(value === Access.Password && room.password) && <CopyToClipboard text={room.password}><input type="text" readOnly={true} className="icon-clippy" value={room.password} /></CopyToClipboard>}
{descriptions[field] && <em>{descriptions[field]}</em>}
</div>
);
@ -133,7 +134,7 @@ const EditRoomDialog: React.FC<Props> = ({ room, restriction, updateProperty, op
onChange={(event) => updateProperty('moderatorToken', event.target.checked ? 'true' : null)} />
<label htmlFor={`bbb-moderatorToken-${room.id}`}>{t('bbb', 'Moderator access via URL')}</label>
</div>
{!!room.moderatorToken && <input type="text" readOnly={true} value={api.getRoomUrl(room, true)} />}
{!!room.moderatorToken && <CopyToClipboard text={api.getRoomUrl(room, true)}><input type="text" readOnly={true} className="icon-clippy" value={api.getRoomUrl(room, true)} /></CopyToClipboard>}
<em>{descriptions.moderatorToken}</em>
</div>