Skip to content

Commit 76a5e64

Browse files
Merge pull request #52 from team-reactype/development
html components in progress, canvas improvements, styling changes
2 parents a54540e + 0737544 commit 76a5e64

29 files changed

+1817
-1116
lines changed

index.js

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
#!/usr/bin/env node
2-
const util = require('util');
3-
const program = require('commander');
4-
const execFile = util.promisify(require('child_process').execFile);
5-
const { Spinner } = require('cli-spinner');
2+
// const util = require('util');
3+
// const program = require('commander');
4+
// const execFile = util.promisify(require('child_process').execFile);
5+
// const { Spinner } = require('cli-spinner');
66

7-
const spinner = new Spinner('running app... %s');
8-
spinner.setSpinnerString('|/-\\');
7+
// const spinner = new Spinner('running app... %s');
8+
// spinner.setSpinnerString('|/-\\');
99

10-
program
11-
.version('1.0.0', '-v, --version, -V')
12-
.description('An application for prototyping React application.');
10+
// program
11+
// .version('1.0.0', '-v, --version, -V')
12+
// .description('An application for prototyping React application.');
1313

14-
program
15-
.command('start')
16-
.description('Start-up reactype app')
17-
.action(() => {
18-
spinner.start();
19-
execFile('npm', ['start']).catch(err => console.log(err));
20-
});
14+
// program
15+
// .command('start')
16+
// .description('Start-up reactype app')
17+
// .action(() => {
18+
// spinner.start();
19+
// execFile('npm', ['start']).catch(err => console.log(err));
20+
// });
2121

2222
program.parse(process.argv);

main.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ const {
77
ipcMain,
88
} = require('electron');
99

10+
1011
require('electron-reload')(__dirname);
1112

1213
// const isDev = true;
@@ -34,6 +35,11 @@ function openFile() {
3435
mainWindow.webContents.send('new-file', file);
3536
}
3637

