From e0a143987f96d4378eb28bc8d4d90bbb053173d3 Mon Sep 17 00:00:00 2001
From: Piero Toffanin <pt@masseranolabs.com>
Date: Mon, 9 Oct 2023 14:36:20 -0400
Subject: [PATCH] Improve loading, add TM warning

---
 libretranslate/static/css/main.css       | 8 ++++++++
 libretranslate/templates/app.js.template | 6 ++++++
 libretranslate/templates/index.html      | 6 +++---
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/libretranslate/static/css/main.css b/libretranslate/static/css/main.css
index f9cb39a..75f01dc 100644
--- a/libretranslate/static/css/main.css
+++ b/libretranslate/static/css/main.css
@@ -74,6 +74,14 @@ a:not(.noline) {
   min-height: 80vh;
 }
 
+.component{
+  visibility: hidden;
+}
+
+#app.loaded .component{
+  visibility: visible;
+}
+
 h3.header {
   margin-bottom: 2.5rem;
 }
diff --git a/libretranslate/templates/app.js.template b/libretranslate/templates/app.js.template
index 4faa119..adf234f 100644
--- a/libretranslate/templates/app.js.template
+++ b/libretranslate/templates/app.js.template
@@ -45,6 +45,7 @@ document.addEventListener('DOMContentLoaded', function(){
         },
         mounted: function() {
             const self = this;
+            self.$el.classList.add("loaded");
 
             const settingsRequest = new XMLHttpRequest();
             settingsRequest.open("GET", BaseUrl + "/frontend/settings", true);
@@ -68,6 +69,11 @@ document.addEventListener('DOMContentLoaded', function(){
                     } else {
                         langsRequest.onload = function() {
                             handleLangsResponse(self, this);
+
+                            var hostname = window.location.hostname.toLowerCase();
+                            if (hostname.indexOf("libretranslate.") === 0 && !hostname.endsWith(".com")){
+                                self.error = "This website might be in violation of our trademark guidelines: https://github.com/LibreTranslate/LibreTranslate/blob/main/TRADEMARK.md";
+                            }
                         }
                     }
                 } else {
diff --git a/libretranslate/templates/index.html b/libretranslate/templates/index.html
index 86e3952..9b66f9d 100644
--- a/libretranslate/templates/index.html
+++ b/libretranslate/templates/index.html
@@ -141,11 +141,11 @@
 		</div>
 	</div>
 
-	<div v-else-if="error">
+	<div v-else-if="error" class="component">
 		<div class="section no-pad-bot">
 			<div class="container">
 				<div class="row">
-					<div class="col s12 m7">
+					<div class="col s12 m12">
 					<div class="card horizontal">
 						<div class="card-stacked">
 						<div class="card-content">
@@ -162,7 +162,7 @@
 		</div>
 	</div>
 
-	<div v-else>
+	<div v-else class="component">
 		<div class="section no-pad-bot">
 			<div class="container">
 				<div class="row">