@zippytech/region
v3.0.8
Published
A helper to work with rectangular regions in the DOM
Downloads
22
Maintainers
Readme
region
A helper to work with rectangular regions in the DOM
Install
$ npm install @zippytech/region --save
Usage
var Region = require('@zippytech/region')
var region = Region({
top: 10,
left: 10,
width: 50,
height: 60
})
region.getRight() == 60
region.getBottom() == 70
API
Instantiation
You can create a new Region by calling the function returned by require('@zippytech/region')
. You can call it as a constructor if you want.
var Region = require('@zippytech/region')
new Region({
top: 10,
left: 10
//either width,height
//or right, bottom
width: 10,
height: 10
})
or
var Region = require('@zippytech/region')
var r = Region({
top: 10,
left: 10,
right: 20,
bottom: 20
})
You can instantiate a Region
from a DOM node, using Region.fromDOM (NOTE: uses dom.offsetWidth/Height/Left/Top for getting coordinates)
var r = Region.fromDOM(document.body)
Getters
- get - returns an object with {top, left, bottom, right}
- getWidth
- getHeight
- getLeft
- getTop
- getRight
- getBottom
- getPosition - returns an object with {left, top}
- getSize - returns an object with {width, height}
containsPoint(x,y) or containsPoint({x,y}) : Boolean
var r = Region({
top: 10,
left: 10,
width: 10,
height: 10
})
r.containsPoint(15, 10) == true
r.containsPoint({x: 10, y: 10}) == true
equals(r): Boolean
Returns true if this region equals the region (or the object) given as the first param var r = Region({top: 10, left: 10, bottom: 20, right: 20 })
r.equals({top: 10, left: 10, bottom: 20, right: 20 }) == true
equalsPosition({top, left}): Boolean
Returns true if this region has top, left equal to the given coordinates
equalsSize({width, height}): Boolean
Returns true if this region has the same size as the given region or object
var coords = { top: 10, left: 10, width: 100, height: 100 }
var r = Region(coords)
r.equalsSize(coords) == true
r.equalsSize(r.clone()) == true
getIntersection(Region): Region/false
Returns the region resulted by intersecting this region with the given region. If no intersection, returns false
clone: Region
Returns a new region instance with the same coordinates
var r = new Region({left: 10, right: 10, width: 10, height: 20})
r.clone().equals(r)
Tests
$ make
Watch mode
$ make test-w