[Scummvm-git-logs] scummvm-sites cloud -> 4ea3592b69c128d3647a1e9ad935312ae7a6734b
sev-
noreply at scummvm.org
Sat Apr 8 10:57:40 UTC 2023
This automated email contains information about 4 new commits which have been
pushed to the 'scummvm-sites' repo located at https://github.com/scummvm/scummvm-sites .
Summary:
62031c08fe CLOUD: Add new connection flow page
f7c3b74c41 CLOUD: Remove "Dropbox (Legacy)" option
f6685f58dd CLOUD: Add new flow for 2.7.1 and higher
4ea3592b69 CLOUD: minor fixes
Commit: 62031c08fe116bb6872243a39cf19db4c34d307b
https://github.com/scummvm/scummvm-sites/commit/62031c08fe116bb6872243a39cf19db4c34d307b
Author: Alexander Tkachov (alexander at tkachov.ru)
Date: 2023-04-08T12:57:36+02:00
Commit Message:
CLOUD: Add new connection flow page
Has custom CSS and JS to pass the JSON acquired from cloud provider to the ScummVM. Displays different information based on the response (or lack of), and provides some troubleshooting options.
Changed paths:
A public/connect-style.css
A public/connect.js
A templates/connect.phtml
diff --git a/public/connect-style.css b/public/connect-style.css
new file mode 100644
index 0000000..33578a0
--- /dev/null
+++ b/public/connect-style.css
@@ -0,0 +1,108 @@
+.hidden {
+ display: none;
+}
+
+.content {
+ overflow-x: hidden;
+}
+
+.content::before {
+ content: ' ';
+ display: block;
+ opacity: 0;
+ width: 48pt;
+ height: 3pt;
+ background: #0AF;
+ margin-left: -8pt;
+ margin-top: -8pt;
+ margin-bottom: 8pt;
+ animation: 2s ease-in-out 0s infinite loading;
+}
+
+#state_connecting.content::before {
+ opacity: 100;
+}
+
+ at keyframes loading {
+ from {
+ transform: translateX(-100pt);
+ }
+ to {
+ transform: translateX(calc(500pt + 100pt));
+ }
+}
+
+.content > p {
+ margin-top: 10pt;
+ font-size: 12pt;
+ text-align: left;
+}
+
+.content > p:first-child {
+ margin-top: 6pt;
+ font-size: 18pt;
+ text-align: center;
+}
+
+.content > p:nth-child(2) {
+ margin-top: 10pt;
+ font-size: 12pt;
+ text-align: center;
+}
+
+.content > hr {
+ height: 1px;
+ margin: 18pt 0;
+ border: 0;
+ background: #CCC;
+}
+
+.content > input {
+ font-size: 14pt;
+ border: 1px solid #CCC;
+ padding: 5pt;
+ width: 50%;
+}
+
+.content > button {
+ font-size: 14pt;
+ padding: calc(5pt + 1px);
+ border: 0;
+ background: #821D06;
+ color: #FFF;
+ border-radius: 5px;
+ min-width: 20%;
+}
+
+.content > button:hover {
+ cursor: pointer;
+ background: #B42709;
+}
+
+.content > input,
+.content > button {
+ margin-top: 8pt;
+}
+
+.content > textarea {
+ width: calc(100% - 2*5pt - 2*1px);
+ border: 1px solid #CCC;
+ padding: 5pt;
+ margin-top: 4pt;
+ margin-bottom: 8pt;
+ resize: none;
+}
+
+.content > input:hover,
+.content > textarea:hover {
+ border: 1px solid #AAA;
+}
+
+.content > p > a {
+ color: #821D06;
+}
+
+.content > p > a:hover {
+ color: #E4330B;
+ text-decoration: none;
+}
diff --git a/public/connect.js b/public/connect.js
new file mode 100644
index 0000000..aaf9928
--- /dev/null
+++ b/public/connect.js
@@ -0,0 +1,52 @@
+window.onload = function () {
+ connect_cloud();
+ document.getElementById("json").value = JSON.stringify(token_json);
+};
+
+function connect_cloud() {
+ display_content("state_connecting");
+
+ var host = document.getElementById("host").value;
+ if (host == "") host = "http://localhost:12345/";
+
+ var url = host + (host.endsWith("/") ? "" : "/") + "connect_cloud";
+ postJsonAndParseJson(
+ url,
+ token_json,
+ function (json_response) {
+ if (json_response.error) {
+ console.error(json_response);
+ display_content("state_connect_failed");
+ } else {
+ display_content("state_connected");
+ }
+ },
+ function (failed_request) {
+ display_content("state_request_failed");
+ }
+ );
+}
+
+function display_content(id) {
+ var contents = document.querySelectorAll(".content");
+ for (var c of contents) c.classList.add("hidden");
+ document.getElementById(id).classList.remove("hidden");
+}
+
+function postJsonAndParseJson(url, data, callback, error_callback) {
+ var cb = function (responseText) { callback(JSON.parse(responseText)); };
+ var ecb = function (x) { error_callback(x); };
+
+ var x = new XMLHttpRequest();
+ x.open("POST", url, true);
+ x.onreadystatechange = function () {
+ if (x.readyState == XMLHttpRequest.DONE) {
+ if (x.status == 200)
+ cb(x.responseText);
+ else
+ ecb(x);
+ }
+ };
+ x.setRequestHeader('Content-Type', 'application/json');
+ x.send(JSON.stringify(data));
+}
diff --git a/templates/connect.phtml b/templates/connect.phtml
new file mode 100644
index 0000000..d337b3f
--- /dev/null
+++ b/templates/connect.phtml
@@ -0,0 +1,61 @@
+<!doctype html>
+<html>
+ <head>
+ <title>ScummVM</title>
+ <meta charset="utf-8"/>
+ <link rel="stylesheet" type="text/css" href="/cloud-style.css"/>
+ <link rel="stylesheet" type="text/css" href="/connect-style.css"/>
+ <script>
+ var token_json = {};
+ try {
+ token_json = JSON.parse(atob("<?= $response_base64 ?>"));
+ } catch (e) { console.error(e); };
+ </script>
+ <script src="/connect.js"></script>
+ </head>
+ <body>
+ <div class="container">
+ <div class="header">
+ <img src="https://scummvm.org/images/scummvm_logo.png"/>
+ </div>
+ <div class="content" id="state_connecting">
+ <p>Connecting <?= $provider_name ?>...</p>
+ <p>Please don't close this page yet.</p>
+ </div>
+ <div class="content hidden" id="state_connected">
+ <p>Connected!</p>
+ <p>Now you can close this page and return to ScummVM app.</p>
+ </div>
+ <div class="content hidden" id="state_request_failed">
+ <p>Something went wrong.</p>
+ <p>We couldn't reach your ScummVM app.</p>
+
+ <hr/>
+
+ <p><b>Troubleshooting:</b></p>
+ <p><b>1. Run Local Webserver or specify correct address</b></p>
+ <p>Make sure Local Webserver is running.<br/>If you're using custom port, enter your server's address.<br/>Press "Connect" to try reaching ScummVM again.</p>
+ <input id="host" type="text" placeholder="http://localhost:12345/" value="http://localhost:12345/" />
+ <button onclick="connect_cloud();">Connect</button>
+
+ <br/><br/>
+ <p><b>2. Use Manual mode</b></p>
+ <p>In ScummVM, go back and use Manual mode in connection wizard.<br/>Copy this code in there:</p>
+ <textarea id="json" readonly></textarea>
+ </div>
+ <div class="content hidden" id="state_connect_failed">
+ <p>Something went wrong.</p>
+ <p>We've reached your ScummVM app, but storage wasn't connected.</p>
+
+ <hr/>
+
+ <p><b>Troubleshooting:</b></p>
+ <p><b>1. Update ScummVM</b></p>
+ <p>Make sure to use ScummVM 2.7.1 or newer.<br/><a href="https://www.scummvm.org/downloads/">Go to Downloads</a></p>
+
+ <p style="margin-top: 20pt;"><b>2. Try again</b></p>
+ <p>Try connecting your storage one more time.<br/><a href="https://cloud.scummvm.org/">Go to cloud.scummvm.org</a></p>
+ </div>
+ </div>
+ </body>
+</html>
Commit: f7c3b74c410d6ebfe58261b88cb68d90a5f7527d
https://github.com/scummvm/scummvm-sites/commit/f7c3b74c410d6ebfe58261b88cb68d90a5f7527d
Author: Alexander Tkachov (alexander at tkachov.ru)
Date: 2023-04-08T12:57:36+02:00
Commit Message:
CLOUD: Remove "Dropbox (Legacy)" option
Changed paths:
templates/index.phtml
diff --git a/templates/index.phtml b/templates/index.phtml
index 630b120..b92eccc 100644
--- a/templates/index.phtml
+++ b/templates/index.phtml
@@ -13,10 +13,6 @@
<div class="content">
<p>Which cloud do you want to connect?</p>
<div class="links-list">
- <a href="/dropbox" class="link">
- <img src="/images/dropbox.png" />
- <b>Dropbox (Legacy)<sup class='small'>*</sup></b>
- </a>
<a href="/dropbox?refresh_token=true" class="link">
<img src="/images/dropbox.png" />
<b>Dropbox</b>
@@ -35,7 +31,6 @@
</a>
</div>
</div>
- <p>* Dropbox Legacy is used in ScummVM versions up to and including 2.2.1</p>
<p>Please note: Clicking on the cloud icons will redirect you to the chosen cloud provider. Please review their privacy policies beforehand.</p>
</div>
</body>
Commit: f6685f58dd30d2f2204a38eb69e7738eab1b70ab
https://github.com/scummvm/scummvm-sites/commit/f6685f58dd30d2f2204a38eb69e7738eab1b70ab
Author: Alexander Tkachov (alexander at tkachov.ru)
Date: 2023-04-08T12:57:36+02:00
Commit Message:
CLOUD: Add new flow for 2.7.1 and higher
New flow displays the page that does cross-origin request, instead of displaying a short code that could be used to get the data from cloud.scummvm.org. The logic of storing and retrieving data from Redis is not needed for this flow, and could be removed in the future.
To switch between the flows, a checkbox to the index page was added.
Changed paths:
src/routes.php
templates/index.phtml
diff --git a/src/routes.php b/src/routes.php
index 2029bc4..c1c1fa7 100644
--- a/src/routes.php
+++ b/src/routes.php
@@ -98,26 +98,77 @@ return function (App $app) {
return $response->withJson(['error' => true, 'message' => 'Invalid state']);
} else {
- try {
- // Try to get an access token (using the authorization code grant)
- $token = $providerAndScope['provider']->getAccessToken(
- 'authorization_code', [
- 'code' => $_GET['code']
- ]
- );
-
- $this->random = new PragmaRX\Random\Random();
- $shortcode = $this->random->size(6)->get();
- $client = new Predis\Client();
- $client->set("cloud-{$cloud}-{$shortcode}", json_encode($token));
- $client->expire("cloud-{$cloud}-{$shortcode}", 600);
- return $container->get('renderer')->render($response, 'token.phtml', ['shortcode' => $shortcode]);
+ $flow = "";
+ if (!empty($_SESSION['newFlow'])) {
+ $flow = $_SESSION['newFlow'];
}
- catch(League\OAuth2\Client\Provider\Exception\IdentityProviderException $e) {
- return $response->withJson(['error' => true, 'message' => $e->getMessage()]);
+
+ if ($flow === "271") {
+
+ try {
+ // Try to get an access token (using the authorization code grant)
+ $token = $providerAndScope['provider']->getAccessToken(
+ 'authorization_code', [
+ 'code' => $_GET['code']
+ ]
+ );
+
+ $providerName = "";
+ switch ($settings['provider']) {
+ case 'dropbox': $providerName = "Dropbox"; break;
+ case 'box': $providerName = "Box"; break;
+ case 'gdrive': $providerName = "Google Drive"; break;
+ case 'onedrive': $providerName = "OneDrive"; break;
+ }
+
+ $response_json = ['error' => false, 'storage' => $settings['provider'], 'oauth' => $token];
+ return $container->get('renderer')->render($response, 'connect.phtml', ['response_base64' => base64_encode(json_encode($response_json)), 'provider_name' => $providerName]);
+ }
+ catch(League\OAuth2\Client\Provider\Exception\IdentityProviderException $e) {
+ return $response->withJson(['error' => true, 'message' => $e->getMessage()]);
+ }
+
+ } else {
+
+ try {
+ // Try to get an access token (using the authorization code grant)
+ $token = $providerAndScope['provider']->getAccessToken(
+ 'authorization_code', [
+ 'code' => $_GET['code']
+ ]
+ );
+
+ $this->random = new PragmaRX\Random\Random();
+ $shortcode = $this->random->size(6)->get();
+ $client = new Predis\Client();
+ $client->set("cloud-{$cloud}-{$shortcode}", json_encode($token));
+ $client->expire("cloud-{$cloud}-{$shortcode}", 600);
+ return $container->get('renderer')->render($response, 'token.phtml', ['shortcode' => $shortcode]);
+ }
+ catch(League\OAuth2\Client\Provider\Exception\IdentityProviderException $e) {
+ return $response->withJson(['error' => true, 'message' => $e->getMessage()]);
+ }
+
}
+ }
+ }
+ );
+
+ $app->get(
+ '/{cloud}/271', function (Request $request, Response $response, array $args) use ($container) {
+ $cloud = $args['cloud'];
+ $settings = $container->get('settings')[$cloud];
+ $providerAndScope = getCloudProviderAndScope($settings);
+ if (!isset($providerAndScope)) {
+ return $response->withJson(['error' => true, 'message' => 'Unknown cloud provider']);
}
+
+ $authUrl = $providerAndScope['provider']->getAuthorizationUrl($providerAndScope['scope']);
+ $_SESSION['oauth2state'] = $providerAndScope['provider']->getState();
+ $_SESSION['newFlow'] = "271";
+
+ return $response->withRedirect($authUrl);
}
);
@@ -158,7 +209,6 @@ return function (App $app) {
]
);
- // $json = json_decode(json_encode($token), true);
return $response->withJson(['error' => false, 'oauth' => $token]);
}
catch(League\OAuth2\Client\Provider\Exception\IdentityProviderException $e) {
diff --git a/templates/index.phtml b/templates/index.phtml
index b92eccc..4fbf168 100644
--- a/templates/index.phtml
+++ b/templates/index.phtml
@@ -13,25 +13,49 @@
<div class="content">
<p>Which cloud do you want to connect?</p>
<div class="links-list">
- <a href="/dropbox?refresh_token=true" class="link">
+ <a id="db_link" href="/dropbox?refresh_token=true" class="link">
<img src="/images/dropbox.png" />
<b>Dropbox</b>
</a>
- <a href="/onedrive" class="link">
+ <a id="od_link" href="/onedrive" class="link">
<img src="/images/onedrive.png" />
<b>OneDrive</b>
</a>
- <a href="/gdrive" class="link">
+ <a id="gd_link" href="/gdrive" class="link">
<img src="/images/google_drive.png" />
<b>Google Drive</b>
</a>
- <a href="/box" class="link">
+ <a id="bx_link" href="/box" class="link">
<img src="/images/box.png" />
<b>Box</b>
</a>
</div>
+ <p><label for="271_cb"><input type="checkbox" value="off" id="271_cb" onclick="refresh_links();" onchange="refresh_links();" /> ScummVM version 2.7.1 or newer</label></p>
</div>
<p>Please note: Clicking on the cloud icons will redirect you to the chosen cloud provider. Please review their privacy policies beforehand.</p>
</div>
+ <script>
+function refresh_links() {
+ var e = document.getElementById("271_cb");
+ var use271 = (e.checked || e.value == "on");
+ var hrefs = {
+ "db_link": ["/dropbox?refresh_token=true", "/dropbox/271?refresh_token=true"],
+ "od_link": ["/onedrive", "/onedrive/271"],
+ "gd_link": ["/gdrive", "/gdrive/271"],
+ "bx_link": ["/box", "/box/271"],
+ };
+
+ var links = document.querySelectorAll("a.link");
+ for (var link of links) {
+ if (link.id in hrefs) {
+ link.href = hrefs[link.id][use271 ? 1 : 0];
+ }
+ }
+}
+
+window.onload = function () {
+ refresh_links();
+};
+ </script>
</body>
</html>
Commit: 4ea3592b69c128d3647a1e9ad935312ae7a6734b
https://github.com/scummvm/scummvm-sites/commit/4ea3592b69c128d3647a1e9ad935312ae7a6734b
Author: Alexander Tkachov (alexander at tkachov.ru)
Date: 2023-04-08T12:57:36+02:00
Commit Message:
CLOUD: minor fixes
- refer to JSON response as "JSON code", not just "code", like we do in application;
- reset $_SESSION value if old flow is used, in case new flow was used in that session already, so the final step executes in the old flow correctly.
Changed paths:
src/routes.php
templates/connect.phtml
diff --git a/src/routes.php b/src/routes.php
index c1c1fa7..bb15733 100644
--- a/src/routes.php
+++ b/src/routes.php
@@ -88,6 +88,7 @@ return function (App $app) {
// If we don't have an authorization code then get one
$authUrl = $providerAndScope['provider']->getAuthorizationUrl($providerAndScope['scope']);
$_SESSION['oauth2state'] = $providerAndScope['provider']->getState();
+ $_SESSION['newFlow'] = "270";
return $response->withRedirect($authUrl);
diff --git a/templates/connect.phtml b/templates/connect.phtml
index d337b3f..d052c65 100644
--- a/templates/connect.phtml
+++ b/templates/connect.phtml
@@ -40,7 +40,7 @@
<br/><br/>
<p><b>2. Use Manual mode</b></p>
- <p>In ScummVM, go back and use Manual mode in connection wizard.<br/>Copy this code in there:</p>
+ <p>In ScummVM, go back and use Manual mode in connection wizard.<br/>Copy this JSON code in there:</p>
<textarea id="json" readonly></textarea>
</div>
<div class="content hidden" id="state_connect_failed">
More information about the Scummvm-git-logs
mailing list