mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-11 06:13:51 -04:00
Fix linting errors
This commit is contained in:
Tom Byers
@@ -1,258 +1,258 @@
|
||||
;(function (global) {
|
||||
'use strict'
|
||||
'use strict';
|
||||
|
||||
var $ = global.jQuery
|
||||
var GOVUK = global.GOVUK || {}
|
||||
var $ = global.jQuery;
|
||||
var GOVUK = global.GOVUK || {};
|
||||
|
||||
// Stick elements to top of screen when you scroll past, documentation is in the README.md
|
||||
var Sticky = function (selector) {
|
||||
this._hasScrolled = false
|
||||
this._scrollTimeout = false
|
||||
this._hasResized = false
|
||||
this._resizeTimeout = false
|
||||
this._elsLoaded = false
|
||||
this._els = []
|
||||
this._hasScrolled = false;
|
||||
this._scrollTimeout = false;
|
||||
this._hasResized = false;
|
||||
this._resizeTimeout = false;
|
||||
this._elsLoaded = false;
|
||||
this._els = [];
|
||||
|
||||
this.CSS_SELECTOR = selector
|
||||
}
|
||||
this.CSS_SELECTOR = selector;
|
||||
};
|
||||
Sticky.prototype.getWindowDimensions = function () {
|
||||
return {
|
||||
height: $(global).height(),
|
||||
width: $(global).width()
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
Sticky.prototype.getWindowPositions = function () {
|
||||
return {
|
||||
scrollTop: $(global).scrollTop()
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
Sticky.prototype.setFixedTop = function (el) {
|
||||
var $siblingEl = $('<div></div>')
|
||||
$siblingEl.insertBefore(el.$fixedEl)
|
||||
var fixedTop = $siblingEl.offset().top - $siblingEl.position().top
|
||||
$siblingEl.remove()
|
||||
var $siblingEl = $('<div></div>');
|
||||
$siblingEl.insertBefore(el.$fixedEl);
|
||||
var fixedTop = $siblingEl.offset().top - $siblingEl.position().top;
|
||||
$siblingEl.remove();
|
||||
|
||||
el.fixedTop = fixedTop
|
||||
}
|
||||
el.fixedTop = fixedTop;
|
||||
};
|
||||
Sticky.prototype.setElHeight = function (el) {
|
||||
var self = this
|
||||
var fixedOffset = parseInt(el.$fixedEl.css('top'), 10)
|
||||
var $el = el.$fixedEl
|
||||
var $img = $el.find('img')
|
||||
var self = this;
|
||||
var fixedOffset = parseInt(el.$fixedEl.css('top'), 10);
|
||||
var $el = el.$fixedEl;
|
||||
var $img = $el.find('img');
|
||||
|
||||
fixedOffset = isNaN(fixedOffset) ? 0 : fixedOffset
|
||||
fixedOffset = isNaN(fixedOffset) ? 0 : fixedOffset;
|
||||
|
||||
if ((!self._elsLoaded) && ($img.length > 0)) {
|
||||
var image = new global.Image()
|
||||
var image = new global.Image();
|
||||
image.onload = function () {
|
||||
el.height = $el.outerHeight() + fixedOffset
|
||||
el.scrolledTo = self.getScrollingTo(el)
|
||||
self.checkElementsLoaded()
|
||||
}
|
||||
image.src = $img.attr('src')
|
||||
el.height = $el.outerHeight() + fixedOffset;
|
||||
el.scrolledTo = self.getScrollingTo(el);
|
||||
self.checkElementsLoaded();
|
||||
};
|
||||
image.src = $img.attr('src');
|
||||
} else {
|
||||
el.height = $el.outerHeight() + fixedOffset
|
||||
el.scrolledTo = self.getScrollingTo(el)
|
||||
self.checkElementsLoaded()
|
||||
el.height = $el.outerHeight() + fixedOffset;
|
||||
el.scrolledTo = self.getScrollingTo(el);
|
||||
self.checkElementsLoaded();
|
||||
}
|
||||
}
|
||||
};
|
||||
Sticky.prototype.checkElementsLoaded = function () {
|
||||
this._elsLoaded = $.grep(this._els, function (el) { return ('height' in el) }).length === this._els.length
|
||||
}
|
||||
this._elsLoaded = $.grep(this._els, function (el) { return ('height' in el); }).length === this._els.length;
|
||||
};
|
||||
Sticky.prototype.init = function () {
|
||||
var self = this
|
||||
var $els = $(self.CSS_SELECTOR)
|
||||
var self = this;
|
||||
var $els = $(self.CSS_SELECTOR);
|
||||
|
||||
if ($els.length > 0) {
|
||||
$els.each(function (i, el) {
|
||||
var $el = $(el)
|
||||
var el = {
|
||||
var $el = $(el);
|
||||
var elObj = {
|
||||
$fixedEl: $el,
|
||||
scrolledFrom: self.getScrolledFrom($el),
|
||||
stopped: false
|
||||
}
|
||||
};
|
||||
|
||||
self.setFixedTop(el)
|
||||
self.setElHeight(el)
|
||||
self._els.push(el)
|
||||
})
|
||||
self.setFixedTop(elObj);
|
||||
self.setElHeight(elObj);
|
||||
self._els.push(elObj);
|
||||
});
|
||||
|
||||
if (self._scrollTimeout === false) {
|
||||
$(global).scroll(function (e) { self.onScroll() })
|
||||
self._scrollTimeout = global.setInterval(function (e) { self.checkScroll() }, 50)
|
||||
$(global).scroll(function (e) { self.onScroll(); });
|
||||
self._scrollTimeout = global.setInterval(function (e) { self.checkScroll(); }, 50);
|
||||
}
|
||||
|
||||
if (self._resizeTimeout === false) {
|
||||
$(global).resize(function (e) { self.onResize() })
|
||||
self._resizeTimeout = global.setInterval(function (e) { self.checkResize() }, 50)
|
||||
$(global).resize(function (e) { self.onResize(); });
|
||||
self._resizeTimeout = global.setInterval(function (e) { self.checkResize(); }, 50);
|
||||
}
|
||||
|
||||
// fake scrolling to allow us to check the position of the elements
|
||||
self._hasScrolled = true
|
||||
self.checkScroll()
|
||||
self._hasScrolled = true;
|
||||
self.checkScroll();
|
||||
}
|
||||
}
|
||||
};
|
||||
Sticky.prototype.onScroll = function () {
|
||||
this._hasScrolled = true
|
||||
}
|
||||
this._hasScrolled = true;
|
||||
};
|
||||
Sticky.prototype.onResize = function () {
|
||||
this._hasResized = true
|
||||
}
|
||||
this._hasResized = true;
|
||||
};
|
||||
Sticky.prototype.viewportIsWideEnough = function (windowWidth) {
|
||||
return windowWidth > 768
|
||||
}
|
||||
return windowWidth > 768;
|
||||
};
|
||||
Sticky.prototype.checkScroll = function () {
|
||||
var self = this
|
||||
var self = this;
|
||||
|
||||
if (self._hasScrolled === true) {
|
||||
self._hasScrolled = false
|
||||
self._hasScrolled = false;
|
||||
|
||||
$.each(self._els, function (i, el) {
|
||||
var $el = el.$fixedEl
|
||||
var $el = el.$fixedEl;
|
||||
|
||||
var windowDimensions = self.getWindowDimensions()
|
||||
var windowDimensions = self.getWindowDimensions();
|
||||
|
||||
if (self.scrolledFromInsideWindow(el.scrolledFrom)) {
|
||||
self.release($el)
|
||||
self.release($el);
|
||||
} else {
|
||||
if (self.scrolledToOutsideWindow(el, windowDimensions.height)) {
|
||||
self.stop(el)
|
||||
self.stop(el);
|
||||
} else if (self.viewportIsWideEnough(windowDimensions.width)) {
|
||||
if (el.stopped) {
|
||||
self.unstop(el)
|
||||
self.unstop(el);
|
||||
}
|
||||
self.stick($el)
|
||||
self.stick($el);
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
Sticky.prototype.checkResize = function () {
|
||||
var self = this
|
||||
var self = this;
|
||||
|
||||
if (self._hasResized === true) {
|
||||
self._hasResized = false
|
||||
self._hasResized = false;
|
||||
|
||||
var windowDimensions = self.getWindowDimensions()
|
||||
var windowDimensions = self.getWindowDimensions();
|
||||
|
||||
$.each(self._els, function (i, el) {
|
||||
var $el = el.$fixedEl
|
||||
var $el = el.$fixedEl;
|
||||
|
||||
var elResize = $el.hasClass('js-self-resize')
|
||||
var elResize = $el.hasClass('js-self-resize');
|
||||
if (elResize) {
|
||||
var $shim = $('.shim')
|
||||
var $elParent = $el.parent('div')
|
||||
var elParentWidth = $elParent.width()
|
||||
$shim.css('width', elParentWidth)
|
||||
$el.css('width', elParentWidth)
|
||||
self.setElHeight(el)
|
||||
var $shim = $('.shim');
|
||||
var $elParent = $el.parent('div');
|
||||
var elParentWidth = $elParent.width();
|
||||
$shim.css('width', elParentWidth);
|
||||
$el.css('width', elParentWidth);
|
||||
self.setElHeight(el);
|
||||
}
|
||||
|
||||
if (!self.viewportIsWideEnough(windowDimensions.width)) {
|
||||
self.release($el)
|
||||
self.release($el);
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
Sticky.prototype.stick = function ($el) {
|
||||
if (!$el.hasClass('content-fixed')) {
|
||||
var height = Math.max($el.height(), 1)
|
||||
var width = $el.width()
|
||||
var height = Math.max($el.height(), 1);
|
||||
var width = $el.width();
|
||||
|
||||
this.addShimForEl($el, width, height)
|
||||
$el.css('width', width + 'px').addClass('content-fixed')
|
||||
this.addShimForEl($el, width, height);
|
||||
$el.css('width', width + 'px').addClass('content-fixed');
|
||||
}
|
||||
}
|
||||
};
|
||||
Sticky.prototype.release = function ($el) {
|
||||
if ($el.hasClass('content-fixed')) {
|
||||
$el.removeClass('content-fixed').css('width', '')
|
||||
$el.siblings('.shim').remove()
|
||||
$el.removeClass('content-fixed').css('width', '');
|
||||
$el.siblings('.shim').remove();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var stickAtTop = new Sticky('.js-stick-at-top-when-scrolling')
|
||||
var stickAtTop = new Sticky('.js-stick-at-top-when-scrolling');
|
||||
stickAtTop.getScrolledFrom = function ($el) {
|
||||
return $el.offset().top
|
||||
}
|
||||
return $el.offset().top;
|
||||
};
|
||||
stickAtTop.getScrollingTo = function (el) {
|
||||
var footer = $('.js-footer:eq(0)')
|
||||
var footer = $('.js-footer:eq(0)');
|
||||
if (footer.length === 0) {
|
||||
return 0
|
||||
return 0;
|
||||
}
|
||||
return (footer.offset().top - 10) - el.height
|
||||
}
|
||||
return (footer.offset().top - 10) - el.height;
|
||||
};
|
||||
stickAtTop.scrolledFromInsideWindow = function (scrolledFrom) {
|
||||
var windowTop = this.getWindowPositions().scrollTop
|
||||
var windowTop = this.getWindowPositions().scrollTop;
|
||||
|
||||
return scrolledFrom > windowTop
|
||||
}
|
||||
return scrolledFrom > windowTop;
|
||||
};
|
||||
stickAtTop.scrolledToOutsideWindow = function (el, windowHeight) {
|
||||
var windowTop = this.getWindowPositions().scrollTop
|
||||
var windowTop = this.getWindowPositions().scrollTop;
|
||||
|
||||
return windowTop > el.scrolledTo
|
||||
}
|
||||
return windowTop > el.scrolledTo;
|
||||
};
|
||||
stickAtTop.addShimForEl = function ($el, width, height) {
|
||||
$el.before('<div class="shim" style="width: ' + width + 'px height: ' + height + 'px"> </div>')
|
||||
}
|
||||
$el.before('<div class="shim" style="width: ' + width + 'px height: ' + height + 'px"> </div>');
|
||||
};
|
||||
stickAtTop.stop = function (el) {
|
||||
if (!el.stopped) {
|
||||
el.$fixedEl.css({ 'position': 'absolute', 'top': el.scrolledTo })
|
||||
el.stopped = true
|
||||
el.$fixedEl.css({ 'position': 'absolute', 'top': el.scrolledTo });
|
||||
el.stopped = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
stickAtTop.unstop = function (el) {
|
||||
if (el.stopped) {
|
||||
el.$fixedEl.css({ 'position': '', 'top': '' })
|
||||
el.stopped = false
|
||||
el.$fixedEl.css({ 'position': '', 'top': '' });
|
||||
el.stopped = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var stickAtBottom = new Sticky('.js-stick-at-bottom-when-scrolling')
|
||||
var stickAtBottom = new Sticky('.js-stick-at-bottom-when-scrolling');
|
||||
stickAtBottom.getScrolledFrom = function ($el) {
|
||||
return $el.offset().top + $el.outerHeight()
|
||||
}
|
||||
return $el.offset().top + $el.outerHeight();
|
||||
};
|
||||
stickAtBottom.getScrollingTo = function (el) {
|
||||
var header = $('.js-header:eq(0)')
|
||||
var header = $('.js-header:eq(0)');
|
||||
if (header.length === 0) {
|
||||
return 0
|
||||
return 0;
|
||||
}
|
||||
return (header.offset().top + header.outerHeight() + 10) + el.height
|
||||
}
|
||||
return (header.offset().top + header.outerHeight() + 10) + el.height;
|
||||
};
|
||||
stickAtBottom.scrolledFromInsideWindow = function (scrolledFrom) {
|
||||
var windowBottom = this.getWindowPositions().scrollTop + this.getWindowDimensions().height
|
||||
var windowBottom = this.getWindowPositions().scrollTop + this.getWindowDimensions().height;
|
||||
|
||||
return scrolledFrom < windowBottom
|
||||
}
|
||||
return scrolledFrom < windowBottom;
|
||||
};
|
||||
stickAtBottom.scrolledToOutsideWindow = function (el, windowHeight) {
|
||||
var windowBottom = this.getWindowPositions().scrollTop + this.getWindowDimensions().height
|
||||
var windowBottom = this.getWindowPositions().scrollTop + this.getWindowDimensions().height;
|
||||
|
||||
return windowBottom < el.scrolledTo
|
||||
}
|
||||
return windowBottom < el.scrolledTo;
|
||||
};
|
||||
stickAtBottom.addShimForEl = function ($el, width, height) {
|
||||
$el.after('<div class="shim" style="width: ' + width + 'px height: ' + height + 'px"> </div>')
|
||||
}
|
||||
$el.after('<div class="shim" style="width: ' + width + 'px height: ' + height + 'px"> </div>');
|
||||
};
|
||||
stickAtBottom.stop = function (el) {
|
||||
if (!el.stopped) {
|
||||
el.$fixedEl.css({
|
||||
'position': 'absolute',
|
||||
'top': (el.scrolledTo - el.height),
|
||||
'bottom': 'auto'
|
||||
})
|
||||
el.stopped = true
|
||||
});
|
||||
el.stopped = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
stickAtBottom.unstop = function (el) {
|
||||
if (el.stopped) {
|
||||
el.$fixedEl.css({
|
||||
'position': '',
|
||||
'top': '',
|
||||
'bottom': ''
|
||||
})
|
||||
el.stopped = false
|
||||
});
|
||||
el.stopped = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
GOVUK.stickAtTopWhenScrolling = stickAtTop
|
||||
GOVUK.stickAtBottomWhenScrolling = stickAtBottom
|
||||
global.GOVUK = GOVUK
|
||||
})(window)
|
||||
GOVUK.stickAtTopWhenScrolling = stickAtTop;
|
||||
GOVUK.stickAtBottomWhenScrolling = stickAtBottom;
|
||||
global.GOVUK = GOVUK;
|
||||
})(window);
|
||||
|
||||
Reference in New Issue
Block a user