diff --git a/src/components/map/map.vue b/src/components/map/map.vue index 42b97886..731dd407 100644 --- a/src/components/map/map.vue +++ b/src/components/map/map.vue @@ -375,6 +375,11 @@ export default { try { if (this.building_compare_error === false) { let path = this.$store.getters['map/building'](this.compareStories[0]).path + if (target !== 'q' && this.compareStories.length === 1) { + this.$router.push({ + path: `/compare/${encodeURI(JSON.stringify(this.compareStories))}/2` + }) + } let mgId = this.$store.getters[path + '/primaryGroup']('Electricity').id let blockSpace = this.$store.getters[path + '/block'](mgId).path await this.$store.dispatch(blockSpace + '/removeAllModifiers') @@ -391,7 +396,7 @@ export default { name: 'map_compare_side', path: path }) - } else { + } else if (target !== 'q' && this.compareStories.length > 1) { this.$router.push({ path: `/compare/${encodeURI(JSON.stringify(this.compareStories))}/2` }) @@ -410,7 +415,9 @@ export default { this.showSide = false this.askingForComparison = true this.compareStories = [] - this.compareStories.push(buildingId) + if (buildingId !== undefined) { + this.compareStories.push(buildingId) + } const data = " " diff --git a/src/components/map/map_prompt.vue b/src/components/map/map_prompt.vue index 84af189b..942ae648 100644 --- a/src/components/map/map_prompt.vue +++ b/src/components/map/map_prompt.vue @@ -11,23 +11,36 @@ - Select buildings by clicking on map or using building menu search bar.

- Select a single building to compare multiple time periods for that building.

- NOTE: Only buildings with Electricity data are valid for comparison! + Select buildings by clicking on map or using building menu search bar.

+ Select one building (Any Energy Type) for comparison across multiple time periods

+ Select multiple buildings (Electricity) to be compared across a single time period

 - - Compare + + Compare ({{ Math.min(4, compareStories.length) }} Buildings) Quick Compare Compare in FullScreen - Compare Multiple Time Periods - + + Compare (1 Building) + Cancel @@ -80,7 +93,7 @@ export default { top: 100px; width: 330px; left: 250px; - height: 360px; + height: 380px; } } diff --git a/src/components/map/prompt_error.vue b/src/components/map/prompt_error.vue index df42e780..541e20b4 100644 --- a/src/components/map/prompt_error.vue +++ b/src/components/map/prompt_error.vue @@ -5,8 +5,8 @@ ERROR
You have either not selected any buildings for comparison, or you have included a non-electric - building.You have either not selected any buildings for comparison, or you have included a non-electric building + (for multiple buildings comparison). @@ -24,7 +24,7 @@ export default {} diff --git a/src/components/view/modals/edit_card.vue b/src/components/view/modals/edit_card.vue index 4234f346..f616e2b7 100644 --- a/src/components/view/modals/edit_card.vue +++ b/src/components/view/modals/edit_card.vue @@ -255,7 +255,7 @@ v-if="compareOneBuildingView" class="item" effect="dark" - content='Click to add time period (not saved until you click "Ok")' + content='Add at least 2 time periods to compare. Not saved until you click "Ok"' placement="top" > Add Time Period @@ -492,6 +492,7 @@ export default { }, updateForm: function () { + this.cancelTimeSave() const blockPath = this.$store.getters['modalController/data'].path if (blockPath) { this.form.new = false diff --git a/src/components/view/navdir.vue b/src/components/view/navdir.vue index d34aa605..46ca62d0 100644 --- a/src/components/view/navdir.vue +++ b/src/components/view/navdir.vue @@ -50,7 +50,7 @@   - + @@ -168,14 +168,15 @@ export default { return false } }, - // this checks if the building has electricity data or not - electricBuilding: { + // this checks if page is in /building path + isBuilding: { get () { try { - let path = this.$store.getters['map/building'](this.$route.params.id).path - // eslint-disable-next-line - let mgId = this.$store.getters[path + '/primaryGroup']('Electricity').id - return true + if (this.$store.getters['map/building'](this.$route.params.id).path) { + return true + } else { + return false + } } catch (err) { return false } diff --git a/src/components/view/view.vue b/src/components/view/view.vue index 13d0ec7b..1b8d65b6 100644 --- a/src/components/view/view.vue +++ b/src/components/view/view.vue @@ -90,7 +90,7 @@ export default { for (let card of this.cards) { if (!card.path) return this.$nextTick(() => { - let blockpath = this.cards[0].path + let blockpath = card.path let searchTerm = 'block_' let chartIndex = blockpath.indexOf(searchTerm) let blockID = blockpath.slice(chartIndex + searchTerm.length) @@ -104,33 +104,66 @@ export default { handler: async function (buildings) { if (this.$route.path.includes('compare')) { // this.cards array only has one element in it - if (this.cards.length > 0 && this.cards[0]) { - // console.log(buildings.map(building => building.id)) - // console.log(this.cards[0].path) - await this.$store.dispatch(this.cards[0].path + '/removeAllModifiers') - // addModifier and updateModifier below call block.module.js, which then calls building_compare.mod.js - await this.$store.dispatch(this.cards[0].path + '/addModifier', 'building_compare') + if (buildings.length > 1) { + if (this.cards.length > 0 && this.cards[0]) { + // console.log(buildings.map(building => building.id)) + // console.log(this.cards[0].path) + await this.$store.dispatch(this.cards[0].path + '/removeAllModifiers') + // addModifier and updateModifier below call block.module.js, which then calls building_compare.mod.js + await this.$store.dispatch(this.cards[0].path + '/addModifier', 'building_compare') - // Full call order: view.vue's compareBuildings() > block.module.js's updateModifier > - // building_compare.mod.js's updateData() > building_compare.mod.js's addCharts() > block.module.js's loadCharts() + // Full call order: view.vue's compareBuildings() > block.module.js's updateModifier > + // building_compare.mod.js's updateData() > building_compare.mod.js's addCharts() > block.module.js's loadCharts() - // Alternatively (building_compare_mod.js's updateData calls two things): - // view.vue's compareBuildings() > block.module.js's updateModifier > building_compare.mod.js's updateData() > - // building_compare.mod.js's removeOldCharts() > block.module.js's unloadChart() + // Alternatively (building_compare_mod.js's updateData calls two things): + // view.vue's compareBuildings() > block.module.js's updateModifier > building_compare.mod.js's updateData() > + // building_compare.mod.js's removeOldCharts() > block.module.js's unloadChart() - // console.log(this.cards[0].path) - // Example this.cards[0].path: map/building_29/block_79 + // console.log(this.cards[0].path) + // Example this.cards[0].path: map/building_29/block_79 - // Example call order: map.module.js's map() getter > building.module.js's building() getter > - // block.module's updateModifier function (I think) - await this.$store.dispatch(this.cards[0].path + '/updateModifier', { - name: 'building_compare', - data: { - // buildingIds below defines which buildingId are sent to block.module.js and then building_compare.mod.js, - // which also affects chartSpace naming (duplicate chart path triggers error) - buildingIds: buildings.map(building => building.id) + // Example call order: map.module.js's map() getter > building.module.js's building() getter > + // block.module's updateModifier function (I think) + await this.$store.dispatch(this.cards[0].path + '/updateModifier', { + name: 'building_compare', + data: { + // buildingIds below defines which buildingId are sent to block.module.js and then building_compare.mod.js, + // which also affects chartSpace naming (duplicate chart path triggers error) + buildingIds: buildings.map(building => building.id) + } + }) + } + } else { + for (let i in this.cards) { + if (this.cards.length > 0 && this.cards[i]) { + // console.log(buildings.map(building => building.id)) + // console.log(this.cards[0].path) + await this.$store.dispatch(this.cards[i].path + '/removeAllModifiers') + // addModifier and updateModifier below call block.module.js, which then calls building_compare.mod.js + await this.$store.dispatch(this.cards[i].path + '/addModifier', 'building_compare') + + // Full call order: view.vue's compareBuildings() > block.module.js's updateModifier > + // building_compare.mod.js's updateData() > building_compare.mod.js's addCharts() > block.module.js's loadCharts() + + // Alternatively (building_compare_mod.js's updateData calls two things): + // view.vue's compareBuildings() > block.module.js's updateModifier > building_compare.mod.js's updateData() > + // building_compare.mod.js's removeOldCharts() > block.module.js's unloadChart() + + // console.log(this.cards[0].path) + // Example this.cards[0].path: map/building_29/block_79 + + // Example call order: map.module.js's map() getter > building.module.js's building() getter > + // block.module's updateModifier function (I think) + await this.$store.dispatch(this.cards[i].path + '/updateModifier', { + name: 'building_compare', + data: { + // buildingIds below defines which buildingId are sent to block.module.js and then building_compare.mod.js, + // which also affects chartSpace naming (duplicate chart path triggers error) + buildingIds: buildings.map(building => building.id) + } + }) } - }) + } } } } @@ -168,7 +201,7 @@ export default { for (let card of this.cards) { if (!card.path) return this.$nextTick(() => { - let blockpath = this.cards[0].path + let blockpath = card.path let searchTerm = 'block_' let chartIndex = blockpath.indexOf(searchTerm) let blockID = blockpath.slice(chartIndex + searchTerm.length) @@ -238,14 +271,24 @@ export default { } // unintuituively, this.compareBuildings[0].block_ has all the comparison charts in it, and // every other element in this.compareBuildings is ignored - // console.log(this.compareBuildings) - let building = this.$store.getters['map/building'](this.compareBuildings[0].id) - // console.log(building) - if (!building) return [] - let group = this.$store.getters[building.path + '/primaryGroup']('Electricity') - let block = this.$store.getters[building.path + '/block'](group.id) - if (!block) return [] - return [this.$store.getters[building.path + '/block'](group.id)] + console.log(this.compareBuildings) + if (this.compareBuildings.length > 1) { + let building = this.$store.getters['map/building'](this.compareBuildings[0].id) + // console.log(building) + if (!building) return [] + let group = this.$store.getters[building.path + '/primaryGroup']('Electricity') + let block = this.$store.getters[building.path + '/block'](group.id) + if (!block) return [] + return [this.$store.getters[building.path + '/block'](group.id)] + } else { + let building = this.$store.getters['map/building'](this.compareBuildings[0].id) + // console.log(building) + if (!building) return [] + // let group = this.$store.getters[building.path + '/primaryGroup']('Electricity') + // let block = this.$store.getters[building.path + '/block'](group.id) + // if (!block) return [] + return this.$store.getters[building.path + '/blocks'] + } } else { if (!this.view || !this.view.id) return [] return this.$store.getters[this.view.path + '/blocks']