Merge pull request #4 from empatica/diagram-integration

Diagram integration
empatica · Jun 7, 2018 · 35e3843 · 35e3843
2 parents acaaf8b + 5ae1ca8
commit 35e3843
Show file tree

Hide file tree

Showing 5 changed files with 39 additions and 20 deletions.
diff --git a/images/E4_streaming_server_scheme.jpg b/images/E4_streaming_server_scheme.jpg
diff --git a/stylesheets/stylesheet.css b/stylesheets/stylesheet.css
@@ -244,6 +244,20 @@ ul, ol, dl {
   margin-bottom: 20px;
 }
 
+figure {
+    margin: 30px;
+}
+
+figure img {
+    display: block;
+    height: auto;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+figcaption {
+    padding: 10px;
+}
 
 /* COMMON STYLES */
 

diff --git a/windows-streaming-server-commands.html b/windows-streaming-server-commands.html
@@ -54,7 +54,7 @@ <h6>Updated May, 2018</h6>
                 <section id="main_content">
 
                     <h3>
-                        General message structure
+                        General Message Structure
                     </h3>
 
 
@@ -86,12 +86,12 @@ <h3>
                     <p></p>
 
                     <h3>
-                        <a id="commands-responses" class="anchor" href="#commands-responses" aria-hidden="true"></a>Commands and Responses Details
+                        Commands and Responses Details
                     </h3>
 
 
                     <h4>
-                        <a id="device-discover-list" class="anchor" href="#device-discover-list" aria-hidden="true"></a>List of discovered BTLE devices (manual BTLE)
+                        List of Discovered BTLE Devices (Manual BTLE)
                     </h4>
                     <p></p>
 
@@ -120,7 +120,7 @@ <h4>
                     <p>The strings <strong>allowed</strong> and <strong>not_allowed</strong> indicate if the devices are allowed to be used with the given API key.</p>
 
                     <h4>
-                        <a id="device-connect-btle" class="anchor" href="#device-connect-btle" aria-hidden="true"></a>Connect device over BTLE (manual BTLE)
+                        Connect Device over BTLE (Manual BTLE)
                     </h4>
                     <p></p>
 
@@ -145,7 +145,7 @@ <h4>
                     <p></p>
 
                     <h4>
-                        <a id="list-available-devices" class="anchor" href="#list-available-devices" aria-hidden="true"></a>List of devices connected over BTLE
+                        List of Devices Connected over BTLE
                     </h4>
                     <p></p>
 
@@ -170,8 +170,8 @@ <h4>
                     </div>
                     <p></p>
 
-                    <h4>
-                        <a id="connect-device" class="anchor" href="#connect-device" aria-hidden="true"></a>Connect to a Device
+                    <h4 id="connect-device">
+                        Connect to a Device
                     </h4>
                     <p></p>
 
@@ -198,7 +198,7 @@ <h4>
                     <p></p>
 
                     <h4>
-                        <a id="disconnect-device" class="anchor" href="#disconnect-device" aria-hidden="true"></a>Disconnect from a Device
+                        Disconnect from a Device
                     </h4>
                     <p></p>
 
@@ -217,8 +217,8 @@ <h4>
                     </div>
                     <p></p>
 
-                    <h4>
-                        <a id="subscribe-receive-data" class="anchor" href="#subscribe-receive-data" aria-hidden="true"></a>Subscribe and Unsubscribe to Data Stream
+                    <h4 id="subscribe-receive-data">
+                        Subscribe and Unsubscribe to Data Stream
                     </h4>
                     <p></p>
 
@@ -262,7 +262,7 @@ <h4>
                     <p></p>
 
                     <h4>
-                        <a id="suspend-data-streaming" class="anchor" href="#suspend-data-streaming" aria-hidden="true"></a>Suspend and resume data streaming
+                        Suspend and Resume Data Streaming
                     </h4>
                     <p></p>
 
@@ -286,7 +286,7 @@ <h4>
 
                     <p>To pause the stream specify <strong>ON</strong> and to resume <strong>OFF</strong>.</p>
 
-                    <a id="protocol-example" class="anchor" href="#protocol-example" aria-hidden="true"></a><h3>Protocol Example (no manual BTLE)</h3>
+                    <h3 id="protocol-example">Protocol Example (no Manual BTLE)</h3>
                     <p></p>
 
                     <pre>[OPEN TCP CONNECTION]
@@ -312,7 +312,7 @@ <h4>
 
 [EOF]</pre><p></p>
 
-                    <h3>Protocol Example (manual BTLE)</h3>
+                    <h3>Protocol Example (Manual BTLE)</h3>
                     <p></p>
 
                     <pre>[OPEN TCP CONNECTION]

diff --git a/windows-streaming-server-usage.html b/windows-streaming-server-usage.html
@@ -54,7 +54,7 @@ <h6>Updated May, 2018</h6>
                 <section id="main_content">
 
                     <h3>
-                        <a id="requirements" class="anchor" href="#requirements" aria-hidden="true"></a>Requirements
+                        Requirements
                     </h3>
 
                     <ul>
@@ -65,13 +65,13 @@ <h3>
                     </ul>
                     <p></p>
                     <h3>
-                        <a id="installation" class="anchor" href="#installation" aria-hidden="true"></a>Installation
+                        Installation
                     </h3>
 
                     <p>Download the latest release of the E4 streaming server for Windows from <a href="http://get.empatica.com/win/EmpaticaBLEServer.html">here</a></p>
 
                     <h3>
-                        <a id="configuration" class="anchor" href="#configuration" aria-hidden="true"></a>Configuration
+                        Configuration
                     </h3>
 
                     <p>The first time you start the server you will see the settings panel that allows you to set:</p>
@@ -87,7 +87,7 @@ <h3>
                     <p>Click the "Save" button after the configurations are made.</p>
 
                     <h3>
-                        <a id="using-server" class="anchor" href="#using-server" aria-hidden="true"></a>Using the server
+                        Using the server
                     </h3>
 
                     <p>You will see the default view of the server, click the "Start" button.</p>
@@ -115,7 +115,7 @@ <h3>
                     <p></p>
 
                     <h3>
-                        <a id="using-server-cmd" class="anchor" href="#using-server-cmd" aria-hidden="true"></a>Running the server from other code or scripts
+                        Running the Server from Other Code or Scripts
                     </h3>
                     <p>The E4 streaming server can be run without GUI, passing the connection information and API key as startup arguments:</p>
 
@@ -129,7 +129,7 @@ <h3>
                     <p>When running the E4 streaming server without GUI, the settings won't be saved and are only active during this execution. Also, BTLE connections have to be handled manually through the commands.</p>
 
                     <h3>
-                        <a id="troubleshooting" class="anchor" href="#troubleshooting" aria-hidden="true"></a>Troubleshooting
+                        Troubleshooting
                     </h3>
 
                     <strong>When I click "Save" in settings panel, I see the "Invalid Api key" message</strong>

diff --git a/windows-streaming-server.html b/windows-streaming-server.html
@@ -57,7 +57,12 @@ <h6>Updated May, 2018</h6>
 
                     <p>The E4 streaming server allows to forward <strong>realtime data</strong> of multiple Empatica E4 devices to multiple TCP socket connections. Please note that each TCP connection can receive data from only one Empatica E4 device. To connect to multiple devices, multiple TCP connections are required.<br/>
                     The E4 streaming server is intended to make the data streams available to scripts and applications. However, the data streams can also be easily accessed e.g. for testing purposes with <a href="https://en.wikipedia.org/wiki/Telnet">Telnet</a>.</p>
-
+
+                    <figure>
+                        <img style="width: 600px;" src="images/E4_streaming_server_scheme.jpg"/>
+                        <figcaption><strong>Figure 1:</strong> Illustration of the connectivity and function of the E4 streaming server. On one side are E4s, connected over BTLE to the E4 streaming server using the BLED112 dongle. On the other side are TCP clients, connected to the E4 streaming server through TCP connections over the network. The lines originating from the E4s illustrate the data flow from the E4 through the E4 streaming server to the subscribed TCP client. For example, the data from the first E4 is forwarded by the E4 streaming server to the first and third TCP client.</figcaption>
+                    </figure>
+
                     <h3>Getting Started</h3>
                     <p></p>