diff --git a/web/package.json b/web/package.json index 98f786e8..e6adad40 100644 --- a/web/package.json +++ b/web/package.json @@ -38,6 +38,7 @@ "react-dom": "^17.0.1", "react-hook-form": "^6.11.0", "react-hooks-global-state": "^1.0.1", + "react-responsive": "^8.1.1", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", "react-scripts": "^4.0.0", diff --git a/web/public/illustrations/alcohol__cotton_swabs__medical_tape.png b/web/public/illustrations/alcohol__cotton_swabs__medical_tape.png new file mode 100644 index 00000000..46c8c585 Binary files /dev/null and b/web/public/illustrations/alcohol__cotton_swabs__medical_tape.png differ diff --git a/web/public/illustrations/chip.png b/web/public/illustrations/chip.png deleted file mode 100644 index 62a00fdb..00000000 Binary files a/web/public/illustrations/chip.png and /dev/null differ diff --git a/web/public/illustrations/ec2.png b/web/public/illustrations/ec2.png deleted file mode 100644 index b12c9c6b..00000000 Binary files a/web/public/illustrations/ec2.png and /dev/null differ diff --git a/web/public/illustrations/ec2_ten20.png b/web/public/illustrations/ec2_ten20.png new file mode 100644 index 00000000..c4a3e321 Binary files /dev/null and b/web/public/illustrations/ec2_ten20.png differ diff --git a/web/public/illustrations/electrode.png b/web/public/illustrations/electrode.png deleted file mode 100644 index 260187e3..00000000 Binary files a/web/public/illustrations/electrode.png and /dev/null differ diff --git a/web/public/illustrations/gauze_electrodes.png b/web/public/illustrations/gauze_electrodes.png index 3606fc50..82fd6ef0 100644 Binary files a/web/public/illustrations/gauze_electrodes.png and b/web/public/illustrations/gauze_electrodes.png differ diff --git a/web/public/illustrations/gauze_pads.png b/web/public/illustrations/gauze_pads.png deleted file mode 100644 index 8a596295..00000000 Binary files a/web/public/illustrations/gauze_pads.png and /dev/null differ diff --git a/web/public/illustrations/hypafix.png b/web/public/illustrations/hypafix.png deleted file mode 100644 index f45bf4f0..00000000 Binary files a/web/public/illustrations/hypafix.png and /dev/null differ diff --git a/web/public/illustrations/hypafix__gauze_wrap.png b/web/public/illustrations/hypafix__gauze_wrap.png new file mode 100644 index 00000000..2d20f9f7 Binary files /dev/null and b/web/public/illustrations/hypafix__gauze_wrap.png differ diff --git a/web/public/illustrations/measuring_tape.png b/web/public/illustrations/measuring_tape.png deleted file mode 100644 index 9a207fc7..00000000 Binary files a/web/public/illustrations/measuring_tape.png and /dev/null differ diff --git a/web/public/illustrations/medical_tape.png b/web/public/illustrations/medical_tape.png deleted file mode 100644 index 44bb1372..00000000 Binary files a/web/public/illustrations/medical_tape.png and /dev/null differ diff --git a/web/public/illustrations/open_bci__electrodes__batteries.png b/web/public/illustrations/open_bci__electrodes__batteries.png new file mode 100644 index 00000000..2ab98c7a Binary files /dev/null and b/web/public/illustrations/open_bci__electrodes__batteries.png differ diff --git a/web/public/illustrations/pen_tape.png b/web/public/illustrations/pen_tape.png new file mode 100644 index 00000000..c3db0d13 Binary files /dev/null and b/web/public/illustrations/pen_tape.png differ diff --git a/web/public/illustrations/sd.png b/web/public/illustrations/sd.png index c6f7d6ca..fd8d1b5b 100644 Binary files a/web/public/illustrations/sd.png and b/web/public/illustrations/sd.png differ diff --git a/web/public/img/cyton_connections.png b/web/public/img/cyton_connections.png new file mode 100644 index 00000000..d59bcd91 Binary files /dev/null and b/web/public/img/cyton_connections.png differ diff --git a/web/public/img/ganglion_connections.png b/web/public/img/ganglion_connections.png new file mode 100644 index 00000000..06d08a91 Binary files /dev/null and b/web/public/img/ganglion_connections.png differ diff --git a/web/public/img/impedance_btn.png b/web/public/img/impedance_btn.png new file mode 100644 index 00000000..f877989a Binary files /dev/null and b/web/public/img/impedance_btn.png differ diff --git a/web/public/instructions/res_1.jpg b/web/public/instructions/res_1.jpg index a982c3e7..a9f36a46 100644 Binary files a/web/public/instructions/res_1.jpg and b/web/public/instructions/res_1.jpg differ diff --git a/web/public/instructions/res_2.jpg b/web/public/instructions/res_2.jpg index a1382ee8..1b70a9d6 100644 Binary files a/web/public/instructions/res_2.jpg and b/web/public/instructions/res_2.jpg differ diff --git a/web/public/instructions/res_3.jpg b/web/public/instructions/res_3.jpg index efce7e6a..ef53bae2 100644 Binary files a/web/public/instructions/res_3.jpg and b/web/public/instructions/res_3.jpg differ diff --git a/web/public/instructions/res_4.jpg b/web/public/instructions/res_4.jpg index 5b0153b2..c75131aa 100644 Binary files a/web/public/instructions/res_4.jpg and b/web/public/instructions/res_4.jpg differ diff --git a/web/public/instructions/res_5.jpg b/web/public/instructions/res_5.jpg index 13789b2d..d79274cf 100644 Binary files a/web/public/instructions/res_5.jpg and b/web/public/instructions/res_5.jpg differ diff --git a/web/public/instructions/res_6.jpg b/web/public/instructions/res_6.jpg index bb0bd24e..4fa84b60 100644 Binary files a/web/public/instructions/res_6.jpg and b/web/public/instructions/res_6.jpg differ diff --git a/web/src/components/alternating_text_image.js b/web/src/components/alternating_text_image.js deleted file mode 100644 index 9a78bbb1..00000000 --- a/web/src/components/alternating_text_image.js +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; -import { Row, Col } from 'reactstrap'; - -const AlternatingTextImage = ({ elements }) => - elements.map(({ title, text, image }, i) => { - const textElement = ( - <> -
{text}
- > - ); - - const imageElement ={text}
; + + if (isTabletOrMobile || !image) { + return ( +{bodyText}
+| {element} | diff --git a/web/src/views/home/hero/hero.js b/web/src/views/home/hero/hero.js index 1562437a..804ce025 100644 --- a/web/src/views/home/hero/hero.js +++ b/web/src/views/home/hero/hero.js @@ -6,6 +6,7 @@ import HeaderSeparator from 'components/header_separator'; import { RecordMyOwnSleepButton, PreviewButton } from 'components/buttons'; import Logo from 'assets/img/logo.png'; +import PolyCortexFull from 'assets/img/polycortex_full.png'; import './style.css'; @@ -42,12 +43,7 @@ class Hero extends React.Component {
- To ensure that skin contact is good, it is important to measure the impedance between the electrodes. - Start by measuring the impedance between your active electrode and its reference (e.g.: Fpz and Cz). - Also, check the impedance between the reference electrodes of each channel (Cz and Oz) and the ground - electrode (A2). As a rule of thumb, low impedance (10 KOhms) is good and high ones are bad (let’s say - 150 KOhms). -
-- Tie the electrodes together with a hair tie, and if you have long hair, tie them all together in order - to avoid static during the night. To limit electromagnetic interferences you may want to place your - board in some sort of Faraday cage, for example, a plastic container wrapped up in aluminium foil. -
-- First thing you need is the OpenBCI GUI in order to use the hardware. Therefrom, select{' '} - Live (from <boardname>) as your source. If you’re using a Cyton board we suggest you use a - microSD card using FAT32 format. If you do so, do not forget to select at least 12 hour maximum for - the write to SD card parameter. Otherwise, you must keep your computer near and open for the whole night and - log the data to a session file. If you do it this way, do not forget to select the OpenBCI file output and - to select No Limit as your max file duration. When everything is configured properly, you can press{' '} - Start Session. Before pressing Start Stream, press Hardware Settings and configure - everything as follow: -
- -- Do not forget to deactivate all unused channels by greying out the numbered colored pill on the left of the - signal in the GUI. You can now press Start data stream. If you are using a microSD card and a Cyton - board, you may want to pull off the dongle from its usb port. Data will be written to the SD card for the - configured amount of time. -
-- You must keep a journal (accurate to the minute) and write down a few information to help us track and - analyze your sleep: -
-
-
-
-
You will need to provide this information in order to score your EEG recording.
-- In order to take the electrodes off your scalp, you can use warm water for the EC2 to come off easily. The - Hypafix, used for electrodes over the skin, should be taken off with warm water and/or rubbing alcohol. - Prefer taking them off slowly, since they can hurt sensible skin if removed too quickly. Don’t forget to - clean your electrodes using warm water and soap. -
-- Remove the microSD card from the board and insert it in your computer. Then, open OpenBCI GUI and select{' '} - PLAYBACK (from file) as your data source. Use the Convert SD for playback option and select - your sd file. Wait a little bit and you will get the converted csv file. Upload this one to this website - in order to score your sleep -
-- After stopping the stream, go to the Recordings directory where your session file. Just upload this file - in order to score your sleep and analyze your data. -
-- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et - dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip - ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu - fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia - deserunt mollit anim id est laborum. -
- - -+ Now that you have your recorded sleep data file, you will need to install and run the sleep analysis server. + Then, you will be able to submit your recorded data to the Polydodo sleep analysis algorithm. When you are ready + to proceed, perhaps after a sip of coffee, it's right there: +
+ +Here is how you need to connect your electrodes to the OpenBCI board you are using:
+
+
+
+
+ + The headers pins of the electrodes can be disconnected rather easily. Make sure that no pressure is exerted on + the wire at any time. On our side, we decided to tap the wire on its container, in order to avoid such a + scenario. It is now time to power your OpenBCI device. We suggest full charged batteries, since the device + will be powered on for several hours. +
++ Pour a small amount of abrasive paste where your Fpz mark is and exfoliate the skin with a cotton swab until + it begins to turn pink. Using rubbing alcohol and a cotton swab, wipe away the skin several times in order to + remove dead skin. Repeat this for all marked locations. +
++ First, make sure your electrodes are clean. For more info on how to wash them, see the Wake Up section below. + Then, follow these three steps: +
++ Finally, take the gauze pad with the electrode and the EC2 and place it on the marked area. Exerce a small + pressure on the gauze square with your palm. The electrode should stay in place. The EC2 conductive paste + should take a couple minutes to dry (try to avoid sudden movements). Repeat these steps for the two others + scalp electrodes. +
++ As with the scalp electrodes' first step, fill the electrode cup with a good amount of Ten20. Afterwards, + cutoff a small piece of Hypafix. Place the electrode over the mark and apply the Hypafix medical tape tightly. + The electrode should be secured under the tape. +
+
diff --git a/web/src/views/record_my_sleep/sections/electrodes_placement_section/index.js b/web/src/views/record_my_sleep/sections/electrodes_placement_section/index.js
new file mode 100644
index 00000000..3ac45d6d
--- /dev/null
+++ b/web/src/views/record_my_sleep/sections/electrodes_placement_section/index.js
@@ -0,0 +1,68 @@
+import BadgeBulletPoint from 'components/badge_bullet_point';
+import React from 'react';
+import { Alert, Container } from 'reactstrap';
+
+import ElectrodesDisplay from './electrodes_display';
+
+const ElectrodesPlacementSection = () => (
+ + First, you need to know where to place the electrodes. You will need the soft tape measure to measure the head + according to the 10-20 placement system and then you will mark as precisely as possible each electrode's + location using a marker. The montage is composed of the Fpz-Cz and Pz-Oz channels to which we add a driven + ground electrode placed at A2. This montage is based on an alternative electrode placement for sleep analysis + [Sweden, Kemp, Kamphuisen and Velde, 1990]. +
++ First thing you need is the + + + OpenBCI GUI + + + in order to use the hardware. Therefrom, select Live (from <boardname>) as your source. If + you’re using a Cyton board we suggest you use a microSD card using FAT32 format. If you do so, do not forget to + select at least + 12 hour maximum for the write to SD card parameter. +
++ Otherwise, you must keep your computer near and open for the whole night and log the data to a session file. If + you do it this way, do not forget to select the OpenBCI file output and to select + No Limit as your max file duration. When everything is configured properly, you can press + Start Session. Before pressing Start Stream, press Hardware Settings and configure + everything as follow: +
++ Do not forget to deactivate all unused channels by greying out the numbered colored pill on the left of the + signal in the GUI. You can now press Start data stream. If you are using a microSD card and a Cyton + board, you may want to pull off the dongle from its usb port. Data will be written to the SD card for the + configured amount of time. +
++ On these photos, we can clearly see the application of the electrodes. Please ignore the electrodes placed + at chin and eye level (they were used for manual data scoring purposes). For this recording, we used the + Cyton board and a microSD card. We put the board in a disposable plastic container that we covered with + aluminum foil, to limit EMIs. Then, we put the container in a camera bag worn with a shoulder strap to be + able to carry the board on us. +
+ ++ Here is a comprehensive guide that explains how to record your own EEG data with an OpenBCI board. The proposed + method ensures that the recorded data will be compatible with Polydodo. This guide presents the list of needed + materials, the positioning of the electrodes, their placement, as well as their connection. After, it will focus + on configuring the OpenBCI boards and on what to do overnight. Be sure to follow our tips and tricks on how to + maintain a good signal to noise ratio. Note that the supplies and the application methods are meant to follow + best practices and to provide good quality data. +
++ If you'd first like to see what the sleep analysis looks like, check out the preview. +
+ ++ During the night, you must keep a journal, accurate to the minute, and write down a few information to help us + track and analyze your sleep: +
+This information must be given when filling out the upload form for your EEG data file.
++ If you already own an OpenBCI board and some basic EEG equipment, you could have very little to buy except a few + things from the drugstore. Some of the brands that we mention have their equivalent and can be replaced. We do + not advertise the mentionned products, but we have used them and found them useful and of good quality. +
+
+ + In order to take the electrodes off your scalp, you can use warm water for the EC2 to come off easily. The + Hypafix, used for electrodes over the skin, should be taken off with warm water and/or rubbing alcohol. Prefer + taking them off slowly, since they can hurt sensible skin if removed too quickly. Don’t forget to clean your + electrodes. To do this, you can fill a sink with hot water and soap, then use cotton swabs to remove the paste + from the electrodes. Do not leave the electrodes in hot water for too long, as this may damage them. Dry them. +
++ If you used a microSD card, remove it from the board and insert it in your computer. If you used the session + file way, after stopping the stream, go to the Recordings directory where should be stored your session file. +
+