이 수업으로 돌아와서 오디오에서의 추가에 초점을 맞추어 각 키를 칠 때 연주 할 음악 샘플을 추가하고 각 키에 고유 색을 지정하는 데 초점을 맞추어 항상이 오렌지 색을 얻지는 않습니다 노란색과 녹색으로 퇴색하지만 우리는 여기에서 볼 수 있듯이 파란색으로 된 일부를 파란색으로 보게 될 것입니다.
그러나 항상 H와 같은 주어진 키에 대해 항상 같은 색입니다.이 오렌지 큐는 항상 이것이 T Y 등입니다.
승인.
시작하려면 사운드를 재생하는 방법을 알아 내야합니다.
Hallard를 사용하여 소리를내는 방법.
Hausler의 예는 기본적으로 Paperchase의 반대입니다. 복잡성면에서는 정말 간단합니다. 정말 멋지게 만듭니다.
다시 라이브러리없이 오디오를 재생할 수 있지만 조금 있습니다.
우리가하고 싶은 일을하고 싶을 때 약간 고통 스럽습니다. 단지 한 번 소리를내는 것이 아니라, 내가 이것을하고 있다고 말하는 것처럼 연속으로 10 번 소리를 낼 수 있기를 원합니다. 허튼 소리 나는 우리가 원하는 방식대로 행동하는 것과 관련하여 약간의 작업이 필요한 것처럼 할 수 있기를 바란다.
정말로 짜증나는 노래를 연주하는 것과 같은 사운드를 연주하는 것은 정말로 쉽습니다. 그러나 웹 사이트에 가서 어떤 종류의 사운드 나 노래가 백그라운드에서 연주되는 것을 알고 있다면, 그것은 tim owl과 javascript로 정말 간단합니다 .
그러나 우리가 여러 가지 동시 발음을 가질 수있는 곳에서 이런 일을하면 우리는 일을 반복 할 수 있으며 Hallard J us와 같은 것을 사용하는 것이 훨씬 쉽습니다.
다시는 불가능하지 않습니다.
도서관이하는 것처럼 당신도 스스로 할 수 있습니다.
그러나 우리는 정말로 원하지 않을 것입니다.
따라서 우리가 어떻게 작동하는지 살펴보면이 작은 코드를 사용하여 새로운 방법을 만드는 데 필요한 모든 것입니다.
그러면 우리가 초기화하고 어떻게 알았는지는 어떨까요?
그런 다음 재생할 파일의 몇 가지 URL 목록을 제공합니다.
그래서 우리가 여러 가지 배열을 제공하는 이유는 파일 형식이 서로 같고 모양이 서로 다른 것처럼 보이지만 사용자가 넣는 순서는 하울러가로드하고로드하는 순서입니다. 그들.
따라서 기본적으로 모든 브라우저에서 작동하는 특정 파일 유형이 있으며 일부 브라우저는 모든 브라우저에서 작동하지 않습니다.
따라서 특정 백업을 지정할 수 있습니다.
우리는 그렇게하지 않을 것입니다.
우리는 하나의 파일 만 가질 것입니다.
하지만 기본적으로 적어도 내가 알고있는 한 그것에 대해 읽을 수있는 백업 방법을 원한다면 확실합니다.
여기서 우리는 당신이나 당신이 트랙이나 트랙에있는 다른 소스를 사운드를 위해로드되도록합니다.
이것들은 우선 순위가되어야합니다.
Howard Jasc는 현재 브라우저와 호환되는 첫 번째 브라우저를 자동으로로드합니다.
그래서 거기에 간다.
우리는 같은 노래의 다른 버전을 추가 할 수 있습니다.
우리의 경우 동일한 샘플과 성배기가 자동으로 첫 번째 호환 성을로드합니다.
승인.
그래서 우리가 필요로하는 코드는 새로운 하웰입니다.
그리고 나서 당신은 그게 전부입니다.
그리고 우리가 그것을 연주 할 준비가되면 우리는 단지 연극을 부릅니다.
당신은 여기에서 볼 수 있고 우리는 멈추지 않을 것입니다.
우리는 멈추지 않을 것입니다.
우리의 소리가 너무 짧기 때문에 반복하지 않을 것입니다.
그래서 우리는 단지 그들이 놀고 끝내도록하고 싶습니다.
각각은 약 0.5 초와 1 초 사이의 어딘가에 있습니다.
그렇게하지 않았다면 이미 진행하고 모든 소리가있는 zip 파일을 다운로드하고 코드를 작성한 디렉토리로 드래그하십시오.
그래서 소리 대신 우리는이 모든 파일들을 가지고 있습니다.
괜찮아.
다음으로해야 할 일은 HAUSLER를 설치하여 사용하는 것입니다.
그래서 다운로드 할 수 있습니다.
그러나 여러 가지 이유로 나는 CDN을 사용할 것입니다.
그래서 나는 처음으로 CDN 복사를 검색했습니다.
당신은 여기에있는 모든 사람들이 그것이 유효한지를 항상 시험해볼 수 있습니다.
여기에 우리가 간다.
하울러 용 코드는 다음과 같습니다.
완전한.
우리의 응용 프로그램으로 돌아가서 우리는 단지 스크립트를 추가 할 것입니다.
따라서 종이를 복사하여 원본을 하울러로 변경하면 아무런 문제없이 OK가로드되는지 확인하십시오.
완전한.
다음은 실제로 첫 번째 울부 짖음을 만들어 보겠습니다.
그래서 hower에서이 코드를 다시 복사 해 봅시다.
이 첫 번째 기사를 여기로 가져 가서 가장 먼저 시작하겠습니다.
그래서 우리는 바로 여기에서 할 것이고, VAR의 사운드 동등한 방법을 알고 나서 우리는 단지 하나의 파일에 넣고 우리가 보는 첫 번째 파일을 만들어 보겠습니다.
그래서 버블은 MP 3을 얻었습니다. 그래서 사운드 디렉토리 내에서 스터드 MP 3을 버립니다.
소리.
거품을 버리십시오.
나는 거품을 사용하는 것을 이미 잊었다.
됐어.
복수형입니다.
너처럼 거품 소리가 나.
MP 3 그리고 우리가 필요한 전부입니다.
그리고 곧바로 그것을하지 않겠습니다.
그냥 만들자.
그것이 우리가해야 할 전부입니다.
그리고 나서 그것을 연주 해 봅시다.
키를 눌렀을 때 소리가 너무 작아서 정말 멋지고 단순 해 보입니다.
우리는 거기에 갈.
따라서 여러 키를 누르는 모든 키가 이제는 소리가 들립니다.
잘만되면 그것은 그렇게 성가신 was not.
다음은 다른 사운드를 추가하는 데 집중하겠습니다.
그래서 우리는 시작할 때 두 가지를 할 것입니다.
그래서 우리는 거품을 가지고 있습니다.
우리가 할 수 있도록 Clay MP3를 해보자. 이걸 복사해서 새로운 Howell과 Howell을 같게 만든다. 사운드 슬래시 점토와 P3을 할 것이다.
그리고 여기서 우리가 할 일은 if 문입니다.
이제 두 개의 키에 초점을 맞추어 보겠습니다.
가자.
그래서 if 키를 누른다면, 우리는 소리를 내고, 소리가 들리면 소리가 들리게하여 열쇠가 명확하면 소리를 내고하자.
그럼 우리도 소리를 낼거야.
그래서 어떤 키를 눌렀는지 알려면 Paperchase에서이 이벤트 객체를 여기에두고 이벤트 점 키를 사용하면됩니다.
따라서 키가 a와 같은 이벤트가 발생하면 if 문을 읽습니다.
그러면 우리는 단지 연극을 할 것입니다.
그래서 그것은 하나의 연극이고, 똑같은 일을합니다.
이벤트 도트 키가 같으면 X도 재생됩니다.
그렇게 연주하는 소리.
그래서 우리는 그것을 시도 할 수 있습니다.
따라서 키와 S만이 사물을 움직여야합니다.
그래서 나는 지금 우리에게 오류가있는 것처럼 보이는 q를 치고 있다고 말할 것입니다.
우리가 여기서 뭐하고있는거야?
소리가 정의되지 않았습니다.
여기에이 경고를 무시하십시오. 우리는 끝까지이를 고칠 것입니다.
더 복잡한 문제이지만 실제로 코드를 시작하는 데 방해가되지 않습니다.
그러나 이것은 바보 같은 오류입니다.
나는 여기서 소리를 참조하고 있었다.
우리는 더 이상 소리가 나지 않습니다.
승인.
이제는 아무것도 재생해서는 안됩니다.
대부분의 키를 치었지만 다른 키를 치고 이제는 s를가집니다.
그래서 우리에게는 ns가 있습니다.
완전한.
우리가 할 수있는 일은 이제 각자에게 하나의 색을 지정하여 이렇게 할 수 있습니다.
이것을 아래쪽의 같은 키의 아래쪽으로 옮겨 놓으십시오. 그러나 밀기 전에 우린 그 소리가 나는 연극이 있고 우리가 새로운 원형 도트 채색의 색을 같게 설정할 수 있다면 우리는 이와 같은 것을 가질 수 있습니다. 그러면 우리는 그것을 줄 수 있습니다. 색깔은 3 5 0을보고 같은 것을합니다.
우리가 S를 누르고 다른 색깔로 16 A 0 8 5처럼하면 우리는 다른 것을 가질 수 있고 희망적으로 당신 자신을 생각하고있을 것입니다. 아마 이것을하는 가장 좋은 방법은 아닙니다.
2 명과 20 명은 20 대 30 대 50 대 정도는 괜찮을 것입니다.
우리는 전체 키보드와 모든 다른 문자를 사용합니다.
그것은 많은 코드가 될 것입니다.
하지만 지금 당장 당신을 보여 드리죠.
대부분의 색이나 대부분의 키는 소리를 내지 않습니다.
그들은 우리에게 같은 색깔을줍니다.
이제 UPS가 있다면 두 개의 키를 누르십시오. 약간 다른 색을 주면 파란색을줍니다.
당연히 여기에서 골랐던 색상은 어렵습니다.
변화가 자주색으로 바뀌는 것을보기가 어렵습니다.
기술적으로 우리는 이것을 다른 것으로 만들어야합니다.
그렇다면 키가 LCF인지 확인하고, if 문이 두 개인 경우 키를 확인합니다.
이 하나가 실행되고 우리는 또 다른 것을 가지고있을 것이고 만약 그것이 사실이 아니라면 엘소는 사실 일 것이지만 이것은 고려하지 않을 것입니다.
그래서 우리가 오직 하나만을 원한다면 하나의 색깔이 보라색 또는 오렌지색이되기를 원합니다.
그렇다면 우리는 그것들이 하나의 if 문에 포함되기를 원합니다. 그러나 우리는 이것을 단지 1 초 만에 바꾸기 때문에 그것은 중요하지 않습니다.
이제 여기서 새로 고침은 정상적인 키입니다.
나는 우리가 푸른 색과 두 가지 다른 소리를 얻을 때 자주색을 쳤다.
승인.
그래서 우리는 하우 슬러를 사용합니다.
이제 모든 단일 키에 대해이 작업을 수행하려고합니다. 여기에있는 것보다 훨씬 좋은 방법이 있습니다.
그래서 우리는 할 수 있기 때문에 실제로이 모든 것을 제거 할 것입니다.
앞에서 언급했듯이, 키가 B이면 모든 단일 키에 대해 if 문을 사용하고 키가 B이면 모든 단일 키에 대해 if 문을 사용합니다.
하지만 그건 좋은 습관이 아닙니다.
그래서 우리가 대신 할 일은 객체를 정의하는 것입니다. 우리는 그 객체를 핵심 데이터라고 부릅니다.
그리고 이것이 바로 그 모습입니다.
그래서 우리는 a와 같은 열쇠를 가질 것입니다.
그리고 a가 눌려지면 우리는 색깔이 자주색이어야하고 소리는 있어야한다고 말할 것입니다.
이 모든 것을 거기에 넣자.
그래서 잠시 후에 이걸 살펴 보겠습니다.
먼저 여기에 넣으십시오. 그러면 똑같은 일을 다시 할 수 있습니다.
그래서 눌려진 색은 초록색이어야하며 소리는 새 것이어야합니다.
어떻게 될지.
당신이하는 것과 똑같은 일을하고 소리를 내 보자. Clay는 MP3를 생각한 다음 모든 단일 키에 대해 그렇게 할 수 있었다.
그리고 네, 여기에 많은 문법이 있습니다. 그러나 장점은 우리의 모든 데이터가 정의되어있는 곳을 가지고 있고 모든 단일 키에 대해 if 문이나 별도의 조건문이 필요 없다는 것입니다.
우리가해야만하는 모든 것은 실제로 당신을 없애 버리는 이벤트 도트 키가 어디 있는지 확인하는 것입니다.
이거 받아라.
눌려진 키 이벤트 도트 키.
그게 J.의 편지라고 가정 해 봅시다.
그렇다면 우리는 그것을 가져 와서 핵심 데이터에 연결하면 보라색 사운드를 얻을 수 있습니다.
이 소리 지.
그래서 내가 무슨 뜻인지 보여 드리겠습니다.
이 두 예제를 사용하여 더 명확하게 설명해 드리겠습니다.
그래서 우리는 n을 가지고 있습니다.
그리고 색상은 너무 노란색이어서 소리가 날 수 있습니다.
그 밖의 무엇을 우리는 가지고 있습니다.
색종이를하자.
완전한.
이 후행 쉼표를 제거하십시오.
우리는 지금 이것을 제거 할 수 있습니다. 우리는 이것을 약간 변경해야 할 것입니다. 그 다음에 할 일은 그 이벤트 덕 키를 가져와 우리의 핵심 데이터에 연결하는 것입니다.
그래서 우리는 이렇게 할 수 있습니다.
중요한 데이터 괄호 이벤트 키 그리고 만약 우리가 여기에 우리에게이 모든 것을 주면서 사건이라면 우리가 시작할 수 있도록 우리는 색을 칠할 수 있습니다.
우리가 새로운 원을 그리기 전에 우리가 할 일은 새로운 원 채우기 색이 주요 데이터 이벤트 키 색상과 같다고 말하는 것입니다.
그래서 어두운 키를 되풀이하는 것은 편지입니다.
우리의 경우에 우리는 그것이 편지인지 확실히 할 것입니다.
엄밀히 말하자면 숫자 또는 시프트 탭 일 수 있지만 키를 눌렀습니다.
그런 다음 핵심 데이터에 연결합니다.
우리는이 모든 것을 꺼냅니다.
사용자가를 누른 경우 eventime 키가 a이면 우리는 보라색을주는 어두운 색을하고 있습니다.
그래서 우리는 새로운 원을 그리지 만 보라색으로 채워 넣습니다.
이벤트 Duck Key가 통지이지만 if 명령문을 사용하지 않아도됩니다.
따라서 우리는 터키가 이런 조치를 취할 것인지 여부를 물을 필요가 없다면 그렇게 할 필요는 없습니다.
무엇이든 상관 없습니다.
우리가이 하나의 사전이나이 데이터 소스를 정의했기 때문에 물론 문제가 있습니다.
이것은 현재 S와 D에만 적용됩니다.
따라서 새로 고침하여 구문 오류가 없는지 확인해 보겠습니다.
우리는 색상을 읽을 수 없거나 제대로 정의되지 않은 색상으로 읽을 수 없으며 구문 오류가 아닙니다.
그것이 내가 예상하고있는 오류입니다.
그래서 내가 보여줄거야.
나는 좋은 언론을 누를 것이다.
하지만 지금 나는 Q를 누른다. 그리고 우리에게는 문제가있다.
이것은 Q의 정의되지 않은 핵심 데이터가 존재하지 않기 때문입니다.
우리는 S와 D가 있습니다.
그래서 그것이 문제입니다.
그것을 고치는 방법은 간단합니다.
우리가 할 일은 바로 여기에 있는지 확인하는 것입니다.
주요 데이터 브래킷 이벤트 Docky 인 경우 해당 키 언론의 맨 위.
그래서 이것이 사실인지 기억하십시오 기본적으로 존재한다면 우리는이 모든 것을 할 것입니다.
그렇지 않으면 우리는 시작할 아무 것도하지 않을 것입니다.
나는 실제로 아무것도하지 않을 것입니다.
그래서 지금 우리의 애플은 S와 D를 누르면 아무것도하지 않거나 아무것도하지 않을 것입니다.
다시 돌아가서 이제는 제대로 작동하는지 확인하십시오.
Q 아무 일도 일어나지 않습니다.
나는 열쇠를 잔뜩하고있어.
지금 나는 a를 쳤다.
그리고 그것은 작동합니다.
S와 D하지만 다른 키는 아무것도하지 않습니다.
큰.
이제 소리를 들려 봅시다.
그래서 그것은 또한 멋지고 단순합니다.
우리는 단지 중요한 데이터 이벤트 키 사운드가 필요하고 나는 왜 소리가 되어야만했던이 두 가지 사운드를 명명했는지 확신 할 수 없습니다.
저기 우리는 그 점잖은 놀이를합니다.
Venki 플러그를이 보도 자료 D에 넣으십시오.
우리는이 물건을 얻는다.
우리는 그것에 소리를 낸다.
우리는 그때 우리가 이전과 같이 놀 수있는 이것을 얻습니다.
좋아, 한번 해보자.
A로서.
그리고 다른 키들은 아무 것도하지 않습니다.
완전한.
그래서 우리가 여기서해야 할 일은 단지 그녀의 다른 모든 열쇠를 추가하는 것입니다. 그리고 그것은 당신이 나를 처음부터 타이핑하는 것을 보는 것이 정말로 고통 스러울 것입니다.
미리 준비해 봤는데 다운로드 한 파일을 줬어.
나는 하루 하루를 불렀다.
예.
그래서 우리가 그것을 열면 모든 문자 키를 가지고있는 거대한 객체 일뿐입니다.
그래서 우리는 q w e r을가집니다.
그들은 어떤 순서로도 실제로 있지 않습니다.
글쎄 그들은 색과 소리까지 특별한 순서는 없습니다.
방금 무작위로 선택했는데 각각 색이 있습니다.
따라서 이것을 복사하여 여기에있는 내용을 대체하면 핵심 데이터라고 부를 수 있습니다.
우리는 이제 적어도 하나의 알파벳 키마다 모든 단일 키에 대해 색을 표시하는 사전을 제공했습니다.
그리고 우리는 그것을 사용할 수 있습니다.
우리는 코드를 전혀 변경할 필요가 없습니다.
따라서 우리가 탭에 추가하고자하는 숫자 키와 Shift 및 Esc를 추가하고이 객체에 추가 속성을 추가하는 것이면 정말 좋습니다.
그러니 새로 고치려고 시도해 봅시다.
완전한.
괜찮아.
그러니 여기서 벗어나지 마라.
꽤 재미있다.
승인.
좋아. 충분 해.
그래서 우리는 많은 것을 다루었지만 결국 우리가 한 모든 것은 우리가 원을 만들 때 발견 한 코드를 취하는 것입니다.
색상을 변경하기 위해 원을 애니메이션화 한 코드를 사용했습니다.
우리는 이벤트를 수행하는 코드를 발견했습니다.
그래서 열쇠를 누를 때.
그리고 우리는 이것을 우리가 음악을 연주하기 위해 찾은 다른 코드와 결합시킵니다.
그리고 함께하면 멋진 것들을 만들 수 있고 여기에서 할 수있는 일이 훨씬 더 많습니다.
그리고 우리는 100 % 완성되지 않았습니다.
우리는 기능이 완성되어 새로운 기능을 추가하지 않고 다른 기능을 추가하지 않을 것입니다.
그러나 당신이 콘솔을 열면 우리는이 모든 것들이 SML HTP 요청 cross origin 파일을로드 할 수 없음을 알게 될 것입니다.
ㅋ ㅋ ㅋ ㅋ ㅋ ㅋ.
나는 다음 비디오에서 그것을 다룰 것이다.
왜 그런 일이 일어나는지, 어떻게 해결할 수 있는지 이야기하십시오.
그리고 우리가 할 다른 것은 이것을 리팩토링하는 작은 방법에 대해 이야기하는 것입니다. 왜냐하면 지금 내가 누를 때마다 원의 배열에 새로운 원을 추가하고 결코 그 배열에서 제거하지 않을 것이기 때문입니다.
그래서 지금 거기에 10000 명이있을 것입니다.
글쎄 나는하지는 않지만 100이 될 수도 있고 200이 있고 우리는 그 모든 것을 반복하고있다.
그들이 너무 작기 때문에 우리가 원을 보지 않더라도.
그래서 우리는 다음 비디오에서 그것들을 제거하기 위해 작은 변화를 만들 것입니다.
그러나 다시 우리는 기능이 완성되었습니다. 그래서 당신이 이것을 좋아하고 당신이 계속하고 싶다는 것을 보지 않는다면.
다음 단위로 이동하십시오.