Skip to content

Commit 7a7e72a

Browse files
yvessyvess
committed
Merged in stage (pull request #29)
faster snapshot switchting
2 parents aab7bb2 + 77a4707 commit 7a7e72a

File tree

6 files changed

+135
-40
lines changed

6 files changed

+135
-40
lines changed

‎Makefile‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ deploy_local:
6464
source env.hosts.prod && rsync -av --delete vue/dist $$VUE_LOCAL_PATH
6565
docker-compose exec -T django make migrate
6666
docker-compose exec -T django killall -TERM gunicorn
67+
docker-compose exec -T vue killall -TERM node
6768

6869
slack-push:
6970
source env.hosts.prod && test -v SLACK_APP_HOOK && curl -X POST -H 'Content-type: application/json' --data "{\"text\":\"$$SLACK_APP_TEXT\"}" "https://hooks.slack.com/services/$$SLACK_APP_HOOK"

‎vue/src/components/SnapshotList.vue‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,9 @@
6767
white-space: initial;
6868
text-overflow: ellipsis;
6969
}
70+
.v-image__image {
71+
background-color: rgba(0, 0, 0, 0.1);
72+
}
7073
</style>
7174

7275

‎vue/src/components/SnapshotMap.vue‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,26 @@ body,
6262
position: relative;
6363
width: 100%;
6464
overflow: hidden;
65+
background: #dedede
66+
linear-gradient(90deg, #dedede 0%, #f2f2f2 17%, #dedede 23%) repeat-y;
67+
background-size: 125% 10%;
68+
animation: BGani 2s ease infinite;
69+
}
70+
71+
@keyframes BGani {
72+
0% {
73+
background-position: 110% 0%;
74+
}
75+
66% {
76+
background-position: -410% 0%;
77+
}
78+
100% {
79+
background-position: -410% 0%;
80+
}
81+
}
82+
#map.leaflet-container {
6583
background: #dedede;
84+
animation: none;
6685
}
6786
6887
#map .mapbox-improve-map {

