Make product modal show close button only if there is a scroll bar

This commit is contained in:
Luis Ramos
2020-04-29 15:57:13 +01:00
parent e239bb33f8
commit 30fe457cb5
3 changed files with 28 additions and 1 deletions

View File

@@ -4,3 +4,9 @@ Darkswarm.controller "ProductNodeCtrl", ($scope, $modal, FilterSelectorsService)
$scope.triggerProductModal = ->
$scope.productPropertySelectors = FilterSelectorsService.createSelectors()
$modal.open(templateUrl: "product_modal.html", scope: $scope)
$scope.hasVerticalScrollBar = (selector) ->
elem = angular.element(document.querySelector(selector))
return false unless elem[0]
elem[0].scrollHeight > elem[0].clientHeight

View File

@@ -19,6 +19,6 @@
%ng-include{src: "'partials/close.html'"}
.buttons
.buttons{ "ng-show": "hasVerticalScrollBar('.reveal-modal')" }
.button.bottom-close-button{"ng-click" => "$close()"}
= t('js.shop.products.product_modal.close')

View File

@@ -16,3 +16,24 @@ describe "ProductNodeCtrl", ->
it "puts a reference to supplier in the scope", ->
expect(scope.enterprise).toBe product.supplier
describe "#hasVerticalScrollBar", ->
it "returns false if modal element is not found", ->
spyOn(angular, 'element').and.returnValue([])
expect(scope.hasVerticalScrollBar()).toBe false
it "returns false if scrollHeight is equal to clientHeight", ->
spyOn(angular, 'element').and.returnValue([{ scrollHeight: 100, clientHeight: 100 }])
expect(scope.hasVerticalScrollBar()).toBe false
it "returns false if scrollHeight is smaller than clientHeight", ->
spyOn(angular, 'element').and.returnValue([{ scrollHeight: 50, clientHeight: 100 }])
expect(scope.hasVerticalScrollBar()).toBe false
it "returns true if scrollHeight is bigger than clientHeight", ->
spyOn(angular, 'element').and.returnValue([{ scrollHeight: 100, clientHeight: 50 }])
expect(scope.hasVerticalScrollBar()).toBe true