# Letsee-Geofencing

---

## 사용법

#### 1. 패키지 설치

```shell
npm i letsee-geofencing@latest
```

    

#### 2. GeofencingMap : Admin의 Geofence Map Tool 컴포넌트

```javascript
import { GeofencingWorker, GeofencingMap, Client } from 'letsee-geofencing'

const App = () => {
    // new GeofencingWorker(GateHostURL[String], MasterId[String], ProjectId[String])
    const gw = new GeofencingWorker('https://192.168.1.6:8000', 'test', '1');

    return(
        <>
            // <GeofencingMap>의 파라메터 
            // geofencingWorker : GeofencingWorker class (필수)
            // initCenter : 처음 지도 오픈 시 지도의 중심 위/경도 좌표. (default: [lat, lng])   
            // initZoom : 처음 지도 오픈 시 Zoom 정도. 숫자가 클수록 좁은 범위를 넓게 볼 수 있음. 1~19 (default: 13)
            <GeofencingMap geofencingWorker={gw} initCenter={[37.506012, 127.058175]} initZoom={13} />
        </>
    )
}
export default App
```

    
#### 3. Client : Client의 Tracker 클래스

```javascript
import { GeofencingWorker, GeofencingMap, Client } from 'letsee-geofencing'

const App = () => {
    // new GeofencingWorker(GateHostURL[String], MasterId[String], ProjectId[String])
    const gw = new GeofencingWorker('https://192.168.1.6:8000', 'test', '1');

    // new Client(geofencingWorker[GeofencingWorker], Client_id[String])
    let client = new Client(gw, 'test_id');

    // 사용자의 위치(GPS)가 Fence 내부에 있을때 실행되는 함수
    const userInside = (fenceData) => {
        console.log("inside!!", fenceData)
    }

    // 사용자의 위치(GPS)가 Fence 외부에 있을때 실행되는 함수
        const userOutside = () => {
        console.log("outside!!")
    }
    // client.startGPS(insideCB, outsideCB, _options);
    client.startGPS( userInside, userOutside );

    return(
        <>
        </>
    )
}
export default App
```

    
### 4. 설명

`GeofencingWorker` Class는 Backend의 Gate와 통신하는 주체로,

1. Gate의 URL

2. MasterId

3. ProjectId
   
   세 파라메터를 가지고 생성되며, GeofencingMap과 Client 모두에 사용된다.

`Client` Class의 startGPS() 함수 내부에서는 navigator.geolocation.watchPosition()이 생성된다.

```javascript
startGPS([팬스 내부일때 실행할 콜백함수], [팬스 외부일때 실행할 콜백함수], [watchPosition의 옵션])
```

 [watchPosition의 옵션](https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition): maximumAge, timeout, enableHighAccuracy


---

## 수정 및 NPM 배포

```shell
git clone https://github.com/letsee/letsee-geofencing-npm.git
git checkout develop
npm i
# 코드 수정
npm version patch -f  ## 혹은 npm version 0.4.0 -f
npm publish
```