5
0
mirror of https://github.com/wailsapp/wails.git synced 2025-05-06 17:50:33 +08:00
wails/v3/examples/oauth/assets/index.html
2023-07-09 20:13:29 +10:00

39 lines
1.8 KiB
HTML

<!-- templates/index.html -->
<!doctype html>
<html>
<head>
<title>Google SignIn</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> <!-- load bulma css -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <!-- load fontawesome -->
</head>
<body>
<div id="main" class="container">
<div class="jumbotron text-center text-success" style="padding-top:70px;">
<h1><span class="fa fa-lock"></span> Social Authentication</h1>
<p>Login or Register with:</p>
<a data-wml-event="github-login" class="btn btn-primary"><span class="fa fa-github" style="color: #FFF"></span> SignIn with Github</a>
</div>
</div>
<div id="details" class="text-center" style="display: none">
<image id="logo" style="width:250px"></image>
<h3 id="name" style="padding-top: 10px"></h3>
<a data-wml-event="github-logout" class="btn btn-primary"><span class="fa fa-github" style="color: #FFF"></span> Logout </a>
</div>
<script>
window.wails.Events.On("wails:oauth:success", (event) => {
document.getElementById("main").style.display = "none";
document.getElementById("details").style.display = "block";
document.getElementById("name").innerText = event.data.Name;
document.getElementById("logo").src = event.data.AvatarURL;
document.body.style.backgroundColor = "#000";
document.body.style.color = "#FFF";
});
window.wails.Events.On("wails:oauth:loggedout", (event) => {
document.getElementById("details").style.display = "none";
document.getElementById("main").style.display = "block";
document.body.style.backgroundColor = "#FFF";
document.body.style.color = "#000";
});
</script>
</body>
</html>