all files / lib/src/utils/ core.js

67.24% Statements 39/58
45.71% Branches 16/35
57.14% Functions 4/7
62% Lines 31/50
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124                                                                                                                              11×   11× 11×       11×                                           16× 16×   16× 16× 16× 16×        
import { isNode, isNodeList } from '../utils/browser'
 
 
export function isElementVisible (element) {
	var container = this.store.containers[element.containerId]
	var viewFactor = element.config.viewFactor
	var viewOffset = element.config.viewOffset
 
	var elementBounds = {
		top: element.geometry.bounds.top + element.geometry.height * viewFactor,
		right: element.geometry.bounds.right - element.geometry.width * viewFactor,
		bottom: element.geometry.bounds.bottom - element.geometry.height * viewFactor,
		left: element.geometry.bounds.left + element.geometry.width * viewFactor,
	}
 
	var containerBounds = {
		top: container.geometry.bounds.top + container.scroll.top + viewOffset.top,
		right: container.geometry.bounds.right + container.scroll.left + viewOffset.right,
		bottom: container.geometry.bounds.bottom + container.scroll.top + viewOffset.bottom,
		left: container.geometry.bounds.left + container.scroll.left + viewOffset.left,
	}
 
	return elementBounds.top < containerBounds.bottom
		&& elementBounds.right > containerBounds.left
		&& elementBounds.bottom > containerBounds.top
		&& elementBounds.left < containerBounds.right
		|| element.styles.position === 'fixed'
}
 
 
export function getGeometry (target, isContainer) {
	/**
	 * We want to ignore padding and scrollbars for container elements.
	 * More information here: https://goo.gl/vOZpbz
	 */
	var height = (isContainer) ? target.node.clientHeight : target.node.offsetHeight
	var width = (isContainer) ? target.node.clientWidth : target.node.offsetWidth
 
	var offsetTop = 0
	var offsetLeft = 0
	var node = target.node
 
	do {
		if (!isNaN(node.offsetTop)) {
			offsetTop += node.offsetTop
		}
		if (!isNaN(node.offsetLeft)) {
			offsetLeft += node.offsetLeft
		}
		node = node.offsetParent
	} while (node)
 
	return {
		bounds: {
			top: offsetTop,
			right: offsetLeft + width,
			bottom: offsetTop + height,
			left: offsetLeft,
		},
		height: height,
		width: width,
	}
}
 
 
export function getNode (target, container) {
	Eif ( container === void 0 ) container = document;
 
	var node = null
	if (typeof target === 'string') {
		try {
			node = container.querySelector(target)
			if (!node) { logger(("Querying the selector \"" + target + "\" returned nothing.")) }
		} catch (err) {
			logger(("\"" + target + "\" is not a valid selector."))
		}
	}
	return isNode(target) ? target : node
}
 
 
export function getNodes (target, container) {
	Eif ( container === void 0 ) container = document;
 
	if (isNode(target)) { return [target] }
	if (isNodeList(target)) { return Array.prototype.slice.call(target) }
	Eif (typeof target === 'string') {
		try {
			var query = container.querySelectorAll(target)
			var nodes = Array.prototype.slice.call(query)
			if (nodes.length) { return nodes }
			logger(("Querying the selector \"" + target + "\" returned nothing."))
		} catch (error) {
			logger(("\"" + target + "\" is not a valid selector."))
		}
	}
	return []
}
 
 
export function getScrolled (container) {
	return (container.node === document.documentElement)
		? {
			top: window.pageYOffset,
			left: window.pageXOffset,
		} : {
			top: container.node.scrollTop,
			left: container.node.scrollLeft,
		}
}
 
 
export function logger (message) {
	var details = [], len = arguments.length - 1;
	while ( len-- > 0 ) details[ len ] = arguments[ len + 1 ];
 
	Eif (console) {
		var report = "ScrollReveal: " + message
		details.forEach(function (detail) { return report += "\n  - " + detail; })
		console.log(report) // eslint-disable-line no-console
	}
}