From 1ed14519e723bd63f3bec19f8f764b399f5ef083 Mon Sep 17 00:00:00 2001
From: Aljaz Grilc <aljaz.grilc@amebis.si>
Date: Tue, 26 Mar 2024 10:53:02 +0100
Subject: [PATCH] Tweak registering besService and unify textarea and div
 contenteditable classes

---
 index.html | 55 ++++++++++++++++++++++++------------------------------
 service.js |  8 +++-----
 2 files changed, 27 insertions(+), 36 deletions(-)
diff --git a/index.html b/index.html
index ed1b620..a3c18cb 100644
--- a/index.html
+++ b/index.html
@@ -8,45 +8,42 @@
     <script src="service.js"></script>
   </head>
   <body>
-    <div class="bes-service" contenteditable="true">Tukaj vpišite besedilo ki ga želite popraviti.</div>
-    <br>
-    <!-- <div class="bes-service" contenteditable="true"></div> -->
-    <!-- <br />
-    <div class="bes-service" contenteditable="true"><div>Popravite kar želite.</div></div> -->
+    <!-- <div class="bes-service any-other-class" contenteditable="true">Tukaj vpišite besedilo ki ga želite popraviti.</div>
+    <br /> -->
+    <!-- <div class="bes-service any-other-class" contenteditable="true"></div>
+    <br /> -->
+    <!-- <div class="bes-service any-other-class" contenteditable="true"><div>Popravite kar želite.</div></div>
+    <br> -->
     <!-- TODO: In the example below, BesService suggests wrong replacement (with included HTML tag) -->
-    <!-- <br>
-    <div class="bes-service" contenteditable="true"><div>Popravite <a href=".">kar želite</a>.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div> -->
-    <!-- <br>
-    <div class="bes-service" contenteditable="true">To je preiskus.</div> -->
-    <!--<br>
-    <div class="bes-service" contenteditable="true"><div class="contextual"><p>Madžarski premier Orban je tako očitno vendarle pristal na nadaljnjo makrofinančno pomoč Ukrajini v okviru revizije dolgoročnega proračuna unije 2021-2027. Ta vključuje 50 milijard evrov za Ukrajino za prihodnja štiri leta, od tega 33 milijard evrov posojil in 17 milijard evrov nepovratnih sredstev.</p></div></div>-->
-    <!-- <br>
-    <div class="bes-service" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div> -->
-    <!-- <br>
-    <div class="bes-service" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite. Na mizo nisem položil knjigo.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div> -->
+    <!-- <div class="bes-service any-other-class" contenteditable="true"><div>Popravite <a href=".">kar želite</a>.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>
+    <br> -->
+    <!-- <div class="bes-service any-other-class" contenteditable="true">To je preiskus.</div>
+    <br> -->
+    <div class="bes-service any-other-class" contenteditable="true"><div class="contextual"><p>Madžarski premier Orban je tako očitno vendarle pristal na nadaljnjo makrofinančno pomoč Ukrajini v okviru revizije dolgoročnega proračuna unije 2021-2027. Ta vključuje 50 milijard evrov za Ukrajino za prihodnja štiri leta, od tega 33 milijard evrov posojil in 17 milijard evrov nepovratnih sredstev.</p></div></div>
+    <br>
+    <div class="bes-service any-other-class" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>
+    <br>
+    <div class="bes-service any-other-class" contenteditable="true"><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite. Na mizo nisem položil knjigo.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div><div>Popravite kar želite.</div><div>Na mizo nisem položil knjigo. Popravite kar želite.</div></div>
     <br />
-    <textarea class="bes-service-textarea"></textarea>
+    <textarea class="bes-service any-other-class"></textarea>
+    <br />
+    <textarea class="bes-service any-other-class"></textarea>
+    <br />
+    <textarea class="bes-service any-other-class"></textarea>
+    <br />
+    <textarea class="bes-service any-other-class"></textarea>
     <bes-popup-el></bes-popup-el>
   </body>
 </html>
 <style>
   .bes-service {
-    width: 80%;
-    height: 300px;
-    margin: 0 auto;
-    padding: 20px;
-    border-radius: 10px;
-    background-color: #f5f5f5;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
-    line-height: 1.6;
-    white-space: pre-wrap;
     overflow-y: auto;
-    font-family: Arial, Helvetica, sans-serif;
+    white-space: pre-wrap;
     z-index: 2;
     position: relative;
   }
 
-  .bes-service-textarea {
+  .any-other-class{
     width: 80%;
     height: 300px;
     margin: 0 auto;
@@ -55,10 +52,6 @@
     background-color: #f5f5f5;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
     line-height: 1.6;
-    white-space: pre-wrap;
-    overflow-y: auto;
     font-family: Arial, Helvetica, sans-serif;
-    z-index: 2;
-    position: relative;
   }
 </style>
diff --git a/service.js b/service.js
index 80c819b..69706e0 100644
--- a/service.js
+++ b/service.js
@@ -994,11 +994,9 @@ class BesPopupEl extends HTMLElement {
 }
 
 window.onload = () => {
-  document
-    .querySelectorAll('.bes-service')
-    .forEach(hostElement => BesService.register(hostElement))
-  document.querySelectorAll('.bes-service-textarea').forEach(hostElement => {
-    BesTAService.register(hostElement)
+  document.querySelectorAll('.bes-service').forEach(hostElement => {
+    if (hostElement.tagName === 'TEXTAREA') BesTAService.register(hostElement)
+    else BesService.register(hostElement)
   })
 }
 
