diff --git a/src/components/FacsimileComponent.vue b/src/components/FacsimileComponent.vue index 9668e77..9986290 100644 --- a/src/components/FacsimileComponent.vue +++ b/src/components/FacsimileComponent.vue @@ -32,6 +32,7 @@ export default { props: { }, + computed: { /** * the tileSource for the current page @@ -68,7 +69,8 @@ export default { showGrid () { const tab = this.$store.getters.explorerTab const validTabs = ['pages'] - return validTabs.indexOf(tab) !== -1 + const gridFlag = this.$store.getters.pageShowGrid + return gridFlag && validTabs.indexOf(tab) !== -1 }, /** @@ -794,6 +796,10 @@ export default { // this.focusActiveWritingZone() } }) + this.unwatchGrid = this.$store.watch((state, getters) => getters.pageShowGrid, + (newVal, oldVal) => { + this.renderGrid() + }) this.openFacsimile() }, @@ -810,6 +816,7 @@ export default { this.unwatchTileSource() this.unwatchSVG() this.unwatchSystems() + this.unwatchGrid() } } diff --git a/src/components/PagesTab.vue b/src/components/PagesTab.vue index d717d15..8baf6eb 100644 --- a/src/components/PagesTab.vue +++ b/src/components/PagesTab.vue @@ -6,6 +6,11 @@ +
@@ -131,6 +136,7 @@ export default { 'currentPageAngle', 'pageBorderPoints', 'pageBorderPointsIncomplete', + 'pageShowGrid', 'currentPageDimensions', 'allDocsLoaded', 'pageTabRightSidebarVisible', diff --git a/src/store/gui/index.js b/src/store/gui/index.js index ac3d983..0429e49 100644 --- a/src/store/gui/index.js +++ b/src/store/gui/index.js @@ -53,6 +53,7 @@ const guiModule = { pageTabSidebarWidth: 310, pageTabRightSidebarVisible: true, pageTabRightSidebarWidth: 430, + pageShowGrid: true, zonesTabLeftSidebarVisible: true, zonesTabLeftSidebarWidth: 310, zonesTabRightSidebarVisible: true, @@ -161,6 +162,14 @@ const guiModule = { TOGGLE_PAGETAB_RIGHT_SIDEBAR_VISIBILITY (state) { state.pageTabRightSidebarVisible = !state.pageTabRightSidebarVisible }, + /** + * toggles visibility of grid in pageTab + * @memberof store.gui.mutations + * @param {[type]} state [description] + */ + TOGGLE_PAGE_SHOW_GRID (state) { + state.pageShowGrid = !state.pageShowGrid + }, /** * sets width of left sidebar in zonesTab @@ -416,6 +425,21 @@ const guiModule = { togglePageTabRightSidebar ({ commit }) { commit('TOGGLE_PAGETAB_RIGHT_SIDEBAR_VISIBILITY') }, + /** + * toggles visibility of the zonesTab left sidebar + * @memberof store.gui.actions + * @param {[type]} commit [description] + * @return {[type]} [description] + */ + togglePageTabLeftSidebar ({ commit }) { + commit('TOGGLE_PAGETAB_SIDEBAR_VISIBILITY') + }, + /** + * toggles visibility of the grid on the pageTab + */ + togglePageShowGrid ({ commit }) { + commit('TOGGLE_PAGE_SHOW_GRID') + }, /** * toggles visibility of the zonesTab left sidebar @@ -678,6 +702,15 @@ const guiModule = { pageTabRightSidebarWidth: (state) => { return state.pageTabRightSidebarWidth }, + /** + * returns visibility of grid on pageTab + * @memberof store.gui.getters + * @param {[type]} state [description] + * @return {[type]} [description] + */ + pageShowGrid: (state) => { + return state.pageShowGrid + }, /** * returns visibility of left sidebar on zonesTab