Skip to content

Commit 5876d35

Browse files
ibeeliotibeeliot
committed
Fixing merge conflicts
2 parents 73f1a54 + 9692c88 commit 5876d35

File tree

10 files changed

+187
-217
lines changed

10 files changed

+187
-217
lines changed

‎src/components/BottomTabs.tsx

Lines changed: 31 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
ComponentInt,
1212
ComponentsInt,
1313
PropInt,
14-
PropsInt,
14+
PropsInt
1515
} from '../utils/Interfaces';
1616

1717
interface BottomTabsPropsInt extends PropsInt {
@@ -38,13 +38,13 @@ const styles = (theme: Theme): any => ({
3838
backgroundColor: '#333333',
3939
height: '100%',
4040
color: '#fff',
41-
boxShadow: '0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)',
41+
boxShadow: '0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)'
4242
},
4343
tabsRoot: {
44-
borderBottom: '0.5px solid #424242',
44+
borderBottom: '0.5px solid #424242'
4545
},
4646
tabsIndicator: {
47-
backgroundColor: '#1de9b6',
47+
backgroundColor: '#1de9b6'
4848
},
4949
tabRoot: {
5050
textTransform: 'initial',
@@ -62,35 +62,35 @@ const styles = (theme: Theme): any => ({
6262
'sans-serif',
6363
'"Apple Color Emoji"',
6464
'"Segoe UI Emoji"',
65-
'"Segoe UI Symbol"',
65+
'"Segoe UI Symbol"'
6666
].join(','),
6767
'&:hover': {
6868
color: '#1de9b6',
69-
opacity: 1,
69+
opacity: 1
7070
},
7171
'&$tabSelected': {
7272
color: '#33eb91',
73-
fontWeight: theme.typography.fontWeightMedium,
73+
fontWeight: theme.typography.fontWeightMedium
7474
},
7575
'&:focus': {
76-
color: '#4aedc4',
77-
},
76+
color: '#4aedc4'
77+
}
7878
},
7979
tabSelected: {},
8080
typography: {
81-
padding: theme.spacing.unit * 3,
81+
padding: theme.spacing.unit * 3
8282
},
8383
padding: {
84-
padding: `0 ${theme.spacing.unit * 2}px`,
85-
},
84+
padding: `0 ${theme.spacing.unit * 2}px`
85+
}
8686
});
8787

8888
class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
8989
constructor(props: BottomTabsPropsInt) {
9090
super(props);
9191
this.state = {
9292
value: 0,
93-
translate: { x: 0, y: 0 },
93+
translate: { x: 0, y: 0 }
9494
};
9595
}
9696
treeWrapper: HTMLDivElement;
@@ -100,8 +100,8 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
100100
this.setState({
101101
translate: {
102102
x: dimensions.width / 12,
103-
y: dimensions.height / 2.2,
104-
},
103+
y: dimensions.height / 2.2
104+
}
105105
});
106106
}
107107

@@ -110,7 +110,9 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
110110
};
111111

112112
handleClick = (event: any, node: any) => {
113-
this.props.changeFocusComponent({ title: event.name });
113+
if (!event.attributes.Type) {
114+
this.props.changeFocusComponent({ title: event.name });
115+
}
114116
};
115117

116118
generateComponentTree(componentId: number, components: ComponentsInt) {
@@ -120,13 +122,14 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
120122
component.childrenArray.forEach(child => {
121123
if (child.childType === 'COMP') {
122124
tree.children.push(
123-
this.generateComponentTree(child.childComponentId, components),
125+
this.generateComponentTree(child.childComponentId, components)
124126
);
125127
} else {
128+
let str = { Type: 'HTML Element' };
126129
tree.children.push({
127130
name: child.componentName,
128-
attributes: {},
129-
children: [],
131+
attributes: str,
132+
children: []
130133
});
131134
}
132135
});
@@ -140,14 +143,14 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
140143
focusComponent,
141144
deleteProp,
142145
addProp,
143-
focusChild,
146+
focusChild
144147
} = this.props;
145148
const { value } = this.state;
146149

147150
// display count on the tab. user can see without clicking into tab
148151
const propCount = focusComponent.props.length;
149152
const htmlAttribCount = focusComponent.childrenArray.filter(
150-
child => child.childType === 'HTML',
153+
child => child.childType === 'HTML'
151154
).length;
152155

