From 1f1e66be1198e3260ff15d964b5b2834dc5fb803 Mon Sep 17 00:00:00 2001
From: rizkyilhampra <rizkyilhamp16@gmail.com>
Date: Tue, 13 Jun 2023 19:09:15 +0800
Subject: [PATCH 1/5] change title

---
 resources/views/user/user.blade.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/views/user/user.blade.php b/resources/views/user/user.blade.php
index f3bcb4c..0621011 100644
--- a/resources/views/user/user.blade.php
+++ b/resources/views/user/user.blade.php
@@ -137,7 +137,7 @@ class="img-fluid chocolat-image"
         </div>
     </div>
     @can('asUser')
-        @section('title', 'User ' . html_entity_decode('&mdash;'))
+        @section('title', auth()->user()->name . html_entity_decode(' &mdash;'))
         @include('user.profile-modal')
         @include('user.detail-diagnosis-modal')
         @push('styleLibraries')

From 20642c77fc905bde5f921d483d61f11544851684 Mon Sep 17 00:00:00 2001
From: rizkyilhampra <rizkyilhamp16@gmail.com>
Date: Tue, 13 Jun 2023 19:37:49 +0800
Subject: [PATCH 2/5] change notyf condition and style

---
 public/spesified-assets/user/script.js | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/public/spesified-assets/user/script.js b/public/spesified-assets/user/script.js
index 4cf8a03..4d1b79c 100644
--- a/public/spesified-assets/user/script.js
+++ b/public/spesified-assets/user/script.js
@@ -220,12 +220,18 @@ function ajaxGetGejala() {
 document.addEventListener('DOMContentLoaded', async () => {
     const notyf = new Notyf({
         position: {
-            x: 'right',
+            x: 'center',
             y: 'top',
         },
         dismissible: true,
     });
 
+    if (isUser) {
+        if (login != false) {
+            notyf.success(login);
+        }
+    }
+
     const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
     const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(
         tooltipTriggerEl))
@@ -437,15 +443,6 @@ document.addEventListener('DOMContentLoaded', async () => {
         })
     }
 
-    if (isUser) {
-        if (login && !localStorage.getItem('notyfshown')) {
-            notyf.success(login);
-            localStorage.setItem('notyfshown', true);
-        } else {
-            localStorage.removeItem('notyfshown');
-        }
-    }
-
     const openImageChocolat = document.querySelectorAll('.open-image-chocolat');
 
     openImageChocolat.forEach((element, index) => {

From 8167ba9ec21c2ecee447537a9011636d19063f98 Mon Sep 17 00:00:00 2001
From: rizkyilhampra <rizkyilhamp16@gmail.com>
Date: Tue, 13 Jun 2023 19:41:38 +0800
Subject: [PATCH 3/5] change condition where Chocolat lib show

---
 .../user/detail-diagnosis-modal.js                | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/public/spesified-assets/user/detail-diagnosis-modal.js b/public/spesified-assets/user/detail-diagnosis-modal.js
index 480b1b8..7f1de72 100644
--- a/public/spesified-assets/user/detail-diagnosis-modal.js
+++ b/public/spesified-assets/user/detail-diagnosis-modal.js
@@ -117,11 +117,16 @@ function drawDetailDiagnosis(response, diagnosed) {
         });
 
         imagePenyakit.addEventListener('click', () => {
-            const chocolatInstance = Chocolat([{
-                src: assetStorage + '/' + response.penyakit.image,
-                title: response.penyakit.name,
-            }], {});
-            chocolatInstance.api.open();
+            const lebarLayar = window.innerWidth || document.documentElement.clientWidth || document
+                .body.clientWidth;
+
+            if (lebarLayar >= 992) {
+                const chocolatInstance = Chocolat([{
+                    src: assetStorage + '/' + response.penyakit.image,
+                    title: response.penyakit.name,
+                }], {});
+                chocolatInstance.api.open();
+            }
         });
     }
 }

From fc4295531a050baa4fb826983ce8486fae8f11b0 Mon Sep 17 00:00:00 2001
From: rizkyilhampra <rizkyilhamp16@gmail.com>
Date: Tue, 13 Jun 2023 19:45:13 +0800
Subject: [PATCH 4/5] change text

---
 resources/views/user/user.blade.php | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/resources/views/user/user.blade.php b/resources/views/user/user.blade.php
index 0621011..25920a9 100644
--- a/resources/views/user/user.blade.php
+++ b/resources/views/user/user.blade.php
@@ -29,14 +29,12 @@
                     <div class="card shadow border border-0">
                         <div class="card-body">
                             <div class="card-text">
