const pc = new RTCPeerConnection({  
	iceServers: [{ urls: "stun:stun.l.google.com:19302" }]  
});  

const pc = new RTCPeerConnection({  
	iceServers: [  
		{ urls: "stun:stun.l.google.com:19302" },  
		// TURN 서버 추가  
		{  
			urls: "turn:your-turn-server.com:3478",  
			username: "user",  
			credential: "password"  
		}  
	]  
});  

pc.addEventListener("icecandidate", (event) => {  
	if (event.candidate) {  
		signalingChannel.send({  
			type: "candidate",  
			candidate: event.candidate  
		});  
	}  
});  

pc.addEventListener("track", (event) => {  
	const remoteVideo = document.querySelector("#remoteVideo");  
	remoteVideo.srcObject = event.streams[0];  
});  

pc.addEventListener("connectionstatechange", () => {  
	switch (pc.connectionState) {  
		case "new":  
			console.log("연결 초기화됨");  
			break;  
		case "connecting":  
			console.log("연결 시도 중");  
			break;  
		case "connected":  
			console.log("연결 성공");  
			break;  
		case "disconnected":  
			console.log("일시적으로 끊김");  
			break;  
		case "failed":  
			console.log("연결 실패");  
			break;  
		case "closed":  
			console.log("연결 종료");  
			break;  
	}  
});  

pc.addEventListener("negotiationneeded", async () => {  
	const offer = await pc.createOffer();  
	await pc.setLocalDescription(offer);

	signalingChannel.send({ type: "offer", sdp: offer });  
});  

const stream = await navigator.mediaDevices.getUserMedia({  
	video: true,  
	audio: true  
});

stream.getTracks().forEach((track) => {  
	pc.addTrack(track, stream);  
});  

// 1. Offer 생성  
const offer = await pc.createOffer();

// 2. 내 PeerConnection에 등록  
await pc.setLocalDescription(offer);

// 3. 상대방에게 전송  
signalingChannel.send({ type: "offer", sdp: offer });  

// 1. 받은 Offer를 등록  
await pc.setRemoteDescription(receivedOffer);

// 2. Answer 생성  
const answer = await pc.createAnswer();

// 3. 내 PeerConnection에 등록  
await pc.setLocalDescription(answer);

// 4. 응답 전송  
signalingChannel.send({ type: "answer", sdp: answer });  

// 상대방의 Candidate 받기  
signalingChannel.on("candidate", async (candidate) => {  
	await pc.addIceCandidate(candidate);  
});  

// 1. PeerConnection 생성  
const pc = new RTCPeerConnection({  
	iceServers: [{ urls: "stun:stun.l.google.com:19302" }]  
});

// 2. 이벤트 리스너 등록  
pc.addEventListener("icecandidate", (e) => {  
	if (e.candidate) {  
		signalingChannel.send({ type: "candidate", candidate: e.candidate });  
	}  
});

pc.addEventListener("track", (e) => {  
	document.querySelector("#remoteVideo").srcObject = e.streams[0];  
});

pc.addEventListener("connectionstatechange", () => {  
	console.log("상태:", pc.connectionState);  
});

pc.addEventListener("negotiationneeded", async () => {  
	const offer = await pc.createOffer();  
	await pc.setLocalDescription(offer);  
	signalingChannel.send({ type: "offer", sdp: offer });  
});

// 3. 미디어 추가 (negotiationneeded 자동 발생)  
const stream = await navigator.mediaDevices.getUserMedia({  
	video: true,  
	audio: true  
});

stream.getTracks().forEach((track) => {  
	pc.addTrack(track, stream);  
});

// 4. 상대방 메시지 처리  
signalingChannel.on("offer", async (offer) => {  
	await pc.setRemoteDescription(offer);  
	const answer = await pc.createAnswer();  
	await pc.setLocalDescription(answer);  
	signalingChannel.send({ type: "answer", sdp: answer });  
});

signalingChannel.on("answer", async (answer) => {  
	await pc.setRemoteDescription(answer);  
});

signalingChannel.on("candidate", async (candidate) => {  
	await pc.addIceCandidate(candidate);  
});  

async function checkQuality() {  
	const stats = await pc.getStats();

	stats.forEach((report) => {  
		if (report.type === "inbound-rtp" && report.kind === "video") {  
			const packetsLost = report.packetsLost || 0;  
			const packetsReceived = report.packetsReceived || 0;  
			const lossRate = packetsLost / (packetsLost + packetsReceived);

			console.log(`패킷 손실률: ${(lossRate * 100).toFixed(2)}%`);

			if (lossRate > 0.05) {  
				console.warn("⚠️ 네트워크 불안정");  
			}  
		}  
	});  
}

setInterval(checkQuality, 3000);  

async function adjustBitrate(targetBitrate) {  
	const sender = pc.getSenders().find((s) => s.track?.kind === "video");  
	if (!sender) return;

	const params = sender.getParameters();  
	if (!params.encodings) params.encodings = [{}];

	params.encodings[0].maxBitrate = targetBitrate;  
	await sender.setParameters(params);

	console.log(`비트레이트 조정: ${targetBitrate / 1000}kbps`);  
}

// 네트워크 상태에 따라 자동 조절  
async function autoAdjust() {  
	const stats = await pc.getStats();

	stats.forEach((report) => {  
		if (report.type === "inbound-rtp" && report.kind === "video") {  
			const lossRate = report.packetsLost / report.packetsReceived;

			if (lossRate > 0.05) {  
				adjustBitrate(500_000); // 500kbps  
			} else if (lossRate < 0.02) {  
				adjustBitrate(2_500_000); // 2.5Mbps  
			}  
		}  
	});  
}

setInterval(autoAdjust, 5000);  

let reconnectAttempts = 0;  
const MAX_ATTEMPTS = 3;

pc.addEventListener("iceconnectionstatechange", async () => {  
	const state = pc.iceConnectionState;  
	console.log("ICE 상태:", state);

	if (state === "disconnected") {  
		console.log("⚠️ 연결 끊김, 재연결 시도");

		if (reconnectAttempts < MAX_ATTEMPTS) {  
			reconnectAttempts++;

			// ICE 재시작  
			const offer = await pc.createOffer({ iceRestart: true });  
			await pc.setLocalDescription(offer);  
			signalingChannel.send({ type: "offer", sdp: offer });  
		} else {  
			console.error("❌ 재연결 실패, 수동 재시작 필요");  
		}  
	}

	if (state === "connected") {  
		reconnectAttempts = 0;  
		console.log("✅ 연결 복구 성공");  
	}

	if (state === "failed") {  
		console.error("❌ 연결 완전 실패");  
	}  
});  

function cleanup() {  
	// 1. 미디어 트랙 정지  
	if (localStream) {  
		localStream.getTracks().forEach((track) => {  
			track.stop();  
			console.log(`${track.kind} 트랙 정지`);  
		});  
	}

	// 2. PeerConnection 종료  
	if (pc) {  
		pc.close();  
		console.log("PeerConnection 종료");  
	}

	// 3. UI 정리  
	const localVideo = document.querySelector("#localVideo");  
	const remoteVideo = document.querySelector("#remoteVideo");

	if (localVideo) localVideo.srcObject = null;  
	if (remoteVideo) remoteVideo.srcObject = null;

	console.log("✅ 리소스 정리 완료");  
}

// 페이지 나갈 때 자동 실행  
window.addEventListener("beforeunload", cleanup);  

useEffect(() => {  
	// 연결 설정...

	return () => {  
		cleanup(); // 컴포넌트 언마운트 시 자동 실행  
	};  
}, []);