ash/WebStudio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

mic locking for touchscreens (in bootstrap)

Browse source
This commit is contained in:
Ben Allen 2020-03-28 03:06:46 +00:00
parent f3b891e308
commit 805bc73e0b
1 changed files with 10 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/showplanner/index.tsx
View file

@ -296,6 +296,7 @@ function MicControl() {
const [micList, setMicList] = useState(dummylist); const [micList, setMicList] = useState(dummylist);
const dispatch = useDispatch(); const dispatch = useDispatch();
const [micSource, setMicSource] = useState("None") const [micSource, setMicSource] = useState("None")
const [lock, setLock] = useState(false)
if (gotMicList == false){ if (gotMicList == false){
navigator.mediaDevices.enumerateDevices() navigator.mediaDevices.enumerateDevices()
@ -316,16 +317,21 @@ function MicControl() {
return temp return temp
} }
function toggleCheck(){setLock(!lock)}
return ( return (
<div className="sp-col" style={{ height: "48%", overflowY: "visible" }}> <div className="sp-col" style={{ height: "48%", overflowY: "visible" }}>
<h2>Microphone</h2> <h2>Microphone</h2>
<button <button
disabled={state.id == micSource} disabled={state.id == micSource || lock}
onClick={() => dispatch(MixerState.openMicrophone(micSource))} onClick={() => dispatch(MixerState.openMicrophone(micSource))}
> >
Open Open
</button> </button>
<div className="custom-control custom-checkbox">
<input className="custom-control-input" type="checkbox" id="micLock" onChange={toggleCheck}></input>
<label className="custom-control-label" htmlFor="micLock" style={{marginLeft:"8px"}}> Lock Microphone</label>
</div>
<select <select
className="form-control" className="form-control"
style={{ width: "100%" }} style={{ width: "100%" }}
@ -334,12 +340,11 @@ function MicControl() {
> >
<option value={"None"} disabled label="Choose a microphone"></option> <option value={"None"} disabled label="Choose a microphone"></option>
{ {
micList.map(e => { micList.map(function(e,i) {
return <option value={e.deviceId}>{e.label}</option>; return <option value={e.deviceId} key={i}>{e.label}</option>;
}) })
} }
</select> </select>
{state.openError !== null && ( {state.openError !== null && (
<div className="sp-alert"> <div className="sp-alert">
{state.openError === "NO_PERMISSION" {state.openError === "NO_PERMISSION"