fixed ranges input label

index.html

@@ -24,6 +24,8 @@
     <script src="./scripts/getTeachers.js"></script>
     <script src="./scripts/rating.js"></script>
     <script src="./scripts/popup.js" defer></script>
+    <script src="./scripts/page.js" defer></script>
+
 
     <title>CESCO LEAK</title>
 </head>
@@ -114,29 +116,29 @@ <h1 class="main-header-title-text2">cl</p>
                 <div class="score">
                     <p class="score-title">Autorité</p>
                     <div class="score-value">
-                        <input id="ratingAuthority" class="value" type="range" min="1" max="10" value="5>
-                        <p id=" ratingText1">3</p>
+                        <input id="ratingAuthority" class="value" type="range" min="1" max="10" value="5">
+                        <p id="ratingText1">5</p>
                     </div>
                 </div>
                 <div class="score">
                     <p class="score-title">Humour</p>
                     <div class="score-value">
                         <input id="ratingHumor" class="value" type="range" min="1" max="10" value="5">
-                        <p id="ratingText2">3</p>
+                        <p id="ratingText2">5</p>
                     </div>
                 </div>
                 <div class="score">
                     <p class="score-title">Qualité d'enseignement</p>
                     <div class="score-value">
                         <input id="ratingTeachingQuality" class="value" type="range" min="1" max="10" value="5">
-                        <p id="ratingText3">3</p>
+                        <p id="ratingText3">5</p>
                     </div>
                 </div>
                 <div class="score">
                     <p class="score-title">Gentilesse</p>
                     <div class="score-value">
                         <input id="ratingKindness" class="value" type="range" min="1" max="10" value="5">
-                        <p id="ratingText4">3</p>
+                        <p id="ratingText4">5</p>
                     </div>
                 </div>
                 <button id="voteRatingButton" class="standard-button save-ratings">Voter</button>

scripts/page.js

@@ -0,0 +1,29 @@
+const imageInput = document.getElementById('uploadPhoto');
+const previewImage = document.getElementById('previewImage');
+const standardPopupContentMessages = document.getElementById('standardPopupContentMessages')
+
+const ratingValues = document.querySelectorAll(".value");
+const ratingTexts = document.querySelectorAll(".score-value p");
+
+ratingValues.forEach((value, index) => {
+    value.addEventListener("input", function() {
+        ratingTexts[index].textContent = this.value;
+    });
+});
+
+imageInput.addEventListener('change', function(event) {
+    const file = event.target.files[0];
+    if (file) {
+        const reader = new FileReader();
+        reader.onload = function(e) {
+            previewImage.src = e.target.result;
+        };
+        reader.readAsDataURL(file);
+    } else {
+        previewImage.src = '#';
+    }
+});
+
+window.onload = function() {
+    standardPopupContentMessages.scrollTop = standardPopupContentMessages.scrollHeight;
+};