|
|
<!DOCTYPE html> |
|
|
<html> |
|
|
<head> |
|
|
<title>Completing Authentication...</title> |
|
|
<style> |
|
|
body { |
|
|
font-family: Arial, sans-serif; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
height: 100vh; |
|
|
margin: 0; |
|
|
background-color: #f5f5f5; |
|
|
} |
|
|
.container { |
|
|
text-align: center; |
|
|
padding: 20px; |
|
|
background: white; |
|
|
border-radius: 8px; |
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1); |
|
|
} |
|
|
.spinner { |
|
|
border: 3px solid #f3f3f3; |
|
|
border-top: 3px solid #3498db; |
|
|
border-radius: 50%; |
|
|
width: 40px; |
|
|
height: 40px; |
|
|
animation: spin 1s linear infinite; |
|
|
margin: 20px auto; |
|
|
} |
|
|
@keyframes spin { |
|
|
0% { transform: rotate(0deg); } |
|
|
100% { transform: rotate(360deg); } |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container"> |
|
|
<h2>Completing authentication...</h2> |
|
|
<div class="spinner"></div> |
|
|
<p id="status">Please wait...</p> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
function updateStatus(message) { |
|
|
document.getElementById('status').textContent = message; |
|
|
} |
|
|
|
|
|
try { |
|
|
|
|
|
let token = null; |
|
|
let authData = { type: 'auth-success' }; |
|
|
|
|
|
|
|
|
if (window.location.hash) { |
|
|
const hashParams = new URLSearchParams(window.location.hash.substring(1)); |
|
|
token = hashParams.get('access_token'); |
|
|
} |
|
|
|
|
|
|
|
|
if (!token && window.location.search) { |
|
|
const queryParams = new URLSearchParams(window.location.search); |
|
|
|
|
|
|
|
|
const code = queryParams.get('code'); |
|
|
const state = queryParams.get('state'); |
|
|
|
|
|
if (code && state === 'slack') { |
|
|
|
|
|
token = code; |
|
|
authData.code = code; |
|
|
authData.provider = 'slack'; |
|
|
|
|
|
|
|
|
const team = queryParams.get('team'); |
|
|
const teamId = queryParams.get('team_id'); |
|
|
const teamName = queryParams.get('team_name'); |
|
|
|
|
|
if (team || teamId) { |
|
|
authData.team_id = teamId || team; |
|
|
authData.team_name = teamName || team; |
|
|
} |
|
|
} else if (code && !token) { |
|
|
|
|
|
updateStatus('Slack authentication detected. Using authorization code.'); |
|
|
token = code; |
|
|
authData.code = code; |
|
|
authData.provider = 'slack'; |
|
|
} |
|
|
} |
|
|
|
|
|
if (token) { |
|
|
updateStatus('Authentication successful! Closing window...'); |
|
|
|
|
|
|
|
|
if (window.opener) { |
|
|
window.opener.postMessage({ |
|
|
...authData, |
|
|
token: token |
|
|
}, window.location.origin); |
|
|
|
|
|
|
|
|
setTimeout(() => window.close(), 1000); |
|
|
} else { |
|
|
updateStatus('Unable to communicate with main window. Please close this window manually.'); |
|
|
} |
|
|
} else { |
|
|
updateStatus('Authentication failed'); |
|
|
setTimeout(() => { |
|
|
if (window.opener) { |
|
|
window.opener.postMessage({ type: 'auth-failed', error: 'No token received' }, '*'); |
|
|
window.close(); |
|
|
} |
|
|
}, 3000); |
|
|
} |
|
|
} catch (error) { |
|
|
updateStatus('An error occurred: ' + error.message); |
|
|
console.error('Auth error:', error); |
|
|
} |
|
|
</script> |
|
|
</body> |
|
|
</html> |
