Updated how to for 1.7.0

src/docs/assets/index.js

@@ -25,6 +25,7 @@ import mapEditor from "./MapEditor.mp4";
 import filteringMaps from "./FilteringMaps.mp4";
 import groupAndRemovingTokens from "./GroupAndRemovingTokens.mp4";
 import filteringTokens from "./FilteringTokens.mp4";
+import usingNotes from "./UsingNotes.mp4";
 
 const assets = {
   defaultMaps,
@@ -54,6 +55,7 @@ const assets = {
   filteringMaps,
   groupAndRemovingTokens,
   filteringTokens,
+  usingNotes,
 };
 
 export default assets;

src/docs/howTo/usingFog.md

@@ -8,15 +8,15 @@ The Fog Tool allows you to add hidden areas to control what the other party memb
 
 A summary of the Fog Tool options are listed below.
 
-| Option        | Description                                                          | Shortcut                                       |
+| Option        | Description                                        | Shortcut                                       |
-| ------------- | -------------------------------------------------------------------- | ---------------------------------------------- |
+| ------------- | -------------------------------------------------- | ---------------------------------------------- |
-| Fog Polygon   | Click to add points to a fog shape                                   | P, Enter (Accept Shape), Escape (Cancel Shape) |
+| Fog Polygon   | Click to add points to a fog shape                 | P, Enter (Accept Shape), Escape (Cancel Shape) |
-| Fog Brush     | Drag to add a free form fog shape                                    | B                                              |
+| Fog Rectangle | Drag to add a rectangle fog shape                  | R                                              |
-| Toggle Fog    | Click a fog shape to hide/show it                                    | T                                              |
+| Fog Brush     | Drag to add a free form fog shape                  | B                                              |
-| Remove Fog    | Click a fog shape to remove it                                       | R                                              |
+| Toggle Fog    | Click a fog shape to hide/show it                  | T                                              |
-| Add Fog       | When selected drawing a fog shape will add it to the scene           | Alt (Toggle)                                   |
+| Erase Fog     | Click a fog shape to remove it                     | E                                              |
-| Subtract Fog  | When selected drawing a fog shape will subtract it from other shapes | Alt (Toggle)                                   |
+| Fog Cutting   | Enables/Disables fog cutting                       | C, Alt (Toggle)                                |
-| Edge Snapping | Enables/Disables edge snapping                                       | S                                              |
+| Edge Snapping | Enables/Disables edge snapping                     | S                                              |
-| Fog Preview   | Enables/Disables a preview of the final fog shapes                   | F                                              |
+| Fog Preview   | Enables/Disables a preview of the final fog shapes | F                                              |
-| Undo          | Undo a fog action                                                    | Ctrl + Z                                       |
+| Undo          | Undo a fog action                                  | Ctrl + Z                                       |
-| Redo          | Redo a fog action                                                    | Ctrl + Shift + Z                               |
+| Redo          | Redo a fog action                                  | Ctrl + Shift + Z                               |

src/docs/howTo/usingMeasure.md

@@ -4,9 +4,10 @@ The Measure Tool allows you to find how far one point on a map is from another p
 
 A summary of the Measure Tool options are listed below.
 
-| Option              | Description                                                                        | Shortcut |
+| Option                        | Description                                                                              | Shortcut |
-| ------------------- | ---------------------------------------------------------------------------------- | -------- |
+| ----------------------------- | ---------------------------------------------------------------------------------------- | -------- |
-| Grid Distance       | This is the distance on a grid and is the metric used in D&D                       | G        |
+| Grid Distance                 | This is the distance on a grid and is the metric used in D&D                             | G        |
-| Line Distance       | This is the actual distance between the two points of the measure tool             | L        |
+| Alternating Diagonal Distance | This is the distance on a grid with diagonals alternating between 1 square and 2 squares | A        |
-| City Block Distance | This is the distance when only travelling in the horizontal or vertical directions | C        |
+| Line Distance                 | This is the actual distance between the two points of the measure tool                   | L        |
-| Scale               | This allows you to enter a custom scale and unit value to apply                    |          |
+| City Block Distance           | This is the distance when only travelling in the horizontal or vertical directions       | C        |
+| Scale                         | This allows you to enter a custom scale and unit value to apply                          |          |

src/docs/howTo/usingNotes.md

@@ -0,0 +1,3 @@
+The notes tool allows you to write and share notes for other players to see.
+
+![Using Notes](usingNotes)

src/routes/HowTo.js

@@ -20,6 +20,7 @@ const usingMeasure = raw("../docs/howTo/usingMeasure.md");
 const sharingAudio = raw("../docs/howTo/sharingAudio.md");
 const usingPointer = raw("../docs/howTo/usingPointer.md");
 const usingTimer = raw("../docs/howTo/usingTimer.md");
+const usingNotes = raw("../docs/howTo/usingNotes.md");
 
 function HowTo() {
   const location = useLocation();
@@ -111,6 +112,14 @@ function HowTo() {
             <Markdown source={usingPointer} assets={assets} />
           </Accordion>
         </div>
+        <div id="usingNotes">
+          <Accordion
+            heading="Using the Notes Tool"
+            defaultOpen={location.hash === "#usingNotes"}
+          >
+            <Markdown source={usingNotes} assets={assets} />
+          </Accordion>
+        </div>
         <div id="usingTimer">
           <Accordion
             heading="Using the Countdown Timer"