diff options
author | Fabio Alessandrelli <fabio.alessandrelli@gmail.com> | 2021-04-17 14:43:16 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-04-17 14:43:16 +0200 |
commit | 0ee744ff5f3cf045a2699aa4111de3200b9d70be (patch) | |
tree | cd0a237aa3c1d2febaafe447637fb4df31bb54d8 /misc/dist | |
parent | 837b5da6a4ddad968670636de18d2140fe2f7967 (diff) | |
parent | 8b0814689423857efd05f1b2c2f16973202cfe1b (diff) |
Merge pull request #47069 from Calinou/html5-editor-welcome-dialog
Add a welcome dialog to the HTML5 editor
Diffstat (limited to 'misc/dist')
-rw-r--r-- | misc/dist/html/editor.html | 65 |
1 files changed, 65 insertions, 0 deletions
diff --git a/misc/dist/html/editor.html b/misc/dist/html/editor.html index 4785f54973..347c22adf8 100644 --- a/misc/dist/html/editor.html +++ b/misc/dist/html/editor.html @@ -58,6 +58,29 @@ filter: brightness(82.5%); } + .welcome-modal { + display: none; + position: fixed; + z-index: 1; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: hsla(0, 0%, 0%, 0.5); + } + + .welcome-modal-content { + background-color: #333b4f; + box-shadow: 0 0.25rem 0.25rem hsla(0, 0%, 0%, 0.5); + line-height: 1.5; + max-width: 38rem; + margin: 4rem auto 0 auto; + color: white; + border-radius: 0.5rem; + padding: 1rem 1rem 2rem 1rem; + } + #tabs-buttons { /* Match the default background color of the editor window for a seamless appearance. */ background-color: #202531; @@ -206,6 +229,36 @@ </style> </head> <body> + <div + id="welcome-modal" + class="welcome-modal" + role="dialog" + aria-labelledby="welcome-modal-title" + aria-describedby="welcome-modal-description" + onclick="if (event.target === this) closeWelcomeModal(false)" + > + <div class="welcome-modal-content"> + <h2 id="welcome-modal-title">Important - Please read before continuing</h2> + <div id="welcome-modal-description"> + <p> + The Godot Web Editor has some limitations compared to the native version. + Its main focus is education and experimentation; + <strong>it is not recommended for production</strong>. + </p> + <p> + Refer to the + <a + href="https://docs.godotengine.org/en/latest/tutorials/editor/using_the_web_editor.html" + target="_blank" + rel="noopener" + >Web editor documentation</a> for usage instructions and limitations. + </p> + </div> + <button id="welcome-modal-dismiss" class="btn" type="button" onclick="closeWelcomeModal(true)" style="margin-top: 1rem"> + OK, don't show again + </button> + </div> + </div> <div id="tabs-buttons"> <button id="btn-tab-loader" class="btn tab-btn" onclick="showTab('loader')">Loader</button> <button id="btn-tab-editor" class="btn tab-btn" disabled="disabled" onclick="showTab('editor')">Editor</button> @@ -274,7 +327,19 @@ if ("serviceWorker" in navigator) { navigator.serviceWorker.register("service.worker.js"); } + + if (localStorage.getItem("welcomeModalDismissed") !== 'true') { + document.getElementById("welcome-modal").style.display = "block"; + document.getElementById("welcome-modal-dismiss").focus(); + } }); + + function closeWelcomeModal(dontShowAgain) { + document.getElementById("welcome-modal").style.display = "none"; + if (dontShowAgain) { + localStorage.setItem("welcomeModalDismissed", 'true'); + } + } </script> <script src="godot.tools.js"></script> <script>//<![CDATA[ |