From a6edc1c97356fa564ae78e67cece576f7bde7fcb Mon Sep 17 00:00:00 2001
From: Matt-Yorkley <9029026+Matt-Yorkley@users.noreply.github.com>
Date: Fri, 12 Jun 2020 12:34:52 +0200
Subject: [PATCH] Enable control over body scroll with BodyScroll service

---
 .../controllers/cart_dropdown_controller.js.coffee       | 3 ++-
 .../darkswarm/directives/body_scroll.js.coffee           | 9 +++++++++
 .../javascripts/darkswarm/services/body_scroll.js.coffee | 7 +++++++
 app/assets/stylesheets/darkswarm/ui.css.scss             | 4 ++++
 app/views/layouts/darkswarm.html.haml                    | 2 +-
 5 files changed, 23 insertions(+), 2 deletions(-)
 create mode 100644 app/assets/javascripts/darkswarm/directives/body_scroll.js.coffee
 create mode 100644 app/assets/javascripts/darkswarm/services/body_scroll.js.coffee

diff --git a/app/assets/javascripts/darkswarm/controllers/cart_dropdown_controller.js.coffee b/app/assets/javascripts/darkswarm/controllers/cart_dropdown_controller.js.coffee
index f22e237f06..048459ecd8 100644
--- a/app/assets/javascripts/darkswarm/controllers/cart_dropdown_controller.js.coffee
+++ b/app/assets/javascripts/darkswarm/controllers/cart_dropdown_controller.js.coffee
@@ -1,6 +1,7 @@
-Darkswarm.controller "CartDropdownCtrl", ($scope, Cart) ->
+Darkswarm.controller "CartDropdownCtrl", ($scope, Cart, BodyScroll) ->
   $scope.Cart = Cart
   $scope.showCartSidebar = false
 
   $scope.toggleCartSidebar = ->
     $scope.showCartSidebar = !$scope.showCartSidebar
+    BodyScroll.toggle()
diff --git a/app/assets/javascripts/darkswarm/directives/body_scroll.js.coffee b/app/assets/javascripts/darkswarm/directives/body_scroll.js.coffee
new file mode 100644
index 0000000000..183d828d03
--- /dev/null
+++ b/app/assets/javascripts/darkswarm/directives/body_scroll.js.coffee
@@ -0,0 +1,9 @@
+Darkswarm.directive "bodyScroll", ($rootScope, BodyScroll) ->
+  restrict: 'A'
+  scope: true
+  link: (scope, elem, attrs) ->
+    $rootScope.$on "toggleBodyScroll", ->
+      if BodyScroll.disabled
+        elem.addClass "disable-scroll"
+      else
+        elem.removeClass "disable-scroll"
diff --git a/app/assets/javascripts/darkswarm/services/body_scroll.js.coffee b/app/assets/javascripts/darkswarm/services/body_scroll.js.coffee
new file mode 100644
index 0000000000..84c8ed9337
--- /dev/null
+++ b/app/assets/javascripts/darkswarm/services/body_scroll.js.coffee
@@ -0,0 +1,7 @@
+angular.module("Darkswarm").factory "BodyScroll", ($rootScope) ->
+  new class BodyScroll
+    disabled: false
+
+    toggle: ->
+      @disabled = !@disabled
+      $rootScope.$broadcast "toggleBodyScroll"
diff --git a/app/assets/stylesheets/darkswarm/ui.css.scss b/app/assets/stylesheets/darkswarm/ui.css.scss
index 856b3dc0ca..d6b0988ad6 100644
--- a/app/assets/stylesheets/darkswarm/ui.css.scss
+++ b/app/assets/stylesheets/darkswarm/ui.css.scss
@@ -163,3 +163,7 @@ a.button.large {
   padding-right: 0;
   padding-left: 0;
 }
+
+.disable-scroll {
+  overflow: hidden;
+}
diff --git a/app/views/layouts/darkswarm.html.haml b/app/views/layouts/darkswarm.html.haml
index fdf2cd4f17..f45b157a51 100644
--- a/app/views/layouts/darkswarm.html.haml
+++ b/app/views/layouts/darkswarm.html.haml
@@ -18,7 +18,7 @@
     = stylesheet_link_tag "darkswarm/all"
     = csrf_meta_tags
 
-  %body{class: body_classes, ng: {app: "Darkswarm"}}
+  %body{class: body_classes, "body-scroll" => true , ng: {app: "Darkswarm"}}
     / [if lte IE 8]
       = render partial: "shared/ie_warning"
       = javascript_include_tag "iehack"