‎vue/src/store/index.js‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@ export default new Vuex.Store({
88
notIframe: window.self === window.top,
99
bfsnumber: '',
1010
bfsname: '',
11-
snapshotnav: false
11+
snapshotnav: false,
12+
workspacesInfo: {}
1213
},
1314
mutations: {
1415
setBfsnumber(state, nr) {
@@ -21,6 +22,18 @@ export default new Vuex.Store({
2122

2223
setSnapshotnav(state, value) {
2324
state.snapshotnav = value;
25+
},
26+
27+
addWorkspaceInfo(state, hashNvalue) {
28+
state.workspacesInfo[hashNvalue.hash] = hashNvalue.value;
29+
}
30+
},
31+
getters: {
32+
WorkspaceInfoByHash: state => (hash) => {
33+
if (state.workspacesInfo.hasOwnProperty(hash)) {
34+
return state.workspacesInfo[hash];
35+
}
36+
return false;
2437
}
2538
},
2639
actions: {

‎vue/src/views/Snapshot.vue‎

Lines changed: 28 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,9 @@ export default {
149149
150150
async mounted() {
151151
if (this.hash) {
152-
await this.getSnapshot(this.hash);
152+
await this.getSnapshotInfo(this.hash);
153+
154+
await this.getSnapshotData(this.hash);
153155
if (this.geojson) {
154156
this.$refs.map.setupMeta();
155157
this.$refs.map.setupMapbox();
@@ -192,13 +194,12 @@ export default {
192194
},
193195
194196
methods: {
195-
async getSnapshot(hash) {
197+
async getSnapshotInfo(hash) {
196198
const result = await this.$apollo.query({
197199
query: gql`query getsnapshot($hash: ID!) {
198200
snapshot(id: $hash) {
199201
id
200202
pk
201-
data
202203
predecessor {
203204
id
204205
pk
@@ -238,7 +239,6 @@ export default {
238239
});
239240
if (result) {
240241
if (result.data.hasOwnProperty('snapshot') && result.data.snapshot) {
241-
this.geojson = result.data.snapshot.data;
242242
this.municipalityName = result.data.snapshot.municipality.fullname;
243243
this.snapshotsMunicipality = result.data.snapshot.municipality.snapshots;
244244
const snapshotsIdExamplesExclude = this.snapshotsMunicipality.map(
@@ -258,6 +258,30 @@ export default {
258258
}
259259
},
260260
261+
async getSnapshotData(hash) {
262+
const result = await this.$apollo.query({
263+
query: gql`query getsnapshot($hash: ID!) {
264+
snapshot(id: $hash) {
265+
id
266+
pk
267+
data
268+
}
269+
}`,
270+
variables: {
271+
hash: btoa(`SnapshotNode:${hash}`)
272+
}
273+
}).catch((error) => {
274+
this.errorsettings = { type: 'netwokerror', open: true, error };
275+
});
276+
if (result) {
277+
if (result.data.hasOwnProperty('snapshot') && result.data.snapshot) {
278+
this.geojson = result.data.snapshot.data;
279+
} else {
280+
this.$router.push({ name: 'home' });
281+
}
282+
}
283+
},
284+
261285
async getEmpty(bfsNumber) {
262286
const result = await this.$apollo.query({
263287
query: gql`query getmunicipality($bfsNumber: ID!) {

‎vue/src/views/Workspace.vue‎

Lines changed: 70 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,8 @@ export default {
108108
},
109109
110110
async mounted() {
111-
await this.getWorkspace();
111+
await this.getWorkspaceInfo();
112+
await this.getWorkspaceData();
112113
if (this.geojson) {
113114
this.$refs.map.setupMeta();
114115
this.$refs.map.setupMapbox();
@@ -135,31 +136,17 @@ export default {
135136
},
136137
137138
methods: {
138-
async getWorkspace() {
139-
const result = await this.$apollo.query({
140-
query: gql`query getworkspace($wshash: ID!, $hash: ID!) {
141-
workspace(id: $wshash) {
142-
id
143-
pk
144-
title
145-
description
146-
snapshots {
139+
async getWorkspaceInfo() {
140+
let workspaceInfo = this.$store.getters.WorkspaceInfoByHash(this.wshash);
141+
142+
if (!workspaceInfo) {
143+
const result = await this.$apollo.query({
144+
query: gql`query getworkspace($wshash: ID!, $hash: ID!) {
145+
workspace(id: $wshash) {
147146
id
148147
pk
149148
title
150-
topic
151-
screenshot
152-
thumbnail
153-
}
154-
}
155-
156-
snapshot(id: $hash) {
157-
id
158-
pk
159-
data
160-
municipality {
161-
bfsNumber
162-
fullname
149+
description
163150
snapshots {
164151
id
165152
pk
@@ -169,6 +156,65 @@ export default {
169156
thumbnail
170157
}
171158
}
159+
160+
snapshot(id: $hash) {
161+
id
162+
pk
163+
municipality {
164+
bfsNumber
165+
fullname
166+
snapshots {
167+
id
168+
pk
169+
title
170+
topic
171+
screenshot
172+
thumbnail
173+
}
174+
}
175+
}
176+
}`,
177+
variables: {
178+
wshash: btoa(`WorkspaceNode:${this.wshash}`),
179+
hash: btoa(`SnapshotNode:${this.hash}`)
180+
}
181+
}).catch((error) => {
182+
this.errorsettings = { type: 'netwokerror', open: true, error };
183+
});
184+
if (result) {
185+
if (result.data.hasOwnProperty('workspace') && result.data.workspace) {
186+
workspaceInfo = result.data;
187+
this.$store.commit('addWorkspaceInfo', { hash: this.wshash, value: workspaceInfo });
188+
} else {
189+
this.$router.push({ name: 'home' });
190+
}
191+
}
192+
}
193+
const workspace = workspaceInfo.workspace;
194+
const snapshot = workspaceInfo.snapshot;
195+
if (!workspace.snapshots.map(s => s.pk).includes(snapshot.pk)) {
196+
this.$router.push({ name: 'home' });
197+
}
198+
this.municipalityName = snapshot.municipality.fullname;
199+
this.snapshotsWorkspace = workspace.snapshots;
200+
this.title = workspace.title;
201+
this.description = workspace.description;
202+
this.$store.commit('setBfsnumber', snapshot.municipality.bfsNumber);
203+
this.$store.commit('setBfsname', snapshot.municipality.fullname);
204+
},
205+
206+
async getWorkspaceData() {
207+
const result = await this.$apollo.query({
208+
query: gql`query getworkspace($wshash: ID!, $hash: ID!) {
209+
workspace(id: $wshash) {
210+
id
211+
pk
212+
title
213+
}
214+
snapshot(id: $hash) {
215+
id
216+
pk
217+
data
172218
}
173219
}`,
174220
variables: {
@@ -180,18 +226,7 @@ export default {
180226
});
181227
if (result) {
182228
if (result.data.hasOwnProperty('workspace') && result.data.workspace) {
183-
const workspace = result.data.workspace;
184-
const snapshot = result.data.snapshot;
185-
if (!workspace.snapshots.map(s => s.pk).includes(snapshot.pk)) {
186-
this.$router.push({ name: 'home' });
187-
}
188-
this.geojson = snapshot.data;
189-
this.municipalityName = snapshot.municipality.fullname;
190-
this.snapshotsWorkspace = workspace.snapshots;
191-
this.title = workspace.title;
192-
this.description = workspace.description;
193-
this.$store.commit('setBfsnumber', snapshot.municipality.bfsNumber);
194-
this.$store.commit('setBfsname', snapshot.municipality.fullname);
229+
this.geojson = result.data.snapshot.data;
195230
} else {
196231
this.$router.push({ name: 'home' });
197232
}

0 commit comments

Comments
 (0)