Add sync page
parent
9464a54481
commit
94b8fc82d6
|
@ -26,7 +26,15 @@ body {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
p {
|
||||
.animatable {
|
||||
transition: opacity 0.7s ease-in-out, transform 0.7s ease-in-out;
|
||||
}
|
||||
.invisible {
|
||||
transform: translateY(10px);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
p, div.p {
|
||||
color: white;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1.5em;;
|
||||
|
@ -78,6 +86,7 @@ input.m-input:focus {
|
|||
border: none;
|
||||
border-radius: 20px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
transition: background-color 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
|
@ -90,7 +99,6 @@ input.m-input:focus {
|
|||
.m-button.link {
|
||||
background-color: unset;
|
||||
color: var(--fg-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.login-button {
|
||||
|
|
|
@ -0,0 +1,55 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Memories</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
<body>
|
||||
<div id="main" class="container animatable">
|
||||
<img src="memories.svg" alt="Memories Logo" class="logo">
|
||||
<p id="waiting" class="animatable">
|
||||
Waiting for login to complete <br/>
|
||||
Keep this page open in the background
|
||||
</p>
|
||||
|
||||
<div id="sync" class="p animatable invisible">
|
||||
You are now logged in to the server!
|
||||
<br/><br/>
|
||||
You can set up automatic uploads from this device using the
|
||||
Nextcloud mobile app. Click the button below to download the app,
|
||||
or skip this step and continue.
|
||||
<br/>
|
||||
|
||||
<a class="m-button login-button" href="https://play.google.com/store/apps/details?id=com.nextcloud.client">
|
||||
Set up automatic upload
|
||||
</a>
|
||||
<br/>
|
||||
|
||||
<p id="conn-error" class="error"></p>
|
||||
|
||||
<button class="m-button link" onclick="start()">
|
||||
Continue
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
window.loggedIn = async () => {
|
||||
const waiting = document.getElementById('waiting');
|
||||
waiting.classList.add('invisible');
|
||||
await new Promise(resolve => setTimeout(resolve, 700));
|
||||
waiting.remove();
|
||||
document.getElementById('sync').classList.remove('invisible');
|
||||
}
|
||||
|
||||
async function start() {
|
||||
const sync = document.getElementById('main');
|
||||
sync.classList.add('invisible');
|
||||
await new Promise(resolve => setTimeout(resolve, 700));
|
||||
window.nativex?.reload();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,17 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Memories</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<img src="memories.svg" alt="Memories Logo" class="logo">
|
||||
<p>
|
||||
Waiting for login to complete <br/>
|
||||
Keep this page open in the background
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
|
@ -7,7 +7,7 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div id="main" class="container animatable invisible">
|
||||
<img src="memories.svg" alt="Memories Logo" class="logo">
|
||||
<p>
|
||||
Start organizing and sharing your precious moments.
|
||||
|
@ -21,6 +21,7 @@
|
|||
<button class="m-button login-button" id="login">
|
||||
Continue to Login
|
||||
</button>
|
||||
<br/>
|
||||
|
||||
<p id="conn-error" class="error"></p>
|
||||
|
||||
|
@ -108,7 +109,10 @@
|
|||
|
||||
// Set action bar color
|
||||
const themeColor = getComputedStyle(document.documentElement).getPropertyValue('--theme-color');
|
||||
globalThis.nativex.setThemeColor(themeColor, true);
|
||||
globalThis.nativex?.setThemeColor(themeColor, true);
|
||||
|
||||
// Make container visible
|
||||
document.getElementById('main').classList.remove('invisible');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -100,6 +100,13 @@ import java.net.URLDecoder
|
|||
}
|
||||
}
|
||||
|
||||
@JavascriptInterface
|
||||
fun reload() {
|
||||
mCtx.runOnUiThread {
|
||||
mCtx.loadDefaultUrl()
|
||||
}
|
||||
}
|
||||
|
||||
@JavascriptInterface
|
||||
fun login(baseUrl: String?, loginFlowUrl: String?) {
|
||||
if (baseUrl == null || loginFlowUrl == null) return;
|
||||
|
|
|
@ -85,7 +85,7 @@ import java.net.SocketTimeoutException
|
|||
|
||||
private fun pollLogin(pollUrl: String, pollToken: String, baseUrl: String) {
|
||||
mCtx.binding.webview.post {
|
||||
mCtx.binding.webview.loadUrl("file:///android_asset/waiting.html")
|
||||
mCtx.binding.webview.loadUrl("file:///android_asset/sync.html")
|
||||
}
|
||||
|
||||
val client = OkHttpClient()
|
||||
|
@ -130,9 +130,9 @@ import java.net.SocketTimeoutException
|
|||
mCtx.runOnUiThread {
|
||||
// Save login info (also updates header)
|
||||
storeCredentials(baseUrl, loginName, appPassword)
|
||||
mCtx.runOnUiThread {
|
||||
mCtx.loadDefaultUrl()
|
||||
}
|
||||
|
||||
// Go to next screen
|
||||
mCtx.binding.webview.evaluateJavascript("window.loggedIn()", {})
|
||||
}
|
||||
|
||||
return;
|
||||
|
|
Loading…
Reference in New Issue