38+
// export files
39+
function exportComponents() {
40+
console.log('hi from exportComponents');
41+
}
42+
3743
// Choose directory
3844
ipcMain.on('choose_app_dir', (event) => {
3945
const directory = dialog.showOpenDialog(mainWindow, {
@@ -60,10 +66,15 @@ const createWindow = () => {
6066
mainWindow = new BrowserWindow({
6167
width,
6268
height,
69+
show: false,
6370
});
6471

6572
// and load the index.html of the app.
6673
mainWindow.loadURL(`file://${__dirname}/build/index.html`);
74+
// load page once window is loaded
75+
mainWindow.once('ready-to-show', () => {
76+
mainWindow.show();
77+
});
6778

6879
const template = [{
6980
label: 'File',
@@ -73,6 +84,13 @@ const createWindow = () => {
7384
click() {
7485
openFile();
7586
},
87+
},
88+
{
89+
label: 'Export Components',
90+
accelerator: process.platform === 'darwin' ? 'Cmd+E' : 'Ctrl+Shift+E',
91+
click() {
92+
exportComponents();
93+
},
7694
}],
7795
},
7896
{

src/actionTypes/index.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ export const HANDLE_TRANSFORM = 'HANDLE_TRANSFORM';
1818
export const CREATE_APPLICATION = 'CREATE_APPLICATION';
1919
export const CREATE_APPLICATION_SUCCESS = 'CREATE_APPLICATION_SUCCESS';
2020
export const CREATE_APPLICATION_ERROR = 'CREATE_APPLICATION_ERROR';
21-
export const TOGGLE_DRAGGING = 'TOGGLE_DRAGGING';
2221
export const MOVE_TO_BOTTOM = 'MOVE_TO_BOTTOM';
2322
export const MOVE_TO_TOP = 'MOVE_TO_TOP';
2423
export const OPEN_EXPANSION_PANEL = 'OPEN_EXPANSION_PANEL';

src/actions/components.js

Lines changed: 97 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ import {
1919
CREATE_APPLICATION,
2020
CREATE_APPLICATION_SUCCESS,
2121
CREATE_APPLICATION_ERROR,
22-
TOGGLE_DRAGGING,
2322
MOVE_TO_BOTTOM,
2423
MOVE_TO_TOP,
2524
OPEN_EXPANSION_PANEL,
@@ -29,10 +28,11 @@ import {
2928
CHANGE_IMAGE_PATH,
3029
} from '../actionTypes/index';
3130

31+
3232
import { loadState } from '../localStorage';
3333

34-
// import createFiles from '../utils/createFiles.util';
35-
// import createApplicationUtil from '../utils/createApplication.util';
34+
import createFiles from '../utils/createFiles.util';
35+
import createApplicationUtil from '../utils/createApplication.util'
3636

3737
export const loadInitData = () => dispatch => {
3838
loadState().then(data =>
@@ -45,23 +45,23 @@ export const loadInitData = () => dispatch => {
4545
);
4646
};
4747

48-
export const updateChildren = ({ parentIds, childIndex, childId }) => ({
49-
type: UPDATE_CHILDREN,
50-
payload: {
51-
parentIds,
52-
childIndex,
53-
childId,
54-
},
55-
});
48+
// export const updateChildren = ({ parentIds, childIndex, childId }) => ({
49+
// type: UPDATE_CHILDREN,
50+
// payload: {
51+
// parentIds,
52+
// childIndex,
53+
// childId,
54+
// },
55+
// });
5656

57-
export const parentReassignment = ({ index, id, parentIds }) => ({
58-
type: REASSIGN_PARENT,
59-
payload: {
60-
index,
61-
id,
62-
parentIds,
63-
},
64-
});
57+
// export const parentReassignment = ({ index, id, parentIds }) => ({
58+
// type: REASSIGN_PARENT,
59+
// payload: {
60+
// index,
61+
// id,
62+
// parentIds,
63+
// },
64+
// });
6565

6666
export const addComponent = ({ title }) => dispatch => {
6767
dispatch({ type: ADD_COMPONENT, payload: { title } });
@@ -80,19 +80,15 @@ export const deleteComponent = ({ componentId, stateComponents }) => dispatch =>
8080
console.log('Hello from component.js delete component.componentId= ', componentId);
8181

8282
// find all places where the "to be delted" is a child and do what u gotta do
83-
stateComponents.forEach(parent => {
84-
parent.childrenArray
85-
.filter(child => child.childComponentId == componentId)
86-
.forEach(child => {
87-
// console.log(`Should delete ${child.childId} from component id:${parent.id} ${parent.title}`)
88-
dispatch({
89-
type: DELETE_CHILD,
90-
payload: {
91-
parentId: parent.id,
92-
childId: child.childId,
93-
calledFromDeleteComponent: true,
94-
},
95-
});
83+
stateComponents.forEach((parent) => {
84+
parent.childrenArray.filter(child => child.childComponentId == componentId).forEach((child) => {
85+
dispatch({
86+
type: DELETE_CHILD,
87+
payload: {
88+
parentId: parent.id,
89+
childId: child.childId,
90+
calledFromDeleteComponent: true,
91+
},
9692
});
9793
});
9894

@@ -102,30 +98,36 @@ export const deleteComponent = ({ componentId, stateComponents }) => dispatch =>
10298
dispatch({ type: DELETE_COMPONENT, payload: { componentId } });
10399
};
104100

105-
export const updateComponent = ({ id, index, newParentId = null, color = null, stateful = null }) => dispatch => {
106-
dispatch({
107-
type: UPDATE_COMPONENT,
108-
payload: {
109-
id,
110-
index,
111-
newParentId,
112-
color,
113-
stateful,
114-
},
115-
});
101+
// export const updateComponent = ({
102+
// id,
103+
// index,
104+
// newParentId = null,
105+
// color = null,
106+
// stateful = null,
107+
// }) => (dispatch) => {
108+
// dispatch({
109+
// type: UPDATE_COMPONENT,
110+
// payload: {
111+
// id,
112+
// index,
113+
// newParentId,
114+
// color,
115+
// stateful,
116+
// },
117+
// });
116118

117-
if (newParentId) {
118-
dispatch(
119-
updateChildren({
120-
parentIds: [newParentId],
121-
childId: id,
122-
childIndex: index,
123-
}),
124-
);
125-
}
119+
// if (newParentId) {
120+
// dispatch(
121+
// updateChildren({
122+
// parentIds: [newParentId],
123+
// childId: id,
124+
// childIndex: index,
125+
// }),
126+
// );
127+
// }
126128

127-
dispatch({ type: SET_SELECTABLE_PARENTS });
128-
};
129+
// dispatch({ type: SET_SELECTABLE_PARENTS });
130+
// };
129131

130132
export const changeFocusComponent = ({ title }) => dispatch => {
131133
dispatch({ type: CHANGE_FOCUS_COMPONENT, payload: { title } });
@@ -143,21 +145,21 @@ export const changeComponentFocusChild = ({ componentId, childId }) => dispatch
143145
});
144146
};
145147

146-
// export const exportFiles = ({ components, path }) => (dispatch) => {
147-
// dispatch({
148-
// type: EXPORT_FILES,
149-
// });
148+
export const exportFiles = ({ components, path }) => (dispatch) => {
149+
dispatch({
150+
type: EXPORT_FILES,
151+
});
150152

151-
// createFiles(components, path)
152-
// .then(dir => dispatch({
153-
// type: EXPORT_FILES_SUCCESS,
154-
// payload: { status: true, dir: dir[0] },
155-
// }))
156-
// .catch(err => dispatch({
157-
// type: EXPORT_FILES_ERROR,
158-
// payload: { status: true, err },
159-
// }));
160-
// };
153+
createFiles(components, path)
154+
.then(dir => dispatch({
155+
type: EXPORT_FILES_SUCCESS,
156+
payload: { status: true, dir: dir[0] },
157+
}))
158+
.catch(err => dispatch({
159+
type: EXPORT_FILES_ERROR,
160+
payload: { status: true, err },
161+
}));
162+
};
161163

162164
export const handleClose = () => ({
163165
type: HANDLE_CLOSE,
@@ -176,45 +178,30 @@ export const handleTransform = (componentId, childId, { x, y, width, height }) =
176178
},
177179
});
178180

179-
// export const createApplication = ({
180-
// path, components = [], genOption, appName = 'proto_app', repoUrl,
181-
// }) => (dispatch) => {
182-
// if (genOption === 0) {
183-
// dispatch(exportFiles({ path, components }));
184-
// } else if (genOption) {
185-
// dispatch({
186-
// type: CREATE_APPLICATION,
187-
// });
188-
// createApplicationUtil({
189-
// path, appName, genOption, repoUrl,
190-
// })
191-
// .then(() => {
192-
// dispatch({
193-
// type: CREATE_APPLICATION_SUCCESS,
194-
// });
195-
// dispatch(exportFiles({ path: `${path}/${appName}`, components }));
196-
// })
197-
// .catch(err => dispatch({
198-
// type: CREATE_APPLICATION_ERROR,
199-
// payload: { status: true, err },
200-
// }));
201-
// }
202-
// };
203-
204-
export const toggleDragging = status => ({
205-
type: TOGGLE_DRAGGING,
206-
payload: status,
207-
});
208-
209-
// export const moveToBottom = componentId => ({
210-
// type: MOVE_TO_BOTTOM,
211-
// payload: componentId,
212-
// });
213-
214-
// export const moveToTop = componentId => ({
215-
// type: MOVE_TO_TOP,
216-
// payload: componentId,
217-
// });
181+
export const createApplication = ({
182+
path, components = [], genOption, appName = 'proto_app', repoUrl,
183+
}) => (dispatch) => {
184+
if (genOption === 0) {
185+
dispatch(exportFiles({ path, components }));
186+
} else if (genOption) {
187+
dispatch({
188+
type: CREATE_APPLICATION,
189+
});
190+
createApplicationUtil({
191+
path, appName, genOption, repoUrl,
192+
})
193+
.then(() => {
194+
dispatch({
195+
type: CREATE_APPLICATION_SUCCESS,
196+
});
197+
dispatch(exportFiles({ path: `${path}/${appName}`, components }));
198+
})
199+
.catch(err => dispatch({
200+
type: CREATE_APPLICATION_ERROR,
201+
payload: { status: true, err },
202+
}));
203+
}
204+
};
218205

219206
export const openExpansionPanel = component => ({
220207
type: OPEN_EXPANSION_PANEL,
@@ -225,15 +212,9 @@ export const openExpansionPanel = component => ({
225212
// type: DELETE_ALL_DATA,
226213
// });
227214

228-
// export const changeImagePath = path => ({
229-
// type: CHANGE_IMAGE_PATH,
230-
// payload: path,
231-
// });
232-
233-
export const deleteProp = ({ id, index }) => ({
234-
type: DELETE_PROP,
235-
payload: { id, index },
236-
});
215+
export const deleteProp = propId => dispatch => {
216+
dispatch({ type: DELETE_PROP, payload: propId });
217+
};
237218

238219
export const addProp = prop => ({
239220
type: ADD_PROP,

0 commit comments

Comments
 (0)