Merge pull request #117 from gtt-project/fix/resize-map

Added ResizeObserver to detect map div resize event

Author: sanak

package.json

@@ -20,6 +20,7 @@
   },
   "homepage": "https://github.com/gtt-project/redmine_gtt#readme",
   "dependencies": {
+    "@juggle/resize-observer": "^3.3.1",
     "font-awesome": "^4.7.0",
     "ol": "^6.5.0",
     "ol-ext": "^3.2.3"

src/components/gtt-client.ts

@@ -33,7 +33,8 @@ import TextButton from 'ol-ext/control/TextButton'
 import LayerPopup from 'ol-ext/control/LayerPopup'
 import Popup from 'ol-ext/overlay/Popup'
 import { position } from 'ol-ext/control/control'
-import GeometryType from 'ol/geom/GeometryType';
+import GeometryType from 'ol/geom/GeometryType'
+import { ResizeObserver } from '@juggle/resize-observer'
 
 interface GttClientOption {
   target: HTMLDivElement | null
@@ -265,11 +266,12 @@ export class GttClient {
     }
 
     // Sidebar hack
-    document.querySelector('#sidebar').addEventListener('hideSidebar', _ => {
+    const resizeObserver = new ResizeObserver((entries, observer) => {
       this.maps.forEach(m => {
         m.updateSize()
       })
     })
+    resizeObserver.observe(this.map.getTargetElement())
 
     // When one or more issues is selected, zoom to selected map features
     document.querySelectorAll('table.issues tbody tr').forEach((element: HTMLTableRowElement) => {

yarn.lock

@@ -14,6 +14,11 @@
   resolved "https://registry.yarnpkg.com/@discoveryjs/json-ext/-/json-ext-0.5.2.tgz#8f03a22a04de437254e8ce8cc84ba39689288752"
   integrity sha512-HyYEUDeIj5rRQU2Hk5HTB2uHsbRQpF70nvMhVzi+VJR0X+xNEhjPui4/kBf3VeH/wqD28PT4sVOm8qqLjBrSZg==
 
+"@juggle/resize-observer@^3.3.1":
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/@juggle/resize-observer/-/resize-observer-3.3.1.tgz#b50a781709c81e10701004214340f25475a171a0"
+  integrity sha512-zMM9Ds+SawiUkakS7y94Ymqx+S0ORzpG3frZirN3l+UlXUmSUR7hF4wxCVqW+ei94JzV5kt0uXBcoOEAuiydrw==
+
 "@mapbox/jsonlint-lines-primitives@~2.0.2":
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz#ce56e539f83552b58d10d672ea4d6fc9adc7b234"