local-network-browser/renderer.js at master · realcoding2003/local-network-browser · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
const elements = {
  statusTitle: document.getElementById("status-title"),
  statusMessage: document.getElementById("status-message"),
  errorPanel: document.getElementById("error-panel"),
  errorMessage: document.getElementById("error-message"),
  retryBtn: document.getElementById("retry-btn"),
  progressBar: document.getElementById("progress-bar"),
  networkStatus: document.getElementById("network-status"),
};

// 초기화
document.addEventListener("DOMContentLoaded", async () => {
  await initialize();
});

async function initialize() {
  try {
    // 설정 로드
    const config = await window.electronAPI.getConfig();
    document.title = `${config.appName} - 제품 찾는중...`;

    // 네트워크 정보 표시
    elements.networkStatus.textContent = `Platform: ${window.electronAPI.platform}`;

    // 프로그레스 바 애니메이션
    animateProgress();

    // 저장된 서버 확인
    const savedServer = await window.electronAPI.getSavedServer();

    if (savedServer && savedServer.url) {
      // 저장된 서버가 있으면 바로 연결 시도
      console.log("저장된 서버 발견:", savedServer.url);
      elements.statusTitle.textContent = "저장된 서버 연결중...";
      elements.statusMessage.textContent = savedServer.url;

      setTimeout(async () => {
        const result = await window.electronAPI.connectToSavedServer(
          savedServer.url,
        );

        if (result.success) {
          console.log("저장된 서버에 연결 성공");
          elements.statusTitle.textContent = "서버 연결 완료!";
          elements.progressBar.style.width = "100%";
        } else {
          // 저장된 서버 연결 실패 시 스캔 시작
          console.log("저장된 서버 연결 실패, 스캔 시작");
          startScan();
        }
      }, 500);
    } else {
      // 저장된 서버가 없으면 스캔 시작
      setTimeout(() => {
        startScan();
      }, 1000);
    }
  } catch (error) {
    console.error("Initialization failed:", error);
    showError("초기화 실패");
  }
}

async function startScan() {
  elements.statusTitle.textContent = "제품을 찾는중...";
  elements.statusMessage.textContent = "잠시만 기다려주세요...";
  elements.errorPanel.classList.add("hidden");

  try {
    const result = await window.electronAPI.scanAndConnect();

    if (result.success) {
      // 서버를 찾았고 연결됨
      elements.statusTitle.textContent = "서버 발견!";
      elements.statusMessage.textContent = `다음에 연결중 ${result.url}`;

      // URL 저장
      await window.electronAPI.saveServer(result.url);

      // 성공 표시 (실제로는 main.js에서 페이지가 이미 전환됨)
      setTimeout(() => {
        elements.progressBar.style.width = "100%";
      }, 500);
    } else {
      // 서버를 찾지 못함
      showError(result.message || "서버를 찾을 수 없습니다");
    }
  } catch (error) {
    console.error("Scan failed:", error);
    showError("스캔 실패: " + error.message);
  }
}

function showError(message) {
  elements.statusTitle.textContent = "서버를 찾을 수 없습니다";
  elements.statusMessage.textContent = "서버를 찾을 수 없습니다";
  elements.errorMessage.textContent = message;
  elements.errorPanel.classList.remove("hidden");
  elements.progressBar.style.width = "0%";
}

// 재시도 버튼 이벤트
elements.retryBtn.addEventListener("click", async () => {
  elements.errorPanel.classList.add("hidden");
  animateProgress();
  await startScan();
});

// 프로그레스 바 애니메이션
function animateProgress() {
  let progress = 0;
  const interval = setInterval(() => {
    progress += 2;
    elements.progressBar.style.width = `${Math.min(progress, 90)}%`;

    if (progress >= 90) {
      clearInterval(interval);
    }
  }, 100);
}