분류 전체보기(277)
-
[유튜브 클론코딩] 9.1 Recording Video part.1
9.1 Recording Video part.1 우선 start recording을 눌렀으면 버튼의 innerHTML이 "Stop recording"으로 바뀌게 코드를 넣는다. 그리고 finally부분을 추가하여 removeEventListener 구문을 이곳으로 옮긴다 try나 catch 부분 둘 중 하나가 실행된 후 finally구문이 실행된다. 아직 여기까지 한 것은 진짜 녹화를 한 것이 아니라 그냥 프리뷰만 보이게 한 것이니까 함수 이름을 바꾼다. (startRecording => getVideo) const recordContainer = document.getElementById("jsRecordContainer"); const recordBtn = document.getElementById(..
2021.03.18 -
[유튜브 클론코딩] 9.0 Getting User Media
9.0 Getting User Media 비디오를 업로드할 때 비디오 레코드도 가능하게 하는 것을 해볼 것이다. 🍰 views 고치고 scss 만들기 우선 그걸 위해 views를 좀 고치겠다. extends layouts/main block content .form-container .record-container#jsRecordContainer video#jsVideoPreview button#jsRecordBtn Start Recording form(action=`/videos${routes.upload}`, method="post", enctype="multipart/form-data") div.fileUpload label(for="file") Video File input(type="file",..
2021.03.18 -
[유튜브 클론코딩] 8.5 ~ 8.6 Volume Bar part.1 / part.2
8.5 Volume Bar part.1 비디오가 끝났을 때 시간을 처음으로 다시 돌려 놓을거고 비디오를 멈출것이다. (현재는 비디오가 예를 들어 52초짜리면 다 재생되면 00:00:52/ 00:00:52 라고 떠있다. 그리고 플레이버튼은 ⏸ 에 머물러있다. 우리는 ▶이 되기를 원한다.) function handleEnded(){ videoPlayer.currentTime = 0; playBtn.innerHTML = ''; } function init(){ playBtn.addEventListener("click", handlePlayClick); volumeBtn.addEventListener("click", handleVolumeClick); fullScreenBtn.addEventListener("c..
2021.03.18 -
[유튜브 클론코딩] 8.4 Total time and Current time
8.4 Total time and Current time 많은 브라우저에서 동작할 수 있도록 if문을 이용해서 goFullScreen과 exitFullScreen을 수정한다. function exitFullScreen(){ // document.exitFullscreen();//전체화면을 종료하기 if(document.exitFullscreen){ document.exitFullscreen(); }else if(document.mozCancelFullScreen){ document.mozCancelFullScreen(); }else if(document.webkitExitFullscreen){ document.webkitExitFullscreen(); }else if(document.msExitFulls..
2021.03.18 -
[자료구조] 이진탐색트리 구현 - 삭제
이진탐색트리에서 삭제를 할 때에는 경우의 수를 3가지를 생각해야 한다. 경우 1) 리프노드(자식이 없는 노드)일 경우 * 이 경우 단순히 해당 노드를 null로 처리하고 그 노드를 return하기만 하면 된다. 경우 2) 왼쪽/오른쪽 중에서 한쪽에만 자식이 있는 경우 * 오른쪽에만 자식이 있다면, 왼쪽 자식을 해당 노드로 바꾸고 그 노드를 return한다 (한마디로 할아버지가 손자 손을 잡도록 하는 격) 경우 3) 왼쪽/오른쪽 양쪽 모두 자식이 있는 경우 * 삭제하려고 하는 노드를 [왼쪽 서브트리 중 가장 큰 노드]또는 [오른쪽 서브트리 중 가장 작은 노드]로 교체하고, 이 후 서브트리에서 그 노드는 삭제를 해준다. * 나는 [오른쪽 서브트리 중 가장 작은 노드]로 대체하는 방법을 선택하여 자바스크립트 ..
2021.03.17 -
[자료구조] 이진탐색트리 구현 - 최솟값, 최댓값 찾기 / 특정 값 찾기
최솟값/최댓값 찾기 (min(), max()) 이진탐색트리에서 최솟값은 맨 왼쪽 노드값이고, 최댓값은 맨 오른쪽 노드값이다. 그러므로 최솟값을 구하는 메소드 min(), 최댓값을 구하는 메소드 max()는 다음과 같이 구현할 수 있다. //최솟값 찾기 min(){ return this.minNode(this.root); } minNode(node){ if(node){ while(node && node.left !== null){ node = node.left; } return node.key; } return null; } //최댓값 찾기 max(){ return this.maxNode(this.root); } maxNode(node){ if(node){ while(node && node.right !=..
2021.03.17