fix: #1044 - picture-profile update events;

Betarena · Feb 16, 2023 · 2c0638c · 2c0638c
1 parent 2e9ffc2
commit 2c0638c
Showing 1 changed file with 13 additions and 30 deletions.
diff --git a/src/lib/components/page/profile/Modal-ProfilePictureCrop.svelte b/src/lib/components/page/profile/Modal-ProfilePictureCrop.svelte
@@ -39,46 +39,32 @@ COMPONENT JS (w/ TS)
 	 */
 	export function load_picture(file: File): void {
 		let image: HTMLImageElement = document.getElementById('profile-image');
-    let imageOuter: HTMLElement = document.getElementById('image-box-in');
+    let resize_elemnts: HTMLCollectionOf<Element> = document.getElementsByClassName('resize-dot')
+    let imageCropBox: HTMLElement = document.getElementById('profile-cricle-img-crop');
 		image.src = URL.createObjectURL(file);
 		image.onload = function () {
-      imageOuter.addEventListener('mouseenter', start_all_listeners, true)
-      imageOuter.addEventListener('mouseout', clear_event_listeners, true)
-			reset_crop = true;
+      reset_crop = true;
       reset_resize = true;
+      imageCropBox.addEventListener('touchstart', mousedown_event, true);
+      window.addEventListener('touchend', mouseup_event, true);
+      window.addEventListener('touchmove', mousemove_event, true);
+      imageCropBox.addEventListener('mousedown', mousedown_event, true);
+      window.addEventListener('mouseup', mouseup_event, true);
+      window.addEventListener('mousemove', mousemove_event, true);
+      for (const element of resize_elemnts) {
+        element.addEventListener('touchstart', mousedown_resize_event, true);
+        element.addEventListener('mousedown', mousedown_resize_event, true);
+      }
 		};
 	}
 
-  /**
-   * @description starts all of the listeners for
-   * the target component;
-   * @returns {void}
-   */
-  function start_all_listeners(): void {
-    let imageCropBox: HTMLElement = document.getElementById('profile-cricle-img-crop');
-    let resize_elemnts: HTMLCollectionOf<Element> = document.getElementsByClassName('resize-dot')
-    imageCropBox.addEventListener('touchstart', mousedown_event, true);
-    window.addEventListener('touchend', mouseup_event, true);
-    window.addEventListener('touchmove', mousemove_event, true);
-    imageCropBox.addEventListener('mousedown', mousedown_event, true);
-    window.addEventListener('mouseup', mouseup_event, true);
-    window.addEventListener('mousemove', mousemove_event, true);
-    for (const element of resize_elemnts) {
-      element.addEventListener('touchstart', mousedown_resize_event, true);
-      element.addEventListener('mousedown', mousedown_resize_event, true);
-    }
-  }
-
 	/**
 	 * @description bubbles up to parent event
 	 * to trigger target method; shutsdown (this) component;
 	 * NOTE:IMPORTANT removes eventListeners no longer used;
    * @returns {void}
 	 */
 	function toggle_modal(): void {
-    let imageOuter: HTMLElement = document.getElementById('image-box-in');
-    imageOuter.removeEventListener('mouseenter', start_all_listeners, true)
-    imageOuter.removeEventListener('mouseout', clear_event_listeners, true)
     clear_event_listeners()
     reset_crop = true;
     reset_resize = true;
@@ -93,9 +79,6 @@ COMPONENT JS (w/ TS)
    * @returns {void}
 	 */
 	function upload_selected_img(): void {
-    let imageOuter: HTMLElement = document.getElementById('image-box-in');
-    imageOuter.removeEventListener('mouseenter', start_all_listeners, true)
-    imageOuter.removeEventListener('mouseout', clear_event_listeners, true)
 		clear_event_listeners()
 		reset_crop = true;
     reset_resize = true;