이번엔 레프트라이너가 뭘 하든 해야 돼.js라는 아주 편리한 도서관이 있어서 소개하기로 했어요.

LeapTrainer가 뭐예요?

쉽게 말해 손의 움직임과 모양을 기억하고 식별하기 위해 LeapMotion을 사용하는 소프트웨어와 프로그램 라이브러리다.
손짓을 기억하고 HTML 스크립트로 복사하기만 하면 손짓을 할 때 동작을 할 수 있습니다.
추기
자세도 인식할 수 있다.

한번 써보세요.

우선 LeapTratner입니다.js를github에서가져오너라,trainer-ui.""을 표시해 보세요.

이런 화면이 나오고
OPTION을 통해 미세한 동작의 탐지 및 식별 방법 등을 선택할 수 있다.그 설명은 앞으로 진행될 겁니다.
CREATE A GESTURE를 사용하여 제스처의 이름을 결정하여 등록합니다.

제스처 등록하세요.

그럼 오른쪽으로 미끄러지는 제스처를 실제로 등록해 보세요.

로그인을 종료합니다.그런 다음 동일한 작업을 다시 수행하여 일치도를 확인합니다.
일치도가 나타나지 않거나 너무 낮으면 등록된 제스처를 클릭하십시오.옵션을 선택하면 제스처를 수정할 수 있습니다. 다시 한 번 진행해 주십시오.

HTML로 읽어주세요.

이번엔 리프트레인이야.js 파일에 있는menu-demo로 가봐.
그럼 menu-demo의 index.같이 보러 갑시다.
menu-demo/index.html

<script>
...
var trainer = new LeapTrainer.Controller(); 

  trainer.fromJSON('コピペしたものをはる');
  trainer.fromJSON('コピペしたものをはる');
  trainer.on('LEFT', open);
  trainer.on('RIGHT', close);

</script>

jQuery로 OPEN을 눌렀을 때 메뉴가 나오고 CLOSE를 눌렀을 때 닫힌 동작 아래에는 LeapTrainer가 동작을 호출하는 코드가 적혀 있다.
그리고 제스처 이름을 클릭하면 JSON으로 코드가 표시되므로 복사하여 붙여넣습니다.

여기 프롬 JSON에 아까 오른쪽 슬라이드의 제스처를 복사한 것을 붙여 넣으세요.그런 다음 마우스 오른쪽 슬라이딩 시 CLOSE를 누를 때와 동일한 동작을 수행할 수 있습니다.OPEN도 있기 때문에 이쪽은 왼쪽으로 미끄러질 때 움직인다.
왼쪽 슬라이드에 메뉴를 이렇게 표시하면 성공합니다.