Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

better fix for Maximum call stack size exceeded #68

Merged
merged 1 commit into from
Jan 10, 2016
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
67 changes: 51 additions & 16 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -394,41 +394,76 @@ export default class ReactTooltip extends Component {
xPosition += parseInt(offset[key], 10)
}
}
/* When tooltip over the screen */
let offsetEffectX = effect === 'solid' ? 0 : (place ? offsetFromEffect[place].x : 0)
let offsetEffectY = effect === 'solid' ? 0 : (place ? offsetFromEffect[place].y : 0)
const styleLeft = this.state.x + offsetEffectX + xPosition
const styleTop = this.state.y + offsetEffectY + yPosition
const windoWidth = window.innerWidth
const windowHeight = window.innerHeight

/* Solid use this method will get Uncaught RangeError: Maximum call stack size exceeded */
if (effect === 'float') {
if (styleLeft < 0 && this.state.x + offsetFromEffect['right'].x + xPosition <= windoWidth) {

/* If our tooltip goes outside the window we want to try and change its place to be inside the window */
var x = this.state.x
var y = this.state.y
function getStyleLeft (_place) {
var _offsetEffectX = effect === 'solid' ? 0 : _place ? offsetFromEffect[_place].x : 0
return x + _offsetEffectX + xPosition
}
function getStyleTop (_place) {
var _offsetEffectY = effect === 'solid' ? 0 : _place ? offsetFromEffect[_place].y : 0
return y + _offsetEffectY + yPosition
}

var windoWidth = window.innerWidth
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@enjalot Little typo :)

Edit: Ouh it was there before, so maybe it was intentional ;P

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hah i didn't notice. nice way to save a character ;)

var windowHeight = window.innerHeight

function outsideLeft (_place) {
var styleLeft = getStyleLeft(_place)
return styleLeft < 0 && x + offsetFromEffect['right'].x + xPosition <= windoWidth
}
function outsideRight (_place) {
var styleLeft = getStyleLeft(_place)
return styleLeft + tipWidth > windoWidth && x + offsetFromEffect['left'].x + xPosition >= 0
}
function outsideTop (_place) {
var styleTop = getStyleTop(_place)
return styleTop < 0 && y + offsetFromEffect['bottom'].y + yPosition + tipHeight < windowHeight
}
function outsideBottom (_place) {
var styleTop = getStyleTop(_place)
return styleTop + tipHeight >= windowHeight && y + offsetFromEffect['top'].y + yPosition >= 0
}
/* We want to make sure the place we switch to will not go outside either */
function outside (_place) {
return outsideTop(_place) || outsideRight(_place) || outsideBottom(_place) || outsideLeft(_place)
}

/* We check each side and switch if the new place will be in bounds */
if (outsideLeft(place)) {
if (!outside('right')) {
this.setState({
place: 'right'
})
return
} else if (styleLeft + tipWidth > windoWidth && this.state.x + offsetFromEffect['left'].x + xPosition >= 0) {
}
} else if (outsideRight(place)) {
if (!outside('left')) {
this.setState({
place: 'left'
})
return
} else if (styleTop < 0 && this.state.y + offsetFromEffect['bottom'].y + yPosition + tipHeight < windowHeight) {
}
} else if (outsideTop(place)) {
if (!outside('bottom')) {
this.setState({
place: 'bottom'
})
return
} else if (styleTop + tipHeight >= windowHeight && this.state.y + offsetFromEffect['top'].y + yPosition >= 0) {
}
} else if (outsideBottom(place)) {
if (!outside('top')) {
this.setState({
place: 'top'
})
return
}
}

node.style.left = styleLeft + 'px'
node.style.top = styleTop + 'px'
node.style.left = getStyleLeft(place) + 'px'
node.style.top = getStyleTop(place) + 'px'
}

/**
Expand Down