Initial content

README.md

@@ -1,2 +1,8 @@
 # FRCDashboard-MultiCamera
 Addon to allow toggling between multiple camera views. Great if your robot has a back camera and a front one.
+
+## Installation
+1. If it's not already there, copy the contents of `multicamera.html` to wherever in the dashboard you desire the camera to go.
+2. Change the src property of the <img> to wherever your camera source comes from.
+3. If it's not already there, copy the contents of `multicamera.css` to `style.css` in the dashboard. Of course, you can put it anywhere else you would normally put CSS.
+4. Copy the sections of `multicamera.js` to where the comments above each section say they should go. Unlike the HTML and CSS, this code should not already be there.

multicamera.css

@@ -0,0 +1,13 @@
+/* This code should already be in the dashboard, but here it is if you need it. */
+.camera {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 50vw;
+    overflow: hidden;
+    height: 80vh;
+}
+.camera img {
+    width: 50vw;
+    height: 80vh;
+}

multicamera.html

@@ -0,0 +1,2 @@
+<!-- THIS HTML SHOULD ALREADY BE ON THE PAGE. But here it is in case you removed it. -->
+<img src="PUT DEFAULT CAMERA SOURCE HERE" id="camera">

multicamera.js

@@ -0,0 +1,32 @@
+// This should be added inside the definition of the 'ui' object at the starting of ui.js.
+
+        ,
+        camera: document.getElementById('camera')
+
+// End section
+
+
+
+// Copy this portion of the code into the large switch statement in the onValueChanged function. Then change the src's.
+
+        case '/SmartDashboard/useBackCamera':
+            if (value) {
+                ui.camera.src = 'INSERT HERE THE SOURCE OF YOUR BACK CAMERA';
+            } else {
+                ui.camera.src = 'INSERT HERE THE SOURCE OF YOUR FRONT OR MAIN CAMERA';
+            }
+            break;
+
+// End Section
+
+
+
+// Add this at the bottom of ui.js with the other listeners.
+
+// Toggle between camera views
+ui.camera.onclick = function() {
+    var cameraKey = '/SmartDashboard/Drive | backCamera';
+    NetworkTables.setValue(cameraKey, !NetworkTables.getValue(cameraKey));
+};
+
+// End section