From abb28e0701d3ce92755826fefa4c870f9e04008b Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 15:00:08 -0500 Subject: [PATCH 01/38] Successful render Must pass cssProps to all elements utilizing transition-move. --- components/VGitGraph.vue | 14 ++++++++++---- pages/index.vue | 3 ++- store/index.js | 1 + 3 files changed, 13 insertions(+), 5 deletions(-) diff --git a/components/VGitGraph.vue b/components/VGitGraph.vue index f2b5ac4..8c442a4 100644 --- a/components/VGitGraph.vue +++ b/components/VGitGraph.vue @@ -10,7 +10,7 @@ @@ -18,7 +18,7 @@ @@ -27,7 +27,7 @@ @@ -56,6 +56,11 @@ export default { // dx must be defined before any x values are calculated. Nan causes SSR err. // if in paths.vue, dx may not be defined when links or glyph call it }, + computed:{ + cssProps() { + return {'--duration': `${this.$store.state.scaling}s`} + } + }, methods: { filterLinks(path) { var filtered = _.pickBy(path, function(value, key) { @@ -81,6 +86,7 @@ export default { \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index cf9d8c3..9dd16df 100755 --- a/pages/index.vue +++ b/pages/index.vue @@ -10,7 +10,7 @@
- + {{ $store.state.scale }}
@@ -28,5 +28,6 @@ export default { VGitGraph, CollapseState }, + } diff --git a/store/index.js b/store/index.js index d7d1edc..ee6c0c5 100755 --- a/store/index.js +++ b/store/index.js @@ -23,6 +23,7 @@ perhaps a mixin? I think this makes sense. export const state = () => ({ display: 0, scale: 50, + scaling:1, show: {}, displacement: {}, branches: { From 0723aae01f1041860a2ca36376638f646cd737cf Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 16:18:59 -0500 Subject: [PATCH 02/38] turn and unix are now 1 to 1 turn 1, 9/11/19 through turn 17 9/27/2019 --- store/index.js | 106 ++++++++++++++++++++++++------------------------- 1 file changed, 53 insertions(+), 53 deletions(-) diff --git a/store/index.js b/store/index.js index d7d1edc..5ef835e 100755 --- a/store/index.js +++ b/store/index.js @@ -31,23 +31,23 @@ export const state = () => ({ children: ["P1.1"], color:'#f00fff', path: { - 1: { y: 1, unix: 1569580240, + 1: { y: 1, unix: 1568160000, glyph: "", event: "url", link: { coord: [0, 0], type: "Path" } // hard link }, - 5: { y: [1, 2], unix: 1569580240, + 5: { y: [1, 2], unix: 1568505600, glyph: "", event: "url", link: { } }, - 8: { y: [1, 3], unix: 1569580240, + 8: { y: [1, 3], unix: 1568764800, glyph: "", event: "url", link: { } }, - 11: { y: [0, 4], unix: 1569580240, + 11: { y: [0, 4], unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: [0, 5], unix: 1569580240, + 14: { y: [0, 5], unix: 1569283200, glyph: "", event: "url", link: { } } @@ -58,19 +58,19 @@ export const state = () => ({ children: [], color:'#000864', path: { - 8: { y: 3, unix: 1569580240, + 8: { y: 3, unix: 1568764800, glyph: "", event: "url", link: { coord: ["P1", 5], type: "Path" } // hard link }, - 11: { y: [0, 4], unix: 1569580240, + 11: { y: [0, 4], unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: [1,5], unix: 1569580240, + 14: { y: [1,5], unix: 1569283200, glyph: "", event: "url", link: { } }, - 17: { y: 6, unix: 1569580240, + 17: { y: 6, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -85,19 +85,19 @@ export const state = () => ({ glyph: "Book", event: "url", link: { } }, - 5: { y: 1, unix: 1569580240, + 5: { y: 1, unix: 1568505600, glyph: "", event: "url", link: { } }, - 8: { y: 2, unix: 1569580240, + 8: { y: 2, unix: 1568764800, glyph: "", event: "url", link: { } }, - 11: { y: 3, unix: 1569580240, + 11: { y: 3, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 4, unix: 1569580240, + 14: { y: 4, unix: 1569283200, glyph: "", event: "url", link: { } } @@ -112,15 +112,15 @@ export const state = () => ({ glyph: "", event: "url", link: { coord: ["P0", 5], type: "Path" } // hard link }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } }, - 17: { y: 7, unix: 1569580240, + 17: { y: 7, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -131,19 +131,19 @@ export const state = () => ({ children: [], color:'#000864', path: { - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { coord: ["P0", 5], type: "Path" } // hard link }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } }, - 17: { y: 7, unix: 1569580240, + 17: { y: 7, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -154,23 +154,23 @@ export const state = () => ({ children: ["P3.1"], color:'#6f0fff', path: { - 1: { y: 2, unix: 1569580240, + 1: { y: 2, unix: 1568160000, glyph: "", event: "url", link: { coord: [0, 0], type: "Path" } // hard link }, - 5: { y: 3, unix: 1569580240, + 5: { y: 3, unix: 1568505600, glyph: "", event: "url", link: { } }, - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { } }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } } @@ -181,19 +181,19 @@ export const state = () => ({ children: [], color:'#000864', path: { - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { coord: ["P3", 5], type: "Path" } // hard link }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } }, - 17: { y: 7, unix: 1569580240, + 17: { y: 7, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -204,23 +204,23 @@ export const state = () => ({ children: ["P2.-1", "P2.-2"], color:'#6f0fff', path: { - 1: { y: 2, unix: 1569580240, + 1: { y: 2, unix: 1568160000, glyph: "", event: "url", link: { coord: [0, 0], type: "Path" } // hard link }, - 5: { y: 3, unix: 1569580240, + 5: { y: 3, unix: 1568505600, glyph: "", event: "url", link: { } }, - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { } }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } } @@ -231,19 +231,19 @@ export const state = () => ({ children: ["P2.-1.-1"], color:'#000864', path: { - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { coord: ["P2", 5], type: "Path" } // hard link }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } }, - 17: { y: 7, unix: 1569580240, + 17: { y: 7, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -254,19 +254,19 @@ export const state = () => ({ children: [], color:'#000864', path: { - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { coord: ["P2", 5], type: "Path" } // hard link }, - 11: { y: 5, unix: 1569580240, + 11: { y: 5, unix: 1569024000, glyph: "", event: "url", link: { } }, - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { } }, - 17: { y: 7, unix: 1569580240, + 17: { y: 7, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -277,11 +277,11 @@ export const state = () => ({ children: [], color:'#000864', path: { - 14: { y: 6, unix: 1569580240, + 14: { y: 6, unix: 1569283200, glyph: "", event: "url", link: { coord: ["P2.-1", 11], type: "Path" } }, - 17: { y: 7, unix: 1569580240, + 17: { y: 7, unix: 1569542400, glyph: "", event: "url", link: { } } @@ -296,19 +296,19 @@ export const state = () => ({ glyph: "Book", event: "url", link: { } }, */ - 2: { y: 1, unix: 1569580240, + 2: { y: 1, unix: 1568246400, glyph: "", event: "url", link: {coord:['P0', 0], type: "Path" } }, - 4: { y: 2, unix: 1569580240, + 4: { y: 2, unix: 1568419200, glyph: "", event: "url", link: { } }, - 7: { y: 3, unix: 1569580240, + 7: { y: 3, unix: 1568678400, glyph: "", event: "url", link: {coord:['P1', 11], type:"Dotted" } // relative link }, - 13: { y: 5, unix: 1569580240, + 13: { y: 5, unix: 1569196800, glyph: "", event: "url", link: {coord:['P1', 11], type:"Dotted" } // relative link } @@ -319,23 +319,23 @@ export const state = () => ({ children: [], color:'#0fb500', path: { - 3: { y: 2, unix: 1569580240, + 3: { y: 2, unix: 1568332800, glyph: "Dot", event: "url", link: { coord: ['GM', 2], type: "Path" } // relative link }, - 6: { y: 3, unix: 1569580240, + 6: { y: 3, unix: 1568592000, glyph: "Dot", event: "url", link: { } }, - 9: { y: 4, unix: 1569580240, + 9: { y: 4, unix: 1568851200, glyph: "Dot", event: "url", link: { } }, - 12: { y: 5, unix: 1569580240, + 12: { y: 5, unix: 1569110400, glyph: "Dot", event: "url", link: { } }, - 15: { y: 6, unix: 1569580240, + 15: { y: 6, unix: 1569369600, glyph: "Dot", event: "url", link: { } } From a2a9057f66954cfe904148ae92ddf3724a044da1 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 17:22:40 -0500 Subject: [PATCH 03/38] successful render --- components/DisplayMixin.js | 3 +++ components/VGitGraph.vue | 1 + store/index.js | 13 +++++++++++-- 3 files changed, 15 insertions(+), 2 deletions(-) diff --git a/components/DisplayMixin.js b/components/DisplayMixin.js index 825d137..beaa4c0 100644 --- a/components/DisplayMixin.js +++ b/components/DisplayMixin.js @@ -35,6 +35,9 @@ export const DisplayMixin = { case 1: return this.scaler(+key) case 2: + const yUnix = this.$store.state.timeSet.indexOf(action.unix) + return this.scaler(yUnix) + case 3: // future cases default: const y = action['y'] diff --git a/components/VGitGraph.vue b/components/VGitGraph.vue index f2b5ac4..6994438 100644 --- a/components/VGitGraph.vue +++ b/components/VGitGraph.vue @@ -51,6 +51,7 @@ export default { Glyphs }, created() { + this.$store.commit('initTimeArr') this.initRoots() this.initDisplacement() // dx must be defined before any x values are calculated. Nan causes SSR err. diff --git a/store/index.js b/store/index.js index 5ef835e..37481f3 100755 --- a/store/index.js +++ b/store/index.js @@ -25,6 +25,7 @@ export const state = () => ({ scale: 50, show: {}, displacement: {}, + timeSet: {}, branches: { "P1": { x: [1], @@ -81,7 +82,7 @@ export const state = () => ({ children: ["P0.1", "P0.-1"], color:'#6f0606', path: { - 0: { y: [0, 0], unix: 1569580240, + 0: { y: [0, 0], unix: 1568073600, glyph: "Book", event: "url", link: { } }, @@ -108,7 +109,7 @@ export const state = () => ({ children: [], color:'#000864', path: { - 8: { y: 4, unix: 1569580240, + 8: { y: 4, unix: 1568764800, glyph: "", event: "url", link: { coord: ["P0", 5], type: "Path" } // hard link }, @@ -364,6 +365,14 @@ export const mutations = { }, dxCreate (state, payload) { state.displacement[payload.key] = payload.value + }, + initTimeArr(state) { + var timeArr = _.map(state.branches, (branch)=>{ + return _.map(branch.path, 'unix') + }) + var timeSet = _.sortedUniq(_.flatten(timeArr).sort()) + console.log(timeSet) + state.timeSet = timeSet } } From 2abe4dec0935fc30c70fcbe386746fe64b512714 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 17:52:16 -0500 Subject: [PATCH 04/38] rudimentary timeline --- pages/index.vue | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/pages/index.vue b/pages/index.vue index cf9d8c3..fe2e0bd 100755 --- a/pages/index.vue +++ b/pages/index.vue @@ -16,17 +16,27 @@ + + + {{ new Date(unix*1000).toLocaleDateString("en-US") }} + + + From 6fbf35218dda56fa74bca992e3e5be7f5e7e8480 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 18:16:42 -0500 Subject: [PATCH 05/38] Replace duplicate Move-To --- components/Paths/PathsMixin.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/components/Paths/PathsMixin.js b/components/Paths/PathsMixin.js index 2b63545..7f6b102 100644 --- a/components/Paths/PathsMixin.js +++ b/components/Paths/PathsMixin.js @@ -1,8 +1,14 @@ export const PathsMixin = { methods: { moveTo(d, x, y){ - return d.push(`M${x} ${y}`) - }, + let last_index = d.length-1 + if (d.length>0 && d[last_index][0] === "M") { + d[last_index] = (`M${x} ${y}`) // Overwrite Move-to + return d + } else { + return d.push(`M${x} ${y}`) // Add Move-to + } + }, Branch(d, x, y, priorXYDisp, scale) { var [xprior, yprior] = priorXYDisp; var maxHeight = yprior + +this.$store.state.scale From a81c6f3aa741af286274e39883d26ad0e4f71948 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 18:27:36 -0500 Subject: [PATCH 06/38] Replace repeat else Extend method generalized method --- components/Paths/PathsMixin.js | 23 ++++++++++++----------- 1 file changed, 12 insertions(+), 11 deletions(-) diff --git a/components/Paths/PathsMixin.js b/components/Paths/PathsMixin.js index 7f6b102..1a9afa5 100644 --- a/components/Paths/PathsMixin.js +++ b/components/Paths/PathsMixin.js @@ -1,14 +1,19 @@ export const PathsMixin = { methods: { - moveTo(d, x, y){ + ExtendOrReplace(d, x, y, marker, string) { let last_index = d.length-1 - if (d.length>0 && d[last_index][0] === "M") { - d[last_index] = (`M${x} ${y}`) // Overwrite Move-to + if (d.length>0 && d[last_index][0] === marker) { + d[last_index] = (string) // Overwrite return d } else { - return d.push(`M${x} ${y}`) // Add Move-to + return d.push(string) // Add } }, + moveTo(d, x, y){ + const marker = 'M' + const string = `${marker}${x} ${y}` + return this.ExtendOrReplace(d, x, y, marker, string) + }, Branch(d, x, y, priorXYDisp, scale) { var [xprior, yprior] = priorXYDisp; var maxHeight = yprior + +this.$store.state.scale @@ -22,13 +27,9 @@ export const PathsMixin = { return d }, Line(d, x ,y) { - let last_index = d.length-1 - if (d[last_index][0] === "L") { - d[last_index] = (`L${x} ${y}`) // Extend prior line - return d - } else { - return d.push(`L${x} ${y}`) // Start new line - } + const marker = 'L' + const string = `${marker}${x} ${y}` + return this.ExtendOrReplace(d, x, y, marker, string) }, // In-path Link From 4b53cb928acc18f88215e98858a134bd12e93628 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Wed, 6 Nov 2019 18:34:09 -0500 Subject: [PATCH 07/38] cleaned --- components/Paths/PathsMixin.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/components/Paths/PathsMixin.js b/components/Paths/PathsMixin.js index 1a9afa5..cc8882c 100644 --- a/components/Paths/PathsMixin.js +++ b/components/Paths/PathsMixin.js @@ -3,10 +3,10 @@ export const PathsMixin = { ExtendOrReplace(d, x, y, marker, string) { let last_index = d.length-1 if (d.length>0 && d[last_index][0] === marker) { - d[last_index] = (string) // Overwrite + d[last_index] = (string) // Overwrite repeat return d } else { - return d.push(string) // Add + return d.push(string) // Extend dString } }, moveTo(d, x, y){ @@ -19,9 +19,7 @@ export const PathsMixin = { var maxHeight = yprior + +this.$store.state.scale var midY = (yprior + maxHeight) / 2; d.push(`C${xprior} ${midY} ${x} ${midY} ${x} ${maxHeight}`); - if (maxHeight Date: Wed, 6 Nov 2019 18:36:43 -0500 Subject: [PATCH 08/38] Update PathsMixin.js --- components/Paths/PathsMixin.js | 1 + 1 file changed, 1 insertion(+) diff --git a/components/Paths/PathsMixin.js b/components/Paths/PathsMixin.js index cc8882c..b45e378 100644 --- a/components/Paths/PathsMixin.js +++ b/components/Paths/PathsMixin.js @@ -1,6 +1,7 @@ export const PathsMixin = { methods: { ExtendOrReplace(d, x, y, marker, string) { + // If repeat, overwrite. Otherwise, extened dString. let last_index = d.length-1 if (d.length>0 && d[last_index][0] === marker) { d[last_index] = (string) // Overwrite repeat From c2f8fb6576398b9242ccc216ad5d3a8dcc9da581 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Thu, 7 Nov 2019 13:44:05 -0500 Subject: [PATCH 09/38] dropdown search bar --- pages/index.vue | 77 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) diff --git a/pages/index.vue b/pages/index.vue index cf9d8c3..23dd507 100755 --- a/pages/index.vue +++ b/pages/index.vue @@ -16,6 +16,26 @@ +
+ + +
+ {{ option }} +
+ +
+ @@ -28,5 +48,62 @@ export default { VGitGraph, CollapseState }, + computed: { + filteredList() { + if(this.selected){ + return [this.selected] + } else { + return Object.keys(this._$).filter(k => { + return k.toLowerCase().includes(this.search.toLowerCase()) + }) + } + } + }, + methods:{ + selectOption(option) { + this.search = option + this.selected = option + this.dropdown=false + }, + initQuery(){ + this.dropdown = true + this.selected = false + } + }, + data:() => { + return { + dropdown: false, + search:'', + selected:false + } + } } + + \ No newline at end of file From ccf293c06d1c364ce7cda8a8941f8708cdc8bb41 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Thu, 7 Nov 2019 14:00:45 -0500 Subject: [PATCH 10/38] elastic search component --- components/Search.vue | 87 +++++++++++++++++++++++++++++++++++++++++++ pages/index.vue | 86 ++++-------------------------------------- 2 files changed, 94 insertions(+), 79 deletions(-) create mode 100644 components/Search.vue diff --git a/components/Search.vue b/components/Search.vue new file mode 100644 index 0000000..990fc69 --- /dev/null +++ b/components/Search.vue @@ -0,0 +1,87 @@ + + + + + \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index 23dd507..9f08dfa 100755 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,5 +1,8 @@ - \ No newline at end of file + \ No newline at end of file From f5dfacf4d2a9040a318544a8be82a76505431ce6 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Thu, 7 Nov 2019 14:21:18 -0500 Subject: [PATCH 11/38] proof of concept overwriting show --- components/Search.vue | 22 +++++++++++++--------- store/index.js | 1 + 2 files changed, 14 insertions(+), 9 deletions(-) diff --git a/components/Search.vue b/components/Search.vue index 990fc69..cc75aa4 100644 --- a/components/Search.vue +++ b/components/Search.vue @@ -24,15 +24,26 @@ diff --git a/store/index.js b/store/index.js index d7d1edc..f601fa3 100755 --- a/store/index.js +++ b/store/index.js @@ -25,6 +25,7 @@ export const state = () => ({ scale: 50, show: {}, displacement: {}, + filtered: false, branches: { "P1": { x: [1], From 15a36341fc3ef76060f7e2b62e42db7d3a7aa3e7 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Thu, 7 Nov 2019 14:47:15 -0500 Subject: [PATCH 12/38] filtered but x not calculated troubling. I want filtered and show to be seperate states. but x is calculated on show. i could make a displayed state and a show state. Then filtering just overrides displayed(setDisplayed) if its not empty? --- components/Search.vue | 3 +-- components/VGitGraph.vue | 14 ++++++++++---- store/index.js | 10 +++++++++- 3 files changed, 20 insertions(+), 7 deletions(-) diff --git a/components/Search.vue b/components/Search.vue index cc75aa4..cbd11c3 100644 --- a/components/Search.vue +++ b/components/Search.vue @@ -41,8 +41,7 @@ export default { return k.toLowerCase().includes(this.search.toLowerCase()) }) } - this.$store.commit('setVisible', filtered) - //this.$store.state.filtered = filtered + this.$store.commit('setFiltered', this.search!==""?filtered:false) return filtered } }, diff --git a/components/VGitGraph.vue b/components/VGitGraph.vue index f2b5ac4..b71958b 100644 --- a/components/VGitGraph.vue +++ b/components/VGitGraph.vue @@ -8,7 +8,7 @@ Thus, they appear from the top left corner of the screen. --> + v-show="display(branchName)"> + v-show="display(branchName)"> diff --git a/store/index.js b/store/index.js index f601fa3..d929b4e 100755 --- a/store/index.js +++ b/store/index.js @@ -365,7 +365,15 @@ export const mutations = { }, dxCreate (state, payload) { state.displacement[payload.key] = payload.value - } + }, + setFiltered (state, keyArr) { + state.filtered = {} + if (keyArr){ + for (var k of keyArr) { + Vue.set(state.filtered, k, state.branches[k].x) + } + } + }, } export const getters = { From a3dd7b4f9db6963d535f9375df2ba6b0056d9e68 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Thu, 7 Nov 2019 15:09:54 -0500 Subject: [PATCH 13/38] Successful render Beware when +&- child are desplayed, but not parent. they collapse and with nothing between them, they overlap... Not much I can do atm. maybe something like: const test = Math.abs(xConst[xConst.length-1])===1&&xConst.length>1&&!_.isEmpty(state.filtered)?Math.sign(xConst[xConst.length-1]):0 return sum+test idk... --- store/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/store/index.js b/store/index.js index d929b4e..2d691f8 100755 --- a/store/index.js +++ b/store/index.js @@ -409,7 +409,8 @@ export const getters = { solveXDisp: (state) => (xConst) => { const sign = getters.compareX(xConst, [0]) // Get prior Branches. (cant loop through just show as x is needed) - const xArr = _.pickBy(state.show, (x,k) => ( + var displayed = _.isEmpty(state.filtered)?state.show:state.filtered + const xArr = _.pickBy(displayed, (x,k) => ( (!_.isEqual(xConst, [0]) && _.isEqual(x, [0])) || // shift all but 0 by 1 getters.compareX(x, [0]) === sign && // +/- from [0] getters.compareX(xConst, x) === sign // prior branches closer to zero = sign From 3fe53bb54330d93e36c05d1ef9c55ef6552e431e Mon Sep 17 00:00:00 2001 From: TcardLab Date: Tue, 12 Nov 2019 17:13:47 -0500 Subject: [PATCH 14/38] prevent overlap on zero If zero is not present in search results, pseudoZero will add the appropriate displacement based on the sign of branch under calculation. Additionally, if search result length is 1, then pseudoZero will not be calculated. Fixed isActive flase-positive during search. It is now disabled. --- components/Paths.vue | 6 ++++-- store/index.js | 10 ++++++++++ 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/components/Paths.vue b/components/Paths.vue index 90c9162..4d4655f 100644 --- a/components/Paths.vue +++ b/components/Paths.vue @@ -21,8 +21,10 @@ export default { mixins: [PathsMixin, DisplayMixin], computed: { isActive() { - var display = this.$store.state.show - return !this.items.children.every((val) => val in display) + if (_.isEmpty(this.$store.state.filtered)){ + var display = this.$store.state.show + return !this.items.children.every((val) => val in display) + } else {return false} } }, methods: { diff --git a/store/index.js b/store/index.js index 2d691f8..cca44a8 100755 --- a/store/index.js +++ b/store/index.js @@ -417,6 +417,16 @@ export const getters = { )) // sum displacement of prior branches const sum = _.sum(_.map(xArr, (v,k)=>sign * state.displacement[k])) + + if (!_.isEmpty(state.filtered)){ + if (_.keys(state.filtered).length===1){ + return 0 + } else { + const pseudoZero = '0' in _.invert(state.filtered)? 0 : sign + return sum + pseudoZero + } + } + return sum }, maxDx: (state) => (key) => { From 9f23074d39d78f65245c4d4165653e3b4e374f01 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Tue, 12 Nov 2019 17:23:36 -0500 Subject: [PATCH 15/38] cleaned --- store/index.js | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/store/index.js b/store/index.js index cca44a8..d0b9c18 100755 --- a/store/index.js +++ b/store/index.js @@ -406,6 +406,13 @@ export const getters = { } } }, + pseudoZero(displayObject, sign) { + // not empty and seearch results.len > 1 + if (_.keys(displayObject).length>1){ + // if x=[0] is in displayObject + return '0' in _.invert(displayObject)? 0 : sign + } else {return 0} + }, solveXDisp: (state) => (xConst) => { const sign = getters.compareX(xConst, [0]) // Get prior Branches. (cant loop through just show as x is needed) @@ -417,17 +424,7 @@ export const getters = { )) // sum displacement of prior branches const sum = _.sum(_.map(xArr, (v,k)=>sign * state.displacement[k])) - - if (!_.isEmpty(state.filtered)){ - if (_.keys(state.filtered).length===1){ - return 0 - } else { - const pseudoZero = '0' in _.invert(state.filtered)? 0 : sign - return sum + pseudoZero - } - } - - return sum + return sum + getters.pseudoZero(state.filtered, sign) // mod displacement for search results }, maxDx: (state) => (key) => { const path = state.branches[key].path From 2fe6132847fc47ab25756d28b0b03679f5e59f51 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Tue, 24 Dec 2019 15:01:01 -0500 Subject: [PATCH 16/38] Sinlge click to toggle --- components/Paths.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Paths.vue b/components/Paths.vue index 4d4655f..e436463 100644 --- a/components/Paths.vue +++ b/components/Paths.vue @@ -1,7 +1,7 @@ diff --git a/components/Paths/PathsMixin.js b/components/Paths/PathsMixin.js index d942fa6..0c9d0f2 100644 --- a/components/Paths/PathsMixin.js +++ b/components/Paths/PathsMixin.js @@ -35,7 +35,7 @@ export const PathsMixin = { inPathLink(bItems, index){ var link = Object.values(bItems.path)[index].link if (Object.keys(link).length > 0 && link.type==="Path"){ - return this.getLink(link) + return this.$store.getters.getLink(link) } else { return false } diff --git a/store/Display/display.js b/store/Display/display.js index 79e4e87..a6862c7 100644 --- a/store/Display/display.js +++ b/store/Display/display.js @@ -68,7 +68,22 @@ export default { kvArr.map(([k, v]) => [k, getters.getXYDisp(k, xConst, xDisp, v)]) ) return output - } + }, + // Relative Link Function + getLink: ( state, getters, rootState ) => (link) => { + if (Object.keys(rootState.branches).includes(link.coord[0])) { + // relative link - if given branch exists + var [branchName, event] = link.coord + var branch = rootState.branches[branchName] + var action = branch.path[event] + var xDisp = getters.solveXDisp(branch['x']) + var XYLink = getters.getXYDisp(event, branch['x'], xDisp, action) + } else { + // hard link + var XYLink = getters.scaler(link.coord) + } + return XYLink + }, }, mutations: { From de77a5cf410aec1d9625e777eb4cc222ba8ed4e0 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Fri, 27 Dec 2019 18:30:40 -0500 Subject: [PATCH 27/38] removed all methods from DisplayMixin --- components/DisplayMixin.js | 105 ------------------------------------- pages/index.vue | 2 +- 2 files changed, 1 insertion(+), 106 deletions(-) diff --git a/components/DisplayMixin.js b/components/DisplayMixin.js index 055a6e5..e271370 100644 --- a/components/DisplayMixin.js +++ b/components/DisplayMixin.js @@ -20,110 +20,5 @@ export const DisplayMixin = { this.$store.dispatch('updateCache') } } - }, - - methods: { - /* updateCache(){ - for(let [key, bItems] of Object.entries(this._$)) { - - var Payload = {key: key, val: this.cacheCalc(bItems)} - this.$store.commit('updateBranch', Payload) - } - }, */ - /* cacheCalc(bItems){ // –> [[x, y], ...] - const xConst = bItems.x - var xDisp = this.$store.getters.solveXDisp(xConst) - const kvArr = Object.entries(bItems.path) - let output = Object.fromEntries( - // Path data should be an array, can revert to getDispPath() once implemented. - kvArr.map(([k, v]) => [k, this.getXYDisp(k, xConst, xDisp, v)]) - ) - return output - }, */ - - // Modifier functions - scaler(input, scale=this._Display.scale){ // –> scale #s of any given input. - switch(input.constructor){ - case Number: - return input * scale - case String: - return +input * scale - case Array: - if (input[0].constructor==Array){ // 2D - return input.map(xy => [xy[0]*scale, xy[1]*scale]) - } else { // 1D - return input.map(el => el * scale) - } - case Object: // assuming {'C': [x1,y1, x2,y2, x,y]} - Object.keys(input).map(function(key, index) { - input[key] = input[key].map(el => el*scale) - }) - return input - } - }, - - // Independant functions - getXDisp(xConst, action, xDisp){ // –> # - xConst = xConst.reduce((a, b) => a + b, 0) //children branches [1,2] x=0+dx of 2. etc - const y = action['y'] - const dx = Array.isArray(y) ? y[0] : 0 - return this.scaler(xDisp+dx, 50) - // remove 50 so scale uniformly could make x&y scales... added to to-do - }, - getYDisp(key, action){ // –> # - switch(+this._Display.display) { - case 1: - return this.scaler(+key) - case 2: - const yUnix = this.$store.state.timeSet.indexOf(action.unix) - return this.scaler(yUnix) - case 3: - // future cases - default: - const y = action['y'] - const yDisp = Array.isArray(y) ? y[1] : y - return this.scaler(yDisp) - } - }, - - // Dependent Functions - More than necessary, but there if needed - getXYDisp(key, xConst, xDisp, action){ // –> [x, y] - var xDisp = this.getXDisp(xConst, action, xDisp) - var yDisp = this.getYDisp(key, action) - return [xDisp, yDisp] - }, - - getXDispPath(bItems){ // –> [x1, x2, ...] - const xConst = bItems.x - var xDisp = this.$store.getters.solveXDisp(xConst) - const path = Object.values(bItems.path) - return path.map(actions => this.getXDisp(xConst, actions, xDisp)) - }, - getYDispPath(bItems){ // –> [y1, y2, ...] - const kv = Object.entries(bItems.path) - return kv.map(kv => this.getYDisp(kv[0], kv[1])) - }, - getDispPath(bItems){ // –> [[x, y], ...] - const xConst = bItems.x - var xDisp = this.$store.getters.solveXDisp(xConst) - const kvArr = Object.entries(bItems.path) - return kvArr.map(kv => this.getXYDisp(kv[0], xConst, xDisp, kv[1])) - }, - - /* // Relative Link Function - getLink(link) { - if (Object.keys(this._$).includes(link.coord[0])) { - // relative link - if given branch exists - var [branchName, event] = link.coord - var branch = this._$[branchName] - var action = branch.path[event] - var xDisp = this.$store.getters.solveXDisp(branch['x']) - var XYLink = this.getXYDisp(event, branch['x'], xDisp, action) - } else { - // hard link - var XYLink = this.scaler(link.coord) - } - return XYLink - }, */ } } \ No newline at end of file diff --git a/pages/index.vue b/pages/index.vue index 984694b..011f6e7 100755 --- a/pages/index.vue +++ b/pages/index.vue @@ -26,7 +26,7 @@ {{ new Date(unix*1000).toLocaleDateString("en-US") }} From 8204bc248af79f369f93f9fdf43f3c35e0943d0b Mon Sep 17 00:00:00 2001 From: TcardLab Date: Fri, 27 Dec 2019 18:39:38 -0500 Subject: [PATCH 28/38] seperated state from store index file --- .nuxt/store.js | 2 + store/index.js | 358 +------------------------------------------------ store/state.js | 346 +++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 355 insertions(+), 351 deletions(-) create mode 100644 store/state.js diff --git a/.nuxt/store.js b/.nuxt/store.js index ab175e4..03e9b79 100644 --- a/.nuxt/store.js +++ b/.nuxt/store.js @@ -18,6 +18,7 @@ void (function updateModules() { // Enforce store modules store.modules = store.modules || {} + resolveStoreModules(require('../store/state.js'), 'state.js') resolveStoreModules(require('../store/storeRoute.js'), 'storeRoute.js') resolveStoreModules(require('../store/Display/display.js'), 'Display/display.js') @@ -27,6 +28,7 @@ void (function updateModules() { // Whenever any Vuex module is updated... module.hot.accept([ '../store/index.js', + '../store/state.js', '../store/storeRoute.js', '../store/Display/display.js', ], () => { diff --git a/store/index.js b/store/index.js index b67f098..512178c 100755 --- a/store/index.js +++ b/store/index.js @@ -1,361 +1,17 @@ +import Vue from "vue"; +import _ from "lodash"; + +// Root stuff +import state from "./state.js" + +// Modules import DisplayMixin from "./Display/display.js" export const modules = { DisplayMixin } - export const strict = false; -/* Due to the need of relative links when y-display changes, I need a key -to reference an event so i can get the coordinates. - -I have chosen "turn" to be the key, as globaly it is the most intuitive to -sort and search by. However, it doesnt make the methods any simpler... - -Alternative: -I believe using "y" as the key would improve simplicity. I would lose the -x-override however, I would make this a dx key to shift from the xConst of -the branch: -x=xConst -path: { - y: {turn:0, dx:"if applicable", ...} -} -i'll play around with this as well later. -If i can figure out general coordinate functions/methods, this will be -easier as json and that file are the only ones that need editing. -perhaps a mixin? I think this makes sense. -*/ - -export const state = () => ({ - display: 0, - scale: 50, - scaling:1, - show: {}, - displacement: {}, - filtered: false, - timeSet: {}, - branches: { - "P1": { - x: [1], - children: ["P1.1"], - color:'#f00fff', - path: { - 1: { y: 1, unix: 1568160000, - glyph: "", event: "url", - link: { coord: [0, 0], type: "Path" } // hard link - }, - 5: { y: [1, 2], unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: [1, 3], unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: [0, 4], unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: [0, 5], unix: 1569283200, - glyph: "", event: "url", - link: { } - } - }, - }, - "P1.1": { - x: [2, 1], - children: [], - color:'#000864', - path: { - 8: { y: 3, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P1", 5], type: "Path" } // hard link - }, - 11: { y: [0, 4], unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: [1,5], unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 6, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P0": { - x: [0], - children: ["P0.1", "P0.-1"], - color:'#6f0606', - path: { - 0: { y: [0, 0], unix: 1568073600, - glyph: "Book", event: "url", - link: { } - }, - 5: { y: 1, unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: 2, unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: 3, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 4, unix: 1569283200, - glyph: "", event: "url", - link: { } - } - }, - }, - "P0.1": { - x: [0, 1], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P0", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P0.-1": { - x: [0, -1], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P0", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P3": { - x: [-3], - children: ["P3.1"], - color:'#6f0fff', - path: { - 1: { y: 2, unix: 1568160000, - glyph: "", event: "url", - link: { coord: [0, 0], type: "Path" } // hard link - }, - 5: { y: 3, unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - } - }, - }, - "P3.1": { - x: [-3, 1], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P3", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P2": { - x: [3], - children: ["P2.-1", "P2.-2"], - color:'#6f0fff', - path: { - 1: { y: 2, unix: 1568160000, - glyph: "", event: "url", - link: { coord: [0, 0], type: "Path" } // hard link - }, - 5: { y: 3, unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - } - }, - }, - "P2.-1": { - x: [3, -1], - children: ["P2.-1.-1"], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P2", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P2.-2": { - x: [3, -2], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P2", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P2.-1.-1": { - x: [3, -1, -1], - children: [], - color:'#000864', - path: { - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { coord: ["P2.-1", 11], type: "Path" } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "GM": { - x: [-1], - children: ['GM2'], - color: '#008fb5', - path: { - /* 0: { y: [1, 0], unix: 1569580240, - glyph: "Book", event: "url", - link: { } - }, */ - 2: { y: 1, unix: 1568246400, - glyph: "", event: "url", - link: {coord:['P0', 0], type: "Path" } - }, - 4: { y: 2, unix: 1568419200, - glyph: "", event: "url", - link: { } - }, - 7: { y: 3, unix: 1568678400, - glyph: "", event: "url", - link: {coord:['P1', 11], type:"Dotted" } // relative link - }, - 13: { y: 5, unix: 1569196800, - glyph: "", event: "url", - link: {coord:['P1', 11], type:"Dotted" } // relative link - } - }, - }, - "GM2": { - x: [-2], - children: [], - color:'#0fb500', - path: { - 3: { y: 2, unix: 1568332800, - glyph: "Dot", event: "url", - link: { coord: ['GM', 2], type: "Path" } // relative link - }, - 6: { y: 3, unix: 1568592000, - glyph: "Dot", event: "url", - link: { } - }, - 9: { y: 4, unix: 1568851200, - glyph: "Dot", event: "url", - link: { } - }, - 12: { y: 5, unix: 1569110400, - glyph: "Dot", event: "url", - link: { } - }, - 15: { y: 6, unix: 1569369600, - glyph: "Dot", event: "url", - link: { } - } - } - } - } -}); - -import Vue from "vue"; -import _ from "lodash"; - export const mutations = { addVisible (state, key) { // show: {bName: x, ...} for (var k of key) { diff --git a/store/state.js b/store/state.js new file mode 100644 index 0000000..33f9924 --- /dev/null +++ b/store/state.js @@ -0,0 +1,346 @@ +/* Due to the need of relative links when y-display changes, I need a key +to reference an event so i can get the coordinates. + +I have chosen "turn" to be the key, as globaly it is the most intuitive to +sort and search by. However, it doesnt make the methods any simpler... + +Alternative: +I believe using "y" as the key would improve simplicity. I would lose the +x-override however, I would make this a dx key to shift from the xConst of +the branch: +x=xConst +path: { + y: {turn:0, dx:"if applicable", ...} +} +i'll play around with this as well later. +If i can figure out general coordinate functions/methods, this will be +easier as json and that file are the only ones that need editing. +perhaps a mixin? I think this makes sense. +*/ + +export default { + display: 0, + scale: 50, + scaling:1, + show: {}, + displacement: {}, + filtered: false, + timeSet: {}, + branches: { + "P1": { + x: [1], + children: ["P1.1"], + color:'#f00fff', + path: { + 1: { y: 1, unix: 1568160000, + glyph: "", event: "url", + link: { coord: [0, 0], type: "Path" } // hard link + }, + 5: { y: [1, 2], unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: [1, 3], unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: [0, 4], unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: [0, 5], unix: 1569283200, + glyph: "", event: "url", + link: { } + } + }, + }, + "P1.1": { + x: [2, 1], + children: [], + color:'#000864', + path: { + 8: { y: 3, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P1", 5], type: "Path" } // hard link + }, + 11: { y: [0, 4], unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: [1,5], unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 6, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "P0": { + x: [0], + children: ["P0.1", "P0.-1"], + color:'#6f0606', + path: { + 0: { y: [0, 0], unix: 1568073600, + glyph: "Book", event: "url", + link: { } + }, + 5: { y: 1, unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: 2, unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: 3, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 4, unix: 1569283200, + glyph: "", event: "url", + link: { } + } + }, + }, + "P0.1": { + x: [0, 1], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P0", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "P0.-1": { + x: [0, -1], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P0", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "P3": { + x: [-3], + children: ["P3.1"], + color:'#6f0fff', + path: { + 1: { y: 2, unix: 1568160000, + glyph: "", event: "url", + link: { coord: [0, 0], type: "Path" } // hard link + }, + 5: { y: 3, unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + } + }, + }, + "P3.1": { + x: [-3, 1], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P3", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "P2": { + x: [3], + children: ["P2.-1", "P2.-2"], + color:'#6f0fff', + path: { + 1: { y: 2, unix: 1568160000, + glyph: "", event: "url", + link: { coord: [0, 0], type: "Path" } // hard link + }, + 5: { y: 3, unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + } + }, + }, + "P2.-1": { + x: [3, -1], + children: ["P2.-1.-1"], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P2", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "P2.-2": { + x: [3, -2], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P2", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "P2.-1.-1": { + x: [3, -1, -1], + children: [], + color:'#000864', + path: { + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { coord: ["P2.-1", 11], type: "Path" } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } + } + }, + "GM": { + x: [-1], + children: ['GM2'], + color: '#008fb5', + path: { + /* 0: { y: [1, 0], unix: 1569580240, + glyph: "Book", event: "url", + link: { } + }, */ + 2: { y: 1, unix: 1568246400, + glyph: "", event: "url", + link: {coord:['P0', 0], type: "Path" } + }, + 4: { y: 2, unix: 1568419200, + glyph: "", event: "url", + link: { } + }, + 7: { y: 3, unix: 1568678400, + glyph: "", event: "url", + link: {coord:['P1', 11], type:"Dotted" } // relative link + }, + 13: { y: 5, unix: 1569196800, + glyph: "", event: "url", + link: {coord:['P1', 11], type:"Dotted" } // relative link + } + }, + }, + "GM2": { + x: [-2], + children: [], + color:'#0fb500', + path: { + 3: { y: 2, unix: 1568332800, + glyph: "Dot", event: "url", + link: { coord: ['GM', 2], type: "Path" } // relative link + }, + 6: { y: 3, unix: 1568592000, + glyph: "Dot", event: "url", + link: { } + }, + 9: { y: 4, unix: 1568851200, + glyph: "Dot", event: "url", + link: { } + }, + 12: { y: 5, unix: 1569110400, + glyph: "Dot", event: "url", + link: { } + }, + 15: { y: 6, unix: 1569369600, + glyph: "Dot", event: "url", + link: { } + } + } + } + } +} From 28f4c20b5233eb995cb3c26baff63eb658803036 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Fri, 27 Dec 2019 18:52:23 -0500 Subject: [PATCH 29/38] some cleanup --- components/Search.vue | 2 +- store/Display/display.js | 7 ++++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/components/Search.vue b/components/Search.vue index 6008770..562110d 100644 --- a/components/Search.vue +++ b/components/Search.vue @@ -24,7 +24,7 @@
+
+ + + {{ _Display.scale }} +
+ +
+ + + {{ ['Paths', 'Turns', 'Time'][_Display.display] }} +
+ + + + + +
+ + + + + \ No newline at end of file diff --git a/layouts/default.vue b/layouts/default.vue index 0b069e2..f785d9f 100755 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -29,8 +29,9 @@ html { min-height: 100vh; display: flex; justify-content: center; - align-items: center; + /* align-items: center; */ text-align: center; + overflow: scroll; } .button--green { diff --git a/pages/index.vue b/pages/index.vue index 011f6e7..9a52fb8 100755 --- a/pages/index.vue +++ b/pages/index.vue @@ -1,27 +1,7 @@ \ No newline at end of file diff --git a/store/index.js b/store/index.js index 512178c..7f742d6 100755 --- a/store/index.js +++ b/store/index.js @@ -5,13 +5,14 @@ import _ from "lodash"; import state from "./state.js" // Modules -import DisplayMixin from "./Display/display.js" +import DisplayMixin from "./modules/display.js" export const modules = { DisplayMixin } export const strict = false; + export const mutations = { addVisible (state, key) { // show: {bName: x, ...} for (var k of key) { diff --git a/store/Display/display.js b/store/modules/display.js similarity index 100% rename from store/Display/display.js rename to store/modules/display.js diff --git a/store/state.js b/store/state.js index 33f9924..0dddbe5 100644 --- a/store/state.js +++ b/store/state.js @@ -17,330 +17,330 @@ If i can figure out general coordinate functions/methods, this will be easier as json and that file are the only ones that need editing. perhaps a mixin? I think this makes sense. */ - -export default { - display: 0, - scale: 50, - scaling:1, - show: {}, - displacement: {}, - filtered: false, - timeSet: {}, - branches: { - "P1": { - x: [1], - children: ["P1.1"], - color:'#f00fff', - path: { - 1: { y: 1, unix: 1568160000, - glyph: "", event: "url", - link: { coord: [0, 0], type: "Path" } // hard link - }, - 5: { y: [1, 2], unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: [1, 3], unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: [0, 4], unix: 1569024000, - glyph: "", event: "url", - link: { } +export default () => ({ + display: 0, + scale: 50, + scaling:1, + show: {}, + displacement: {}, + filtered: false, + timeSet: {}, + branches: { + "P1": { + x: [1], + children: ["P1.1"], + color:'#f00fff', + path: { + 1: { y: 1, unix: 1568160000, + glyph: "", event: "url", + link: { coord: [0, 0], type: "Path" } // hard link + }, + 5: { y: [1, 2], unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: [1, 3], unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: [0, 4], unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: [0, 5], unix: 1569283200, + glyph: "", event: "url", + link: { } + } }, - 14: { y: [0, 5], unix: 1569283200, - glyph: "", event: "url", - link: { } - } }, - }, - "P1.1": { - x: [2, 1], - children: [], - color:'#000864', - path: { - 8: { y: 3, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P1", 5], type: "Path" } // hard link - }, - 11: { y: [0, 4], unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: [1,5], unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 6, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P0": { - x: [0], - children: ["P0.1", "P0.-1"], - color:'#6f0606', - path: { - 0: { y: [0, 0], unix: 1568073600, - glyph: "Book", event: "url", - link: { } - }, - 5: { y: 1, unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: 2, unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: 3, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 4, unix: 1569283200, - glyph: "", event: "url", - link: { } + "P1.1": { + x: [2, 1], + children: [], + color:'#000864', + path: { + 8: { y: 3, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P1", 5], type: "Path" } // hard link + }, + 11: { y: [0, 4], unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: [1,5], unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 6, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } }, - }, - "P0.1": { - x: [0, 1], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P0", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } + "P0": { + x: [0], + children: ["P0.1", "P0.-1"], + color:'#6f0606', + path: { + 0: { y: [0, 0], unix: 1568073600, + glyph: "Book", event: "url", + link: { } + }, + 5: { y: 1, unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: 2, unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: 3, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 4, unix: 1569283200, + glyph: "", event: "url", + link: { } + } }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P0.-1": { - x: [0, -1], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P0", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } - } - } - }, - "P3": { - x: [-3], - children: ["P3.1"], - color:'#6f0fff', - path: { - 1: { y: 2, unix: 1568160000, - glyph: "", event: "url", - link: { coord: [0, 0], type: "Path" } // hard link - }, - 5: { y: 3, unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - } }, - }, - "P3.1": { - x: [-3, 1], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P3", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } + "P0.1": { + x: [0, 1], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P0", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } - } - }, - "P2": { - x: [3], - children: ["P2.-1", "P2.-2"], - color:'#6f0fff', - path: { - 1: { y: 2, unix: 1568160000, - glyph: "", event: "url", - link: { coord: [0, 0], type: "Path" } // hard link - }, - 5: { y: 3, unix: 1568505600, - glyph: "", event: "url", - link: { } - }, - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { } - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } + }, + "P0.-1": { + x: [0, -1], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P0", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } }, - }, - "P2.-1": { - x: [3, -1], - children: ["P2.-1.-1"], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P2", 5], type: "Path" } // hard link + "P3": { + x: [-3], + children: ["P3.1"], + color:'#6f0fff', + path: { + 1: { y: 2, unix: 1568160000, + glyph: "", event: "url", + link: { coord: [0, 0], type: "Path" } // hard link + }, + 5: { y: 3, unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + } }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } + }, + "P3.1": { + x: [-3, 1], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P3", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } - } - }, - "P2.-2": { - x: [3, -2], - children: [], - color:'#000864', - path: { - 8: { y: 4, unix: 1568764800, - glyph: "", event: "url", - link: { coord: ["P2", 5], type: "Path" } // hard link - }, - 11: { y: 5, unix: 1569024000, - glyph: "", event: "url", - link: { } - }, - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { } + }, + "P2": { + x: [3], + children: ["P2.-1", "P2.-2"], + color:'#6f0fff', + path: { + 1: { y: 2, unix: 1568160000, + glyph: "", event: "url", + link: { coord: [0, 0], type: "Path" } // hard link + }, + 5: { y: 3, unix: 1568505600, + glyph: "", event: "url", + link: { } + }, + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { } + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + } }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } + }, + "P2.-1": { + x: [3, -1], + children: ["P2.-1.-1"], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P2", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } - } - }, - "P2.-1.-1": { - x: [3, -1, -1], - children: [], - color:'#000864', - path: { - 14: { y: 6, unix: 1569283200, - glyph: "", event: "url", - link: { coord: ["P2.-1", 11], type: "Path" } - }, - 17: { y: 7, unix: 1569542400, - glyph: "", event: "url", - link: { } + }, + "P2.-2": { + x: [3, -2], + children: [], + color:'#000864', + path: { + 8: { y: 4, unix: 1568764800, + glyph: "", event: "url", + link: { coord: ["P2", 5], type: "Path" } // hard link + }, + 11: { y: 5, unix: 1569024000, + glyph: "", event: "url", + link: { } + }, + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } - } - }, - "GM": { - x: [-1], - children: ['GM2'], - color: '#008fb5', - path: { - /* 0: { y: [1, 0], unix: 1569580240, - glyph: "Book", event: "url", - link: { } - }, */ - 2: { y: 1, unix: 1568246400, - glyph: "", event: "url", - link: {coord:['P0', 0], type: "Path" } - }, - 4: { y: 2, unix: 1568419200, - glyph: "", event: "url", - link: { } - }, - 7: { y: 3, unix: 1568678400, - glyph: "", event: "url", - link: {coord:['P1', 11], type:"Dotted" } // relative link - }, - 13: { y: 5, unix: 1569196800, - glyph: "", event: "url", - link: {coord:['P1', 11], type:"Dotted" } // relative link + }, + "P2.-1.-1": { + x: [3, -1, -1], + children: [], + color:'#000864', + path: { + 14: { y: 6, unix: 1569283200, + glyph: "", event: "url", + link: { coord: ["P2.-1", 11], type: "Path" } + }, + 17: { y: 7, unix: 1569542400, + glyph: "", event: "url", + link: { } + } } }, - }, - "GM2": { - x: [-2], - children: [], - color:'#0fb500', - path: { - 3: { y: 2, unix: 1568332800, - glyph: "Dot", event: "url", - link: { coord: ['GM', 2], type: "Path" } // relative link - }, - 6: { y: 3, unix: 1568592000, - glyph: "Dot", event: "url", - link: { } - }, - 9: { y: 4, unix: 1568851200, - glyph: "Dot", event: "url", - link: { } + "GM": { + x: [-1], + children: ['GM2'], + color: '#008fb5', + path: { + /* 0: { y: [1, 0], unix: 1569580240, + glyph: "Book", event: "url", + link: { } + }, */ + 2: { y: 1, unix: 1568246400, + glyph: "", event: "url", + link: {coord:['P0', 0], type: "Path" } + }, + 4: { y: 2, unix: 1568419200, + glyph: "", event: "url", + link: { } + }, + 7: { y: 3, unix: 1568678400, + glyph: "", event: "url", + link: {coord:['P1', 11], type:"Dotted" } // relative link + }, + 13: { y: 5, unix: 1569196800, + glyph: "", event: "url", + link: {coord:['P1', 11], type:"Dotted" } // relative link + } }, - 12: { y: 5, unix: 1569110400, - glyph: "Dot", event: "url", - link: { } - }, - 15: { y: 6, unix: 1569369600, - glyph: "Dot", event: "url", - link: { } + }, + "GM2": { + x: [-2], + children: [], + color:'#0fb500', + path: { + 3: { y: 2, unix: 1568332800, + glyph: "Dot", event: "url", + link: { coord: ['GM', 2], type: "Path" } // relative link + }, + 6: { y: 3, unix: 1568592000, + glyph: "Dot", event: "url", + link: { } + }, + 9: { y: 4, unix: 1568851200, + glyph: "Dot", event: "url", + link: { } + }, + 12: { y: 5, unix: 1569110400, + glyph: "Dot", event: "url", + link: { } + }, + 15: { y: 6, unix: 1569369600, + glyph: "Dot", event: "url", + link: { } + } } } } } -} +) \ No newline at end of file From 6b7d449297cafe0f0b355a7e946bcd1ec4660433 Mon Sep 17 00:00:00 2001 From: TcardLab Date: Fri, 27 Dec 2019 22:40:15 -0500 Subject: [PATCH 31/38] Vuex Strict --- components/DisplayMixin.js | 3 --- components/Links.vue | 2 -- components/Paths.vue | 3 +-- components/VGitGraph.vue | 2 +- components/VInterface.vue | 30 +++++++++++++++--------------- pages/index.vue | 2 +- store/index.js | 2 +- store/modules/display.js | 5 +++-- store/state.js | 6 +++--- 9 files changed, 25 insertions(+), 30 deletions(-) delete mode 100644 components/DisplayMixin.js diff --git a/components/DisplayMixin.js b/components/DisplayMixin.js deleted file mode 100644 index ace4992..0000000 --- a/components/DisplayMixin.js +++ /dev/null @@ -1,3 +0,0 @@ -export const DisplayMixin = { - -} \ No newline at end of file diff --git a/components/Links.vue b/components/Links.vue index d91c28e..03a05d2 100644 --- a/components/Links.vue +++ b/components/Links.vue @@ -11,11 +11,9 @@