Step 2 (싱글/멀티): replace auto-advance with a card selection plus a "다음" button so the user can review their choice before moving on. Step 4-1 (모드 플랫폼): replace the "설치 / 건너뛰기" buttons with two cards — "권장 플랫폼 설치" and "기본 마인크래프트로 설치". Selection only records intent; the actual platform install fires in 4-2 along with mods/resourcepacks (already handled by installer:client install). Server: default HOST to 127.0.0.1 instead of 0.0.0.0 so the startup log prints a Ctrl+클릭으로 바로 열 수 있는 URL. Set HOST=0.0.0.0 externally when public exposure is needed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
546 lines
22 KiB
JavaScript
546 lines
22 KiB
JavaScript
'use strict'
|
|
|
|
const installerApi = window.installer
|
|
|
|
const state = {
|
|
packs: [],
|
|
selectedPackKey: null,
|
|
mode: null, // 'single' | 'multi'
|
|
serverInstall: {
|
|
path: '',
|
|
jdk: '',
|
|
eulaAccepted: false,
|
|
ram: null,
|
|
portStatus: null
|
|
},
|
|
client: {
|
|
installPlatform: true
|
|
},
|
|
finishToggles: {
|
|
desktopShortcut: true,
|
|
startServer: true,
|
|
startLauncher: true
|
|
},
|
|
stepDone: { 1: false, 2: false, 3: false, 4: false }
|
|
}
|
|
|
|
const pageHost = document.getElementById('pageHost')
|
|
const stepIndicator = document.getElementById('stepIndicator')
|
|
const logViewer = document.getElementById('logViewer')
|
|
const logBody = document.getElementById('logBody')
|
|
const logToggle = document.getElementById('logToggle')
|
|
|
|
logToggle.addEventListener('click', function () {
|
|
logViewer.classList.toggle('collapsed')
|
|
if (logViewer.classList.contains('collapsed')) {
|
|
logViewer.style.height = '36px'
|
|
logToggle.textContent = '펼치기'
|
|
} else {
|
|
logViewer.style.height = ''
|
|
logToggle.textContent = '접기'
|
|
}
|
|
})
|
|
|
|
installerApi.onLog(function (line) {
|
|
logViewer.hidden = false
|
|
logBody.textContent += line + '\n'
|
|
logBody.scrollTop = logBody.scrollHeight
|
|
})
|
|
|
|
function setActiveStep(step) {
|
|
stepIndicator.querySelectorAll('li').forEach(function (item) {
|
|
var index = Number(item.getAttribute('data-step'))
|
|
item.classList.remove('active', 'done')
|
|
if (index < step) item.classList.add('done')
|
|
if (index === step) item.classList.add('active')
|
|
})
|
|
}
|
|
|
|
function clearPage() {
|
|
pageHost.innerHTML = ''
|
|
}
|
|
|
|
function renderStep1() {
|
|
setActiveStep(1)
|
|
clearPage()
|
|
var section = document.createElement('section')
|
|
section.className = 'page'
|
|
section.innerHTML =
|
|
'<h2>1단계. 설치할 음악퀴즈 선택</h2>' +
|
|
'<div id="packList" class="cardChoice"><p class="formMessage">목록을 불러오는 중...</p></div>' +
|
|
'<div class="actionRow"><span></span><button class="primaryBtn" id="next" disabled>다음</button></div>'
|
|
pageHost.appendChild(section)
|
|
var listEl = section.querySelector('#packList')
|
|
var nextBtn = section.querySelector('#next')
|
|
|
|
function renderList() {
|
|
listEl.innerHTML = ''
|
|
if (state.packs.length === 0) {
|
|
listEl.innerHTML = '<p class="formMessage error">등록된 음악퀴즈가 없습니다.</p>'
|
|
return
|
|
}
|
|
state.packs.forEach(function (pack) {
|
|
var btn = document.createElement('button')
|
|
btn.type = 'button'
|
|
btn.innerHTML = '<strong>' + pack.name + '</strong><br><small>마인크래프트 ' + pack.pack.mcVersion + ' / ' + pack.pack.platform.type + '</small>'
|
|
if (state.selectedPackKey === pack.key) btn.classList.add('selected')
|
|
btn.addEventListener('click', function () {
|
|
state.selectedPackKey = pack.key
|
|
nextBtn.disabled = false
|
|
renderList()
|
|
})
|
|
listEl.appendChild(btn)
|
|
})
|
|
}
|
|
|
|
nextBtn.addEventListener('click', async function () {
|
|
if (!state.selectedPackKey) return
|
|
await installerApi.setSelectedPack(state.selectedPackKey)
|
|
state.stepDone[1] = true
|
|
renderStep2()
|
|
})
|
|
|
|
;(async function () {
|
|
try {
|
|
var packs = await installerApi.loadPacks()
|
|
state.packs = packs
|
|
renderList()
|
|
} catch (err) {
|
|
listEl.innerHTML = '<p class="formMessage error">목록을 가져오지 못했습니다: ' + err.message + '</p>'
|
|
}
|
|
})()
|
|
}
|
|
|
|
function renderStep2() {
|
|
setActiveStep(2)
|
|
clearPage()
|
|
var section = document.createElement('section')
|
|
section.className = 'page'
|
|
section.innerHTML =
|
|
'<h2>2단계. 싱글 / 멀티 선택</h2>' +
|
|
'<div class="cardChoice">' +
|
|
'<button id="single" type="button" data-mode="single"><strong>싱글</strong><br><small>혼자 즐기는 모드. 4단계만 진행합니다.</small></button>' +
|
|
'<button id="multi" type="button" data-mode="multi"><strong>멀티</strong><br><small>친구들과 함께. 3단계 서버 설치 후 4단계를 진행합니다.</small></button>' +
|
|
'</div>' +
|
|
'<div class="actionRow"><button class="secondaryBtn" id="back">이전</button><button class="primaryBtn" id="next" disabled>다음</button></div>'
|
|
pageHost.appendChild(section)
|
|
var nextBtn = section.querySelector('#next')
|
|
var modeButtons = section.querySelectorAll('[data-mode]')
|
|
|
|
function applySelection(mode) {
|
|
state.mode = mode
|
|
modeButtons.forEach(function (btn) {
|
|
if (btn.getAttribute('data-mode') === mode) btn.classList.add('selected')
|
|
else btn.classList.remove('selected')
|
|
})
|
|
nextBtn.disabled = false
|
|
}
|
|
|
|
modeButtons.forEach(function (btn) {
|
|
btn.addEventListener('click', function () {
|
|
applySelection(btn.getAttribute('data-mode'))
|
|
})
|
|
})
|
|
|
|
if (state.mode === 'single' || state.mode === 'multi') applySelection(state.mode)
|
|
|
|
nextBtn.addEventListener('click', function () {
|
|
if (!state.mode) return
|
|
state.stepDone[2] = true
|
|
if (state.mode === 'single') renderStep4()
|
|
else renderStep3()
|
|
})
|
|
section.querySelector('#back').addEventListener('click', renderStep1)
|
|
}
|
|
|
|
function renderStep3() {
|
|
setActiveStep(3)
|
|
clearPage()
|
|
var section = document.createElement('section')
|
|
section.className = 'page'
|
|
section.innerHTML =
|
|
'<h2>3단계. 서버 관련 설정</h2>' +
|
|
'<div id="sub31" class="subStep"></div>' +
|
|
'<div id="sub32" class="subStep" hidden></div>' +
|
|
'<div id="sub33" class="subStep" hidden></div>' +
|
|
'<div id="sub34" class="subStep" hidden></div>' +
|
|
'<div id="sub35" class="subStep" hidden></div>' +
|
|
'<div class="actionRow"><button class="secondaryBtn" id="back">이전</button><button class="primaryBtn" id="proceedClient" hidden>4단계로 진행</button></div>'
|
|
pageHost.appendChild(section)
|
|
section.querySelector('#back').addEventListener('click', renderStep2)
|
|
|
|
renderSubStep31(section.querySelector('#sub31'), function () {
|
|
section.querySelector('#sub32').hidden = false
|
|
renderSubStep32(section.querySelector('#sub32'), function () {
|
|
section.querySelector('#sub33').hidden = false
|
|
renderSubStep33(section.querySelector('#sub33'), function () {
|
|
section.querySelector('#sub34').hidden = false
|
|
renderSubStep34(section.querySelector('#sub34'), function () {
|
|
section.querySelector('#sub35').hidden = false
|
|
renderSubStep35(section.querySelector('#sub35'), function () {
|
|
section.querySelector('#proceedClient').hidden = false
|
|
section.querySelector('#proceedClient').addEventListener('click', function () {
|
|
state.stepDone[3] = true
|
|
renderStep4()
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
})
|
|
}
|
|
|
|
function renderSubStep31(host, done) {
|
|
host.innerHTML =
|
|
'<h3>3-1. 서버 설치 경로</h3>' +
|
|
'<p class="formMessage">서버를 생성할 폴더를 선택하세요. 경로에 한글이 포함되면 안 됩니다.</p>' +
|
|
'<div class="fieldset"><label><input id="installPath" type="text" placeholder="C:\\MusicQuizServer" value="' + (state.serverInstall.path || '') + '" /></label>' +
|
|
'<button class="secondaryBtn" id="pickFolder">폴더 선택</button></div>' +
|
|
'<div class="formMessage" id="msg"></div>' +
|
|
'<button class="primaryBtn" id="confirm">확인</button>'
|
|
var input = host.querySelector('#installPath')
|
|
var msg = host.querySelector('#msg')
|
|
host.querySelector('#pickFolder').addEventListener('click', async function () {
|
|
var picked = await installerApi.pickFolder()
|
|
if (picked) input.value = picked
|
|
})
|
|
host.querySelector('#confirm').addEventListener('click', async function () {
|
|
var result = await installerApi.validateInstallPath(input.value.trim())
|
|
if (!result.ok) {
|
|
msg.textContent = result.message || '경로가 유효하지 않습니다.'
|
|
msg.classList.add('error')
|
|
return
|
|
}
|
|
msg.textContent = '경로 확정: ' + result.message
|
|
msg.classList.remove('error')
|
|
msg.classList.add('success')
|
|
state.serverInstall.path = input.value.trim()
|
|
done()
|
|
})
|
|
}
|
|
|
|
function renderSubStep32(host, done) {
|
|
host.innerHTML =
|
|
'<h3>3-2. JDK 확인</h3>' +
|
|
'<p class="formMessage">JAVA_HOME 또는 C:\\Program Files\\Java 에서 자동 탐색합니다. 직접 폴더를 선택해도 됩니다.</p>' +
|
|
'<div class="fieldset"><label><input id="jdkPath" type="text" placeholder="C:\\Program Files\\Java\\jdk-17" value="' + (state.serverInstall.jdk || '') + '" /></label>' +
|
|
'<button class="secondaryBtn" id="pickJdk">폴더 선택</button>' +
|
|
'<button class="secondaryBtn" id="auto">자동 탐색</button></div>' +
|
|
'<div class="formMessage" id="msg"></div>' +
|
|
'<button class="primaryBtn" id="confirm">확인</button>'
|
|
var input = host.querySelector('#jdkPath')
|
|
var msg = host.querySelector('#msg')
|
|
host.querySelector('#auto').addEventListener('click', async function () {
|
|
var detect = await installerApi.detectJdk()
|
|
if (detect.found) {
|
|
input.value = detect.path
|
|
msg.textContent = 'JDK 발견: ' + detect.path
|
|
msg.classList.remove('error')
|
|
msg.classList.add('success')
|
|
} else {
|
|
msg.textContent = 'JDK를 자동으로 찾지 못했습니다. 직접 선택해 주세요.'
|
|
msg.classList.add('error')
|
|
}
|
|
})
|
|
host.querySelector('#pickJdk').addEventListener('click', async function () {
|
|
var picked = await installerApi.pickFolder()
|
|
if (picked) input.value = picked
|
|
})
|
|
host.querySelector('#confirm').addEventListener('click', function () {
|
|
if (!input.value.trim()) {
|
|
msg.textContent = 'JDK 경로를 입력해 주세요.'
|
|
msg.classList.add('error')
|
|
return
|
|
}
|
|
state.serverInstall.jdk = input.value.trim()
|
|
done()
|
|
})
|
|
;(async function () {
|
|
var detect = await installerApi.detectJdk()
|
|
if (detect.found && !input.value) {
|
|
input.value = detect.path
|
|
msg.textContent = 'JDK 자동 탐색됨: ' + detect.path
|
|
msg.classList.add('success')
|
|
}
|
|
})()
|
|
}
|
|
|
|
function renderSubStep33(host, done) {
|
|
host.innerHTML =
|
|
'<h3>3-3. 서버 다운로드 및 설치</h3>' +
|
|
'<p class="formMessage">선택한 음악퀴즈의 서버 파일을 다운로드합니다. 진행 상황은 하단 로그 뷰어에 표시됩니다.</p>' +
|
|
'<div class="formMessage" id="downloadStatus">대기 중</div>' +
|
|
'<button class="primaryBtn" id="startDownload">다운로드 시작</button>' +
|
|
'<div id="eulaSection" hidden style="margin-top:14px;">' +
|
|
'<h3>3-3-3. EULA 동의</h3>' +
|
|
'<div class="eulaBox">Minecraft EULA: 본 설치는 Minecraft End User License Agreement (https://www.minecraft.net/ko-kr/eula) 동의가 필요합니다. 동의 시 eula.txt가 새로 작성됩니다.</div>' +
|
|
'<label class="toggleRow"><input id="eulaCheck" type="checkbox" /> Minecraft EULA에 동의합니다.</label>' +
|
|
'<div class="formMessage" id="eulaMsg"></div>' +
|
|
'</div>' +
|
|
'<div id="ramSection" hidden style="margin-top:14px;">' +
|
|
'<h3>3-3-4. 램 검사</h3>' +
|
|
'<div class="formMessage" id="ramMsg">검사 중...</div>' +
|
|
'</div>' +
|
|
'<div class="actionRow"><span></span><button class="primaryBtn" id="confirm" hidden>다음</button></div>'
|
|
|
|
var startBtn = host.querySelector('#startDownload')
|
|
var statusEl = host.querySelector('#downloadStatus')
|
|
var eulaSection = host.querySelector('#eulaSection')
|
|
var ramSection = host.querySelector('#ramSection')
|
|
var ramMsg = host.querySelector('#ramMsg')
|
|
var confirmBtn = host.querySelector('#confirm')
|
|
var eulaCheck = host.querySelector('#eulaCheck')
|
|
var eulaMsg = host.querySelector('#eulaMsg')
|
|
|
|
startBtn.addEventListener('click', async function () {
|
|
startBtn.disabled = true
|
|
statusEl.textContent = '다운로드 중...'
|
|
try {
|
|
await installerApi.startServerInstall({
|
|
packKey: state.selectedPackKey,
|
|
installPath: state.serverInstall.path,
|
|
jdkPath: state.serverInstall.jdk
|
|
})
|
|
statusEl.textContent = '다운로드 완료. EULA 동의가 필요합니다.'
|
|
eulaSection.hidden = false
|
|
} catch (err) {
|
|
statusEl.textContent = '다운로드 실패: ' + err.message
|
|
startBtn.disabled = false
|
|
}
|
|
})
|
|
|
|
eulaCheck.addEventListener('change', async function () {
|
|
if (!eulaCheck.checked) return
|
|
try {
|
|
await installerApi.acceptEula(state.serverInstall.path)
|
|
eulaMsg.textContent = 'EULA 동의 저장됨.'
|
|
eulaMsg.classList.add('success')
|
|
ramSection.hidden = false
|
|
var result = await installerApi.checkRam(state.selectedPackKey)
|
|
state.serverInstall.ram = result
|
|
if (result.decision === 'tooLow') {
|
|
ramMsg.innerHTML = '시스템 램(' + result.systemRamMb + 'MB)이 음악퀴즈 최소 요구치(' + (state.packs.find(function (p) { return p.key === state.selectedPackKey }).pack.serverMinRam) + 'MB)에 미치지 못합니다. 설치를 중단합니다.'
|
|
ramMsg.classList.add('error')
|
|
return
|
|
}
|
|
if (result.decision === 'minOk') {
|
|
ramMsg.innerHTML = '시스템 램(' + result.systemRamMb + 'MB)이 권장치보다 부족합니다. 최소치(' + result.appliedRamMb + 'MB)로 진행합니다.'
|
|
ramMsg.classList.add('warn')
|
|
} else {
|
|
ramMsg.textContent = '시스템 램(' + result.systemRamMb + 'MB) 충분. ' + result.appliedRamMb + 'MB로 설정.'
|
|
ramMsg.classList.add('success')
|
|
}
|
|
confirmBtn.hidden = false
|
|
} catch (err) {
|
|
eulaMsg.textContent = 'EULA 저장 실패: ' + err.message
|
|
eulaMsg.classList.add('error')
|
|
}
|
|
})
|
|
|
|
confirmBtn.addEventListener('click', function () {
|
|
state.serverInstall.eulaAccepted = true
|
|
done()
|
|
})
|
|
}
|
|
|
|
function renderSubStep34(host, done) {
|
|
host.innerHTML =
|
|
'<h3>3-4. 서버 설정 편집</h3>' +
|
|
'<p class="formMessage">로컬 웹서버를 띄워 server.properties / bukkit.yml 등을 GUI로 편집합니다.</p>' +
|
|
'<button class="secondaryBtn" id="open">편집기 열기</button>' +
|
|
'<div class="formMessage" id="editorMsg"></div>' +
|
|
'<button class="primaryBtn" id="confirm">확인</button>'
|
|
host.querySelector('#open').addEventListener('click', async function () {
|
|
var msg = host.querySelector('#editorMsg')
|
|
try {
|
|
var result = await installerApi.startServerConfigEditor(state.serverInstall.path)
|
|
msg.innerHTML = '편집기 주소: <a href="' + result.url + '" target="_blank">' + result.url + '</a>'
|
|
} catch (err) {
|
|
msg.textContent = '편집기 실행 실패: ' + err.message
|
|
msg.classList.add('error')
|
|
}
|
|
})
|
|
host.querySelector('#confirm').addEventListener('click', done)
|
|
}
|
|
|
|
function renderSubStep35(host, done) {
|
|
host.innerHTML =
|
|
'<h3>3-5. 포트포워딩 점검</h3>' +
|
|
'<p class="formMessage">서버의 외부 접근 가능 여부를 확인합니다. UPnP를 시도해도 안 되면 직접 포트포워딩을 안내합니다.</p>' +
|
|
'<div class="fieldset"><label>포트 <input id="port" type="text" value="25565" /></label></div>' +
|
|
'<button class="secondaryBtn" id="run">검사 시작</button>' +
|
|
'<div class="formMessage" id="resultMsg"></div>' +
|
|
'<button class="primaryBtn" id="confirm" hidden>확인</button>'
|
|
var resultMsg = host.querySelector('#resultMsg')
|
|
var confirmBtn = host.querySelector('#confirm')
|
|
host.querySelector('#run').addEventListener('click', async function () {
|
|
var port = Number(host.querySelector('#port').value) || 25565
|
|
resultMsg.textContent = '확인 중...'
|
|
var result = await installerApi.checkPortForward(port)
|
|
state.serverInstall.portStatus = result
|
|
if (result.status === 'preForwarded') {
|
|
resultMsg.innerHTML = '이미 외부 접속 가능: ' + result.externalIp + ':' + result.port
|
|
resultMsg.classList.add('success')
|
|
} else if (result.status === 'upnpOk') {
|
|
resultMsg.innerHTML = 'UPnP로 자동 개방 완료: ' + result.externalIp + ':' + result.port
|
|
resultMsg.classList.add('success')
|
|
} else {
|
|
resultMsg.innerHTML = (result.message || '직접 포트포워딩을 해주세요.') +
|
|
'<br><small>외부 IP: ' + (result.externalIp || '확인 불가') + ', 포트: ' + result.port + '</small>'
|
|
resultMsg.classList.add('warn')
|
|
}
|
|
confirmBtn.hidden = false
|
|
})
|
|
confirmBtn.addEventListener('click', done)
|
|
}
|
|
|
|
function renderStep4() {
|
|
setActiveStep(4)
|
|
clearPage()
|
|
var pack = state.packs.find(function (p) { return p.key === state.selectedPackKey })
|
|
var section = document.createElement('section')
|
|
section.className = 'page'
|
|
section.innerHTML =
|
|
'<h2>4단계. 유저 클라이언트 설정</h2>' +
|
|
'<div class="subStep" id="sub41"></div>' +
|
|
'<div class="subStep" id="sub42" hidden></div>' +
|
|
'<div class="subStep" id="sub43" hidden></div>' +
|
|
'<div class="actionRow"><button class="secondaryBtn" id="back">이전</button><button class="primaryBtn" id="next" hidden>5단계로</button></div>'
|
|
pageHost.appendChild(section)
|
|
section.querySelector('#back').addEventListener('click', function () {
|
|
if (state.mode === 'multi') renderStep3(); else renderStep2()
|
|
})
|
|
|
|
renderSubStep41(section.querySelector('#sub41'), pack, function () {
|
|
section.querySelector('#sub42').hidden = false
|
|
renderSubStep42(section.querySelector('#sub42'), function () {
|
|
section.querySelector('#sub43').hidden = false
|
|
renderSubStep43(section.querySelector('#sub43'), function () {
|
|
var nextBtn = section.querySelector('#next')
|
|
nextBtn.hidden = false
|
|
nextBtn.addEventListener('click', function () {
|
|
state.stepDone[4] = true
|
|
renderStep5()
|
|
})
|
|
})
|
|
})
|
|
})
|
|
}
|
|
|
|
function renderSubStep41(host, pack, done) {
|
|
var platformType = pack ? pack.pack.platform.type : 'vanilla'
|
|
if (platformType === 'vanilla') {
|
|
state.client.installPlatform = false
|
|
host.innerHTML =
|
|
'<h3>4-1. 모드 플랫폼</h3>' +
|
|
'<p class="formMessage">선택한 음악퀴즈의 플랫폼: <strong>vanilla</strong></p>' +
|
|
'<p class="formMessage">바닐라이므로 별도 설치는 필요 없습니다.</p>' +
|
|
'<div class="actionRow"><span></span><button class="primaryBtn" id="next">다음</button></div>'
|
|
host.querySelector('#next').addEventListener('click', done)
|
|
return
|
|
}
|
|
|
|
host.innerHTML =
|
|
'<h3>4-1. 모드 플랫폼</h3>' +
|
|
'<p class="formMessage">선택한 음악퀴즈의 플랫폼: <strong>' + platformType + '</strong></p>' +
|
|
'<div class="cardChoice">' +
|
|
'<button type="button" data-choice="install"><strong>권장 플랫폼 설치</strong><br><small>' + platformType + ' 설치파일을 함께 다운로드해 4-2 설치 시작 시 함께 설치됩니다.</small></button>' +
|
|
'<button type="button" data-choice="skip"><strong>기본 마인크래프트로 설치</strong><br><small>플랫폼은 설치하지 않고 바닐라로 진행합니다.</small></button>' +
|
|
'</div>' +
|
|
'<div class="actionRow"><span></span><button class="primaryBtn" id="next" disabled>다음</button></div>'
|
|
|
|
var nextBtn = host.querySelector('#next')
|
|
var choiceButtons = host.querySelectorAll('[data-choice]')
|
|
|
|
function applyChoice(choice) {
|
|
state.client.installPlatform = choice === 'install'
|
|
choiceButtons.forEach(function (btn) {
|
|
if (btn.getAttribute('data-choice') === choice) btn.classList.add('selected')
|
|
else btn.classList.remove('selected')
|
|
})
|
|
nextBtn.disabled = false
|
|
}
|
|
|
|
choiceButtons.forEach(function (btn) {
|
|
btn.addEventListener('click', function () {
|
|
applyChoice(btn.getAttribute('data-choice'))
|
|
})
|
|
})
|
|
|
|
if (typeof state.client.installPlatform === 'boolean') {
|
|
applyChoice(state.client.installPlatform ? 'install' : 'skip')
|
|
}
|
|
|
|
nextBtn.addEventListener('click', done)
|
|
}
|
|
|
|
function renderSubStep42(host, done) {
|
|
host.innerHTML =
|
|
'<h3>4-2. 모드/리소스팩 다운로드 및 launcher_profiles 갱신</h3>' +
|
|
'<p class="formMessage">%appdata%\\.mc_custom 에 모드와 리소스팩을 설치하고, launcher_profiles.json에 프로필을 등록합니다.</p>' +
|
|
'<button class="primaryBtn" id="run">설치 시작</button>' +
|
|
'<div class="formMessage" id="msg"></div>'
|
|
host.querySelector('#run').addEventListener('click', async function () {
|
|
var msg = host.querySelector('#msg')
|
|
msg.textContent = '설치 중...'
|
|
msg.classList.remove('error', 'success')
|
|
try {
|
|
await installerApi.installClient({
|
|
packKey: state.selectedPackKey,
|
|
installPlatform: !!state.client.installPlatform
|
|
})
|
|
msg.textContent = '클라이언트 설치 완료.'
|
|
msg.classList.add('success')
|
|
done()
|
|
} catch (err) {
|
|
msg.textContent = '설치 실패: ' + err.message
|
|
msg.classList.add('error')
|
|
}
|
|
})
|
|
}
|
|
|
|
function renderSubStep43(host, done) {
|
|
host.innerHTML = '<h3>4-3. 완료 확인</h3><p class="formMessage">모드와 리소스팩이 .mc_custom에 설치되어 있고, launcher_profiles.json도 갱신되었습니다.</p><button class="primaryBtn" id="confirm">5단계로</button>'
|
|
host.querySelector('#confirm').addEventListener('click', done)
|
|
}
|
|
|
|
function renderStep5() {
|
|
setActiveStep(5)
|
|
clearPage()
|
|
var section = document.createElement('section')
|
|
section.className = 'page'
|
|
var multi = state.mode === 'multi'
|
|
section.innerHTML =
|
|
'<h2>5단계. 설치 완료</h2>' +
|
|
'<p>모든 단계가 끝났습니다. 아래 옵션을 선택해 주세요.</p>' +
|
|
(multi ? '<div class="subStep">' +
|
|
'<h3>서버</h3>' +
|
|
'<button class="secondaryBtn" id="openFolder">서버 폴더 열기</button>' +
|
|
'<label class="toggleRow"><input type="checkbox" id="shortcut" checked /> 바탕화면에 서버 실행 바로가기 만들기</label>' +
|
|
'<label class="toggleRow"><input type="checkbox" id="startServer" checked /> 서버 바로 실행</label>' +
|
|
'</div>' : '') +
|
|
'<div class="subStep">' +
|
|
'<h3>마인크래프트 런처</h3>' +
|
|
'<label class="toggleRow"><input type="checkbox" id="startLauncher" checked /> 마인크래프트 런처 실행</label>' +
|
|
'</div>' +
|
|
'<div class="actionRow"><button class="secondaryBtn" id="back">이전</button><button class="primaryBtn" id="finish">완료</button></div>'
|
|
pageHost.appendChild(section)
|
|
section.querySelector('#back').addEventListener('click', renderStep4)
|
|
if (multi) {
|
|
section.querySelector('#openFolder').addEventListener('click', function () {
|
|
installerApi.openServerFolder()
|
|
})
|
|
}
|
|
section.querySelector('#finish').addEventListener('click', async function () {
|
|
if (multi) {
|
|
if (section.querySelector('#shortcut').checked) await installerApi.createDesktopShortcut()
|
|
if (section.querySelector('#startServer').checked) await installerApi.startServer()
|
|
}
|
|
if (section.querySelector('#startLauncher').checked) await installerApi.startMinecraftLauncher()
|
|
section.querySelector('#finish').disabled = true
|
|
section.querySelector('#finish').textContent = '완료됨'
|
|
})
|
|
}
|
|
|
|
renderStep1()
|