Skip to content

Commit 40951ee

Browse files
committed
resolving merge conflicts
2 parents b56af43 + 30a80d3 commit 40951ee

16 files changed

+323
-46
lines changed

quasar.conf.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,15 +86,15 @@ module.exports = function (ctx) {
8686
// analyze: true,
8787
// extractCSS: false,
8888
extendWebpack (cfg) {
89-
// cfg.module.rules.push({
89+
//cfg.module.rules.push({
9090
// enforce: 'pre',
9191
// test: /\.(js|vue)$/,
9292
// loader: 'eslint-loader',
9393
// exclude: /node_modules/,
9494
// options: {
9595
// formatter: require('eslint').CLIEngine.getFormatter('stylish')
9696
// }
97-
// })
97+
//})
9898
}
9999
},
100100

src/components/CodeSnippet.vue

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
language="js"
88
:line-numbers="lineNumbers"
99
class="code-editor"
10-
:style="{ height: `${height}vh` }"
10+
:style="{ height: `${height}vh`}"
11+
readonly="true"
1112
/>
1213
</div>
1314
</template>
@@ -43,7 +44,7 @@ export default {
4344
// calls createTemplate and createBoiler to generate snippet
4445
createCodeSnippet (componentName, children) {
4546
let result = `${this.createTemplate(componentName, children)}${this.createBoiler(componentName, children)}`
46-
console.log(`createCodeSnippet result: ${result}`)
47+
//console.log(`createCodeSnippet result: ${result}`)
4748
return result
4849
},
4950
createTemplate (componentName, children) {
@@ -57,7 +58,7 @@ export default {
5758
return `<template>\n ${output}${templateTagStr} </div>\n</template>`
5859
},
5960
writeTemplateTag (componentName) {
60-
console.log('writeTemplateTag invoked!')
61+
//console.log('writeTemplateTag invoked!')
6162
// create reference object
6263
const htmlElementMap = {
6364
div: ['<div>', '</div>'],
@@ -81,7 +82,7 @@ export default {
8182
outputStr += htmlElementMap[el.text][1]
8283
outputStr += ` \n`
8384
}
84-
console.log(`outputStr from writeTemplateTag: ${outputStr}`)
85+
//console.log(`outputStr from writeTemplateTag: ${outputStr}`)
8586
return outputStr
8687
},
8788
createBoiler (componentName, children) {
@@ -109,7 +110,7 @@ export default {
109110
},
110111
// updates code snippet, but broken cause children undefined, shows `function () { [native code] }`
111112
updated () {
112-
console.log(`code: ${this.createCodeSnippet(this.activeComponent, this.componentMap[this.activeComponent].children)}`)
113+
//console.log(`code: ${this.createCodeSnippet(this.activeComponent, this.componentMap[this.activeComponent].children)}`)
113114
this.code = `${this.createCodeSnippet(this.activeComponent, this.componentMap[this.activeComponent].children)}`
114115
},
115116
beforeDestroy () {
@@ -121,6 +122,7 @@ export default {
121122
<style lang="stylus" scoped>
122123
// resize handled by vue lifecycle methods
123124
.code-editor {
125+
font-size: 11px;
124126
}
125127
::-webkit-scrollbar {
126128
display: none;

src/components/ComponentDisplay.vue

Lines changed: 35 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
v-for="componentData in activeRouteArray"
66
:key="componentData.componentName"
77
:x="componentData.x"
8-
:y="componentData.y"
8+
:y="componentData.y + 20"
99
:w="componentData.w"
1010
:h="componentData.h"
1111
:parent="true"
@@ -15,7 +15,14 @@
1515
@resizing="onResize"
1616
@dblclick.native="onDoubleClick(componentData)"
1717
>
18-
<h3>{{ componentData.componentName }}</h3>
18+
<div class="component-title">
19+
<p>{{ componentData.componentName }}</p>
20+
</div>
21+
<div class="component-children">
22+
<p># of children: {{ componentMap[componentData.componentName].children.length }} </p>
23+
<p>children: {{ componentMap[componentData.componentName].children }}</p>
24+
<!-- <p v-for="child in childList" :key="childList.indexOf(child)"> {{ child.text }}</p> -->
25+
</div>
1926
<q-menu context-menu>
2027
<q-list>
2128
<q-item clickable v-ripple v-close-popup @click="handleAddChild">
@@ -80,16 +87,18 @@ export default {
8087
...mapState(['routes', 'activeRoute', 'activeComponent', 'componentMap', 'componentChildrenMultiselectValue']),
8188
// used in VueDraggableResizeable component
8289
activeRouteArray () {
83-
// console.log('active route array method', this.routes[this.activeRoute])
90+
console.log('active route array method', this.routes[this.activeRoute])
8491
return this.routes[this.activeRoute]
8592
},
8693
// used to delete components
8794
activeComponentData () {
88-
// find out what this does
8995
return this.activeRouteArray.filter(componentData => {
9096
return componentData.componentName === this.activeComponent
9197
})[0]
9298
},
99+
childList () {
100+
return this.componentMap[componentData.componentName].children
101+
},
93102
options () {
94103
// PROBLEM: the objects on childrenmultiselectvalue are applied
95104
const routes = Object.keys(this.routes)
@@ -153,6 +162,24 @@ export default {
153162
</script>
154163

155164
<style scoped>
165+
.component-title {
166+
position: relative;
167+
font-size: 16px;
168+
top: -18px;
169+
left: 2px;
170+
color: black;
171+
font-weight: 800;
172+
/* background: rgba(0, 0, 0, 0.678); */
173+
/* width: 1rem; */
174+
line-height: 1.2;
175+
/* margin: 10px; */
176+
}
177+
.component-children {
178+
position: absolute;
179+
top: 0rem;
180+
left: 2px;
181+
color: black;
182+
}
156183
.component-display {
157184
/* border: 3px dashed rgb(159, 122, 122); */
158185
/* height: 500px; */
@@ -187,13 +214,16 @@ export default {
187214
#269;
188215
behavior: url(/pie/PIE.htc);
189216
}
190-
191217
.component-box {
192218
color: white;
193219
border: 1px dashed rgb(227, 203, 71);
194220
background-color: rgba(186, 99, 99, 0.529);
221+
-webkit-transition: background-color 200ms linear;
222+
-ms-transition: background-color 200ms linear;
223+
transition: background-color 200ms linear;
195224
}
196225
.active {
197226
background-color: rgba(57, 63, 84, 0.5);
227+
border: 1px dashed rgb(227, 203, 71);
198228
}
199229
</style>

src/components/CreateComponent.vue

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<br />
55
<form v-on:submit.prevent="handleClick" v-on:click="resetActiveComponent">
66
<q-input
7-
standout="bg-secondary text-white"
7+
standout="secondary text-secondary"
88
bottom-slots
99
v-model="componentNameInputValue"
1010
label="Component Name"
@@ -14,11 +14,13 @@
1414
</q-input>
1515
</form>
1616
<div class="icon-container">
17-
<Icons @getClickedIcon="addToSelectedElementList" @activeElement="addToComponentElementList"/>
17+
<Icons class = 'icons' @getClickedIcon="addToSelectedElementList" @activeElement="addToComponentElementList"/>
1818
</div>
1919
<ParentMultiselect />
2020
<br />
21-
<q-btn id="add-component-btn" class="primary" color="secondary" label="Create Component" icon-right="add" @click="handleClick" :disabled="!componentNameInputValue" />
21+
22+
<q-btn id="add-component-btn" color="secondary" label="Create Component" @click="handleClick" :disabled="!componentNameInputValue" />
23+
2224
</div>
2325
</template>
2426

src/components/ExportProject.vue

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,22 @@
11
<template>
2-
<q-btn class="glossy" color="teal" label="Export Project" @click="exportProject"/>
2+
<!-- electron build
3+
<q-btn class="glossy" color="secondary" label="Export Project" @click="exportProject"/>
4+
-->
5+
<q-btn class="glossy" color="secondary" label="Export Project"/>
36
</template>
47

58
<script>
69
// Where all of the boilerplate is exported
7-
// import { mapState } from "vuex";
8-
// const { remote } = require("electron");
9-
// import fs from "fs-extra";
10-
// import path from "path";
11-
// const ipc = require("electron").ipcRenderer;
10+
import { mapState } from "vuex";
11+
//const { remote } = require("electron");
12+
//import fs from "fs-extra";
13+
//import path from "path";
14+
//const ipc = require("electron").ipcRenderer;
1215
export default {
16+
1317
name: "ExportProjectComponent",
1418
}
19+
1520
// methods: {
1621
// showExportDialog() {
1722
// remote.dialog.showSaveDialog({
@@ -374,7 +379,20 @@ export default {
374379
// ...mapState(["componentMap"])
375380
// }
376381
// };
382+
383+
384+
377385
</script>
378386

379387
<style>
388+
389+
.export-btn {
390+
min-height: 10px !important;
391+
font-size: 11px;
392+
text-transform: capitalize;
393+
padding: 3px 8px;
394+
}
395+
380396
</style>
397+
398+

src/components/Footer.vue

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@
1515
indicator-color="secondary"
1616
align="left"
1717
>
18-
<q-tab name="code" label="Code" id="label-text"/>
18+
<q-tab name="code" label="Code Snippet" id="label-text"/>
1919
<q-tab name="detail" label="Component Details" id="label-text"/>
20-
<q-tab name="tree" label="Tree" id="label-text"/>
20+
<q-tab name="tree" label="Project Tree" id="label-text"/>
2121
<q-tab name="html" label="HTML Elements" id="label-text"/>
2222
</q-tabs>
2323

@@ -27,7 +27,8 @@
2727
</q-tab-panel>
2828

2929
<q-tab-panel name="detail">
30-
<div class="text-h6">Component Deets</div>Component Info Here
30+
<div class="text-h6">Vuex</div>
31+
Component Info Here
3132
</q-tab-panel>
3233

3334
<q-tab-panel name="tree">

src/components/HomeSideDropDownItems/ComponentList.vue

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
{{componentData.componentName}}
1616
<!-- <br> -->
1717
</div>
18-
<q-btn round flat icon="highlight_off" />
18+
<q-btn round flat icon="highlight_off" v-on:click.stop='handleClick(componentData)'/>
1919
</div>
2020
</q-item-section>
2121
</q-item>
@@ -44,11 +44,14 @@ export default {
4444
}
4545
},
4646
methods: {
47-
...mapActions(['setActiveComponent']),
47+
...mapActions(['setActiveComponent','deleteComponent']),
4848
onActivated (componentData) {
4949
this.setActiveComponent(componentData.componentName)
5050
this.activeComponentData.isActive = true
51-
console.log('this.activeComponent', this.activeComponent)
51+
},
52+
handleClick (componentData) {
53+
this.deleteComponent(componentData)
54+
this.setActiveComponent('')
5255
}
5356
}
5457
}
@@ -69,6 +72,7 @@ export default {
6972
.q-list {
7073
margin-bottom: 0.5rem;
7174
border-radius: 5px;
75+
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 6px 0 rgba(0, 0, 0, 0.13);
7276
}
7377
.component-info {
7478
margin: auto 0;

src/components/Icons.vue

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ export default {
4343
grid-template-columns: 50% 50%;
4444
grid-row-gap: 1em;
4545
width: 100%;
46+
4647
}
4748
}
4849
@@ -52,9 +53,10 @@ button {
5253
}
5354
button:hover {
5455
cursor: pointer;
55-
color: #00d1b2;
56+
color: #00FFFF
5657
}
5758
button:focus {
5859
outline: none;
5960
}
61+
6062
</style>
Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<template>
2+
<q-btn class="glossy mr-sm" color="secondary" label="Open Project"/>
3+
<!--<q-btn class="glossy mr-sm" color="secondary" label="Open Project" @click="openProjectJSON"/>-->
4+
</template>
5+
6+
<script>
7+
import localforage from 'localforage';
8+
//import fs from 'fs-extra';
9+
import { addProject } from '../store/types';
10+
//const { remote } = require("electron");
11+
import { mapState, mapActions } from 'vuex'
12+
13+
export default {
14+
name: 'OpenProjectComponent',
15+
}
16+
// methods: {
17+
// ...mapActions([
18+
// 'setComponentMap',
19+
// 'setRoutes',
20+
// ]),
21+
// parseFileName(file) {
22+
// //Obtains json file name from file path
23+
// return file.split('/').pop();
24+
// },
25+
// openJSONFile(data){
26+
// const jsonFile = JSON.parse(fs.readFileSync(data[0], 'utf8'))
27+
// this.setComponentMap(jsonFile.componentMap)
28+
// this.setRoutes(jsonFile.routes)
29+
// },
30+
// showOpenJSONDialog(){
31+
// remote.dialog.showOpenDialog({
32+
// properties: ['openFile'],
33+
// filters: [{
34+
// name: 'JSON Files',
35+
// extensions: ['json']
36+
// }]},
37+
// result => {
38+
// // 'result' is the filepath of the .json file being opened
39+
// this.openJSONFile(result);
40+
// }
41+
// );
42+
// },
43+
// openProjectJSON(){
44+
// this.showOpenJSONDialog();
45+
// }
46+
// },
47+
// created(){
48+
// Mousetrap.bind(['command+o', 'ctrl+o'], () => {
49+
// this.openProjectJSON();
50+
// });
51+
// }
52+
// }
53+
</script>
54+
55+
<style scoped>
56+
.mr-sm {
57+
margin-right: 0.2rem;
58+
}
59+
</style>

src/components/Routes.vue

Lines changed: 5 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -9,22 +9,13 @@
99
@click="handleClick(route)"
1010
v-on:keyup.delete="deleteSelectedRoute(route)"
1111
>
12-
<!--
13-
<span class="panel-icon">
14-
<i class="fas fa-location-arrow" aria-hidden="true"></i>
15-
</span>
16-
-->
17-
<q-list bordered separator>
18-
<q-item clickable v-ripple>
19-
<q-item-section>{{route}}</q-item-section>
20-
21-
</q-item>
22-
23-
</q-list>
24-
12+
<q-list bordered separator>
13+
<q-item clickable v-ripple>
14+
<q-item-section>{{route}}</q-item-section>
15+
</q-item>
16+
</q-list>
2517
</a>
2618
</div>
27-
2819
</template>
2920

3021
<script>

0 commit comments

Comments
 (0)