-                                Sistem ini menggunakan metode forward chaining dalam mendiagnosis penyakit. Prosesnya
-                                dimulai dengan evaluasi gejala yang diberikan oleh pengguna, kemudian
-                                sistem akan mencocokkan dengan aturan yang ada. Jika terdapat aturan yang telah terpenuhi,
-                                sistem akan memberikan detail hasil diagnosis penyakit. Detail hasil diagnosis
-                                penyakit akan
-                                disimpan di
-                                dalam sistem. Pengguna dapat melihat kembali detail hasil diagnosis yang telah dilakukan
-                                pada histori diagnosis di menu profil.
+                                Sistem ini menggunakan metode forward chaining untuk mendiagnosis penyakit. Proses dimulai
+                                dengan mengevaluasi gejala yang diberikan oleh pengguna, kemudian sistem mencocokkannya
+                                dengan aturan yang ada. Jika terdapat aturan yang terpenuhi, sistem akan memberikan detail
+                                hasil diagnosis penyakit. Detail hasil diagnosis penyakit akan disimpan dalam sistem.
+                                Pengguna dapat melihat kembali detail hasil diagnosis yang telah dilakukan pada histori
+                                diagnosis di menu profil.
                             </div>
                             <div class="d-grid pt-3">
                                 <button id="btn-diagnosis" class="btn btn-custom1 py-2">

From 3052b0ae0dddfd7f539fe728d3fd67b5d2417f80 Mon Sep 17 00:00:00 2001
From: rizkyilhampra <rizkyilhamp16@gmail.com>
Date: Wed, 14 Jun 2023 14:43:26 +0800
Subject: [PATCH 5/5] add placeholder detaildiagnosismodal

---
 .../user/detail-diagnosis-modal.js            | 16 ++++++--
 resources/views/layouts/user/footer.blade.php |  2 +-
 .../user/detail-diagnosis-modal.blade.php     | 41 ++++++++++---------
 3 files changed, 35 insertions(+), 24 deletions(-)

diff --git a/public/spesified-assets/user/detail-diagnosis-modal.js b/public/spesified-assets/user/detail-diagnosis-modal.js
index 7f1de72..c0c242d 100644
--- a/public/spesified-assets/user/detail-diagnosis-modal.js
+++ b/public/spesified-assets/user/detail-diagnosis-modal.js
@@ -8,6 +8,7 @@ const headerPenyakitSolution = document.getElementById('headerPenyakitSolution')
 const rowDetailPenyakit = document.getElementById('rowDetailPenyakit');
 const detailJawabanDiagnosisTable = document.getElementById('detailJawabanDiagnosisTable');
 const tableBody = detailJawabanDiagnosisTable.querySelector('tbody');
+const placeholder = document.querySelectorAll('.placeholder');
 
 let idPenyakit = null;
 let idDiagnosis = null;
