152 lines
4.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Unity 상태 수신 설정</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 10px;
background-color: #2d2d30;
color: #ffffff;
}
.container {
padding: 10px;
}
h2 {
color: #2196F3;
margin-bottom: 20px;
}
.setting-group {
margin-bottom: 15px;
}
label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}
input, select {
width: 100%;
padding: 8px;
background-color: #3c3c3c;
border: 1px solid #555;
border-radius: 4px;
color: #ffffff;
box-sizing: border-box;
}
.status {
background-color: #1e1e1e;
padding: 10px;
border-radius: 4px;
margin-top: 15px;
font-size: 12px;
}
.connected {
color: #4CAF50;
}
.disconnected {
color: #f44336;
}
</style>
</head>
<body>
<div class="container">
<h2>Unity 상태 수신</h2>
<div class="setting-group">
<label for="displayMode">표시 모드:</label>
<select id="displayMode">
<option value="status">연결 상태</option>
<option value="hp">플레이어 HP</option>
<option value="score">점수</option>
<option value="level">레벨</option>
</select>
</div>
<div class="setting-group">
<label for="updateInterval">업데이트 간격 (초):</label>
<input type="number" id="updateInterval" min="1" max="60" value="5">
</div>
<div class="status">
<strong>연결 상태:</strong><br>
<span id="connectionStatus" class="disconnected">연결 안됨</span><br><br>
<strong>기능:</strong><br>
• Unity에서 게임 상태를 실시간으로 받아옵니다<br>
• 버튼을 누르면 최신 상태를 요청합니다<br>
• WebSocket: ws://localhost:15732
</div>
</div>
<script>
// StreamDock Property Inspector API
var websocket = null;
var uuid = null;
var actionInfo = {};
function connectSocket(inPort, inUUID, inRegisterEvent, inInfo, inActionInfo) {
uuid = inUUID;
actionInfo = JSON.parse(inActionInfo);
websocket = new WebSocket('ws://localhost:' + inPort);
websocket.onopen = function() {
var json = {
event: inRegisterEvent,
uuid: inUUID
};
websocket.send(JSON.stringify(json));
// 연결 상태 확인
checkUnityConnection();
};
}
// Unity 연결 상태 확인
function checkUnityConnection() {
fetch('http://localhost:15733/status')
.then(response => response.json())
.then(data => {
const statusElement = document.getElementById('connectionStatus');
if (data.unityConnections > 0) {
statusElement.textContent = '연결됨';
statusElement.className = 'connected';
} else {
statusElement.textContent = '연결 안됨';
statusElement.className = 'disconnected';
}
})
.catch(() => {
const statusElement = document.getElementById('connectionStatus');
statusElement.textContent = '서버 없음';
statusElement.className = 'disconnected';
});
}
// 설정 저장
function saveSettings() {
const settings = {
displayMode: document.getElementById('displayMode').value,
updateInterval: document.getElementById('updateInterval').value
};
if (websocket) {
const json = {
event: 'setSettings',
context: uuid,
payload: settings
};
websocket.send(JSON.stringify(json));
}
}
// 이벤트 리스너
document.getElementById('displayMode').addEventListener('change', saveSettings);
document.getElementById('updateInterval').addEventListener('input', saveSettings);
// 주기적으로 연결 상태 확인
setInterval(checkUnityConnection, 3000);
</script>
</body>
</html>