(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-5f3e296e"],{"53af":function(t,e,r){"use strict";e["a"]="@app.route('/list', methods=('GET', ))\r\ndef list_tv():\r\n path = f\"/webostv\"\r\n headers = _create_headers()\r\n response = requests.get(HOST + path, headers=headers).json()\r\n return response\r\n \r\n\r\n@app.route('/connect/', methods=('GET', ))\r\ndef connect_tv(ip):\r\n path = f\"/webostv/{ip}\"\r\n headers = _create_headers()\r\n response = requests.post(HOST + path, headers=headers).json()\r\n return response\r\n\r\n\r\n@app.route('/capture/', methods=('GET', ))\r\ndef capture(ip):\r\n path = f\"/webostv/{ip}/control/capture\"\r\n headers = _create_headers()\r\n response = requests.get(HOST + path, headers=headers).json()\r\n return response\r\n\r\n\r\ndef _create_headers():\r\n headers = {\r\n \"Content-Type\": \"application/json;charset=UTF-8\"\r\n }\r\n return headers\r\n "},"550c":function(t,e,r){"use strict";r.r(e);var a=function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("article",[t._m(0),r("h2",[t._v("Prerequisites")]),t._m(1),t._m(2),t._m(3),t._m(4),r("code-viewer",{attrs:{language:"python",code:t.getStartedPage2Py}}),r("div",[r("div",{staticStyle:{"margin-top":"44px"}},[t._v(" [참고]"),r("br"),t._v(" webOS TV 컴포넌트로 아래 API를 사용하여 TV를 등록하고 화면을 캡처합니다."),r("br"),t._v(" API를 호출하는 Flow는"),r("router-link",{staticStyle:{"margin-left":"8px"},attrs:{to:"/docs/webos-tv/api"}},[t._v("이 페이지")]),t._v("를 참고하세요. ")],1),r("ul",{staticStyle:{"margin-top":"29px","margin-bottom":"102px"}},[r("li",[t._v(" TV 리스트 조회 "),r("router-link",{staticStyle:{"margin-left":"8px"},attrs:{to:"/docs/webos-tv/reference#tv-list"}},[t._v("GET /webostv")])],1),r("li",[t._v(" TV 등록 "),r("router-link",{staticStyle:{"margin-left":"8px"},attrs:{to:"/docs/webos-tv/reference#tv-enroll"}},[t._v("POST /webostv/{ip}")])],1),r("li",[t._v(" TV 화면 캡쳐 "),r("router-link",{staticStyle:{"margin-left":"8px"},attrs:{to:"/docs/webos-tv/reference#capture"}},[t._v("POST /webostv/{ip}/control/capture")])],1)])]),t._m(5),r("div",[r("ol",[r("li",[t._v("예제 코드 파일 압축 (파일명 : damda_tv_capture.zip)")]),t._m(6),r("br"),t._v(" 코드구조 "),r("img",{staticStyle:{"margin-bottom":"60px","margin-top":"10px"},attrs:{src:"/assets/img/getstarted9.png",alt:""}}),t._m(7),r("li",[t._v("컴포넌트 생성을 위해 필요한 정보 입력")]),r("ul",{staticStyle:{"line-height":"34px"}},[t._m(8),r("li",[t._v("설명 : ‘TV 화면을 캡쳐하는 예제’ 입력")]),r("li",[t._v(" 코드 : '1. 예제 코드 파일 압축' 단계에서 생성한 'tv_capture.zip' 파일 업로드 ")]),r("li",[t._v(' 실행 스크립트 : "Python" 선택. 코드가 디바이스에 설치 된 후 디바이스에서 실행될 스크립트 ')]),r("code-viewer",{attrs:{code:t.getStartedPage2Sh,language:"bash"}}),r("li",[t._v("홈 화면 출력' 체크")]),r("li",[t._v("썸네일 이미지 : 자유롭게 선택")]),r("li",[t._v("앱 이름 : 'TV 캡처' 입력")]),t._m(9)],1),r("img",{staticStyle:{"margin-top":"60px","margin-bottom":"60px"},attrs:{src:"/assets/img/getstarted11.png",alt:""}}),r("li",[t._v("컴포넌트 생성 완료")])]),r("img",{staticStyle:{"margin-top":"43px","margin-bottom":"100px"},attrs:{src:"/assets/img/getstarted12.png",alt:""}})]),t._m(10),t._m(11)],1)},s=[function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("hgroup",[r("h1",[t._v("TV화면 캡쳐 컴포넌트 개발하기")])])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("ul",{staticClass:"checklist"},[r("li",[t._v("Python 3.7")]),r("li",[t._v("Flask")])])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("div",[r("div",{staticStyle:{"margin-top":"26px"}},[t._v(" Public component인 "),r("a",{attrs:{href:"https://developer.damda.lge.com/docs/webos-tv/api",target:"_blank"}},[t._v("webOS TV")]),t._v("를 활용하여 TV의 화면을 캡처하는 애플리케이션을 컴포넌트로 생성하여 배포하는 튜토리얼입니다. "),r("br"),t._v("아래 화면은 최종적으로 TV 화면 캡처 컴포넌트를 기기에 배포한 후 실행 화면입니다. "),r("img",{staticStyle:{"margin-bottom":"60px","margin-top":"10px"},attrs:{src:"/assets/img/example1.png",alt:""}})])])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("h2",[r("span",{staticClass:"chip"},[t._v("1단계")]),t._v("웹 애플리케이션 개발")])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("ol",[r("li",[r("a",{attrs:{href:"/assets/img/damda_tutorial_1_tvcapture.zip",target:"_blank"}},[t._v(" 샘플 코드")]),t._v(" 다운로드")]),r("li",[t._v(' app.py에서 "#TODO 여기에 코드를 작성 하세요." 위치에 아래 코드를 추가하세요. ')])])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("h2",[r("span",{staticClass:"chip"},[t._v("2단계")]),t._v("컴포넌트 생성")])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("ul",{staticClass:"comment"},[r("li",[t._v("app.py")]),r("li",[t._v("requirements.txt")]),r("li",[t._v("static/*")]),r("li",[t._v("templates/*")])])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("li",{staticStyle:{"margin-bottom":"60px"}},[r("a",{attrs:{href:"https://damda.lge.com/",target:"_blank"}},[t._v(" DAMDA console")]),t._v(" 로그인 > 컴포넌트 메뉴에서 컴포넌트 추가 ")])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("li",[t._v(' 컴포넌트명 : "com.damda.sample.webostv" 입력'),r("br"),t._v(" - Unique한 이름을 지정해야 함. damda 플랫폼 내 중복되는 이름의 컴포넌트가 존재하는경우 컴포넌트 생성 불가"),r("br"),t._v(" - 컴포넌트명 추천 형식 : com.<개인 식별키워드>.sample.webostv ")])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("li",[t._v(" 접속 링크 : '"),r("span",{staticClass:"link-font"},[t._v("http://127.0.0.1:8005")]),t._v("' 입력 "),r("br"),t._v(" - 홈 화면에서 썸네일 클릭 시 이동할 링크 주소 ")])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("h2",[r("span",{staticClass:"chip"},[t._v("3단계")]),t._v("컴포넌트 배포")])},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("div",[r("ol",[r("li",[t._v("배포할 컴포넌트를 모두 선택 > 배포하기")]),r("ul",[r("li",[t._v("Public 컴포넌트는 모두 배포 리스트에 기본으로 포함됩니다.")])]),r("img",{staticStyle:{"margin-top":"51px","margin-bottom":"60px"},attrs:{src:"/assets/img/getstarted13.png",alt:""}}),r("li",[t._v(" 배포할 컴포넌트 리스트를 확인 > 배포할 '코어 디바이스 선택' > 배포 요청 ")]),r("img",{staticStyle:{"margin-top":"43px","margin-bottom":"60px"},attrs:{src:"/assets/img/getstarted14.png",alt:""}}),r("li",[t._v(" 배포가 완료된 후 개발PC 브라우저에서 '"),r("span",{staticClass:"link-font"},[t._v("http://{라즈베리파이의 IP}:8002")]),t._v("' 접속 ")]),r("ul",[r("li",[t._v(" 참고 : 라즈베리파이에서 접속 시 '"),r("span",{staticClass:"link-font"},[t._v("http://localhost:8002")]),t._v("'로 접속합니다. ")])]),r("img",{staticStyle:{"margin-top":"45px","margin-bottom":"60px"},attrs:{src:"/assets/img/getstarted15.png",alt:""}}),r("li",[t._v("아이콘을 클릭하여 배포한 컴포넌트 웹 애플리케이션 실행")]),r("ul",[r("li",[t._v(" 3~4초 후 같은 네트워크에 연결된 TV 리스트가 나타납니다. 연결한 TV를 선택하고 TV 등록 절차를 참고하여 연결합니다. ")]),r("li",[t._v(" 연결 완료 Toast가 뜨면 캡처 버튼을 눌러 TV 스크린샷이 잘 캡쳐되는지 확인합니다. ")])])]),r("img",{staticStyle:{"margin-top":"48px"},attrs:{src:"/assets/img/getstarted16.png",alt:""}})])}],n=r("53af"),i=r("55ad"),l=r("ea81"),o={data:function(){return{getStartedPage2Py:n["a"],getStartedPage2Sh:i["a"]}},components:{CodeViewer:l["a"]}},c=o,p=r("2877"),_=Object(p["a"])(c,a,s,!1,null,null,null);e["default"]=_.exports},"55ad":function(t,e,r){"use strict";e["a"]="pip3 install -r {root}/tv_capture/requirements.txt && python3 {root}/tv_capture/app.py"}}]); //# sourceMappingURL=chunk-5f3e296e.bdb31145.js.map