{"size": 1684, "ext": "js", "max_stars_repo_path": "src/components/Onboarding/onboarding-div.js", "max_stars_repo_name": "hyperdart/reactjs-onboarding", "max_stars_repo_stars_event_min_datetime": "2019-05-25T02:34:03.000Z", "max_stars_repo_stars_event_max_datetime": "2020-05-16T15:00:57.000Z", "max_issues_repo_path": "src/components/Onboarding/onboarding-div.js", "max_issues_repo_name": "hyperdart/reactjs-onboarding", "max_issues_repo_issues_event_min_datetime": "2020-12-03T09:03:32.000Z", "max_issues_repo_issues_event_max_datetime": "2021-05-10T16:15:06.000Z", "max_forks_repo_path": "src/components/Onboarding/onboarding-div.js", "max_forks_repo_name": "hyperdart/reactjs-onboarding", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 8, "max_issues_count": 3, "max_forks_count": null, "avg_line_length": 35.829787234, "max_line_length": 128, "alphanum_fraction": 0.7078384798}
import CONSTANTS from './constants'

export default class {
	static create = () => {
		if (document.getElementById(CONSTANTS.ONBOARDING_DIV_ID) === null) {
			let rootDiv = document.getElementsByTagName("body")[0]     //this creates a blank div on which the box shadow will be applied
			let newDiv = document.createElement("div")
			newDiv.id = CONSTANTS.ONBOARDING_DIV_ID
			rootDiv.appendChild(newDiv)
		}
	}

	static setTarget = (targetRect,disableArrow) => {
		const onboardingDiv = document.getElementById(CONSTANTS.ONBOARDING_DIV_ID)
		if (onboardingDiv && targetRect) {
					onboardingDiv.style.visibility = "visible"
					onboardingDiv.style.transition = "all .5s ease-out"
					onboardingDiv.style.position = "absolute"
					onboardingDiv.style.left = targetRect.left + "px"
					onboardingDiv.style.top = targetRect.top + "px"
					onboardingDiv.style.width = targetRect.width + "px"
					onboardingDiv.style.height = targetRect.height + "px"
					onboardingDiv.style.boxShadow = "0 0 0 9999px rgba(0, 0, 0, 0.7)"
				 	if(!disableArrow){
						onboardingDiv.style.border = "1px solid white"
						onboardingDiv.style.borderRadius = "5px"
					}
				onboardingDiv.style.zIndex = "99999"
		}
	}

	static clear = () => {
		const onboardingDiv = document.getElementById(CONSTANTS.ONBOARDING_DIV_ID)
		if (onboardingDiv) {
			onboardingDiv.style.visibility = "hidden"
			onboardingDiv.style.left = "0px"
			onboardingDiv.style.top = "0px"
			onboardingDiv.style.width = "0px"
			onboardingDiv.style.height = "0px"
			onboardingDiv.style.boxShadow="none"
			onboardingDiv.style.border="none"
			onboardingDiv.style.borderRadius="0"
			onboardingDiv.style.zIndex = "-1"
		}
	}
}
