simplify with one hook, update readme

README.md

@@ -8,5 +8,5 @@ If you'd like to see them in action, check out `src/hooks` and `src/AppGrid.vue`
 
 Created by [Vue CLI](https://cli.vuejs.org/)
 
-To run: `yarn run serve`
-To build: `yarn run build`
+* To run: `yarn run serve`
+* To build: `yarn run build`

src/components/AppDetails.vue

@@ -14,8 +14,6 @@
 
 <script>
 import { preventscroll } from "./../hooks/preventscroll.js";
-import { enablescroll } from "./../hooks/enablescroll.js";
-
 import { TimelineMax, TweenMax, Sine, Elastic } from "gsap";
 import Splitting from "splitting";
 import "splitting/dist/splitting.css";
@@ -38,7 +36,6 @@ export default {
   },
   hooks() {
     preventscroll();
-    enablescroll();
   },
   methods: {
     lettering() {

src/hooks/preventscroll.js

@@ -1,14 +1,14 @@
-import { useMounted } from "vue-hooks";
+import { useDestroyed, useMounted } from "vue-hooks";
 
 export function preventscroll() {
-  useMounted(() => {
-    const preventDefault = (e) => {
-      e = e || window.event;
-      if (e.preventDefault)
-        e.preventDefault();
-      e.returnValue = false;
-    }
+  const preventDefault = (e) => {
+    e = e || window.event;
+    if (e.preventDefault)
+      e.preventDefault();
+    e.returnValue = false;
+  }
 
+  useMounted(() => {
     // keycodes for left, up, right, down
     const keys = { 37: 1, 38: 1, 39: 1, 40: 1 };
 
@@ -28,4 +28,21 @@ export function preventscroll() {
       document.onkeydown = preventDefaultForScrollKeys;
     })()
   });
+
+  useDestroyed(() => {
+    (() => {
+      if (window.removeEventListener)
+        window.removeEventListener('DOMMouseScroll', preventDefault, false);
+
+      //firefox
+      window.addEventListener('DOMMouseScroll', (e) => {
+        e.stopPropagation();
+      }, true);
+
+      window.onmousewheel = document.onmousewheel = null;
+      window.onwheel = null;
+      window.ontouchmove = null;
+      document.onkeydown = null;
+    })()
+  });
 }