changes for the UI of content scorecard

content_quality_tool_public/templates/get-data.html

@@ -269,7 +269,7 @@ function filterProductsByCategory() {
     // We assume that the category is available at the top level of each product object.
     const filteredData = apiresults_without_filter.filter(product => {
         // Ensure both values are compared consistently (case-insensitive trim)
-        const productCategory = product.category ? product.category.trim().toLowerCase() : '';
+        const productCategory = product.category ? product.category.trim().toLowerCase() : product.product_type ? product.product_type.trim().toLowerCase() : '';
         const filterValue = targetCategory.trim().toLowerCase();
         
         return productCategory === filterValue;
@@ -278,6 +278,7 @@ function filterProductsByCategory() {
     return filteredData;
 }
         document.addEventListener('DOMContentLoaded', function () {
+            var html = '';
             // const responseDiv = document.getElementById('batchScoreMessage');
             // Show loader
             $('#full-page-loader').show();
@@ -311,7 +312,7 @@ function filterProductsByCategory() {
 
                     apiresults.forEach(item => {
                         const valuesUsed = item?.ai_suggestions?.title_construction?.values_used || [];
-                        const productType = item?.category || 'Unknown';
+                        const productType = item?.category || item?.product_type || 'Unknown';
                         const score = item.final_score || 0;
                         const breakdown = item.breakdown || {};
                         const titleQuality = breakdown.title_quality || 0;
@@ -372,7 +373,7 @@ function filterProductsByCategory() {
                         var after_score = ''
                         var base_keys = { 'Title': 'title_quality', 'Description': 'description_quality', 'Image': 'image_score', 'Attributes': 'attributes' }
 
-
+                        
 
                         Object.entries(base_keys).forEach(([key, value]) => {
                             let name = key;
@@ -906,7 +907,7 @@ function filterProductsByCategory() {
 
                     data.results.forEach(item => {
                         const valuesUsed = item?.ai_suggestions?.title_construction?.values_used || [];
-                        const productType = item?.category || 'Unknown';
+                        const productType = item?.category || item?.product_type || 'Unknown';
                         const score = item.final_score || 0;
                         const breakdown = item.breakdown || {};
                         const titleQuality = breakdown.title_quality || 0;
@@ -964,6 +965,7 @@ function filterProductsByCategory() {
                     localStorage.setItem('performanceAnalysis',JSON.stringify(output));
 
                     console.log('Generated Metrics:', output);
+                    $('#full-page-loader').hide();
 
 
                     // responseDiv.innerHTML = `<div class="alert alert-success">✅ ${data.message}</div>`;

content_quality_tool_public/templates/index.html

@@ -184,6 +184,7 @@
         integrity="sha256-+vh8GkaU7C9/wbSLIcwq82tQ2wTf44aOHA8HlBMwRI8=" crossorigin="anonymous"></script>
     <script>
         document.addEventListener('DOMContentLoaded', function () {
+        localStorage.setItem('isNewFileUpload',0);    
         const form = document.getElementById('uploadForm');
         const fileInput = document.getElementById('fileInput');
         const submitBtn = document.getElementById('submitBtn');
@@ -232,6 +233,7 @@
             .finally(() => {
                 submitBtn.textContent = 'Upload';
                 $('#full-page-loader').hide();
+                
 
                 // Remove message after 5 seconds
                 setTimeout(() => {

content_quality_tool_public/templates/product-performance-analysis.html

@@ -225,25 +225,25 @@ border-left: 5px solid #e20303; /* Green */
                     <div class="row g-4 text-center">
                         <div class="col-md-3">
                             <div class="score-card excellent">
-                                <h2 id="excellence_performance">3</h2>
+                                <h2 id="excellence_performance">0</h2>
                                 <p>Excellent Performers</p>
                             </div>
                         </div>
                         <div class="col-md-3">
                             <div class="score-card good">
-                                <h2  id="good_performance">4</h2>
+                                <h2  id="good_performance">0</h2>
                                 <p>Good Performers</p>
                             </div>
                         </div>
                         <div class="col-md-3">
                             <div class="score-card fair">
-                                <h2  id="fair_performance">2</h2>
+                                <h2  id="fair_performance">0</h2>
                                 <p>Fair Performers</p>
                             </div>
                         </div>
                         <div class="col-md-3">
                             <div class="score-card poor">
-                                <h2  id="poor_performance">1</h2>
+                                <h2  id="poor_performance">0</h2>
                                 <p>Poor Performers</p>
                             </div>
                         </div>
@@ -293,7 +293,7 @@ border-left: 5px solid #e20303; /* Green */
                             </thead>
                             <tbody id="productTableBody">
                                 <tr>
-                                    <td>CeraVe</td>
+                                    <!-- <td>CeraVe</td>
                                     <td>3</td>
                                     <td>92.3</td>
                                     <td>100%</td>
@@ -302,14 +302,14 @@ border-left: 5px solid #e20303; /* Green */
                                     <td>0%</td>
                                     <td>9.2</td>
                                     <td>18.7</td>
-                                    <td>22.3</td>
+                                    <td>22.3</td> -->
                                     <!-- <td>19.7</td> -->
                                     <!-- <td>+2.1</td> -->
                                     <!-- <td><span class="category-tag">Skincare</span></td> -->
-                                    <td>
-                                        <button class="btn btn-view btn-sm">View</button>
+                                    <!-- <td> -->
+                                        <!-- <button class="btn btn-view btn-sm">View</button> -->
                                         <!-- <button class="btn btn-edit btn-sm">Edit</button> -->
-                                    </td>
+                                    <!-- </td> -->
                                 </tr>
                                 <!-- Add more rows as needed -->
                             </tbody>
@@ -597,7 +597,7 @@ border-left: 5px solid #e20303; /* Green */
         });
     </script>
     <script>
-         if (localStorage.getItem('analyticsdata') !== null) {
+         if (localStorage.getItem('analyticsdata') !== null && localStorage.getItem('isNewFileUpload') && localStorage.getItem('isNewFileUpload') == 1) {
                 console.log('Data key exists in localStorage');
                 apiresults_stringify = localStorage.getItem('analyticsdata');
                 apiresults = JSON.parse(apiresults_stringify);
@@ -624,7 +624,7 @@ border-left: 5px solid #e20303; /* Green */
 
                     apiresults.forEach(item => {
                         const valuesUsed = item?.ai_suggestions?.title_construction?.values_used || [];
-                        const productType = item?.category || 'Unknown';
+                        const productType = item?.category || item?.product_type || 'Unknown';
                         const score = item.final_score || 0;
                         const breakdown = item.breakdown || {};
                         const titleQuality = breakdown.title_quality || 0;
@@ -683,6 +683,7 @@ border-left: 5px solid #e20303; /* Green */
                     updateScoreCards(output);
 
                     console.log('Generated Metrics:', output);
+                    $('#full-page-loader').hide();
              } else {
                 console.log('Data key not found');
                 $('#full-page-loader').show();
@@ -695,7 +696,8 @@ border-left: 5px solid #e20303; /* Green */
             .then(response => response.json())
             .then(data => {
                 if (data.success) {
-                    var html = '';
+                    localStorage.setItem('isNewFileUpload',1);   
+                    // var html = '';
                     localStorage.setItem('analyticsdata',JSON.stringify(data.results));
                     
                     // Define performance buckets
@@ -719,7 +721,7 @@ border-left: 5px solid #e20303; /* Green */
 
                     data.results.forEach(item => {
                         const valuesUsed = item?.ai_suggestions?.title_construction?.values_used || [];
-                        const productType = item?.category || 'Unknown';
+                        const productType = item?.category || item?.product_type || 'Unknown';
                         const score = item.final_score || 0;
                         const breakdown = item.breakdown || {};
                         const titleQuality = breakdown.title_quality || 0;
@@ -780,7 +782,7 @@ border-left: 5px solid #e20303; /* Green */
                     updateScoreCards(output);
 
                     console.log('Generated Metrics:', output);
-                    $('#full-page-loader').show();
+                    $('#full-page-loader').hide();
 
                     // responseDiv.innerHTML = `<div class="alert alert-success">✅ ${data.message}</div>`;
                 } else {