ch4o5/locomotive-boilerplate
Template
1
0
Fork 0
mirror of https://github.com/locomotivemtl/locomotive-boilerplate.git synced 2026-01-15 00:55:08 +08:00
Code Issues Projects Releases Wiki Activity

Remove jQuery and scrollTo util

Browse Source
This commit is contained in:
Antoine Boulanger
2019-07-19 16:00:31 -04:00
parent 9836c462b2
commit 41c3fe4b49
5 changed files with 0 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
assets/scripts/modules/load.js → assets/scripts/modules/Load.js
View File

63
assets/scripts/utils/scrollTo.js
View File

@@ -1,63 +0,0 @@
import { isNumeric } from './is'
let isAnimating = false;
const defaults = {
easing: 'swing',
headerOffset: 60,
speed: 300
};
/**
* scrollTo is a function that scrolls a container to an element's position within that controller
* Uses jQuery's $.Deferred to allow using a callback on animation completion
* @param {object} $element A jQuery node
* @param {object} options
*/
export function scrollTo($element, options) {
const deferred = $.Deferred();
// Drop everything if this ain't a jQuery object
if ($element instanceof jQuery && $element.length > 0) {
// Merging options
options = $.extend({}, defaults, (typeof options !== 'undefined' ? options : {}));
// Prevents accumulation of animations
if (isAnimating === false) {
isAnimating = true;
// Default container that we'll be scrolling
let $container = $('html, body');
let elementOffset = 0;
// Testing container in options for jQuery-ness
// If we're not using a custom container, we take the top document offset
// If we are, we use the elements position relative to the container
if (typeof options.$container !== 'undefined' && options.$container instanceof jQuery && options.$container.length > 0) {
$container = options.$container;
if (typeof options.scrollTop !== 'undefined' && isNumeric(options.scrollTop) && options.scrollTop !== 0) {
scrollTop = options.scrollTop;
} else {
scrollTop = $element.position().top - options.headerOffset;
}
} else {
if (typeof options.scrollTop !== 'undefined' && isNumeric(options.scrollTop) && options.scrollTop !== 0) {
scrollTop = options.scrollTop;
} else {
scrollTop = $element.offset().top - options.headerOffset;
}
}
$container.animate({
scrollTop: scrollTop
}, options.speed, options.easing, function() {
isAnimating = false;
deferred.resolve();
});
}
}
return deferred.promise();
}

1
www/assets/scripts/jquery-3.4.1.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
www/index.html
View File

@@ -46,8 +46,6 @@
<script nomodule src="https://polyfill.io/v3/polyfill.min.js?features=fetch%2CCustomEvent%2CElement.prototype.matches" crossorigin="anonymous"></script> <script nomodule src="https://polyfill.io/v3/polyfill.min.js?features=fetch%2CCustomEvent%2CElement.prototype.matches" crossorigin="anonymous"></script>
<script nomodule src="assets/scripts/abortcontroller-polyfill-only.js"></script> <script nomodule src="assets/scripts/abortcontroller-polyfill-only.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="assets/scripts/jquery-3.4.1.min.js"><\/script>')</script>
<script src="assets/scripts/vendors.js"></script> <script src="assets/scripts/vendors.js"></script>
<script src="assets/scripts/app.js"></script> <script src="assets/scripts/app.js"></script>
</body> </body>

2
www/page.html
View File

@@ -46,8 +46,6 @@
<script nomodule src="https://polyfill.io/v3/polyfill.min.js?features=fetch%2CCustomEvent%2CElement.prototype.matches" crossorigin="anonymous"></script> <script nomodule src="https://polyfill.io/v3/polyfill.min.js?features=fetch%2CCustomEvent%2CElement.prototype.matches" crossorigin="anonymous"></script>
<script nomodule src="assets/scripts/abortcontroller-polyfill-only.js"></script> <script nomodule src="assets/scripts/abortcontroller-polyfill-only.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="assets/scripts/jquery-3.4.1.min.js"><\/script>')</script>
<script src="assets/scripts/vendors.js"></script> <script src="assets/scripts/vendors.js"></script>
<script src="assets/scripts/app.js"></script> <script src="assets/scripts/app.js"></script>
</body> </body>