Slate 함수

Slate 함수는 Handlebars로 참조할 수 있는 질의 결과, 변수와 위젯 속성을 JavaScript로 처리합니다. 문자열 해석이나 데이터 변환처럼 가벼운 처리를 하고 결과를 다른 구성 요소에 전달하는 데 사용합니다.

Slate 안에서만 사용하는 함수이며 플랫폼 전반의 Foundry 함수와 구분합니다. Foundry 함수는 Slate Platform editor에서 연결합니다.

실행 범위와 순서

Slate 함수는 DOM이나 Slate의 화면 상태를 직접 조작하지 않으며 함수 내부 상태를 다음 실행까지 저장하지 않습니다. 앱 상태는 변수와 이벤트로 관리합니다. 별도로 구성한 OSDK 라이브러리의 온톨로지 조회와 액션 호출은 해당 API 계약을 따릅니다.

async, await와 Promise를 사용할 수 있습니다. 다만 Slate 함수들은 큐에서 하나씩 순서대로 실행합니다. 비동기 작업을 기다리는 함수가 있으면 그 함수가 끝날 때까지 다음 함수가 시작되지 않습니다.

5초 대기 예

다음은 Slate 함수 본문입니다. 5,000ms 타이머가 완료되면 Promise를 완료하고 undefined를 반환합니다. 이 대기 동안 뒤에 있는 Slate 함수도 기다립니다.

return new Promise(function (resolve) {
  setTimeout(function () {
    resolve();
  }, 5000);
});

문서 단위 함수 라이브러리

매개변수를 받는 재사용 JavaScript 함수를 문서 단위 라이브러리에 둘 수 있습니다. 반복되는 처리를 복사하는 대신 이 라이브러리로 분리합니다. Re-run All Function 버튼으로 라이브러리에 의존하는 함수들을 다시 실행하여 결과를 갱신할 수 있습니다.

Slate는 Lodash, Math.js, Moment, Numeral과 es6-shim을 기본 제공하며 사용자 JavaScript 라이브러리도 추가할 수 있습니다.

ES6 문법을 사용하려면 모든 대상 사용자의 브라우저가 해당 문법을 지원해야 합니다.

두 위젯의 숫자 더하기

숫자 selectedValue를 갖는 Dropdown 두 개를 lhs, rhs라는 이름으로 구성하고 addNumbers Slate 함수를 만듭니다. 다음은 Handlebars 참조를 포함한 함수 본문입니다.

return {{lhs.selectedValue}} + {{rhs.selectedValue}};

텍스트 위젯에서 {{addNumbers}}를 참조하여 합계를 표시합니다. 선택값이 문자열인 구성에서는 숫자로 변환한 뒤 계산해야 합니다.

Functions editor 안에서는 Handlebars helper를 사용할 수 없습니다. 값 참조와 JavaScript 처리를 사용합니다.

열 지향 질의 결과 변환

다음은 asteroids 질의의 설명용 입력입니다. 각 열이 배열이며 같은 인덱스가 같은 행에 해당합니다.

{"id":[6,7,8],"name":["Hebe","Iris","Flora"],"diameter":[185.18,199.83,135.89]}

함수는 이름에 ID를 덧붙이고 지름에 3.14를 곱해 원주 근사값을 만듭니다. 입력의 각 열은 같은 길이이며 diameter는 숫자 배열입니다.

var asteroids = {{asteroids}};
var formattedNames = [];
var circumference = [];

for (var i = 0; i < asteroids.name.length; i++) {
  formattedNames.push(formatName(asteroids.name[i], asteroids.id[i]));
  circumference.push(asteroids.diameter[i] * 3.14);
}

return {
  name: formattedNames,
  diameter: asteroids.diameter,
  circumference: circumference
};

function formatName(name, id) {
  return name + " (" + id + ")";
}

이름은 Hebe (6), Iris (7), Flora (8)이 됩니다. 원주 근사값을 소수 넷째 자리까지 표시하면 각각 581.4652, 627.4662, 426.6946입니다. 행 배열과 열 배열을 서로 바꾸는 경우에는 행과 열 스키마 변환을 사용합니다.