Creo.JS 스크립트 사용 방법?

웹 페이지가 로딩될 때, 우리는 다양한 요소들이 제자리를 잡고, 스크립트들이 실행되기를 기대합니다. 하지만, Creo.JS 스크립트는 일반적인 웹 페이지 스크립트와는 조금 다르게 작동합니다.

웹 페이지가 완전히 로드되면 onload 이벤트가 발생합니다. 이 이벤트를 감지하여 특정 코드를 실행하도록 설정할 수 있습니다. 하지만, Creo.JS 스크립트는 onload 이벤트가 발생하기 전에 로딩을 시작하고, onload 이벤트가 발생한 후에도 로딩이 완료되지 않을 수 있습니다.

Creo.JS 스크립트가 완전히 로드되지 않은 상태에서 Creo.JS와 관련된 코드를 실행하면 오류가 발생할 수 있습니다. 
마치 건물이 완공되기도 전에 전기 배선을 연결하려고 하는 것과 같습니다.

이러한 문제를 해결하기 위해 CreoJS.$ADD_ON_LOAD 이벤트가 존재합니다. 이 이벤트는 Creo.JS 스크립트가 완전히 로드된 후에만 발생합니다. 따라서, Creo.JS와 관련된 코드를 CreoJS.$ADD_ON_LOAD 이벤트 핸들러 안에 작성하면 오류를 방지할 수 있습니다.

웹 페이지가 Creo.JS 초기화 및 종료 이벤트를 기다리도록 하려면 각각
CreoJS.$ADD_ON_LOAD 및 CreoJS.$ADD_ON_UNLOAD 이벤트 리스너를 설정하십시오.

아래 html 파의 동작 순서 입니다

웹 페이지가 로드됩니다.
Creo.JS 라이브러리와 브라우저 통합 스크립트가 로드됩니다.
CreoJS.$ADD_ON_LOAD 이벤트가 발생하면 initialize 함수가 실행됩니다 (CreoJS 로딩이 완료된 시점).
initialize 함수는 getActiveModelName 함수를 호출하여 활성화된 모델의 이름을 가져옵니다.
모델 이름은 <span> 태그에 표시됩니다.

<html>
<head>
<script src="creojs.js"></script>
<script type="text/creojs" src="browser.creojs"></script>
<script type="text/creojs">
	function getActiveModelName () {
	return pfcGetCurrentSession ().GetActiveModel ().FileName;
	}
</script>
</head>

<body onload="CreoJS.$ADD_ON_LOAD (initialize)">
<b>Active model:</b> <span id="MODELNAME"></span>
<script>
	function initialize () {
	CreoJS.getActiveModelName ()
	.then (function (name) {
	MODELNAME.innerHTML = name;
	})
	}
</script>
</body>
</html>

코드를 부분별로 설명해 드리겠습니다.

1. <head> 부분:

<script src="creojs.js"></script>: Creo.JS 라이브러리를 포함합니다. Creo.JS를 사용하기 위해서는 이 스크립트가 반드시 필요합니다.
<script type="text/creojs" src="browser.creojs"></script>: Creo 브라우저 통합 스크립트를 포함합니다. Creo 환경과 웹 페이지 간의 연결을 담당합니다.
<script type="text/creojs"> ... </script>: CreoJS 스크립트 블록입니다. 이 블록 안의 코드는 Creo 환경 내에서 실행됩니다.
- function getActiveModelName () { ... }: 현재 활성화된 모델의 이름을 반환하는 함수입니다. pfcGetCurrentSession()은 Creo의 현재 세션을 가져오고, GetActiveModel()은 활성화된 모델을 가져오며, FileName은 모델의 파일 이름을 반환합니다.

2. <body> 부분:

<body onload="CreoJS.$ADD_ON_LOAD (initialize)">: 웹 페이지가 로드될 때 initialize 함수를 실행하도록 설정합니다. 중요한 점은 onload 이벤트 핸들러에서 CreoJS.$ADD_ON_LOAD를 호출하여 Creo.JS가 완전히 로드된 후에 initialize 함수가 실행되도록 하는 것입니다. 앞서 설명했듯이, 일반적인 onload 이벤트는 CreoJS 로딩이 완료되기 전에 발생할 수 있으므로, CreoJS.$ADD_ON_LOAD를 사용하는 것이 안전합니다.
<b>Active model:</b> <span id="MODELNAME"></span>: "Active model:" 텍스트와 모델 이름을 표시할 빈 <span> 태그를 만듭니다. id가 "MODELNAME"인 이 요소에 JavaScript를 사용하여 모델 이름을 표시할 것입니다.
<script> ... </script>: JavaScript 블록입니다. 이 블록 안의 코드는 웹 브라우저에서 실행됩니다.
- function initialize () { ... }: Creo.JS가 완전히 로드된 후 실행되는 함수입니다.
  - CreoJS.getActiveModelName(): 위에서 정의한 CreoJS 함수 getActiveModelName을 호출하여 활성화된 모델의 이름을 가져옵니다. 이 함수는 Promise를 반환합니다.
  - .then(function (name) { ... }): Promise가 성공적으로 완료되면 실행되는 함수입니다. name 인자는 getActiveModelName 함수가 반환한 모델 이름입니다.
  - MODELNAME.innerHTML = name;: 모델 이름을 id가 "MODELNAME"인 <span> 태그의 내용으로 설정하여 웹 페이지에 표시합니다.

▣ CreoJS.$ADD_ON_UNLOAD 이벤트

CreoJS.$ADD_ON_UNLOAD: 웹 페이지가 닫히거나 다른 페이지로 이동할 때 실행되는 정리 작업용 코드입니다. 예를 들어, 사용했던 Creo 관련 기능들을 끄거나, 사용했던 메모리 등을 반환하는 코드를 작성할 수 있습니다. 마치 집을 나설 때 전등을 끄고 문을 잠그는 것과 비슷합니다.
컨텍스트(Context): Creo.JS 엔진 내에서 각 웹 페이지가 사용하는 독립적인 공간이라고 생각하면 됩니다. 각 페이지는 자신만의 공간을 가지고 있으며, 이 공간은 페이지가 로드될 때 만들어지고 언로드될 때 사라집니다. 마치 각 방이 독립적인 공간을 가지는 것과 같습니다.
세션 스토리지(Session Storage): 여러 웹 페이지가 공유할 수 있는 전역적인 저장 공간입니다. Window.sessionStorage와 비슷하게, 웹 페이지 간에 데이터를 교환하거나 공유할 때 사용될 수 있습니다. 마치 거실처럼 여러 사람이 함께 사용하는 공간과 같습니다.

저작자표시 비영리 변경금지

'JavaScript For Creo' 카테고리의 다른 글

babylon.js 테스트 (0)	2025.02.07
Babylon.js & Creo (2)	2025.02.07
browser_test.html (0)	2025.02.06
자비스크리트 예제 사이트 (0)	2025.02.06
자바스크립트 예시 #1 (0)	2025.02.05