diff --git a/client/modules/IDE/actions/files.js b/client/modules/IDE/actions/files.js
index cf09198b..96bb5ce5 100644
--- a/client/modules/IDE/actions/files.js
+++ b/client/modules/IDE/actions/files.js
@@ -130,7 +130,6 @@ export function hideFileOptions(fileId) {
}
export function showEditFileName(id) {
- console.log('in show edit file name');
return {
type: ActionTypes.SHOW_EDIT_FILE_NAME,
id
diff --git a/client/modules/IDE/actions/ide.js b/client/modules/IDE/actions/ide.js
index 4cb32913..b758c915 100644
--- a/client/modules/IDE/actions/ide.js
+++ b/client/modules/IDE/actions/ide.js
@@ -37,6 +37,13 @@ export function setSelectedFile(fileId) {
};
}
+export function resetSelectedFile() {
+ return (dispatch, getState) => {
+ const state = getState();
+ setSelectedFile(state.files[1].id);
+ };
+}
+
export function dispatchConsoleEvent(...args) {
return {
type: ActionTypes.CONSOLE_EVENT,
diff --git a/client/modules/IDE/actions/project.js b/client/modules/IDE/actions/project.js
index a491de48..01937f1f 100644
--- a/client/modules/IDE/actions/project.js
+++ b/client/modules/IDE/actions/project.js
@@ -121,7 +121,6 @@ export function exportProjectAsZip() {
const state = getState();
const zip = new JSZip();
async.each(state.files, (file, cb) => {
- console.log(file);
if (file.url) {
JSZipUtils.getBinaryContent(file.url, (err, data) => {
zip.file(file.name, data, { binary: true });
diff --git a/client/modules/IDE/components/FileNode.js b/client/modules/IDE/components/FileNode.js
index 5d4d8bb4..bfe3c8f6 100644
--- a/client/modules/IDE/components/FileNode.js
+++ b/client/modules/IDE/components/FileNode.js
@@ -1,10 +1,12 @@
import React, { PropTypes } from 'react';
import * as FileActions from '../actions/files';
+import * as IDEActions from '../actions/ide';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import InlineSVG from 'react-inlinesvg';
const downArrowUrl = require('../../../images/down-arrow.svg');
import classNames from 'classnames';
+import { setSelectedFile } from '../reducers/files';
export class FileNode extends React.Component {
constructor(props) {
@@ -13,6 +15,12 @@ export class FileNode extends React.Component {
this.handleKeyPress = this.handleKeyPress.bind(this);
this.handleFileNameChange = this.handleFileNameChange.bind(this);
this.validateFileName = this.validateFileName.bind(this);
+ this.handleFileClick = this.handleFileClick.bind(this);
+ }
+
+ handleFileClick(e) {
+ e.stopPropagation();
+ this.props.setSelectedFile(this.props.id);
}
handleFileNameChange(event) {
@@ -46,63 +54,73 @@ export class FileNode extends React.Component {
render() {
let itemClass = classNames({
- 'sidebar__file-item': true,
+ 'sidebar__file-item': this.props.name !== 'root',
'sidebar__file-item--selected': this.props.isSelected,
'sidebar__file-item--open': this.props.isOptionsOpen,
'sidebar__file-item--editing': this.props.isEditingName
});
return (
-
-
{this.props.name}
-
{
- this.validateFileName();
- this.props.hideEditFileName(this.props.id);
- }}
- onKeyPress={this.handleKeyPress}
- />
-
-
+
setTimeout(() => this.props.hideFileOptions(this.props.id), 100)}
+ >
+ {(() => { // eslint-disable-line
+ if (this.props.name !== 'root') {
+ return (
+
+
{this.props.name}
+
{
+ this.validateFileName();
+ this.props.hideEditFileName(this.props.id);
+ }}
+ onKeyPress={this.handleKeyPress}
+ />
+
+
+
+ );
+ }
+ })()}
{(() => { // eslint-disable-line
- console.log(this.props.children);
if (this.props.children) {
return (
@@ -124,22 +142,21 @@ FileNode.propTypes = {
isOptionsOpen: PropTypes.bool,
isEditingName: PropTypes.bool,
setSelectedFile: PropTypes.func.isRequired,
- fileIndex: PropTypes.number.isRequired,
showFileOptions: PropTypes.func.isRequired,
hideFileOptions: PropTypes.func.isRequired,
deleteFile: PropTypes.func.isRequired,
- resetSelectedFile: PropTypes.func.isRequired,
showEditFileName: PropTypes.func.isRequired,
hideEditFileName: PropTypes.func.isRequired,
- updateFileName: PropTypes.func.isRequired
+ updateFileName: PropTypes.func.isRequired,
+ resetSelectedFile: PropTypes.func.isRequired
};
function mapStateToProps(state, ownProps) {
- return state.files.find((file) => file.id === ownProps.id);
+ return setSelectedFile(state.files, state.ide.selectedFile).find((file) => file.id === ownProps.id);
}
function mapDispatchToProps(dispatch) {
- return bindActionCreators(FileActions, dispatch);
+ return bindActionCreators(Object.assign(FileActions, IDEActions), dispatch);
}
const ConnectedFileNode = connect(mapStateToProps, mapDispatchToProps)(FileNode);
diff --git a/client/modules/IDE/components/Sidebar.js b/client/modules/IDE/components/Sidebar.js
index 7fae0857..395bba71 100644
--- a/client/modules/IDE/components/Sidebar.js
+++ b/client/modules/IDE/components/Sidebar.js
@@ -13,7 +13,7 @@ class Sidebar extends React.Component {
}
resetSelectedFile() {
- this.props.setSelectedFile(this.props.files[0].id);
+ this.props.setSelectedFile(this.props.files[1].id);
}
render() {
@@ -50,7 +50,7 @@ class Sidebar extends React.Component {
-
+ { /*
{this.props.files.map((file, fileIndex) =>
)}
-
+
*/ }
);
diff --git a/client/modules/IDE/pages/IDEView.js b/client/modules/IDE/pages/IDEView.js
index b90224bb..14a19320 100644
--- a/client/modules/IDE/pages/IDEView.js
+++ b/client/modules/IDE/pages/IDEView.js
@@ -24,7 +24,6 @@ import About from '../components/About';
class IDEView extends React.Component {
constructor(props) {
- console.log(props);
super(props);
this._handleConsolePaneOnDragFinished = this._handleConsolePaneOnDragFinished.bind(this);
this._handleSidebarPaneOnDragFinished = this._handleSidebarPaneOnDragFinished.bind(this);
diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js
index ab4ee3e7..b12fac71 100644
--- a/client/modules/IDE/reducers/files.js
+++ b/client/modules/IDE/reducers/files.js
@@ -33,6 +33,11 @@ const defaultCSS =
// if the project has never been saved,
const initialState = [
+ {
+ name: 'root',
+ id: '0',
+ children: ['1', '2', '3']
+ },
{
name: 'sketch.js',
content: defaultSketch,
@@ -47,11 +52,6 @@ const initialState = [
name: 'style.css',
content: defaultCSS,
id: '3'
- },
- {
- name: 'root',
- id: '0',
- children: ['1', '2', '3']
}];