merge with master

client/components/Nav.js

@@ -8,7 +8,7 @@ function Nav(props) {
         <li className="nav__item">
           <a
             className="nav__new"
-            onClick={props.createProject}
+            onClick={props.newProject}
           >
             New
           </a>
@@ -21,6 +21,16 @@ function Nav(props) {
             Save
           </a>
         </li>
+        <li className="nav__item" onClick={props.cloneProject}>
+          <a className="nav__clone">
+            Duplicate
+          </a>
+        </li>
+        <li className="nav__item">
+          <a className="nav__export" onClick={props.exportProjectAsZip}>
+            Download
+          </a>
+        </li>
         <li className="nav__item">
           <p className="nav__open">
             <Link to="/sketches">
@@ -28,16 +38,6 @@ function Nav(props) {
             </Link>
           </p>
         </li>
-        <li className="nav__item">
-          <a className="nav__export" onClick={props.exportProjectAsZip}>
-            Export (zip)
-          </a>
-        </li>
-        <li className="nav__item">
-          <a className="nav__clone" onClick={props.cloneProject}>
-            Clone
-          </a>
-        </li>
       </ul>
       <ul className="nav__items-right" title="user-menu">
         <li className="nav__item">
@@ -50,7 +50,7 @@ function Nav(props) {
 }
 
 Nav.propTypes = {
-  createProject: PropTypes.func.isRequired,
+  newProject: PropTypes.func.isRequired,
   saveProject: PropTypes.func.isRequired,
   exportProjectAsZip: PropTypes.func.isRequired,
   cloneProject: PropTypes.func.isRequired,

client/constants.js

@@ -26,6 +26,7 @@ export const SET_PROJECT_NAME = 'SET_PROJECT_NAME';
 export const PROJECT_SAVE_SUCCESS = 'PROJECT_SAVE_SUCCESS';
 export const PROJECT_SAVE_FAIL = 'PROJECT_SAVE_FAIL';
 export const NEW_PROJECT = 'NEW_PROJECT';
+export const RESET_PROJECT = 'RESET_PROJECT';
 
 export const SET_PROJECT = 'SET_PROJECT';
 export const SET_PROJECTS = 'SET_PROJECTS';

client/modules/IDE/actions/project.js

@@ -52,6 +52,9 @@ export function setProjectName(event) {
 export function saveProject() {
   return (dispatch, getState) => {
     const state = getState();
+    if (state.user.id && state.project.owner && state.project.owner.id !== state.user.id) {
+      return;
+    }
     const formParams = Object.assign({}, state.project);
     formParams.files = [...state.files];
     if (state.project.id) {
@@ -116,7 +119,6 @@ export function createProject() {
 
 export function exportProjectAsZip() {
   return (dispatch, getState) => {
-    console.log('exporting project!');
     const state = getState();
     const zip = new JSZip();
     async.each(state.files, (file, cb) => {
@@ -139,6 +141,13 @@ export function exportProjectAsZip() {
   };
 }
 
+export function newProject() {
+  browserHistory.push('/');
+  return {
+    type: ActionTypes.RESET_PROJECT
+  };
+}
+
 export function cloneProject() {
   return (dispatch, getState) => {
     const state = getState();

client/modules/IDE/components/Editor.js

@@ -89,6 +89,8 @@ class Editor extends React.Component {
         this._cm.setOption('mode', 'htmlmixed');
       }
     }
+
+    console.log('componentDidUpdate in editor');
   }
 
   componentWillUnmount() {

client/modules/IDE/pages/IDEView.js

@@ -39,6 +39,7 @@ class IDEView extends React.Component {
 
     this.consoleSize = this.props.ide.consoleIsExpanded ? 180 : 29;
     this.sidebarSize = this.props.ide.sidebarIsExpanded ? 180 : 20;
+    this.forceUpdate();
   }
 
   componentWillUpdate(nextProps) {
@@ -66,11 +67,18 @@ class IDEView extends React.Component {
         this.autosaveInterval = null;
       }
     }
+
+    if (this.autosaveInterval && !this.props.project.id) {
+      clearInterval(this.autosaveInterval);
+      this.autosaveInterval = null;
+    }
   }
 
   componentWillUnmount() {
     clearInterval(this.autosaveInterval);
     this.autosaveInterval = null;
+    this.consoleSize = undefined;
+    this.sidebarSize = undefined;
   }
 
   _handleConsolePaneOnDragFinished() {
@@ -82,6 +90,7 @@ class IDEView extends React.Component {
   }
 
   _handleSidebarPaneOnDragFinished() {
+    console.log('setting sidebar size');
     this.sidebarSize = this.refs.sidebarPane.state.draggedSize;
     this.refs.sidebarPane.setState({
       resized: false,
@@ -94,7 +103,7 @@ class IDEView extends React.Component {
       <div className="ide">
         <Nav
           user={this.props.user}
-          createProject={this.props.createProject}
+          newProject={this.props.newProject}
           saveProject={this.props.saveProject}
           exportProjectAsZip={this.props.exportProjectAsZip}
           cloneProject={this.props.cloneProject}
@@ -132,6 +141,7 @@ class IDEView extends React.Component {
             ref="sidebarPane"
             onDragFinished={this._handleSidebarPaneOnDragFinished}
             allowResize={this.props.ide.sidebarIsExpanded}
+            minSize={20}
           >
             <Sidebar
               files={this.props.files}
@@ -230,7 +240,7 @@ IDEView.propTypes = {
     authenticated: PropTypes.bool.isRequired,
     id: PropTypes.string
   }).isRequired,
-  createProject: PropTypes.func.isRequired,
+  newProject: PropTypes.func.isRequired,
   saveProject: PropTypes.func.isRequired,
   ide: PropTypes.shape({
     isPlaying: PropTypes.bool.isRequired,

client/modules/IDE/reducers/files.js

@@ -71,6 +71,8 @@ const files = (state = initialState, action) => {
       return [...action.files];
     case ActionTypes.SET_PROJECT:
       return [...action.files];
+    case ActionTypes.RESET_PROJECT:
+      return initialState;
     case ActionTypes.CREATE_FILE:
       return [...state, { name: action.name, id: action.id, content: '', url: action.url }];
     case ActionTypes.SHOW_FILE_OPTIONS:

client/modules/IDE/reducers/ide.js

@@ -43,6 +43,8 @@ const ide = (state = initialState, action) => {
       return Object.assign({}, state, { preferencesIsVisible: true });
     case ActionTypes.CLOSE_PREFERENCES:
       return Object.assign({}, state, { preferencesIsVisible: false });
+    case ActionTypes.RESET_PROJECT:
+      return initialState;
     default:
       return state;
   }

client/modules/IDE/reducers/project.js

@@ -20,6 +20,8 @@ const project = (state = initialState, action) => {
         name: action.project.name,
         owner: action.owner
       };
+    case ActionTypes.RESET_PROJECT:
+      return initialState;
     default:
       return state;
   }

client/modules/Sketch/pages/SketchListView.js

@@ -17,7 +17,7 @@ class SketchListView extends React.Component {
       <div className="sketch-list">
         <Nav
           user={this.props.user}
-          createProject={this.props.createProject}
+          newProject={this.props.newProject}
           saveProject={this.props.saveProject}
           exportProjectAsZip={this.props.exportProjectAsZip}
           cloneProject={this.props.cloneProject}
@@ -47,7 +47,7 @@ class SketchListView extends React.Component {
 
 SketchListView.propTypes = {
   user: PropTypes.object.isRequired,
-  createProject: PropTypes.func.isRequired,
+  newProject: PropTypes.func.isRequired,
   saveProject: PropTypes.func.isRequired,
   getProjects: PropTypes.func.isRequired,
   sketches: PropTypes.array.isRequired,

client/styles/layout/_ide.scss

@@ -44,6 +44,7 @@
   width: 100%;
   position: absolute;
   z-index: 10;
+  display: none;
 }
 
 .toolbar {