화면을 아래로 스크롤한 캡처이다. 빨간 번호 3은 위 캡처에서 보이지 않던 구성요소이다.
코드 안의 회색 줄은 원문 영어 주석이고, 파란 줄은 그 영어 주석의 번역이며, 연분홍 줄은 코드가 하는 일의 설명이다.
| 번호 | 이름 | 종류 | CL 코드 원문, 번역, 설명 |
| 1 | graph | 그래프 | # Creates a number that matches the amount of time passed
# since the button has been pressed.
▷ 버튼을 누른 뒤 지난 시간과 같은 숫자를 만든다.
number("t_0"): button.timeSincePress()
▶ 그래프의 변수 t_0은 행동 버튼 button을 누른 뒤 지난 시간(button.timeSincePress())으로 한다.
number("이름")은 그래핑 계산기 안의 변수 값을 정한다. timeSincePress()는 버튼을 누른 뒤 지난 시간(초)을 알려 주며, 재설정 링크를 누르거나 같은 화면의 구성요소를 선택하거나 편집하면 0으로 돌아가고 기본으로 10초까지 센다.
# Creates numbers that reflect the numeric values in
# each of the two cells in the column.
▷ 그 열의 두 셀에 있는 숫자 값을 반영하는 숫자들을 만든다.
number("a"): table.cellNumericValue(1,1)
▶ 그래프의 변수 a는 표 table의 1행 1열 셀의 숫자 값(table.cellNumericValue(1,1))으로 한다.
cellNumericValue(행, 열)은 그 셀을 계산한 숫자 값을 가져온다. 학생이 "2 + 2"를 입력하면 4를 돌려준다.
number("p"): table.cellNumericValue(1,2)
▶ 그래프의 변수 p는 표 table의 1행 2열 셀의 숫자 값(table.cellNumericValue(1,2))으로 한다.
|
| 2 | table | 표 | # Disables the ability to focus on these cells
# while the animation is playing.
▷ 애니메이션이 재생되는 동안에는 이 셀들에 선택(포커스)할 수 없게 한다.
cellEditable(1,1): button.timeSincePress() = 0
▶ 1행 1열 셀의 편집 가능 여부(cellEditable)는 행동 버튼 button을 누른 뒤 지난 시간이 0과 같은지 비교한 결과(button.timeSincePress() = 0)로 한다.
cellEditable(행, 열)은 학생이 그 셀을 편집할 수 있는지를 정하며 다른 모든 결정 방식을 덮어쓴다. timeSincePress()는 버튼을 누른 뒤 지난 시간(초)을 알려 주며, 재설정 링크를 누르거나 같은 화면의 구성요소를 선택하거나 편집하면 0으로 돌아가고 기본으로 10초까지 센다. 코드 주석에 따르면 애니메이션이 재생되는 동안, 즉 버튼을 누른 뒤에는 이 셀을 편집할 수 없다.
cellEditable(1,2): button.timeSincePress() = 0
▶ 1행 2열 셀의 편집 가능 여부(cellEditable)는 같은 조건 button.timeSincePress() = 0으로 한다.
|
| 3 | button | 행동 버튼 | # Resets the button when the point is moved.
▷ 점을 움직이면 버튼을 재설정한다.
resetOnChange: "${graph.number("x_1")}${graph.number("y_1")}"
▶ 행동 버튼의 변경 시 자동 재설정(resetOnChange)은 그래프 graph의 변수 x_1의 값과 변수 y_1의 값을 이어 붙인 글자 "${graph.number("x_1")}${graph.number("y_1")}"로 한다.
resetOnChange는 글자 값을 받아 그 값이 바뀌면 구성요소를 재설정한다. ${ }는 글자 안에 변수의 값을 끼워 넣는 표기이고, 그 안의 "x_1", "y_1"은 number(...)에 넘기는 변수 이름이다.
# Disables the button once it's been pressed and until it is reset.
▷ 버튼을 한 번 누르면 재설정될 때까지 버튼을 비활성화한다.
disabled: this.timeSincePress() > 0
▶ 행동 버튼의 비활성화 조건(disabled)은 이 버튼을 누른 뒤 지난 시간이 0보다 큰지 비교한 결과(this.timeSincePress() > 0)로 한다.
disabled는 참이면 버튼을 회색으로 만들고 누를 수 없게 한다.
# Adds a link to reset the button after the animation has completed
# The empty string for the "otherwise" condition is an indicator that
# the reset link will not be shown when the "otherwise" condition is in use.
▷ 애니메이션이 끝난 뒤 버튼을 재설정하는 링크를 추가한다. "otherwise" 조건에서 빈 글자를 쓴 것은 "otherwise" 조건일 때 재설정 링크가 보이지 않는다는 표시이다.
resetLabel: when graph.number("a_{nimComplete}") = 1 "Reset" otherwise ""
▶ 행동 버튼의 재설정 라벨(resetLabel)은 그래프 graph의 변수 a_{nimComplete}가 1이면 "Reset"(재설정), 그렇지 않으면 빈 글자로 한다.
resetLabel은 재설정 링크에 표시할 글자를 정하고, when은 조건을 차례로 확인해 처음 맞는 값을 쓴다.
|