lots of text and examples of artifacts

src/components/PageSwitcher/components/EEGEduHeartSpectra/EEGEduHeartSpectra.js

@@ -164,14 +164,14 @@ export function renderModule(channels) {
           );
         } else {
            return( 
-            <Card.Section>
-                <TextContainer>
-                <p> {[
-                "Press connect above to see the chart."  
-                ]} 
-                </p>
-              </TextContainer>              
-            </Card.Section>
+              <Card.Section>
+                  <TextContainer>
+                  <p> {[
+                  "Press connect above to see the chart."  
+                  ]} 
+                  </p>
+                </TextContainer>              
+              </Card.Section>
             )
         }
 

src/components/PageSwitcher/components/EEGEduRaw/EEGEduRaw.js

@@ -10,6 +10,7 @@ import { channelNames } from "muse-js";
 import { Line } from "react-chartjs-2";
 
 import { zipSamples } from "muse-js";
+import YouTube from 'react-youtube'
 
 import {
   bandpassFilter,
@@ -25,9 +26,9 @@ import { generateXTics, standardDeviation } from "../../utils/chartUtils";
 
 export function getSettings () {
   return {
-    cutOffLow: 2,
-    cutOffHigh: 20,
-    interval: 10,
+    cutOffLow: .1,
+    cutOffHigh: 100,
+    interval: 25,
     srate: 256,
     duration: 1024,
     name: 'Raw',
@@ -172,6 +173,14 @@ export function renderModule(channels) {
     }      
   }
 
+  const opts = {
+    height: '195',
+    width: '320',
+    playerVars: { // https://developers.google.com/youtube/player_parameters
+      autoplay: false
+    }
+  };
+
   return (
     <Card title={specificTranslations.title}>
       <Card.Section>
@@ -180,7 +189,6 @@ export function renderModule(channels) {
             <p> {[
               "Next we will move onto the head and look at the raw EEG data that is recorded and transmitted by the EEG headset. ",
               "If you have not already, spend a few minutes going through the Introduction Module 1, which will give you an intro into the EEG signal. " 
-
             ]} </p>
             <p>{specificTranslations.description}</p>
           </TextContainer>
@@ -195,19 +203,197 @@ export function renderModule(channels) {
           <Link url="https://github.com/NeuroTechX/eeg-101/blob/master/EEG101/src/assets/electrodediagram2.png"
                 external={true}
           > Image Source - EEG101 </Link>
+          <div style={chartStyles.wrapperStyle.style}>{renderCharts()}</div>
+
       </Card.Section>
       <Card.Section>
-        <div style={chartStyles.wrapperStyle.style}>{renderCharts()}</div>
+        <TextContainer>
+          <p> {[
+            "If you have not already, it is now time to place the muse on your head. ",
+            "Getting a good connection between the device and your head is crucial. ",
+            "The following video gives tips on how to get a great connection: "
+          ]} </p>
+          <YouTube 
+            videoId="v8xUYqqJAIg"
+            opts={opts}
+          />
+
+          <p> {[
+            "The above chart shows the data coming from each of the four eeg electrodes. ",
+            "Time, again, is on the horizontal X-axis and voltage is on the Y-axis. ",
+            "An offset has been added to the electrodes to separate them vertically. ",
+            "The saturation of the lines is controlled by the amount of noise in the data. ",
+            "That is, the cleaner the data, the more rich the colours will become. ",
+            "Conversely, when the line gets dim, there is too much noise present in the signal. "
+          ]} </p>
+        </TextContainer>      
+      </Card.Section>
+      <Card.Section title="Artifacts">
         <TextContainer>
           <p> {[
               "Before we try to use the EEG to estimate brain activity, we first need to observe what other things can influence the signal. ",
               "Artifacts refer to non-EEG noise in the EEG recording that will cloud the results we want from the brain. ",
               "There are many sources of noise that the EEG can pickup because all it is doing is recording the voltage changes on the head. ",
               "Any other source of voltage or change in resistance of the sensor can affect the signal. ",
-              "Here will will go over some of the common sources of noise in the EEG data. " 
+              "Here is a great overview of the range of possible EEG artifacts that you might come accross. " 
             ]} </p>
         </TextContainer>
+        <br />
+        <iframe src="//www.slideshare.net/slideshow/embed_code/key/BbKErrb1x7Xf3" title="dum" width="60%" height="400" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"> 
+        </iframe> 
+        <div> 
+            <Link url="//www.slideshare.net/SudhakarMarella/eeg-artifacts-15175461" external={true}>EEG artifacts</Link> 
+           from  
+            <Link url="https://www.slideshare.net/SudhakarMarella" external={true}> Sudhakar Marella</Link>
+        </div>
       </Card.Section>
+      <Card.Section title="Weekly Assignment:">
+        <TextContainer>
+          <p> {[
+              "Your assignment this week will be to record plots of four different types of EEG artifact. ",
+              "I will show you examples that I made using screenshots of the plot above. ", 
+              "You can also record data into a .csv file below and look for artifacts using Google Sheets. ", 
+              "After making your plots, play around with the filter settings above (cutoff Low and cutoff High) and observe how they change the plotted data. ", 
+              "How can we use these filters to help collect cleaner data free from some of these artifacts?"
+            ]} </p>
+        </TextContainer>  
+
+      </Card.Section>
+
+      <Card.Section title="👁️ Eye Blinks/Movements 👀">
+        <TextContainer>
+          <p> {[
+              "The eye balls create an electrical field, as they move around they create electrical potentials that are picked up by the EEG sensors. ",
+              "Also, the eye lids, as the pass over the eye, create an electrical field that is picked up by the EEG electrodes. ", 
+              "Eye movement and Blink artifacts are some of the largest and most difficult to remove from the data. ", 
+              "The best way to get clean data is to try to limit blinking and eye movements. ",
+              "These eye movement signals can also be treated as a signal of interest, called the Electrooculogram (EOG)"
+            ]} </p>
+        </TextContainer>
+        <br />
+        <p> {"Eye Blinks: "} </p>
+         <img 
+            src={ require("./blinks.png")} 
+            alt="blinks"
+            width="60%"
+            height="auto"
+          ></img>  
+          <br />
+          <p> {"Horizontal Eye Movements: "} </p>
+          <img 
+            src={ require("./horizontal.png")} 
+            alt="horizontal"
+            width="60%"
+            height="auto"
+          ></img>  
+          <br />
+          <p> {"Vertical Eye Movements: "} </p>
+          <img 
+            src={ require("./vertical.png")} 
+            alt="vertical"
+            width="60%"
+            height="auto"
+          ></img>  
+       </Card.Section>
+
+      <Card.Section title="💪🏿 Muscle Activity 💪🏻">
+        <TextContainer>
+          <p> {[
+              "When signals are sent from our brain to our muscles the motor neurons release Acetylcholine onto the muscle fibres. ",
+              "This release causes the muscles to contract, and these contractions create electrical potentials that are also picked up by electrodes. ",
+              "This signal is called the Electromyogram (EMG), and can be measured over any muscle on your body. ", 
+              "EEG electrodes therefore pickup muscle signals from your face muscles when you smile or frown, and from your chewing muscles. ", 
+              "You should make sure to not be chewing gum for this reason while recording EEG. "
+            ]} </p>
+        </TextContainer>
+        <br />
+        <p> {"Example of Jaw Clenching: "} </p>
+         <img 
+            src={ require("./muscle.png")} 
+            alt="muscle"
+            width="60%"
+            height="auto"
+          ></img>  
+          <br />
+          <p> {"Zoomed in chewing (notice the difference horizontal axis time range): "} </p>
+          <img 
+            src={ require("./muscleClose.png")} 
+            alt="muscleClose"
+            width="60%"
+            height="auto"
+          ></img>         
+       </Card.Section>
+
+      <Card.Section title="🧑‍🔧 Mechanical artifacts 🧑🏾‍🔧">
+        <TextContainer>
+          <p> {[
+              "The EEG electrodes measure the voltage of the human body between two points. Voltage, according to Ohms' law, ",
+              "is modified both by the current and by the resistance (V = IR). ", 
+              "Therefore, if current stays the same, changes in the electrical resistance of the electrode-body connection can change the voltage. ", 
+              "These changes in voltage will not be distinguishable from real changes in voltage from the brain. ",
+              "This is one reason that mobile recording of EEG is difficult, movement of the electrodes against the head leads to large voltage changes not due to brain activity. ", 
+              "Therefore we want the muse to be firmly secured to the head, as tight as possible, and we want to avoid excessive movement during recording. "
+            ]} </p>
+        </TextContainer>
+        <br />
+        <p> {"Tapping on the muse moves the electrodes against the head: "} </p>
+         <img 
+            src={ require("./mechanical.png")} 
+            alt="mechanical"
+            width="60%"
+            height="auto"
+          ></img>    
+       </Card.Section>
+
+      <Card.Section title="😓 Drifts 😰">
+        <TextContainer>
+          <p> {[
+              "Resistance between the sensor and the body leads to less current and smaller measured voltage. ", 
+              "While out salty wet skin conducts electricity well, the dry skin and air does not, nor do oils and dirt that our skin is covered in. ",
+              "Because voltage changes as resistance changes, we can sometimes see slow drifts in our EEG data as the connection strength changes. ",
+              "One example is the moment you place the muse on your head, as the resistance decreases the voltage decreases as well as you can see here. ", 
+              "These slow drifts can also occur due to sweating, which decreases the resistance slowly over time between the head and the sensor. "
+            ]} </p>
+        </TextContainer>
+        <br />
+        <p> {"When you first put on the muse or when you sweat long drifts occur: "} </p>      
+         <img 
+            src={ require("./drift.png")} 
+            alt="drift"
+            width="60%"
+            height="auto"
+          ></img>  
+       </Card.Section>              
+
+      <Card.Section title="🔌 Electrical Noise 💡">
+        <TextContainer>
+          <p> {[
+              "Finally, there is electrical noise all around you. Buildings are supplied with 120 Volts of alternating current to power our lights and electronics. ",
+              "This electrical alternates in polarity 60 times a second, allowing for much more efficient transportation accross distance locations. ", 
+              "Most of our modern electronics convert this AC electrity to DC power (usually around 5 Volts and 2 Amps). ", 
+              "All the computers in the room take in AC power from the building and convert it to DC in their power supply. ",
+              "Therefore, there is alot of 60 Hz electrical noise in any building. ", 
+              "Most EEG systems have filters to remove some of this noise, but even still, it is so strong that it is easily picked up by EEG electrodes. ", 
+              "We can use filtering to remove this type of noise from our data. "
+            ]} </p>
+        </TextContainer>
+       <br />
+        <p> {"Electical noise at 60Hz from the AC power in the room (I held my wired headphones up to one side then the other of my head): "} </p>
+         <img 
+            src={ require("./lineNoise.png")} 
+            alt="lineNoise"
+            width="60%"
+            height="auto"
+          ></img>  
+          <br />
+          <p> {"Zoomed in 60-Hz electrical noise (notice the difference horizontal axis time range): "} </p>
+          <img 
+            src={ require("./lineNoiseClose.png")} 
+            alt="lineNoiseClose"
+            width="60%"
+            height="auto"
+          ></img> 
+       </Card.Section>   
 
     </Card>
   );
@@ -286,7 +472,7 @@ export function renderRecord(recordPopChange, recordPop, status, Settings, setSe
         <p>
           {"When you are recording raw data it is recommended you "}
           {"first set the sampling point between epochs to 1, then set the epoch duration to 1. "}
-          {"Once the live chart disappears entirely you have done it correctly."}
+          {"Once the live chart disappears entirely you have done it correctly. "}
           {"This will make it so every row of the output file is a single time point and make the data much easier to work with."}
         </p>        
       </Card.Section>