Merge branch 'dev'

Author: stsdc

client/src/js/actions/index.js

@@ -74,12 +74,12 @@ const actions = {
     log: (value) => console.log(value),
 
     system: null,
-
     preprogram: {
-        start: function start({ blocks, motors }) {
-            console.log(motors);
-
-            const waitFor = (ms) => new Promise(r => setTimeout(r, ms));
+        start1: ({ blocks, motors, preprogram }) => (state) => {
+            const waitFor = (ms) => new Promise(r => {
+                state.sid = setTimeout(r, ms);
+                return state.sid;
+            });
             const asyncForEach = async (array, callback) => {
                 for (let index = 0; index < array.length; index++) {
                     // eslint-disable-next-line no-await-in-loop
@@ -102,28 +102,30 @@ const actions = {
             };
             const run = async () => {
                 await asyncForEach(blocks, async (block) => {
-                    const iid = setInterval(() => {
+                    state.iid = setInterval(() => {
                         console.log('[pre-program]:', block.speed, motors);
                         motors.set(block.speed, convertToArrOfDirections(block.direction));
                     }, 100);
                     await waitFor(block.time * 1000);
-                    clearInterval(iid);
+                    clearInterval(state.iid);
                 });
-                motors.stop();
+                preprogram.stop({ motors });
                 console.log('[pre-program]: Done');
             };
+            console.log(run());
+            // return { running: !state.running };
+        },
 
-            run();
+        stop: ({ motors }) => state => {
+            motors.stop();
+            clearInterval(state.iid);
+            clearTimeout(state.sid);
+            return { running: !state.running };
         },
-        add: () => state => ({
-            next: {
-                direction: 'fw',
-                speed: 0,
-                time: 0,
-                step: 1,
-            },
-            blocks: state.blocks.concat(state.next),
-        }),
+        setRunningFlag: () => state => ({ running: !state.running }),
+
+        add: () => state => ({ blocks: state.blocks.concat(state.next) }),
+
         remove: (index) => state => ({ blocks: state.blocks.filter(block => state.blocks.indexOf(block) !== index) }),
         next: {
             setDirection: dir => state => ({ direction: dir }),

client/src/js/core/index.js

@@ -26,7 +26,7 @@ const core = (actions) => {
 
     keyboard(actions.motors);
 
-    telemetry(actions, sockets);
+    // telemetry(actions, sockets);
 };
 
 export default core;

client/src/js/core/stream.js

@@ -1,4 +1,4 @@
-export const Stream = function() {
+export const Stream = function () {
     this.protocol = location.protocol === "https:" ? "wss:" : "ws:";
     this.hostname = document.location.hostname;
     this.port = 8090;

client/src/js/core/system.js

@@ -7,3 +7,9 @@ System.prototype.shutdown = function shutdown() {
         this.sockets.io.emit('shutdown');
     }
 };
+
+System.prototype.reboot = function reboot() {
+    if (this.sockets.io.connected) {
+        this.sockets.io.emit('reboot');
+    }
+};

client/src/js/state/index.js

@@ -41,15 +41,13 @@ const state = {
 
     default: {},
     preprogram: {
+        running: false,
+        iid: 0,
+        sid: 0,
         blocks: [{
             direction: 'fw',
-            speed: 70,
-            time: 3,
-        },
-        {
-            direction: 'l',
-            speed: 20,
-            time: 15,
+            speed: 1,
+            time: 1,
         }],
         next: {
             direction: 'fw',

client/src/js/view/components/settings/index.js

@@ -15,7 +15,7 @@ export const Settings = ({ state, actions }) =>
             <div role='button' class={categoryClass(state.settings.category, 'manipulator')} onmousedown={() => actions.settings.setVisibleCategory('manipulator')}>Manipulator</div>
             <div role='button' class={categoryClass(state.settings.category, 'preprogram')} onmousedown={() => actions.settings.setVisibleCategory('preprogram')}>Pre-program</div>
             {/* <li class={categoryClass(state.settings.category, 'debug')} onmousedown={() => actions.settings.setVisibleCategory('debug')}>Debug</li> */}
-            <div role='button' class={categoryClass(state.settings.category, 'clupi')} onmousedown={() => actions.settings.setVisibleCategory('clupi')}>Close-UP Imager</div>
+            <div role='button' class={categoryClass(state.settings.category, 'clupi')} onmousedown={() => actions.settings.setVisibleCategory('clupi')}>Experimental</div>
             <div role='button' class={categoryClass(state.settings.category, 'about')} onmousedown={() => actions.settings.setVisibleCategory('about')}>About</div>
         </div>
         <SettingsContent state={state} actions={actions} />

client/src/js/view/components/settings/settings-about.js

@@ -10,6 +10,14 @@ export const SettingsAbout = ({ state }) =>
                 state.system_info.video_devices.map(device => (<VideoDevice device={device} />))
             }
         </div>
+        <p>
+            Please refer to docs.turtlerover.com to know more about the control options and the Rover maintenance.
+            Feel free to contact us if you have any issue. We're constantly improving the UI, but it's still a long way to go.
+            We'd love to have you participate in the project and get any feedback!
+        </p>
+        <span>Turtle Team</span>
+        <span>[email protected]</span>
+        <span>www.turtlerover.com</span>
     </div>;
 
 const VideoDevice = ({ device }) =>

client/src/js/view/components/settings/settings-general.js

@@ -4,4 +4,6 @@ import { ButtonHold } from '../elements/button-hold';
 export const SettingsGeneral = ({ actions }) =>
     <div class="settings_content">
         <ButtonHold text='SHUTDOWN' setValue={() => actions.system.shutdown()} />
+        <ButtonHold text='REBOOT' setValue={() => actions.system.reboot()} />
+        <ButtonHold text='Restart stream' setValue={() => actions.stream.start()} />
     </div>;

client/src/js/view/components/settings/settings-manipulator.js

@@ -4,6 +4,9 @@ import { Button } from '../elements/button';
 
 export const SettingsManipulator = ({ state, actions }) =>
     <div class="settings_content">
+        <p>
+            Please refer to docs.turtlerover.com to find proper range values for your addon.
+        </p>
         <InputNumber
             label='Axis 1 max value'
             value={state.manipulator.axis1.max}
@@ -46,6 +49,6 @@ export const SettingsManipulator = ({ state, actions }) =>
             inc={actions.manipulator.gripper.incMin}
             dec={actions.manipulator.gripper.decMin} />
 
-        <Button text='Reset' setValue={() => actions.manipulator.reset(state.default.manipulator)} />
+        <Button text='Reset' value={state.default.manipulator} onclick={actions.manipulator.reset} />
 
     </div>;

client/src/js/view/components/settings/settings-preprogram.js

@@ -7,8 +7,7 @@ export const SettingsPreprogram = ({ actions, state }) =>
     <div class="settings_content">
         <div class="preprogram_content">
             <div>
-                {/* <Button text='Start' setValue={() => console.log(actions.motors)} /> */}
-                <Button text='Start' onclick={() => startMotors(state, actions)} />
+                <StartStopButton state={state} actions={actions} />
             </div>
             <div class="preprogram_content__blocks">
                 {
@@ -33,5 +32,20 @@ export const SettingsPreprogram = ({ actions, state }) =>
 const startMotors = function startMotors(state, actions) {
     const blocks = state.preprogram.blocks;
     const motors = actions.motors;
-    actions.preprogram.start({ blocks, motors });
+    const preprogram = actions.preprogram;
+    actions.preprogram.setRunningFlag();
+    actions.preprogram.start1({ blocks, motors, preprogram });
+};
+
+const stopMotors = function stopMotors(state, actions) {
+    const motors = actions.motors;
+    actions.preprogram.stop({ motors });
+};
+
+const StartStopButton = ({ state, actions }) => {
+    if (state.preprogram.running) {
+        return <Button text='Stop' onclick={() => stopMotors(state, actions)} />;
+    } else {
+        return <Button text='Start' onclick={() => startMotors(state, actions)} />;
+    }
 };