핵심 API
이 문서에서는 EntryJS의 핵심 API들을 소개합니다.
목록
프로젝트
이벤트
StateManager
Playground
Toast
기타
프로젝트
Entry.init
EntryJS를 초기화하고, Entry 워크스페이스를 페이지에 불러옵니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
container | DOM | EntryJS가 로드될 HTML 컨테이너 DOM 입니다 | ||
options | initOptions | 워크스페이스를 띄울 때 사용할 options |
Entry.init(document.getElementById('workspace'), { |
Entry.loadProject
저장된 프로젝트 데이터를 불러와서 현재 작업 환경에 적용하는 데 사용됩니다. 이 함수는 특정 프로젝트 파일이나 데이터베이스에서 프로젝트 정보를 읽어 현재 환경에 로드합니다. loadProject는 사용자가 이전에 작업했던 프로젝트를 계속해서 작업하고자 할 때 사용됩니다.
프로젝트 데이터는
Entry.exportProject
로 추출합니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
project | project | load할 프로젝트 데이터 |
Entry.loadProject(); |
Entry.exportProject
현재 작업 중인 프로젝트의 데이터를 외부 파일로 저장하거나 다른 형식으로 내보내는 데 사용됩니다. 이 함수의 주된 목적은 사용자가 작업한 프로젝트를 보존, 공유, 또는 다른 환경에서 사용할 수 있도록 하는 것입니다. exportProject를 통해 생성된 파일은 일반적으로 프로젝트의 모든 정보와 설정을 포함하며, 나중에 loadProject 함수를 사용하여 다시 불러올 수 있습니다.
- Returns: Project Data
const project = Entry.exportProject(); |
Entry.clearProject
현재 작업 중인 프로젝트의 모든 데이터를 비우고 초기화하는 데 사용됩니다. 이 함수의 주된 목적은 현재 프로젝트의 상태를 완전히 초기 상태로 되돌리는 것이며, 모든 설정, 데이터, 작업 내용 등을 제거합니다. 이는 새 프로젝트를 시작하기 전이나, 작업 환경을 처음부터 다시 설정하고자 할 때 유용합니다.
Entry.clearProject(); |
Entry.launchFullScreen
EntryJS 환경을 전체 화면 모드로 전환하는 데 사용됩니다. 이 함수는 웹 페이지의 특정 요소나 전체 페이지를 전체 화면으로 확장하여 사용자에게 더 몰입감 있는 환경을 제공합니다. 내부적으로 HTML5의 requestFullscreen API를 호출하여 이 기능을 구현합니다.
Entry.launchFullScreen(); |
Entry.exitFullScreen
전체 화면 모드에서 일반 화면 모드로 돌아가는 데 사용됩니다. 사용자가 전체 화면 모드를 종료하고 싶을 때 이 함수를 호출하여 원래의 화면 상태로 복귀할 수 있습니다. 내부적으로 exitFullscreen API를 호출하여 이 기능을 구현합니다.
Entry.exitFullScreen(); |
Entry.getStartProject
시작 프로젝트(기본 프로젝트)를 로드하고 반환하는 메서드입니다. 이 함수는 특히 새로운 사용자에게 기본적인 프로젝트 템플릿을 제공하거나, 사전에 정의된 학습 자료를 기반으로 프로그래밍 환경을 초기화할 때 유용합니다.
- Returns: Project Data
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
mediaFilePath | string | 프로젝트 내 미디어 파일에 접근하기 위한 경로의 접두사입니다. 이 값에 따라, 프로젝트에서 사용하는 모든 미디어 자원의 경로가 조정됩니다. |
const mediaFilePath = "/assets"; // 미디어 파일 접근 경로의 접두사 설정 |
Entry.captureInterfaceState
EntryJS 환경에서 현재의 인터페이스 상태를 캡처하고 그 상태 정보를 객체 형태로 반환하는 함수입니다. 이 메서드는 특히 사용자의 작업 환경(워크스페이스의 블록 메뉴 크기, 스테이지의 크기, 현재 선택된 오브젝트 등)을 저장하고, 나중에 이 상태를 Entry.loadInterfaceState 메서드를 사용하여 복원할 때 필요한 정보를 제공합니다.
- Returns: interfaceState
const interfaceState = Entry.captureInterfaceState(); |
Entry.loadInterfaceState
Entry.captureInterfaceState 메서드를 통해 캡처된 EntryJS 환경의 인터페이스 상태를 복원하는 함수입니다. 이 메서드는 사용자가 이전에 저장한 워크스페이스의 블록 메뉴 크기, 스테이지의 크기, 현재 선택된 오브젝트 등의 정보를 다시 로드하여, 사용자의 작업 환경을 이전 상태로 되돌립니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
interfaceState | interfaceState | 사용자의 작업 환경에 대한 정보를 포함하는 데이터 |
Entry.loadInterfaceState(interfaceState); |
이벤트
Entry.addEventListener
EntryJS 환경 내에서 특정 이벤트를 감지하고, 해당 이벤트가 발생했을 때 실행될 콜백 함수를 등록하는 데 사용됩니다.
자세한 사용법은 Entry Event 사용법을 참고하세요.
지원되는 Event 목록은 Entry Event 목록을 참고하세요.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
eventName | string | 감지하려는 이벤트의 이름입니다 | ||
callback | function | 이벤트가 발생했을 때 실행될 콜백 함수입니다. 이 함수는 이벤트에 관련된 데이터를 매개변수로 받을 수 있으며, 이벤트에 대응하는 특정 작업을 수행합니다 |
// 프로젝트 실행 이벤트에 대한 리스너 등록 |
Entry.dispatchEvent
EntryJS 환경 내에서 특정 이벤트를 수동으로 발생시키는 데 사용됩니다. 이 메서드를 사용하여 사용자 정의 이벤트를 생성하고, 이를 통해 애플리케이션의 다른 부분에서 반응하도록 할 수 있습니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
eventName | string | 발생시키려는 이벤트의 이름입니다 | ||
…args | mixed | 이벤트 핸들러로 전달될 추가 매개변수입니다. 이벤트 리스너 함수에서 이 매개변수를 사용하여 이벤트와 관련된 데이터를 처리할 수 있습니다. |
Entry.dispatchEvent('customEvent', arg1, arg2); |
Entry.removeEventListener
이전에 Entry.addEventListener를 통해 등록된 특정 이벤트 리스너를 제거하는 데 사용됩니다. 이 메서드를 사용함으로써, 더 이상 필요하지 않은 이벤트 리스너를 정리하여 리소스를 절약하고, 의도치 않은 이벤트 반응을 방지할 수 있습니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
eventName | string | 리스너를 제거하고자 하는 이벤트의 이름입니다 | ||
callback | function | 제거하고자 하는 콜백 함수입니다 |
Entry.removeEventListener('customEvent', eventHandler); |
Entry.removeAllEventListener
지정된 이벤트에 연결된 모든 이벤트 리스너를 제거하는 데 사용됩니다. 이 메서드는 특정 이벤트와 관련된 모든 리스너를 일괄적으로 제거할 때 유용합니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
eventName | string | 감지하려는 이벤트의 이름입니다 |
Entry.removeAllEventListener('customEvent'); |
StateManager
Entry.stateManager.canRedo
사용자가 수행한 마지막 작업 이후에 다시 실행(재실행)할 수 있는 작업이 있는지 여부를 판단하는 함수입니다.
- Returns: boolean
const canRedo = Entry.stateManager.canRedo(); |
Entry.stateManager.canUndo
사용자가 수행한 마지막 작업을 되돌릴(undo) 수 있는지 여부를 판별하는 함수입니다.
- Returns: boolean
const canUndo = Entry.stateManager.canUndo(); |
Entry.stateManager.clear
사용자의 작업 이력을 관리하는 stateManager 객체 내의 모든 실행 취소(undo) 및 재실행(redo) 기록을 초기화하는 함수입니다.
Entry.stateManager.clear(); |
Entry.stateManager.getUndoStack
사용자의 작업 이력을 관리하는 데 사용되며, 사용자가 수행한 모든 작업을 되돌릴 수 있는 ‘되돌리기(Undo)’ 스택의 현재 상태를 반환합니다.
- Returns: undo stack
const undoStack = Entry.stateManager.getUndoStack(); |
Entry.stateManager.redo
사용자가 이전에 실행 취소한(undo) 마지막 작업을 다시 실행하는 기능을 제공합니다.
Entry.stateManager.redo(); |
Entry.stateManager.undo
사용자가 이전에 수행한 작업을 되돌리는 기능을 제공합니다. 이 메서드를 사용하면, 지정된 횟수만큼 사용자의 최근 작업을 순차적으로 취소할 수 있습니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
count | number | ✔️ | 1 | 되돌릴 작업의 횟수를 나타내는 숫자입니다. 이 매개변수가 지정되지 않을 경우, 기본적으로 1로 간주되어 가장 최근에 수행된 작업 하나만을 되돌립니다. |
Entry.stateManager.undo(); |
Playground
Entry.playground.blockMenu.banClass
특정 블록을 블록 메뉴에서 숨기는 데 사용됩니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
className | string | 블록을 제외할 isNotFor요소 입니다. | ||
doNotAlign | boolean | ✔️ | undefined | 다시 그릴지 여부 입니다. 기본적으로는 다시 그리고 true 를 값을 주면 블록을 다시 그리지 않습니다. |
// 메세지 블록들을 숨기고 싶은 경우 |
Entry.playground.blockMenu.unbanClass
블록 메뉴에 숨긴블록을 표시하는 데 사용됩니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
className | string | 숨긴 블록을 표시할 isNotFor요소 입니다. | ||
doNotAlign | boolean | ✔️ | undefined | 다시 그릴지 여부 입니다. 기본적으로는 다시 그리고 true 를 값을 주면 블록을 다시 그리지 않습니다. |
// 숨긴 메세지 블록들을 표시하고 싶은 경우 |
Entry.playground.blockMenu.banCategory
특정 카테고리를 블록 메뉴에서 숨기는 데 사용됩니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
categoryName | string | 숨길 카테고리 명 입니다. |
// 시작 카테고리를 숨기고 싶은 경우 |
Entry.playground.blockMenu.unbanCategory
숨긴 카테고리를 블록 메뉴에서 표시하는 데 사용됩니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
categoryName | string | 표시할 카테고리 명 입니다. |
// 시작 카테고리를 표시하고 싶은 경우 |
Toast
Entry.toast.alert
사용자에게 메시지를 전달하기 위해 화면에 빨간색 경고 토스트(toast)를 띄우는 데 사용됩니다. 이 메서드는 주로 경고, 오류 메시지 또는 중요한 정보를 사용자에게 즉각적으로 알릴 때 사용합니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
title | string | ✔️ | 토스트에 표시될 제목입니다 | |
message | string | ✔️ | 사용자에게 전달하고자 하는 메시지의 내용입니다 | |
isNotAutoDispose | boolean | 이 값이 true인 경우, 토스트는 자동으로 사라지지 않고 화면에 계속 유지됩니다. false인 경우, 토스트는 약 5초 후에 자동으로 닫힙니다. |
Entry.toast.alert('경고 제목', '이것은 경고 메시지입니다.', false); |
Entry.toast.warning
사용자에게 경고 메시지를 전달하기 위해 화면에 황색 토스트를 띄우는 데 사용됩니다. 이 메서드는 사용자에게 주의를 요구하거나 경고를 제공할 때 사용됩니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
title | string | ✔️ | 토스트에 표시될 제목입니다 | |
message | string | ✔️ | 사용자에게 전달하고자 하는 메시지의 내용입니다 | |
isNotAutoDispose | boolean | 이 값이 true인 경우, 토스트는 자동으로 사라지지 않고 화면에 계속 유지됩니다. false인 경우, 토스트는 약 5초 후에 자동으로 닫힙니다. |
Entry.toast.warning('경고 제목', '주의가 필요한 상황입니다.', false); |
Entry.toast.success
사용자에게 성공 메시지를 전달하기 위해 화면에 녹색 토스트를 띄우는 데 사용됩니다. 이 메서드는 작업이 성공적으로 완료되었음을 알릴 때 주로 사용됩니다.
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
title | string | ✔️ | 토스트에 표시될 제목입니다 | |
message | string | ✔️ | 사용자에게 전달하고자 하는 메시지의 내용입니다 | |
isNotAutoDispose | boolean | false | 이 값이 true인 경우, 토스트는 자동으로 사라지지 않고 화면에 계속 유지됩니다. false인 경우, 토스트는 약 5초 후에 자동으로 닫힙니다. |
Entry.toast.success('성공 제목', '작업이 성공적으로 완료되었습니다.', false); |
기타
Entry.getKeyCodeMap
사용자의 키보드 입력을 처리할 때, 각 키에 해당하는 코드값과 그 코드값이 대응하는 문자열을 포함하는 맵을 반환하는 함수입니다. 이 함수는 키보드 이벤트를 처리하거나 키 입력에 대한 사용자 정의 로직을 구현할 때 유용하게 사용될 수 있습니다.
- Returns: keyCodeMap
const keyCodeMap = Entry.getKeyCodeMap(); |
Entry.getUpTime
Entry.init이 실행된 이후로부터 경과한 시간을 밀리초(ms) 단위로 반환하는 함수입니다. 이 메서드는 EntryJS 환경에서 애플리케이션의 실행 시간을 측정하고자 할 때 유용하게 사용될 수 있습니다.
- Returns: time(ms)
const elapsedTime = Entry.getUpTime(); |
Entry.isDefaultProject
현재 로드된 프로젝트가 EntryJS 환경에서 제공하는 기본 시작 프로젝트(getStartProject 메서드로 생성된 프로젝트)와 동일한지 여부를 검증하는 함수입니다.
- Returns: boolean
파라미터 | 타입 | 선택적 | 기본값 | 설명 |
---|---|---|---|---|
project | project | 검증할 프로젝트 데이터 |
const isDefault = Entry.isDefaultProject(); |
Entry.isMobile
현재 애플리케이션을 실행하고 있는 환경이 모바일 기기인지 아닌지를 판별하는 함수입니다. 이 메서드는 사용자의 디바이스가 모바일(스마트폰, 태블릿 등)인 경우 true를 반환하며, 그렇지 않은 경우(예: 데스크탑 컴퓨터) false를 반환합니다.
- Returns: boolean
const isMobile = Entry.isMobile(); |