2016-06-22 19:58:23 +00:00
|
|
|
import * as ActionTypes from '../../../constants';
|
2016-08-24 03:01:20 +00:00
|
|
|
import objectID from 'bson-objectid';
|
2016-05-05 21:48:26 +00:00
|
|
|
|
2016-07-06 19:09:05 +00:00
|
|
|
const defaultSketch = `function setup() {
|
2016-06-23 22:29:55 +00:00
|
|
|
createCanvas(400, 400);
|
2016-05-09 22:28:38 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function draw() {
|
2016-06-23 22:29:55 +00:00
|
|
|
background(220);
|
2016-07-06 19:09:05 +00:00
|
|
|
}`;
|
|
|
|
|
|
|
|
|
|
const defaultHTML =
|
2016-07-12 01:54:08 +00:00
|
|
|
`<!DOCTYPE html>
|
2016-07-06 19:09:05 +00:00
|
|
|
<html>
|
|
|
|
|
<head>
|
2016-07-12 15:13:09 +00:00
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.min.js"></script>
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/addons/p5.dom.min.js"></script>
|
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/addons/p5.sound.min.js"></script>
|
2016-07-12 01:54:08 +00:00
|
|
|
<link rel="stylesheet" type="text/css" href="style.css">
|
2016-07-06 19:09:05 +00:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<script src="sketch.js"></script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|
`;
|
|
|
|
|
|
2016-07-12 01:54:08 +00:00
|
|
|
const defaultCSS =
|
|
|
|
|
`html, body {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
}
|
|
|
|
|
`;
|
2016-07-08 18:57:22 +00:00
|
|
|
|
2016-08-24 03:01:20 +00:00
|
|
|
function initialState() {
|
|
|
|
|
const a = objectID().toHexString();
|
|
|
|
|
const b = objectID().toHexString();
|
|
|
|
|
const c = objectID().toHexString();
|
2016-08-24 17:09:48 +00:00
|
|
|
const r = objectID().toHexString();
|
2016-08-24 03:01:20 +00:00
|
|
|
return [
|
|
|
|
|
{
|
|
|
|
|
name: 'root',
|
2016-08-24 17:09:48 +00:00
|
|
|
id: r,
|
|
|
|
|
_id: r,
|
2016-08-25 21:32:27 +00:00
|
|
|
children: [a, b, c],
|
|
|
|
|
type: 'folder'
|
2016-08-24 03:01:20 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: 'sketch.js',
|
|
|
|
|
content: defaultSketch,
|
2016-08-24 17:09:48 +00:00
|
|
|
id: a,
|
|
|
|
|
_id: a,
|
2016-08-25 21:32:27 +00:00
|
|
|
isSelected: true,
|
|
|
|
|
type: 'file'
|
2016-08-24 03:01:20 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: 'index.html',
|
|
|
|
|
content: defaultHTML,
|
2016-08-24 17:09:48 +00:00
|
|
|
id: b,
|
2016-08-25 21:32:27 +00:00
|
|
|
_id: b,
|
|
|
|
|
type: 'file'
|
2016-08-24 03:01:20 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: 'style.css',
|
|
|
|
|
content: defaultCSS,
|
2016-08-24 17:09:48 +00:00
|
|
|
id: c,
|
2016-08-25 21:32:27 +00:00
|
|
|
_id: c,
|
|
|
|
|
type: 'file'
|
2016-08-24 03:01:20 +00:00
|
|
|
}];
|
|
|
|
|
}
|
2016-07-06 19:09:05 +00:00
|
|
|
|
2016-08-24 03:01:20 +00:00
|
|
|
const files = (state, action) => {
|
|
|
|
|
if (state === undefined) {
|
|
|
|
|
state = initialState(); // eslint-disable-line
|
|
|
|
|
}
|
2016-06-23 22:29:55 +00:00
|
|
|
switch (action.type) {
|
2016-07-07 17:50:52 +00:00
|
|
|
case ActionTypes.UPDATE_FILE_CONTENT:
|
2016-07-06 19:09:05 +00:00
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.name !== action.name) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
|
2016-07-07 17:50:52 +00:00
|
|
|
return Object.assign({}, file, { content: action.content });
|
2016-07-06 19:09:05 +00:00
|
|
|
});
|
2016-07-19 22:26:46 +00:00
|
|
|
case ActionTypes.SET_BLOB_URL:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.name !== action.name) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
return Object.assign({}, file, { blobURL: action.blobURL });
|
|
|
|
|
});
|
2016-06-23 22:29:55 +00:00
|
|
|
case ActionTypes.NEW_PROJECT:
|
2016-07-06 21:29:07 +00:00
|
|
|
return [...action.files];
|
2016-06-29 16:52:16 +00:00
|
|
|
case ActionTypes.SET_PROJECT:
|
2016-07-06 21:29:07 +00:00
|
|
|
return [...action.files];
|
2016-08-12 16:45:26 +00:00
|
|
|
case ActionTypes.RESET_PROJECT:
|
2016-08-24 19:36:37 +00:00
|
|
|
return initialState();
|
2016-08-23 23:40:47 +00:00
|
|
|
case ActionTypes.CREATE_FILE: // eslint-disable-line
|
2016-08-24 20:06:28 +00:00
|
|
|
{
|
|
|
|
|
const newState = state.map((file) => {
|
|
|
|
|
if (file.id === action.parentId) {
|
|
|
|
|
const newFile = Object.assign({}, file);
|
|
|
|
|
newFile.children = [...newFile.children, action.id];
|
|
|
|
|
return newFile;
|
|
|
|
|
}
|
|
|
|
|
return file;
|
|
|
|
|
});
|
2016-08-25 21:32:27 +00:00
|
|
|
return [...newState, { name: action.name, id: action.id, _id: action._id, content: action.content, url: action.url, type: 'file' }];
|
2016-08-24 20:06:28 +00:00
|
|
|
}
|
2016-08-03 19:11:59 +00:00
|
|
|
case ActionTypes.SHOW_FILE_OPTIONS:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.id !== action.id) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return Object.assign({}, file, { isOptionsOpen: true });
|
|
|
|
|
});
|
|
|
|
|
case ActionTypes.HIDE_FILE_OPTIONS:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.id !== action.id) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return Object.assign({}, file, { isOptionsOpen: false });
|
|
|
|
|
});
|
|
|
|
|
case ActionTypes.UPDATE_FILE_NAME:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.id !== action.id) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return Object.assign({}, file, { name: action.name });
|
|
|
|
|
});
|
|
|
|
|
case ActionTypes.DELETE_FILE:
|
2016-08-24 20:06:28 +00:00
|
|
|
{
|
|
|
|
|
const newState = state.map((file) => {
|
|
|
|
|
if (file.id === action.parentId) {
|
|
|
|
|
const newChildren = file.children.filter(child => child !== action.id);
|
|
|
|
|
return { ...file, children: newChildren };
|
|
|
|
|
}
|
|
|
|
|
return file;
|
|
|
|
|
});
|
|
|
|
|
return newState.filter(file => file.id !== action.id);
|
|
|
|
|
}
|
2016-08-03 21:10:03 +00:00
|
|
|
case ActionTypes.SHOW_EDIT_FILE_NAME:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.id !== action.id) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return Object.assign({}, file, { isEditingName: true });
|
|
|
|
|
});
|
|
|
|
|
case ActionTypes.HIDE_EDIT_FILE_NAME:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.id !== action.id) {
|
|
|
|
|
return file;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return Object.assign({}, file, { isEditingName: false });
|
|
|
|
|
});
|
2016-08-24 17:09:48 +00:00
|
|
|
case ActionTypes.SET_SELECTED_FILE:
|
|
|
|
|
return state.map(file => {
|
|
|
|
|
if (file.id === action.selectedFile) {
|
|
|
|
|
return Object.assign({}, file, { isSelected: true });
|
|
|
|
|
}
|
|
|
|
|
return Object.assign({}, file, { isSelected: false });
|
|
|
|
|
});
|
2016-06-23 22:29:55 +00:00
|
|
|
default:
|
|
|
|
|
return state;
|
|
|
|
|
}
|
|
|
|
|
};
|
2016-05-05 21:48:26 +00:00
|
|
|
|
2016-08-25 16:39:36 +00:00
|
|
|
export const getHTMLFile = (state) => state.filter(file => file.name.match(/.*\.html$/i))[0];
|
|
|
|
|
export const getJSFiles = (state) => state.filter(file => file.name.match(/.*\.js$/i));
|
|
|
|
|
export const getCSSFiles = (state) => state.filter(file => file.name.match(/.*\.css$/i));
|
2016-07-20 01:36:21 +00:00
|
|
|
export const getLinkedFiles = (state) => state.filter(file => file.url);
|
2016-07-08 18:57:22 +00:00
|
|
|
|
2016-07-06 19:09:05 +00:00
|
|
|
export default files;
|
