From 87c271da900c1b80763fd7026c522f12efce5322 Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Tue, 18 Mar 2025 14:54:37 +0200
Subject: [PATCH 1/8] Implement createProgressBar and removeProgressBar methods

---
 .../com_media/js/edit-images.es6.js           | 28 +++++++++++++++----
 1 file changed, 23 insertions(+), 5 deletions(-)
 mode change 100644 => 100755 build/media_source/com_media/js/edit-images.es6.js

diff --git a/build/media_source/com_media/js/edit-images.es6.js b/build/media_source/com_media/js/edit-images.es6.js
old mode 100644
new mode 100755
index f621b53db64e1..b04d4c72f29bb
--- a/build/media_source/com_media/js/edit-images.es6.js
+++ b/build/media_source/com_media/js/edit-images.es6.js
@@ -156,16 +156,34 @@ class Edit {
   Redo() { }
 
   // @TODO Create the progress bar
-  // eslint-disable-next-line class-methods-use-this
-  createProgressBar() { }
+  /**
+   * Creates a progress bar element and inserts it into the DOM
+   */
+  createProgressBar() {
+    const mediaLoader = document.createElement('div');
+    mediaLoader.id = 'media-edit-progress';
+    mediaLoader.className = 'media-loader';
+
+    mediaLoader.style.top = '0';
+    mediaLoader.style.left = '0';
+    mediaLoader.style.zIndex = '1000';
+
+    this.baseContainer.insertAdjacentElement('beforebegin', mediaLoader);
+  }
 
   // @TODO Update the progress bar
-  // eslint-disable-next-line class-methods-use-this
   updateProgressBar(/* position */) { }
 
   // @TODO Remove the progress bar
-  // eslint-disable-next-line class-methods-use-this
-  removeProgressBar() { }
+  /**
+   * Removes the progress bar element from the DOM
+   */
+  removeProgressBar() {
+    const mediaLoader = document.getElementById('media-edit-progress');
+    if (mediaLoader) {
+      mediaLoader.remove();
+    }
+  }
 
   /**
    * Uploads

From bfc0b94cb470b0949eb22f44982d36d4ea7f7876 Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Tue, 18 Mar 2025 15:50:54 +0200
Subject: [PATCH 2/8] Add ESLint disable comments

---
 build/media_source/com_media/js/edit-images.es6.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/build/media_source/com_media/js/edit-images.es6.js b/build/media_source/com_media/js/edit-images.es6.js
index b04d4c72f29bb..3a4d24c909102 100755
--- a/build/media_source/com_media/js/edit-images.es6.js
+++ b/build/media_source/com_media/js/edit-images.es6.js
@@ -159,6 +159,7 @@ class Edit {
   /**
    * Creates a progress bar element and inserts it into the DOM
    */
+  // eslint-disable-next-line class-methods-use-this
   createProgressBar() {
     const mediaLoader = document.createElement('div');
     mediaLoader.id = 'media-edit-progress';
@@ -172,12 +173,14 @@ class Edit {
   }
 
   // @TODO Update the progress bar
+  // eslint-disable-next-line class-methods-use-this
   updateProgressBar(/* position */) { }
 
   // @TODO Remove the progress bar
   /**
    * Removes the progress bar element from the DOM
    */
+  // eslint-disable-next-line class-methods-use-this
   removeProgressBar() {
     const mediaLoader = document.getElementById('media-edit-progress');
     if (mediaLoader) {

From 6074e983f307571fb3383a5ac58c33d3f57da311 Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Tue, 18 Mar 2025 17:22:01 +0200
Subject: [PATCH 3/8] removed TODO's and comments

---
 build/media_source/com_media/js/edit-images.es6.js | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/build/media_source/com_media/js/edit-images.es6.js b/build/media_source/com_media/js/edit-images.es6.js
index 3a4d24c909102..1ed81448cec10 100755
--- a/build/media_source/com_media/js/edit-images.es6.js
+++ b/build/media_source/com_media/js/edit-images.es6.js
@@ -155,10 +155,6 @@ class Edit {
   // eslint-disable-next-line class-methods-use-this
   Redo() { }
 
-  // @TODO Create the progress bar
-  /**
-   * Creates a progress bar element and inserts it into the DOM
-   */
   // eslint-disable-next-line class-methods-use-this
   createProgressBar() {
     const mediaLoader = document.createElement('div');
@@ -176,10 +172,6 @@ class Edit {
   // eslint-disable-next-line class-methods-use-this
   updateProgressBar(/* position */) { }
 
-  // @TODO Remove the progress bar
-  /**
-   * Removes the progress bar element from the DOM
-   */
   // eslint-disable-next-line class-methods-use-this
   removeProgressBar() {
     const mediaLoader = document.getElementById('media-edit-progress');

From e85d8bb4461bfcc477cbdd92e4b56bdb1b22c642 Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Tue, 18 Mar 2025 23:13:55 +0200
Subject: [PATCH 4/8] Removed changing on left (redundant)

---
 build/media_source/com_media/js/edit-images.es6.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/build/media_source/com_media/js/edit-images.es6.js b/build/media_source/com_media/js/edit-images.es6.js
index 1ed81448cec10..2d8d8160543f8 100755
--- a/build/media_source/com_media/js/edit-images.es6.js
+++ b/build/media_source/com_media/js/edit-images.es6.js
@@ -162,7 +162,6 @@ class Edit {
     mediaLoader.className = 'media-loader';
 
     mediaLoader.style.top = '0';
-    mediaLoader.style.left = '0';
     mediaLoader.style.zIndex = '1000';
 
     this.baseContainer.insertAdjacentElement('beforebegin', mediaLoader);

From 5332bc27f1295e2ae8c3fbbe0a4879fe6e51b91d Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Wed, 19 Mar 2025 14:59:06 +0200
Subject: [PATCH 5/8] Revert Unix permissions

---
 build/media_source/com_media/js/edit-images.es6.js | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 mode change 100755 => 100644 build/media_source/com_media/js/edit-images.es6.js

diff --git a/build/media_source/com_media/js/edit-images.es6.js b/build/media_source/com_media/js/edit-images.es6.js
old mode 100755
new mode 100644

From fd4ec12cd5e547f274ee6bb165b292aff739c5cb Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Wed, 19 Mar 2025 15:48:41 +0200
Subject: [PATCH 6/8] Refactor progress bar implementation & Remove ESLint
 comments

---
 .../com_media/tmpl/file/default.php           | 11 ++++---
 .../com_media/js/edit-images.es6.js           | 29 +++++++++----------
 2 files changed, 20 insertions(+), 20 deletions(-)
 mode change 100644 => 100755 administrator/components/com_media/tmpl/file/default.php

diff --git a/administrator/components/com_media/tmpl/file/default.php b/administrator/components/com_media/tmpl/file/default.php
old mode 100644
new mode 100755
index a1807a44fc4d6..2889338a88386
--- a/administrator/components/com_media/tmpl/file/default.php
+++ b/administrator/components/com_media/tmpl/file/default.php
@@ -58,10 +58,13 @@
 $this->useCoreUI = true;
 ?>
 <?php if ($tmpl === 'component') : ?>
-<div class="subhead noshadow mb-3">
-    <?php echo $this->getDocument()->getToolbar('toolbar')->render(); ?>
-</div>
+    <div class="subhead noshadow mb-3">
+        <?php echo $this->getDocument()->getToolbar('toolbar')->render(); ?>
+    </div>
 <?php endif; ?>
+<div id="progress" class="progress visually-hidden">
+    <div id="progress-bar" class="progress-bar bg-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
+</div>
 <form action="#" method="post" name="adminForm" id="media-form" class="form-validate main-card media-form mt-3">
     <?php $fieldSets = $form->getFieldsets(); ?>
     <?php if ($fieldSets) : ?>
@@ -72,4 +75,4 @@
     <?php endif; ?>
     <input type="hidden" name="mediatypes" value="<?php echo $this->escape($mediaTypes); ?>">
 </form>
-<script type="module" src="<?php echo $script . '?' . $this->getDocument()->getMediaVersion(); ?>"></script>
+<script type="module" src="<?php echo $script . '?' . $this->getDocument()->getMediaVersion(); ?>"></script>
\ No newline at end of file
diff --git a/build/media_source/com_media/js/edit-images.es6.js b/build/media_source/com_media/js/edit-images.es6.js
index 2d8d8160543f8..e612cee7de389 100644
--- a/build/media_source/com_media/js/edit-images.es6.js
+++ b/build/media_source/com_media/js/edit-images.es6.js
@@ -155,27 +155,24 @@ class Edit {
   // eslint-disable-next-line class-methods-use-this
   Redo() { }
 
-  // eslint-disable-next-line class-methods-use-this
   createProgressBar() {
-    const mediaLoader = document.createElement('div');
-    mediaLoader.id = 'media-edit-progress';
-    mediaLoader.className = 'media-loader';
-
-    mediaLoader.style.top = '0';
-    mediaLoader.style.zIndex = '1000';
-
-    this.baseContainer.insertAdjacentElement('beforebegin', mediaLoader);
+    this.progress = document.getElementById('progress');
+    this.progressBar = document.querySelector('.progress-bar');
+    this.progress.classList.remove('visually-hidden');
   }
 
-  // @TODO Update the progress bar
-  // eslint-disable-next-line class-methods-use-this
-  updateProgressBar(/* position */) { }
+  updateProgressBar(position) {
+    if (this.progressBar) {
+      this.progressBar.style.width = `${position}%`;
+      this.progressBar.setAttribute('aria-valuenow', position);
+    }
+  }
 
-  // eslint-disable-next-line class-methods-use-this
   removeProgressBar() {
-    const mediaLoader = document.getElementById('media-edit-progress');
-    if (mediaLoader) {
-      mediaLoader.remove();
+    if (this.progress && this.progressBar) {
+      this.progress.classList.add('visually-hidden');
+      this.progressBar.style.width = '0';
+      this.progressBar.setAttribute('aria-valuenow', '0');
     }
   }
 

From 6998357df042c6e42741baf417a47b321f3c9428 Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Wed, 19 Mar 2025 17:52:42 +0200
Subject: [PATCH 7/8] Revert UNIX Permission for the template file

---
 administrator/components/com_media/tmpl/file/default.php | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 mode change 100755 => 100644 administrator/components/com_media/tmpl/file/default.php

diff --git a/administrator/components/com_media/tmpl/file/default.php b/administrator/components/com_media/tmpl/file/default.php
old mode 100755
new mode 100644

From 24c0333ad2083d22a75af57447589505103f57ff Mon Sep 17 00:00:00 2001
From: mahmoudmagdy1-1 <d4rkppl1@gmail.com>
Date: Sun, 13 Apr 2025 22:07:09 +0200
Subject: [PATCH 8/8] Fix indentation

---
 administrator/components/com_media/tmpl/file/default.php | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/administrator/components/com_media/tmpl/file/default.php b/administrator/components/com_media/tmpl/file/default.php
index 2889338a88386..0875c92f873ed 100644
--- a/administrator/components/com_media/tmpl/file/default.php
+++ b/administrator/components/com_media/tmpl/file/default.php
@@ -58,9 +58,9 @@
 $this->useCoreUI = true;
 ?>
 <?php if ($tmpl === 'component') : ?>
-    <div class="subhead noshadow mb-3">
-        <?php echo $this->getDocument()->getToolbar('toolbar')->render(); ?>
-    </div>
+<div class="subhead noshadow mb-3">
+    <?php echo $this->getDocument()->getToolbar('toolbar')->render(); ?>
+</div>
 <?php endif; ?>
 <div id="progress" class="progress visually-hidden">
     <div id="progress-bar" class="progress-bar bg-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
@@ -75,4 +75,4 @@
     <?php endif; ?>
     <input type="hidden" name="mediatypes" value="<?php echo $this->escape($mediaTypes); ?>">
 </form>
-<script type="module" src="<?php echo $script . '?' . $this->getDocument()->getMediaVersion(); ?>"></script>
\ No newline at end of file
+<script type="module" src="<?php echo $script . '?' . $this->getDocument()->getMediaVersion(); ?>"></script>