@@ -73,8 +74,6 @@ detailDiagnosisModal.addEventListener('show.bs.modal', async () => {
 function drawDetailDiagnosis(response, diagnosed) {
     if (diagnosed === false) {
         titleDetailDiagnosisModal.innerText = 'Detail Diagnosis No. ' + noHistoriDiagnosis;
-    } else {
-        titleDetailDiagnosisModal.innerText = 'Detail Diagnosis';
     }
 
     if (response.penyakit == null || response.penyakitUnidentified === true) {
@@ -89,7 +88,6 @@ function drawDetailDiagnosis(response, diagnosed) {
         headerDetailDiagnosis.classList.remove('d-none');
         subheaderDetailDiagnosis.classList.remove('d-none');
 
-        rowDetailPenyakit.classList.remove('d-none');
         const penyakitName = document.getElementById('penyakitName');
         const penyakitReason = document.getElementById('penyakitReason');
         penyakitName.innerHTML = response.penyakit.name;
@@ -129,6 +127,11 @@ function drawDetailDiagnosis(response, diagnosed) {
             }
         });
     }
+
+    //remove class placeholder
+    placeholder.forEach((item) => {
+        item.classList.remove('placeholder');
+    });
 }
 
 function drawDetailJawabanDiagnosis(data) {
@@ -164,14 +167,21 @@ detailDiagnosisModal.addEventListener('hide.bs.modal', () => {
     if (chartDiagnosisPenyakit != null) {
         chartDiagnosisPenyakit.destroy();
     }
+
+    rowDetailPenyakit.classList.remove('d-none');
 });
 
 detailDiagnosisModal.addEventListener('hidden.bs.modal', () => {
+
     if (!document.body.classList.contains('modal-open')) {
         document.body.classList.add('modal-open');
     } else {
         document.body.classList.remove('modal-open');
     }
+    //add class placeholder
+    placeholder.forEach((item) => {
+        item.classList.add('placeholder');
+    });
 });
 
 function drawChart(data) {
diff --git a/resources/views/layouts/user/footer.blade.php b/resources/views/layouts/user/footer.blade.php
index 2590ab5..7e2a88d 100644
--- a/resources/views/layouts/user/footer.blade.php
+++ b/resources/views/layouts/user/footer.blade.php
@@ -7,7 +7,7 @@
                 </p>
                 <p class="pt-3 pb-2">
                     <small>
-                        SPDHTC (Sistem Pakar Diagnosis Penyakit Tanaman Cabai) merupakan hasil dari tugas akhir tim
+                        SPDHTC (Sistem Pakar Diagnosis Penyakit Tanaman Cabai) merupakan hasil tugas akhir dari tim
                         pengembang di Prodi Teknik Informatika Politeknik negeri Banjarmasin. SPDHTC menggunakan data
                         yang diperoleh dari pakar yang berkompeten, sehingga keakuratan datanya dapat dipercaya. Latar
                         belakang mengapa SPDHTC dibangun adalah untuk membantu masyarakat, terutama para petani cabai,
diff --git a/resources/views/user/detail-diagnosis-modal.blade.php b/resources/views/user/detail-diagnosis-modal.blade.php
index 592f6a2..91d80ab 100644
--- a/resources/views/user/detail-diagnosis-modal.blade.php
+++ b/resources/views/user/detail-diagnosis-modal.blade.php
@@ -1,19 +1,19 @@
-<div class="modal fade" id="detailDiagnosisModal">
+<div class="modal fade placeholder-glow" id="detailDiagnosisModal">
     <div class="modal-dialog modal-dialog-scrollable modal-dialog-centered modal-fullscreen">
         <div class="modal-content">
             <div class="modal-header">
-                <h1 class="modal-title h4"></h1>
-                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                <h1 class="modal-title h4 placeholder">Detail Diagnosis</h1>
+                <button type="button" class="btn-close placeholder" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <div class="modal-body">
                 <div class="container">
-                    <h1 id="headerDetailDiagnosis" class="font-semibold text-center pt-5 d-none">
+                    <h1 id="headerDetailDiagnosis" class="font-semibold placeholder text-center pt-5 d-none">
                     </h1>
-                    <p id="subheaderDetailDiagnosis" class="h3 font-normal text-center d-none">
+                    <p id="subheaderDetailDiagnosis" class="h3 placeholder font-normal text-center d-none">
                     </p>
                     <div class="row pt-5" id="rowDetailPenyakit">
-                        <div class="col-12">
-                            <h2 class="font-semibold pb-3">
+                        <div class="col-12 ">
+                            <h2 class="font-semibold pb-3 placeholder">
                                 Detail Penyakit
                             </h2>
                             <div class="card border border-0  shadow">
@@ -21,21 +21,22 @@
                                     <div class="row">
                                         <div class="col-12 col-lg-8 pt-5 pt-lg-0 order-1">
                                             <div class="pb-3">
-                                                <h3 class="h4">Nama Penyakit</h3>
-                                                <p class="card-text" id="penyakitName">
+                                                <h3 class="h4 placeholder">Nama Penyakit</h3>
+                                                <p class="card-text placeholder" id="penyakitName">
                                                 </p>
                                             </div>
                                             <div class="pb-3">
-                                                <h3 class="h4 ">Penyebab Penyakit</h3>
-                                                <p class="card-text" id="penyakitReason">
+                                                <h3 class="h4 placeholder">Penyebab Penyakit</h3>
+                                                <p class="card-text placeholder" id="penyakitReason">
                                                 </p>
                                             </div>
                                             <div>
-                                                <h3 id="headerPenyakitSolution" class="h4">Solusi Penyakit</h3>
+                                                <h3 id="headerPenyakitSolution" class="h4 placeholder">Solusi Penyakit
+                                                </h3>
                                             </div>
                                         </div>
                                         <div
-                                            class="col-12 col-lg-4 order-lg-2 d-flex align-items-center justify-content-center">
+                                            class="col-12 col-lg-4 order-lg-2 d-flex align-items-center justify-content-center placeholder">
                                             <div class="container-image-penyakit"
                                                 id="containerImagePenyakitDetailDiagnosisModal"
                                                 style="max-width: 350px;">
@@ -46,14 +47,14 @@ class="col-12 col-lg-4 order-lg-2 d-flex align-items-center justify-content-cent
                             </div>
                         </div>
                     </div>
-                    <div class="row py-5">
-                        <h2 class="font-semibold pb-3">
+                    <div class="row py-5 ">
+                        <h2 class="font-semibold pb-3 placeholder">
                             Histori Jawaban
                         </h2>
                         <div class="card border border-0 shadow" style="max-height: 400px; overflow-y: scroll">
                             <div class="card-body">
-                                <div class="table-responsive">
-                                    <table class="table table-striped" id="detailJawabanDiagnosisTable">
+                                <div class="table-responsive ">
+                                    <table class="table table-striped placeholder" id="detailJawabanDiagnosisTable">
                                         <thead>
                                             <tr>
                                                 <th scope="col">No</th>
@@ -68,12 +69,12 @@ class="col-12 col-lg-4 order-lg-2 d-flex align-items-center justify-content-cent
                             </div>
                         </div>
                     </div>
-                    <div class="row pb-5">
-                        <h2 class="font-semibold pb-3">
+                    <div class="row pb-5 ">
+                        <h2 class="font-semibold pb-3 placeholder">
                             Persentase Penyakit
                         </h2>
                         <div class="card border border-0 shadow">
-                            <div class="card-body">
+                            <div class="card-body placeholder">
                                 <canvas id="chartDiagnosisPenyakit" height="300"></canvas>
                             </div>
                         </div>