Skip to content

Commit

Permalink
Merge pull request #116 from kylemath/aux2
Browse files Browse the repository at this point in the history 
[ready to deploy] Auxillary channel toggle
  • Loading branch information
@kylemath
kylemath authored Jan 7, 2020
2 parents d819ef6 + 02f2aee commit 5e4de04
Show file tree
Hide file tree
Showing 15 changed files with 322 additions and 251 deletions.
92 changes: 76 additions & 16 deletions src/components/PageSwitcher/PageSwitcher.js
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import React, { useState, useCallback } from "react";
import { MuseClient } from "muse-js";
import { Select, Card, Stack, Button, ButtonGroup } from "@shopify/polaris";
import { Select, Card, Stack, Button, ButtonGroup, Checkbox } from "@shopify/polaris";

import { mockMuseEEG } from "./utils/mockMuseEEG";
import * as translations from "./translations/en.json";
import * as generalTranslations from "./components/translations/en";
import { emptyChannelData, emptySingleChannelData } from "./components/chartOptions";
import { emptyAuxChannelData } from "./components/chartOptions";

import * as funIntro from "./components/EEGEduIntro/EEGEduIntro"
import * as funHeartRaw from "./components/EEGEduHeartRaw/EEGEduHeartRaw"
Expand Down Expand Up @@ -35,19 +35,30 @@ const predict = translations.types.predict;