153156
return (
@@ -191,7 +194,7 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
191194
id='treeWrapper'
192195
style={{
193196
width: '100%',
194-
height: '100%',
197+
height: '100%'
195198
}}
196199
ref={node => (this.treeWrapper = node)}
197200
>
@@ -207,17 +210,17 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
207210
name: {
208211
fill: '#D3D3D3',
209212
stroke: '#D3D3D3',
210-
strokeWidth: 1,
211-
},
213+
strokeWidth: 1
214+
}
212215
},
213216
leafNode: {
214217
name: {
215218
fill: '#D3D3D3',
216219
stroke: '#D3D3D3',
217-
strokeWidth: 1,
218-
},
219-
},
220-
},
220+
strokeWidth: 1
221+
}
222+
}
223+
}
221224
}}
222225
/>
223226
</div>

‎src/components/KonvaStage.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ class KonvaStage extends Component<KonvaStagePropsInt, StateInt> {
4444
//anything, and the gridStroke is the stroke width of the squares.
4545
this.state = {
4646
stageWidth: 1800,
47-
stageHeight: 900,
47+
stageHeight: 1300,
4848
blockSnapSize: 10,
4949
grid: [],
5050
gridStroke: 1,

‎src/components/LeftColExpansionPanel.tsx

Lines changed: 36 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,6 @@ const LeftColExpansionPanel = (props: LeftColExpPanPropsInt) => {
9999
disableTypography
100100
className={classes.light}
101101
primary={
102-
<div>
103102
<Typography
104103
//type='body2'
105104
style={{
@@ -114,18 +113,19 @@ const LeftColExpansionPanel = (props: LeftColExpPanPropsInt) => {
114113
TO DO : IMPROVE DRYNESS OF CODE BY RENDERING ALL FOUR MATERIAL ELEMENTS (LABELS/SWITCH) IN ONE CONDITIONAL
115114
*/}
116115
{/* LABEL AND TOGGLE(SWITCH) FOR STATEFULNESS */}
116+
117117
{focusedToggle ? (
118-
<span style={{ display: 'inline-flex' }}>
118+
<span>
119119
<InputLabel
120-
htmlFor='stateful'
120+
htmlFor="stateful"
121121
style={{
122122
color: '#fff',
123123
marginBottom: '10px',
124124
marginTop: '0px',
125125
marginLeft: '11px',
126126
padding: '0px',
127127
fontSize: '18px',
128-
textShadow: '1px 1px 2px rgba(0, 0, 0, 0.7)'
128+
textShadow: '1px 1px 2px rgba(0, 0, 0, 0.7)',
129129
}}
130130
>
131131
State?
@@ -136,12 +136,12 @@ const LeftColExpansionPanel = (props: LeftColExpPanPropsInt) => {
136136
toggleComponentState(id);
137137
changeFocusComponent({ title });
138138
}}
139-
value='stateful'
140-
color='primary'
139+
value="stateful"
140+
color="primary"
141141
// id={props.id.toString()}
142142
/>
143143
<InputLabel
144-
htmlFor='classBased'
144+
htmlFor='stateful'
145145
style={{
146146
color: '#fff',
147147
marginBottom: '10px',
@@ -193,6 +193,35 @@ const LeftColExpansionPanel = (props: LeftColExpPanPropsInt) => {
193193
textShadow: '1px 1px 2px rgba(0, 0, 0, 0.5)'
194194
}}
195195
/>
196+
) : (
197+
''
198+
)}
199+
200+
{focusedToggle && component.id !== 1 ? (
201+
<Button
202+
variant="text"
203+
size="small"
204+
color="default"
205+
aria-label="Delete"
206+
className={classes.margin}
207+
onClick={() =>
208+
deleteComponent({
209+
componentId: id,
210+
stateComponents: components,
211+
})
212+
}
213+
style={{
214+
color: 'white',
215+
marginBottom: '0px',
216+
marginTop: '4px',
217+
}}
218+
>
219+
<DeleteIcon
220+
style={{
221+
color: '#b30000',
222+
textShadow: '1px 1px 2px rgba(0, 0, 0, 0.5)',
223+
}}
224+
/>
196225
<div
197226
style={{
198227
marginTop: '3px',

‎src/components/Props.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,8 @@ const styles = (theme: any) => ({
113113
},
114114
dataTable: {
115115
border: '1px solid red',
116-
backgroundColor: 'red'
116+
backgroundColor: 'red',
117+
width: '60%',
117118
},
118119
light: {
119120
color: '#eee'
@@ -248,7 +249,6 @@ class Props extends Component<PropsPropsInt, StateInt> {
248249
Prop: prop.key,
249250
// Value: prop.value,
250251
Type: prop.type,
251-
Required: prop.required,
252252
id: prop.id
253253
}));
254254

‎src/containers/LeftContainer.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -250,7 +250,7 @@ class LeftContainer extends Component<LeftContPropsInt, StateInt> {
250250
const { addImage } = this;
251251

252252
return (
253-
<div className="column left">
253+
<div className="column left" style={{ minWidth: '466px' }}>
254254
<Grid
255255
container
256256
spacing={8}

‎src/containers/MainContainer.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
changeFocusChild,
1212
changeComponentFocusChild,
1313
deleteChild,
14-
changeFocusComponent,
14+
changeFocusComponent
1515
} from '../actions/components';
1616
import KonvaStage from '../components/KonvaStage';
1717
import { PropsInt, ApplicationStateInt } from '../utils/Interfaces';
@@ -21,7 +21,7 @@ interface MainContPropsInt extends PropsInt {
2121
handleTransformation(
2222
componentId: number,
2323
childId: number,
24-
dimensions: { x: number; y: number; width: number; height: number },
24+
dimensions: { x: number; y: number; width: number; height: number }
2525
): void;
2626
changeComponentFocusChild(arg: {
2727
componentId: number;
@@ -52,16 +52,16 @@ const mapDispatchToProps = (dispatch: any) => ({
5252
x,
5353
y,
5454
width,
55-
height,
56-
}: { x: number; y: number; width: number; height: number },
55+
height
56+
}: { x: number; y: number; width: number; height: number }
5757
) =>
5858
dispatch(
5959
handleTransform(componentId, childId, {
6060
x,
6161
y,
6262
width,
63-
height,
64-
}),
63+
height
64+
})
6565
),
6666
//this doesn't do anything here
6767
// changeImagePath: (imageSource: string) =>
@@ -78,18 +78,18 @@ const mapDispatchToProps = (dispatch: any) => ({
7878
//vs the one above changes the focusChild property in the state
7979
changeComponentFocusChild: ({
8080
componentId,
81-
childId,
81+
childId
8282
}: {
8383
componentId: number;
8484
childId: number;
8585
}) => dispatch(changeComponentFocusChild({ componentId, childId })),
86-
deleteChild: ({}) => dispatch(deleteChild({})), // if u send no prms, function will delete focus child. <-- This comment was already here, unsure what exactly it means.
86+
deleteChild: ({}) => dispatch(deleteChild({})) // if u send no prms, function will delete focus child. <-- This comment was already here, unsure what exactly it means.
8787
});
8888

8989
const mapStateToProps = (store: { workspace: ApplicationStateInt }) => ({
9090
focusComponent: store.workspace.focusComponent,
9191
focusChild: store.workspace.focusChild,
92-
stateComponents: store.workspace.components,
92+
stateComponents: store.workspace.components
9393
});
9494

9595
class MainContainer extends Component<MainContPropsInt, StateInt> {
@@ -116,7 +116,7 @@ class MainContainer extends Component<MainContPropsInt, StateInt> {
116116
changeFocusComponent,
117117
changeComponentFocusChild,
118118
deleteChild,
119-
image,
119+
image
120120
} = this.props;
121121

122122
// const { main }: { main: HTMLDivElement } = this; **I don't think this has any function**

‎src/public/index.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@
1313
rel="stylesheet"
1414
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"
1515
/>
16-
<!-- <link
16+
<link
1717
rel="stylesheet"
1818
href="https://fonts.googleapis.com/icon?family=Material+Icons"
19-
/> -->
19+
/>
2020
</head>
2121

2222
<body>

0 commit comments

Comments
 (0)