|
|
@@ -27,6 +27,26 @@
|
|
|
integrity="sha256-4MX+61mt9NVvvuPjUWdUdyfZfxSB1/Rf9WtqRHgG5S0=" crossorigin="anonymous">
|
|
|
<!-- <link rel="stylesheet" href="{% static 'dist/WOW-master/css/libs/animate.css' %}"> -->
|
|
|
<link rel="stylesheet" href="{% static 'css/custom.css' %}">
|
|
|
+ <style>
|
|
|
+ #full-page-loader {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: rgba(0, 0, 0, 0.6); /* semi-transparent black */
|
|
|
+ z-index: 9999;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .loader-overlay .spinner-border {
|
|
|
+ width: 3rem;
|
|
|
+ height: 3rem;
|
|
|
+ }
|
|
|
+
|
|
|
+ </style>
|
|
|
</head>
|
|
|
|
|
|
<body class="layout-fixed sidebar-expand-lg sidebar-mini app-loaded sidebar-collapse"> <!--begin::App Wrapper-->
|
|
|
@@ -136,8 +156,16 @@
|
|
|
</div>
|
|
|
<div class="app-content"> <!--begin::Container-->
|
|
|
<div class="container-fluid"> <!-- Info boxes -->
|
|
|
+ <!-- Full Page Loader -->
|
|
|
+ <div id="full-page-loader" style="display: none;">
|
|
|
+ <div class="loader-overlay">
|
|
|
+ <div class="spinner-border text-light" role="status">
|
|
|
+ <!-- <span class="sr-only">Loading...</span> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
<div id="html"></div>
|
|
|
- <div class="row mt-5">
|
|
|
+ <div class="row mt-5 ai-fix-issues-button" style="display: none;">
|
|
|
<div class="col-sm-12 text-center">
|
|
|
<button class="btn btn-primary wow lightSpeedIn" data-wow-delay="1s"
|
|
|
onclick="$(this).hide();$('.after_score').removeClass('d-none');">AI
|
|
|
@@ -145,6 +173,10 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div> <!--end::Row--> <!--begin::Row-->
|
|
|
+ <!-- Loader (initially hidden) -->
|
|
|
+ <!-- <div id="ai-loader" class="spinner-border text-primary mt-3" role="status" style="display: none;">
|
|
|
+ <span class="sr-only">Loading...</span>
|
|
|
+ </div> -->
|
|
|
|
|
|
</div> <!--end::Container-->
|
|
|
</main> <!--end::App Main--> <!--begin::Footer-->
|
|
|
@@ -201,9 +233,12 @@
|
|
|
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
|
<!-- <script src="{% static 'dist/WOW-master/dist/wow.js' %}"></script> -->
|
|
|
<script>
|
|
|
+ const mediaUrl = "./../media/";
|
|
|
+ console.log("mediaUrl",mediaUrl);
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
|
// const responseDiv = document.getElementById('batchScoreMessage');
|
|
|
-
|
|
|
+ // Show loader
|
|
|
+ $('#full-page-loader').show();
|
|
|
fetch('/core/api/batch-score/', {
|
|
|
method: 'GET', // or 'POST' if your API expects POST
|
|
|
headers: {
|
|
|
@@ -218,7 +253,7 @@
|
|
|
// console.log(element.final_score);
|
|
|
var initial_score = '';
|
|
|
var after_score = ''
|
|
|
- var base_keys = { 'Title': 'title_quality', 'Description': 'description_quality', 'Image': 'image_score', 'SEO': 'seo_discoverability', 'Attributes': 'attributes' }
|
|
|
+ var base_keys = { 'Title': 'title_quality', 'Description': 'description_quality', 'Image': 'image_score', 'Attributes': 'attributes' }
|
|
|
|
|
|
|
|
|
|
|
|
@@ -235,6 +270,7 @@
|
|
|
// console.log(element.categorized_feedback[key].issues);
|
|
|
intial_desc = element.categorized_feedback[key].issues.join(', ');
|
|
|
}
|
|
|
+
|
|
|
|
|
|
initial_score += `<tr>
|
|
|
<td class="wow bounceInLeft">
|
|
|
@@ -258,7 +294,7 @@
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="wow bounceInLeft" colspan='2' data-wow-delay="0.2s">
|
|
|
- <div style='max-height:50px;overflow-y:auto;'>
|
|
|
+ <div style='max-height:100px;overflow-y:auto;'>
|
|
|
<small>
|
|
|
`+ intial_desc + `
|
|
|
</small>
|
|
|
@@ -271,28 +307,75 @@
|
|
|
let name = k;
|
|
|
k = k.toLowerCase();
|
|
|
var ik = 'improved_' + k
|
|
|
+ console.log("ik",ik);
|
|
|
var after_desc = '';
|
|
|
if (element.ai_suggestions.content[ik]) {
|
|
|
console.log(element.ai_suggestions.content);
|
|
|
after_desc = element.ai_suggestions.content[ik];
|
|
|
}
|
|
|
|
|
|
- after_score += `<tr>
|
|
|
- <td class="wow bounceInLeft">
|
|
|
- <a>
|
|
|
- `+ name + `
|
|
|
- </a>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td class="wow bounceInLeft" colspan='2' data-wow-delay="0.2s">
|
|
|
- <div style='max-height:50px;overflow-y:auto;'>
|
|
|
- <small>
|
|
|
- `+ after_desc + `
|
|
|
- </small>
|
|
|
- </div>
|
|
|
- </td>
|
|
|
- </tr>`;
|
|
|
+ let missing_attributes = '';
|
|
|
+ if(k == "attributes"){
|
|
|
+ if(element?.ai_suggestions?.content?.missing_attributes){
|
|
|
+ Object.entries(element?.ai_suggestions?.content?.missing_attributes).forEach(([key, value]) => {
|
|
|
+ missing_attributes += `<li><span class="attribute-label">${key}:</span> ${value}</li>`
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ if(k == "image"){
|
|
|
+ after_score += `<tr>
|
|
|
+ <td class="wow bounceInLeft">
|
|
|
+ <a>
|
|
|
+ `+ name + ` Note
|
|
|
+ </a>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="wow bounceInLeft" colspan='2' data-wow-delay="0.2s">
|
|
|
+ <div style='max-height:100px;overflow-y:auto;'>
|
|
|
+ <small>
|
|
|
+ `+ element?.ai_suggestions?.image?.note + `
|
|
|
+ </small>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>`;
|
|
|
+ }else if(k == "attributes"){
|
|
|
+ after_score += `<tr>
|
|
|
+ <td class="wow bounceInLeft">
|
|
|
+ <a>
|
|
|
+ Missing `+ name + `
|
|
|
+ </a>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="wow bounceInLeft" colspan='2' data-wow-delay="0.2s">
|
|
|
+ <div style='max-height:100px;overflow-y:auto;'>
|
|
|
+ <small> <ul>
|
|
|
+ `+ missing_attributes + `
|
|
|
+ </ul></small>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>`;
|
|
|
+ }else{
|
|
|
+ after_score += `<tr>
|
|
|
+ <td class="wow bounceInLeft">
|
|
|
+ <a>
|
|
|
+ `+ name + `
|
|
|
+ </a>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="wow bounceInLeft" colspan='2' data-wow-delay="0.2s">
|
|
|
+ <div style='max-height:100px;overflow-y:auto;'>
|
|
|
+ <small>
|
|
|
+ `+ after_desc + `
|
|
|
+ </small>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>`;
|
|
|
+ }
|
|
|
})
|
|
|
|
|
|
|
|
|
@@ -300,7 +383,7 @@
|
|
|
<div class="col-md-4">
|
|
|
<div class="card">
|
|
|
<img class="card-img-top wow pulse" data-wow-iteration="2"
|
|
|
- src="`+element.image_path+`">
|
|
|
+ src="`+mediaUrl+element.image_path+`">
|
|
|
<div class="card-block">
|
|
|
<h4 class="card-title wow bounceInLeft" data-wow-delay="0.1s">`+element.title+`</h4>
|
|
|
<div class="card-text wow bounceInLeft" data-wow-delay="0.2s">`+element.description+`</div>
|
|
|
@@ -333,7 +416,7 @@
|
|
|
<div class="col-md-4 after_score d-none">
|
|
|
<div class="card">
|
|
|
<div class="card-header py-2">
|
|
|
- <div class="text-sm mb-0">After Score</div>
|
|
|
+ <div class="text-sm mb-0">Forecasted Score</div>
|
|
|
</div>
|
|
|
<div class="card-body text-center wow bounceInDown" data-wow-iteration="0.5">
|
|
|
<input type="text" class="dial" value="`+ element.ai_suggestions.content.quality_score_prediction + `" data-width="120" data-height="120"
|
|
|
@@ -356,8 +439,12 @@
|
|
|
|
|
|
$('#html').html(html);
|
|
|
$('.dial').knob();
|
|
|
+
|
|
|
+ document.querySelector('.ai-fix-issues-button').style.display = 'block';
|
|
|
+ $('#full-page-loader').hide();
|
|
|
// });
|
|
|
new WOW().init();
|
|
|
+
|
|
|
// responseDiv.innerHTML = `<div class="alert alert-success">✅ ${data.message}</div>`;
|
|
|
} else {
|
|
|
// responseDiv.innerHTML = `<div class="alert alert-danger">❌ ${data.error}</div>`;
|