Skip to content

Commit 9bc5aaf

Browse files
jchan444jchan444
committed
Merge branch 'dev' into Johnny
2 parents c28d13d + bf50d77 commit 9bc5aaf

File tree

2 files changed

+104
-103
lines changed

2 files changed

+104
-103
lines changed

‎src/components/left-sidebar/ComponentTab/ImportComponent.vue

Lines changed: 68 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,5 @@
11
<template>
2-
<q-btn
3-
id="import-component-btn"
4-
size="md"
5-
color="secondary"
6-
:label=title
7-
@click="importComponent"
8-
/>
2+
<q-btn id="import-component-btn" size="md" color="secondary" :label=title @click="importComponent" />
93
</template>
104

115

@@ -28,7 +22,7 @@ export default {
2822
},
2923
methods: {
3024
//emitter to send the importedObj to CreateComponent when fully parsed.
31-
createImport(importObj){
25+
createImport(importObj) {
3226
useCreateComponent.bind(this)(importObj) //this is where we will want to invoke the composable
3327
},
3428
...mapActions([
@@ -50,49 +44,52 @@ export default {
5044
},
5145
],
5246
})
53-
.then((res) => this.openVueFile(res.filePaths))
47+
.then((res) => {
48+
this.openVueFile(res.filePaths)
49+
alert('Successfully Imported')
50+
})
5451
.catch((err) => console.log(err));
5552
},
56-
53+
5754
//parses script tag string for props
58-
parsingStringToProps (str){
55+
parsingStringToProps(str) {
5956
let props = [];
6057
let split = str.split(' ');
61-
for(let i = 0; i < split.length; i++){
62-
if(split[i].includes(':') && split[i] !== 'computed:' && split[i] !== 'methods:' && split[i] !== 'name:' && split[i] !=='components:'){
63-
let cleanStr = split[i].slice(0,split[i].indexOf(':'))
58+
for (let i = 0; i < split.length; i++) {
59+
if (split[i].includes(':') && split[i] !== 'computed:' && split[i] !== 'methods:' && split[i] !== 'name:' && split[i] !== 'components:') {
60+
let cleanStr = split[i].slice(0, split[i].indexOf(':'))
6461
props.push(cleanStr)
6562
}
6663
}
6764
return props
6865
},
6966
7067
//parses script tag string for actions
71-
parsingStringToAction (str){
68+
parsingStringToAction(str) {
7269
let action = [];
73-
if (str.indexOf('...mapActions') === -1){return action};
74-
let trashedSlice = str.slice(str.lastIndexOf('...mapActions')+15);
70+
if (str.indexOf('...mapActions') === -1) { return action };
71+
let trashedSlice = str.slice(str.lastIndexOf('...mapActions') + 15);
7572
let slice = trashedSlice.slice(0, trashedSlice.indexOf('])'));
7673
let split = slice.split(' ')
77-
for(let i = 0; i < split.length; i++){
78-
if (split[i].includes(',')){
79-
let cleanStr = split[i].slice(split[i].indexOf('"')+1,split[i].lastIndexOf('"'))
74+
for (let i = 0; i < split.length; i++) {
75+
if (split[i].includes(',')) {
76+
let cleanStr = split[i].slice(split[i].indexOf('"') + 1, split[i].lastIndexOf('"'))
8077
action.push(cleanStr)
8178
}
8279
}
8380
return action;
8481
},
8582
8683
//parses script tag string for state
87-
parsingStringToState (str){
84+
parsingStringToState(str) {
8885
let state = [];
89-
if (str.indexOf('...mapState') === -1){return state};
90-
let trashedSlice = str.slice(str.lastIndexOf('...mapState')+15);
86+
if (str.indexOf('...mapState') === -1) { return state };
87+
let trashedSlice = str.slice(str.lastIndexOf('...mapState') + 15);
9188
let slice = trashedSlice.slice(0, trashedSlice.indexOf('])'));
92-
let split = slice.split(' ')
93-
for (let i = 0; i < split.length; i++){
94-
if (split[i].includes(',')){
95-
let cleanStr = split[i].slice(split[i].indexOf('"')+1,split[i].lastIndexOf('"'))
89+
let split = slice.split(' ')
90+
for (let i = 0; i < split.length; i++) {
91+
if (split[i].includes(',')) {
92+
let cleanStr = split[i].slice(split[i].indexOf('"') + 1, split[i].lastIndexOf('"'))
9693
state.push(cleanStr)
9794
}
9895
}
@@ -105,11 +102,11 @@ export default {
105102
106103
const importObj = {}; //final output
107104
const htmlList = []; //array populated with substrings '<div>' '</div>' '<p>' etc.
108-
let compName = data[0].slice(data[0].lastIndexOf('/')+1).replace(/[^a-z0-9-_.]/gi, '').replace(/.vue/, '');
105+
let compName = data[0].slice(data[0].lastIndexOf('/') + 1).replace(/[^a-z0-9-_.]/gi, '').replace(/.vue/, '');
109106
const vueFile = fs.readFileSync(data[0], "utf8");
110107
111-
for (const key in this.$store.state.componentMap){
112-
if (this.$store.state.componentMap[key].componentName === compName){
108+
for (const key in this.$store.state.componentMap) {
109+
if (this.$store.state.componentMap[key].componentName === compName) {
113110
compName += 'duplicate'; //appends duplicate if the componentName already exists in state.
114111
}
115112
}
@@ -138,9 +135,9 @@ export default {
138135
h6:["<h6>", "</h6>"],
139136
};
140137
141-
142-
let htmlString = vueFile.substring(vueFile.indexOf('<template >')+10, vueFile.indexOf('</template>'));
143-
let scriptString = vueFile.substring(vueFile.indexOf(`<script>`)+8, vueFile.indexOf(`/script>`)-1)
138+
139+
let htmlString = vueFile.substring(vueFile.indexOf('<template >') + 10, vueFile.indexOf('</template>'));
140+
let scriptString = vueFile.substring(vueFile.indexOf(`<script>`) + 8, vueFile.indexOf(`/script>`) - 1)
144141
145142
htmlParser(htmlString);
146143
importObj.props = this.parsingStringToProps(scriptString);
@@ -152,7 +149,7 @@ export default {
152149
let groupings = findGroupings(htmlList);
153150
let groupingObj = objectGenerator(groupings);
154151
let groupingArray = [];
155-
for (const key in groupingObj){
152+
for (const key in groupingObj) {
156153
groupingArray.push(groupingObj[key])
157154
}
158155
importObj.htmlList = groupingArray;
@@ -165,19 +162,19 @@ export default {
165162
* @return: nothing: passes the substrings into buildList to generate an array of elements
166163
*/
167164
168-
function htmlParser(htmlString){
169-
if (!htmlString){return}
165+
function htmlParser(htmlString) {
166+
if (!htmlString) { return }
170167
//remove new lines and tabs from HTML
171168
htmlString = htmlString.replaceAll('\n', '').replaceAll('\t', '');
172169
//find index for the first < and > in the string
173170
let openTag = htmlString.indexOf('<');
174171
let closeTag = htmlString.indexOf('>');
175172
176173
//push the substring wrapped by < and > into the helper func
177-
buildList(htmlString.substring(openTag+1, closeTag))
174+
buildList(htmlString.substring(openTag + 1, closeTag))
178175
179176
//recursively call htmlParser on the remainder of the string
180-
return htmlParser(htmlString.substring(closeTag+1))
177+
return htmlParser(htmlString.substring(closeTag + 1))
181178
}
182179
183180
@@ -190,24 +187,24 @@ export default {
190187
* @return: nothing -- pushes into htmlList array which is defined outside scope of buildList
191188
*/
192189
193-
function buildList(substring){
194-
for (const elem in htmlElementMap){
195-
for (let i = 0; i < htmlElementMap[elem].length; i++){
196-
//if the htmlElementMap[elem][index] matches the substring, push it into the output array
197-
if (substring === 'p'){
198-
htmlList.push(htmlElementMap.paragraph[0])
199-
return;
200-
} else if (substring === '/p') {
201-
htmlList.push(htmlElementMap.paragraph[1])
202-
return;
203-
}
204-
if (htmlElementMap[elem][i].indexOf(substring) !== -1){
205-
htmlList.push(htmlElementMap[elem][i])
206-
return;
190+
function buildList(substring) {
191+
for (const elem in htmlElementMap) {
192+
for (let i = 0; i < htmlElementMap[elem].length; i++) {
193+
//if the htmlElementMap[elem][index] matches the substring, push it into the output array
194+
if (substring === 'p') {
195+
htmlList.push(htmlElementMap.paragraph[0])
196+
return;
197+
} else if (substring === '/p') {
198+
htmlList.push(htmlElementMap.paragraph[1])
199+
return;
200+
}
201+
if (htmlElementMap[elem][i].indexOf(substring) !== -1) {
202+
htmlList.push(htmlElementMap[elem][i])
203+
return;
204+
}
207205
}
208206
}
209207
}
210-
}
211208
212209
/**
213210
* @name: findGroupings
@@ -216,31 +213,31 @@ export default {
216213
* @return: returns an array of arrays (grouped by parent/child)
217214
*/
218215
219-
function findGroupings(array){
216+
function findGroupings(array) {
220217
let count = 0; //tracks where the parent ends
221218
let stopIndexes = []; //an array that will be used to slice out the parent/child relationships
222-
for (let i = 0; i < array.length; i++){
223-
if (array[i][1] !== '/'){
224-
if (array[i] === '<img>' || array[i] === '<a href="#"/>' || array[i] === '<input />'){
225-
if (count === 0){
219+
for (let i = 0; i < array.length; i++) {
220+
if (array[i][1] !== '/') {
221+
if (array[i] === '<img>' || array[i] === '<a href="#"/>' || array[i] === '<input />') {
222+
if (count === 0) {
226223
stopIndexes.push(i);
227224
continue;
228225
}
229226
} else {
230-
count++;
227+
count++;
231228
}
232229
} else {
233230
count--;
234231
}
235-
if (count === 0){
232+
if (count === 0) {
236233
stopIndexes.push(i)
237234
}
238235
}
239236
let groupings = [];
240237
let startIndex = 0;
241-
for (let i = 0; i < stopIndexes.length; i++){
242-
groupings.push(array.slice(startIndex, stopIndexes[i]+1));
243-
startIndex = stopIndexes[i]+1;
238+
for (let i = 0; i < stopIndexes.length; i++) {
239+
groupings.push(array.slice(startIndex, stopIndexes[i] + 1));
240+
startIndex = stopIndexes[i] + 1;
244241
}
245242
return groupings;
246243
}
@@ -253,22 +250,22 @@ export default {
253250
* @return: returns an object containing parent/children html elements nested.
254251
*/
255252
256-
function objectGenerator(array){
253+
function objectGenerator(array) {
257254
let groupingObj = {};
258-
for (let i = 0; i < array.length; i++){
259-
for (const key in htmlElementMap){
260-
if (array[i][0] === htmlElementMap[key][0]){
261-
let idGen = Date.now()-Math.floor(Math.random()*1000000);
262-
groupingObj[i] = {text: key, id: idGen}
255+
for (let i = 0; i < array.length; i++) {
256+
for (const key in htmlElementMap) {
257+
if (array[i][0] === htmlElementMap[key][0]) {
258+
let idGen = Date.now() - Math.floor(Math.random() * 1000000);
259+
groupingObj[i] = { text: key, id: idGen }
263260
}
264261
}
265262
array[i].pop();
266263
array[i].shift();
267-
if (array[i].length > 0){
264+
if (array[i].length > 0) {
268265
const childGroupings = findGroupings(array[i]);
269266
const childrenObj = objectGenerator(childGroupings);
270267
const childrenArray = [];
271-
for (const key in childrenObj){
268+
for (const key in childrenObj) {
272269
childrenArray.push(childrenObj[key])
273270
}
274271
groupingObj[i].children = childrenArray;

0 commit comments

Comments
 (0)