export function PageSwitcher() {

// For auxEnable settings
const [checked, setChecked] = useState(false);
const handleChange = useCallback((newChecked) => setChecked(newChecked), []);
window.enableAux = checked;
if (window.enableAux) {
window.nchans = 5;
} else {
window.nchans = 4;
}
let showAux = true; // if it is even available to press (to prevent in some modules)

// data pulled out of multicast$
const [introData, setIntroData] = useState(emptyChannelData)
const [heartRawData, setHeartRawData] = useState(emptyChannelData);
const [heartSpectraData, setHeartSpectraData] = useState(emptySingleChannelData);
const [rawData, setRawData] = useState(emptyChannelData);
const [spectraData, setSpectraData] = useState(emptyChannelData);
const [bandsData, setBandsData] = useState(emptyChannelData);
const [animateData, setAnimateData] = useState(emptyChannelData);
const [spectroData, setSpectroData] = useState(emptyChannelData);
const [alphaData, setAlphaData] = useState(emptyChannelData);
const [ssvepData, setSsvepData] = useState(emptyChannelData);
const [evokedData, setEvokedData] = useState(emptyChannelData);
const [predictData, setPredictData] = useState(emptyChannelData);
const [introData, setIntroData] = useState(emptyAuxChannelData)
const [heartRawData, setHeartRawData] = useState(emptyAuxChannelData);
const [heartSpectraData, setHeartSpectraData] = useState(emptyAuxChannelData);
const [rawData, setRawData] = useState(emptyAuxChannelData);
const [spectraData, setSpectraData] = useState(emptyAuxChannelData);
const [bandsData, setBandsData] = useState(emptyAuxChannelData);
const [animateData, setAnimateData] = useState(emptyAuxChannelData);
const [spectroData, setSpectroData] = useState(emptyAuxChannelData);
const [alphaData, setAlphaData] = useState(emptyAuxChannelData);
const [ssvepData, setSsvepData] = useState(emptyAuxChannelData);
const [evokedData, setEvokedData] = useState(emptyAuxChannelData);
const [predictData, setPredictData] = useState(emptyAuxChannelData);

// pipe settings
const [introSettings] = useState(funIntro.getSettings);
Expand Down Expand Up @@ -98,6 +109,48 @@ export function PageSwitcher() {
const [recordTwoPop, setRecordTwoPop] = useState(false);
const recordTwoPopChange = useCallback(() => setRecordTwoPop(!recordTwoPop), [recordTwoPop]);

switch (selected) {
case intro:
showAux = false;
break
case heartRaw:
showAux = false;
break
case heartSpectra:
showAux = false;
break
case raw:
showAux = true;
break
case spectra:
showAux = true;
break
case bands:
showAux = true;
break
case animate:
showAux = false;
break
case spectro:
showAux = false;
break
case alpha:
showAux = true;
break
case ssvep:
showAux = true;
break
case evoked:
showAux = true;
break
case predict:
showAux = false;
break
default:
console.log("Error on showAux");
}


const chartTypes = [
{ label: intro, value: intro },
{ label: heartRaw, value: heartRaw },
Expand Down Expand Up @@ -188,6 +241,7 @@ export function PageSwitcher() {
// Connect with the Muse EEG Client
setStatus(generalTranslations.connecting);
window.source = new MuseClient();
window.source.enableAux = window.enableAux;
await window.source.connect();
await window.source.start();
window.source.eegReadings$ = window.source.eegReadings;
Expand Down Expand Up @@ -256,7 +310,7 @@ export function PageSwitcher() {
}
}

function renderCharts() {
function renderModules() {
switch (selected) {
case intro:
return <funIntro.renderModule data={introData} />;
Expand Down Expand Up @@ -368,6 +422,12 @@ export function PageSwitcher() {
{generalTranslations.disconnect}
</Button>
</ButtonGroup>
<Checkbox
label="Enable Muse Auxillary Channel"
checked={checked}
onChange={handleChange}
disabled={!showAux || status !== generalTranslations.connect}
/>
</Stack>
</Card>
<Card title={translations.title} sectioned>
Expand All @@ -379,7 +439,7 @@ export function PageSwitcher() {
/>
</Card>
{pipeSettingsDisplay()}
{renderCharts()}
{renderModules()}
{renderRecord()}
</React.Fragment>
);
Expand Down
14 changes: 6 additions & 8 deletions src/components/PageSwitcher/components/EEGEduAlpha/EEGEduAlpha.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,6 @@ export function getSettings() {
return {
cutOffLow: 2,
cutOffHigh: 20,
nbChannels: 4,
interval: 100,
bins: 256,
sliceFFTLow: 1,
Expand All @@ -53,7 +52,7 @@ export function buildPipe(Settings) {
window.pipeAlpha$ = zipSamples(window.source.eegReadings$).pipe(
bandpassFilter({
cutoffFrequencies: [Settings.cutOffLow, Settings.cutOffHigh],
nbChannels: Settings.nbChannels }),
nbChannels: window.nchans }),
epoch({
duration: Settings.duration,
interval: Settings.interval,
Expand All @@ -78,17 +77,16 @@ export function setup(setData, Settings) {
window.subscriptionAlpha = window.multicastAlpha$.subscribe(data => {
setData(alphaData => {
Object.values(alphaData).forEach((channel, index) => {
if (index < 4) {
channel.datasets[0].data = data.psd[index];
channel.xLabels = data.freqs;
}
channel.datasets[0].data = data.psd[index];
channel.xLabels = data.freqs;
});

return {
ch0: alphaData.ch0,
ch1: alphaData.ch1,
ch2: alphaData.ch2,
ch3: alphaData.ch3
ch3: alphaData.ch3,
ch4: alphaData.ch4
};
});
});
Expand All @@ -101,6 +99,7 @@ export function setup(setData, Settings) {
export function renderModule(channels) {
function renderCharts() {
return Object.values(channels.data).map((channel, index) => {
if (index === 0) {
const options = {
...generalOptions,
scales: {
Expand Down Expand Up @@ -136,7 +135,6 @@ export function renderModule(channels) {
}
};

if (index === 0) {
return (
<Card.Section key={"Card_" + index}>
<Line key={"Line_" + index} data={channel} options={options} />
Expand Down
23 changes: 11 additions & 12 deletions src/components/PageSwitcher/components/EEGEduAnimate/EEGEduAnimate.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ export function getSettings () {
return {
cutOffLow: 2,
cutOffHigh: 20,
nbChannels: 4,
interval: 16,
bins: 256,
duration: 128,
Expand All @@ -52,7 +51,7 @@ export function buildPipe(Settings) {
window.pipeAnimate$ = zipSamples(window.source.eegReadings$).pipe(
bandpassFilter({
cutoffFrequencies: [Settings.cutOffLow, Settings.cutOffHigh],
nbChannels: Settings.nbChannels }),
nbChannels: window.nchans }),
epoch({
duration: Settings.duration,
interval: Settings.interval,
Expand All @@ -76,7 +75,6 @@ export function setup(setData, Settings) {
window.subscriptionAnimate = window.multicastAnimate$.subscribe(data => {
setData(animateData => {
Object.values(animateData).forEach((channel, index) => {
if (index < 4) {
channel.datasets[0].data = [
data.delta[index],
data.theta[index],
Expand All @@ -85,14 +83,14 @@ export function setup(setData, Settings) {
data.gamma[index]
];
channel.xLabels = bandLabels;
}
});

return {
ch0: animateData.ch0,
ch1: animateData.ch1,
ch2: animateData.ch2,
ch3: animateData.ch3
ch3: animateData.ch3,
ch4: animateData.ch4
};
});
});
Expand Down Expand Up @@ -129,14 +127,15 @@ export function renderModule(channels) {
}, []);

return Object.values(channels.data).map((channel, index) => {
// console.log(channel)
if (channel.datasets[0].data) {
// console.log( channel.datasets[0].data[2])
window.delta = channel.datasets[0].data[0];
window.theta = channel.datasets[0].data[1];
window.alpha = channel.datasets[0].data[2];
window.beta = channel.datasets[0].data[3];
window.gamma = channel.datasets[0].data[4];
if (index === 1) {
// console.log( channel.datasets[0].data[2])
window.delta = channel.datasets[0].data[0];
window.theta = channel.datasets[0].data[1];
window.alpha = channel.datasets[0].data[2];
window.beta = channel.datasets[0].data[3];
window.gamma = channel.datasets[0].data[4];
}
}

let thisSketch = sketchTone;
Expand Down
92 changes: 47 additions & 45 deletions src/components/PageSwitcher/components/EEGEduBands/EEGEduBands.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,6 @@ export function getSettings () {
return {
cutOffLow: 2,
cutOffHigh: 20,
nbChannels: 4,
interval: 100,
bins: 256,
duration: 1024,
Expand All @@ -48,7 +47,7 @@ export function buildPipe(Settings) {
window.pipeBands$ = zipSamples(window.source.eegReadings$).pipe(
bandpassFilter({
cutoffFrequencies: [Settings.cutOffLow, Settings.cutOffHigh],
nbChannels: Settings.nbChannels }),
nbChannels: window.nchans }),
epoch({
duration: Settings.duration,
interval: Settings.interval,
Expand All @@ -72,23 +71,22 @@ export function setup(setData, Settings) {
window.subscriptionBands = window.multicastBands$.subscribe(data => {
setData(bandsData => {
Object.values(bandsData).forEach((channel, index) => {
if (index < 4) {
channel.datasets[0].data = [
data.delta[index],
data.theta[index],
data.alpha[index],
data.beta[index],
data.gamma[index]
];
channel.xLabels = bandLabels;
}
channel.datasets[0].data = [
data.delta[index],
data.theta[index],
data.alpha[index],
data.beta[index],
data.gamma[index]
];
channel.xLabels = bandLabels;
});

return {
ch0: bandsData.ch0,
ch1: bandsData.ch1,
ch2: bandsData.ch2,
ch3: bandsData.ch3
ch3: bandsData.ch3,
ch4: bandsData.ch4
};
});
});
Expand All @@ -101,41 +99,45 @@ export function setup(setData, Settings) {
export function renderModule(channels) {
function renderCharts() {
return Object.values(channels.data).map((channel, index) => {
const options = {
...generalOptions,
scales: {
xAxes: [
{
scaleLabel: {
...generalOptions.scales.xAxes[0].scaleLabel,
labelString: specificTranslations.xlabel
if (index < window.nchans) {
const options = {
...generalOptions,
scales: {
xAxes: [
{
scaleLabel: {
...generalOptions.scales.xAxes[0].scaleLabel,
labelString: specificTranslations.xlabel
}
}
}
],
yAxes: [
{
scaleLabel: {
...generalOptions.scales.yAxes[0].scaleLabel,
labelString: specificTranslations.ylabel
},
ticks: {
max: 25,
min: 0
],
yAxes: [
{
scaleLabel: {
...generalOptions.scales.yAxes[0].scaleLabel,
labelString: specificTranslations.ylabel
},
ticks: {
max: 25,
min: 0
}
}
}
]
},
title: {
...generalOptions.title,
text: generalTranslations.channel + channelNames[index]
}
};
]
},
title: {
...generalOptions.title,
text: generalTranslations.channel + channelNames[index]
}
};

return (
<Card.Section key={"Card_" + index}>
<Bar key={"Line_" + index} data={channel} options={options} />
</Card.Section>
);
return (
<Card.Section key={"Card_" + index}>
<Bar key={"Line_" + index} data={channel} options={options} />
</Card.Section>
);
} else {
return null
}
});
}

Expand Down
Loading

0 comments on commit 5e4de04

Please sign in to comment.