1.2.6 | Name for reference examples, prompt before exiting (#251)

* Fixed makeUnPushable/unDroppable bug, fixed animation bugs on render, and added a loading screen/overlay while waiting for view to mount

* Fixed formatting, moved render bug fix to state, removed loading screen changes

* Render changes reversed

* Resolved merge conflicts

* create new commit in different branch to hope that it didn't highlight unnecessary code

* Added makeUnDroppable/Pushable back to reference

* Added makeUnDroppable/Pushable back to autocomplete

* 1.2.3 change log

* 1.2.3 change log

* Disabled save, recover, play, and stop buttons in header and sidebar when reference is open in new tab. (#222)

* added makeSubtractive() function to enable subtractive geometry for MYR entities

* cleaned up makeSubtractive() function

* last commit broke subtractive geometry. this one fixes it.

* added make(Un)Subtractive and make(Un)Pushable commands to the editor autocompleter

* updated Reference.js and Myr.js

* added documentation for makeSubtractive/makeUnSubtractive in reference section

* changed wording in reference section

* slight change to addtive/subtractive mixins

* minor change to mixins, and also readded make(Un)Droppable() to the completer

* reverted changes to reference, fixed some formatting in MyrTour.js

* updated dependencies

* updated dependencies to use new fork of aframe-csg-meshs

* updated subtractive geometry to work with groups

* disabled save, play, stop, and recover when reference is open in new tab

* disabled buttons in sidebar via button styles rather than hiding them altogether

* added tests for subtractive functions

* re-removed makeUnDroppable/makeUnPushable from the autocomplete

* Revert "re-removed makeUnDroppable/makeUnPushable from the autocomplete"

This reverts commit 1e564c2.

* Revert "Merge branch 'dev' of github.com:samuel-zuk/MYR"

This reverts commit feade46, reversing
changes made to c4cdcd5.

* Revert "Merge branch 'dev' of https://github.com/engaging-computing/MYR into dev"

This reverts commit 1ac632d, reversing
changes made to 7dd0f1f.

* changed appearance of render/stop buttons when on reference page

* reverted merge conflicts

* increased stop/start button thickness on reference page

* let -> const

* Render button should behave properly/the same as crtl enter (#237)

* Fixed bug where view only toggle doesn't work in courses (#238)

* Render button should behave properly/the same as crtl enter

* Fixed bug where view only toggle doesn't work in courses

* removed unnecessary lines of code

* Update README.md

* View only on RefEx, ctrl+shift+s rename, eslint, and formatting galore (#244)

* ctrl+shift+s allows for naming project

* View only works on reference examples

* Fixed typo

* Removed static.json

* Formatted all files

* Configure eslint and lint all files

* Lint in CI

* Lint in CI

* Firebase import updates

* Fix eslint in firebase key for CI

* package.json version number

* Change log for 1.2.5

* Update README.md

* Error handling for reference examples and add to eslint rules (#247)

* ctrl+shift+s allows for naming project

* View only works on reference examples

* Fixed typo

* Removed static.json

* Formatted all files

* Configure eslint and lint all files

* Lint in CI

* Lint in CI

* Firebase import updates

* Fix eslint in firebase key for CI

* Fix merge conflict

* Disallow the use of var

* Prefer const to eslint

* Comment out prefer const for later

* Added eqeqeq and curly to eslint

* Error -> warn

* Update .eslintrc.json

* Update .eslintrc.json

* Update .eslintrc.json

* Update .eslintrc.json

* Update change log 1.2.5

* Prefer const is too strict for react

* add name and description for reference example when saving (#250)

* 1.2.6 change log

* Update version #

* editor with change will now show the confirmation window before exit (#252)

* Update README.md

README.md

@@ -6,12 +6,9 @@ MYR can be found online at [LearnMYR.org](https://learnmyr.org). For more inform
 ## ECG
 The Engaging Computing Group develops new technologies to enable learners—youth, teachers, undergraduates, and others— in order for them to be creative in science, engineering, and computing, and studies how these technologies improve learning. For more information about the Engaging Computing Group, please visit the [ECG website](https://sites.uml.edu/engaging-computing).
 
-## Change Log - 1.2.4 -> 1.2.5
-- ctrl+shift+s allows for the option to rename the scene by opening the save menu.
-- View only works on reference examples and courses.
-- Reference examples have error messages now.
-- All files are formatted properly.
-- Eslint is configured and runs with CircleCI.
+## Change Log - 1.2.5 -> 1.2.6
+- Saving a reference example autopopulates a name.
+- You will be prompted to save changes before leaving a scene.
 
 ## Acknowledgments
 MYR uses [Aframe](https://aframe.io), a fantastic open source project, to render objects and effects in the three dimensional space.  

package.json

@@ -1,6 +1,6 @@
 {
     "name": "myrproject",
-    "version": "1.2.5",
+    "version": "1.2.6",
     "private": false,
     "engines": {
         "node": "10.13.0"

src/actions/referenceExampleActions.js

@@ -2,6 +2,8 @@ import { render } from "./editorActions";
 
 import * as types from "../constants/ActionTypes";
 
+import * as sceneActions from "./sceneActions";
+
 const refExRef = "/apiv1/referenceExamples/";
 const header = { headers: { "content-type": "application/json" } };
 const problem = {
@@ -31,6 +33,11 @@ export function fetchReferenceExample(funcName) {
                     .then(json => {
                         dispatch(loadReferenceExample(response.status === 200 ? json : notFound));
                         dispatch(render(json.code || ""));
+                        dispatch(sceneActions.setNameDesc(
+                            {
+                                name: json.functionName,
+                                desc: "This scene was saved from the reference example: " + json.functionName,
+                            }));
                     })
                     .catch(err => {
                         dispatch(loadReferenceExample(problem));

src/components/structural/header/Header.js

@@ -49,7 +49,8 @@ class Header extends Component {
             navAwayModal: false,
             needsNewId: false, // this explicitly tells us to make a new id
             spinnerOpen: false,
-            referenceOpen: false
+            referenceOpen: false,
+            editorChange: false,
         };
     }
 
@@ -128,10 +129,25 @@ class Header extends Component {
         document.addEventListener("keydown", this.handleKeyDown.bind(this));
 
         // Warn the issue before refreshing the page
-        // TODO: Only do so if unsaved changes
-        // window.addEventListener('beforeunload', (event) => {
-        //     event.returnValue = 'You have may have unsaved changes!';
-        // });
+        try {
+            let editor = window.ace.edit("ace-editor");
+            editor.getSession().on("change", () => {
+                let text = editor.getSession().getValue();
+                if (this.props.text !== text) {
+                    this.setState({ editorChange: true });
+                } else {
+                    this.setState({ editorChange: false });
+                }
+
+            });
+        } catch (err) {
+            console.error(err);
+        }
+        window.addEventListener("beforeunload", (event) => {
+            if (this.state.editorChange) {
+                event.returnValue = "";
+            }
+        });
     }
 
     /**
@@ -382,6 +398,7 @@ class Header extends Component {
                     settings: this.props.scene.settings,
                     ts: ts,
                 }).then(() => {
+                    this.setState({editorChange: false});
                     // If we have a new projectId reload page with it
                     if (this.props.courseName) {
                         this.setState({ spinnerOpen: false });
@@ -602,11 +619,7 @@ class Header extends Component {
                     <Sidebar scene={this.props.scene} nameScene={this.props.sceneActions.nameScene} >
                         <Button
                             variant="raised"
-                            onClick={() => {
-                                if (window.confirm("Are you sure you start a new scene?\nYou will lose any unsaved work!")) {
-                                    window.location.href = window.origin;
-                                }
-                            }}
+                            onClick={() => { window.location.href = window.origin; }}
                             color="primary"
                             className="sidebar-btn">
                             <Icon className="material-icons">add</Icon>
@@ -682,11 +695,7 @@ class Header extends Component {
                     <Tooltip title="New Scene" placement="bottom-start">
                         <IconButton
                             id="new-btn"
-                            onClick={() => {
-                                if (window.confirm("Are you sure you start a new scene?\nYou will lose any unsaved work!")) {
-                                    window.location.href = window.origin;
-                                }
-                            }}
+                            onClick={() => { window.location.href = window.origin; }}
                             style={style.default}
                             className="header-btn d-none d-md-block" >
                             <Icon className="material-icons">add_circle_outline</Icon>