jcloud_frontend/legal/user-consent/en/index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta name="jcloud-consent-version" content="d7a1c10b59b544c8a82b93a23d8f0323">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <title>Consent</title>
        <style>
            :root {
                --primary-color: #328cef;
                --darker-than-primary-color: #106acd;
            }
            body {
                display: flex;
                justify-content: center;
                align-items: center;
                height: 100vh;
                margin: 0;
                font-family: sans-serif;
            }
            main {
                border: 1px solid #ccc;
                border-radius: 30px;
                overflow: auto;
                height: 90vh;
                width: 80vh;
            }
            h1 {
                margin: 0;
            }
            .content {
                margin: 30px;
            }
            #consent-list {
                list-style-type: disc;
                margin: 50px;
                padding: 0;
            }
            #consent-form {
                display: flex;
                justify-content: right;
                gap: 20px;
                margin: 30px;
            }
            button {
                padding: 10px 20px;
                font-size: 16px;
                border: none;
                border-radius: 8px;
                cursor: pointer;
            }
            #consent {
                background-color: var(--primary-color);
                color: white;
            }
            #consent:hover {
                background-color: var(--darker-than-primary-color);
            }
            #decline {
                background-color: transparent;
                color: #555;
            }
            #decline:hover {
                background-color: transparent;
            }
            #version {
                margin: 20px;
                text-align: right;
            }
            @media (max-width: 768px) {
                main {
                    width: 100vw;
                    height: 100vh;
                    border-radius: 0;
                    border: none;
                }
                #consent-list {
                    margin: 30px;
                }
                #consent-form {
                    flex-direction: column;
                    align-items: center;
                    gap: 5px;
                }
            }
        </style>
    </head>
    <body>
        <main>
            <div class="content">
                <div id="version"><<CONSENT-VERSION>></div>
                <h1>Before You Continue</h1>
                <article>
                    <p>
                        By using this website, you agree to the following:
                        <ul id="consent-list">
                            <li>
                                <h2>Storage of Logs</h2>
                                <p>
                                    jCloud records logs of all accesses to the website and API. These logs contain information such as the IP address, timestamp, HTTP method, requested resource, HTTP status code, user agent, user’s language, response time, and server version. After 30 days, the logs are anonymized by masking the last 8 bits of the IP address.<br/>
                                    <h3>Purpose of each piece of information</h3>
                                    <ul>
                                        <li>
                                            <strong>IP Address:</strong> Used to identify the source of traffic, detect potential security threats, and revoke access in case of misuse.
                                        </li>
                                        <li>
                                            <strong>Timestamp:</strong> The timestamp allows tracking the exact time of an access, which is necessary for analyzing attacks and for the early detection of inefficiencies or overloads.
                                        </li>
                                        <li>
                                            <strong>HTTP Method and Requested Resource:</strong> Storing the HTTP method and the requested resource helps to understand usage patterns and, based on them, to improve the website and the API.
                                        </li>
                                        <li>
                                            <strong>HTTP Status Code:</strong> The HTTP status code allows the usability of the website and API to be assessed (e.g., misleading links that trigger error codes) and subsequently improved, while also monitoring the reliability of the services.
                                        </li>
                                        <li>
                                            <strong>Response Time:</strong> The response time is measured to monitor the performance of the website and API and to identify bottlenecks that could affect the user experience.
                                        </li>
                                        <li>
                                            <strong>User-Agent:</strong> This information is used to ensure the compatibility of the website and API with different browsers and operating systems and to optimize the user experience.
                                        </li>
                                        <li>
                                            <strong>User’s Language:</strong> The user’s language is stored to improve the localization and internationalization of the website and API.
                                        </li>
                                        <li>
                                            <strong>Server Version:</strong> The server version is recorded to identify issues specific to certain versions and to facilitate the maintenance and updating of the server software.
                                        </li>
                                    </ul>
                                </p>
                            </li>
                            <li>
                                <h2>Cookies Stored in Your Browser</h2>
                                <p>
                                    To ensure the optimal functionality of the website, jCloud stores cookies in your browser.<br/>
                                    <h3>Stored Cookies and Their Purposes:</h3>
                                    <ul>
                                        <li>
                                            <strong>"User":</strong> This cookie contains the currently logged-in user. If you selected the "Stay signed in" option during login, this cookie expires after 20 days. Otherwise, it expires at the end of the session. This cookie is necessary to identify you during your session and to provide access to your data.
                                        </li>
                                        <li>
                                            <strong>"Auth":</strong> This cookie contains a token used to authenticate your requests to the API. If you selected the "Stay signed in" option during login, this cookie expires after 20 days. Otherwise, it expires at the end of the session. This cookie is necessary to authenticate your requests and provide access to your data.
                                        </li>
                                        <li>
                                            <strong>"signed_in":</strong> This cookie indicates whether you are signed in. If you selected the "Stay signed in" option during login, this cookie expires after 20 days. Otherwise, it expires at the end of the session. This cookie is necessary to provide you with a seamless user experience.
                                        </li>
                                        <li>
                                            <strong>"user_consent":</strong> This cookie is used to store that you have given this consent. It expires after 365 days. This cookie is necessary to ensure that you are informed about the data collection practices and that you have provided your consent.
                                        </li>
                                    </ul>
                                </p>
                            </li>
                        </ul>
                    </p>
                </article>
                <form action="https://jcloud-services.ddns.net:1024/consent" method="POST" id="consent-form">
                    <input type="hidden" name="redirect_uri" id="redirect-uri" />
                    <button type="button" id="decline">Decline and Go Back</button>
                    <button type="submit" id="consent">Consent and Continue</button>
                </form>
            </div>
        </main>
        <script>
            'use strict';
            const url = new URL(window.location.href);
            const search = Object.fromEntries(url.searchParams.entries());
            for (let key in search) {
                const input = document.createElement('input');
                input.type = 'hidden';
                input.name = key;
                input.value = search[key];
                document.querySelector('form').appendChild(input);
            };
            document.querySelector('#redirect-uri').value = 'https://jcloud-services.ddns.net' + url.pathname + url.hash;
            document.querySelector('#decline').addEventListener('click', function () {
                window.history.back();
            });
        </script>
    </body>
</html>