From 9551c991e00c7865a4abc836bcfadd97aef71cb4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Juli=C3=A1n=20Ramirez=20Giraldo?=
 <52968528+julianramirez2@users.noreply.github.com>
Date: Tue, 10 Oct 2023 15:48:51 -0500
Subject: [PATCH] feat: course id fields restriction & js uncaught element bug
 fixed (#46)

* feat: course id fields restriction & js bug fixed

* refactor: whitespace error fixed
---
 admin/js/course-id-restriction.js             | 48 +++++++++++++++++++
 admin/js/product-type.js                      |  8 +++-
 ...oocommerce-plugin-enrollment-info-form.php | 23 +--------
 includes/class-openedx-woocommerce-plugin.php |  3 ++
 4 files changed, 59 insertions(+), 23 deletions(-)
 create mode 100644 admin/js/course-id-restriction.js

diff --git a/admin/js/course-id-restriction.js b/admin/js/course-id-restriction.js
new file mode 100644
index 0000000..25e205d
--- /dev/null
+++ b/admin/js/course-id-restriction.js
@@ -0,0 +1,48 @@
+var originalValue = "";
+
+  
+var inputElementForm = document.getElementById("openedx_enrollment_course_id");
+var inputElementProduct = document.getElementById("_course_id");
+var inputElement = null;
+
+if (inputElementForm !== null) {
+    inputElement = inputElementForm;
+} else if (inputElementProduct !== null) {
+    inputElement = inputElementProduct;
+}
+
+if (inputElement !== null) {
+    
+    inputElement.addEventListener("input", function() {
+        updateCourseId(this);
+    });
+
+    
+    inputElement.addEventListener("focus", function() {
+        saveOriginalValue(this);
+    });
+
+    
+    inputElement.addEventListener("blur", function() {
+        restoreOriginalValue(this);
+    });
+
+    function saveOriginalValue(input) {
+        originalValue = input.value;
+    }
+
+    function restoreOriginalValue(input) {
+        if (input.value !== originalValue && !input.value.startsWith("course-v1:")) {
+            input.value = originalValue;
+        }
+    }
+
+    function updateCourseId(input) {
+        var prefix = "course-v1:";
+        var currentValue = input.value;
+
+        if (currentValue !== "" && !currentValue.startsWith(prefix)) {
+            input.value = prefix;
+        }
+    }
+}
diff --git a/admin/js/product-type.js b/admin/js/product-type.js
index afb2506..5d2c13b 100644
--- a/admin/js/product-type.js
+++ b/admin/js/product-type.js
@@ -1,11 +1,15 @@
 document.addEventListener('DOMContentLoaded', function() {
     var checkbox = document.getElementById("is_openedx_course");
-    handleCheckboxChange(checkbox);
+    if (checkbox !== null) {
+        handleCheckboxChange(checkbox);
+    }
 });
 
 document.addEventListener('change', function() {
     var checkbox = document.getElementById("is_openedx_course");
-    handleCheckboxChange(checkbox);
+    if (checkbox !== null) {
+        handleCheckboxChange(checkbox);
+    }
 });
 
 function handleCheckboxChange(checkbox) {
diff --git a/admin/views/class-openedx-woocommerce-plugin-enrollment-info-form.php b/admin/views/class-openedx-woocommerce-plugin-enrollment-info-form.php
index 2d0f234..26f9d8d 100644
--- a/admin/views/class-openedx-woocommerce-plugin-enrollment-info-form.php
+++ b/admin/views/class-openedx-woocommerce-plugin-enrollment-info-form.php
@@ -103,7 +103,7 @@ public function render_enrollment_info_form( $post ) {
 						<tr>
 							<td class="first"><label for="openedx_enrollment_course_id">Course ID</label></td>
 							<td>
-								<input type="text" id="openedx_enrollment_course_id" name="enrollment_course_id" value="<?php echo esc_attr( $course_id ); ?>" oninput="updateCourseId(this)" onfocus="saveOriginalValue(this)" onblur="restoreOriginalValue(this)"
+								<input type="text" id="openedx_enrollment_course_id" name="enrollment_course_id" value="<?php echo esc_attr( $course_id ); ?>"
 								<?php
 								if ( '' !== $course_id ) {
 									?>
@@ -225,26 +225,7 @@ public function render_enrollment_info_form( $post ) {
 		</div>
 
 		<script>
-			var originalValue = "";
-
-			function saveOriginalValue(input) {
-				originalValue = input.value;
-			}
-
-			function restoreOriginalValue(input) {
-				if (input.value !== originalValue && !input.value.startsWith("course-v1:")) {
-					input.value = originalValue;
-				}
-			}
-
-			function updateCourseId(input) {
-				var prefix = "course-v1:";
-				var currentValue = input.value;
-
-				if (currentValue !== "" && !currentValue.startsWith(prefix)) {
-					input.value = prefix;
-				}
-			}
+			
 		</script>
 
 		<?php
diff --git a/includes/class-openedx-woocommerce-plugin.php b/includes/class-openedx-woocommerce-plugin.php
index 7bcbf83..4d89a15 100644
--- a/includes/class-openedx-woocommerce-plugin.php
+++ b/includes/class-openedx-woocommerce-plugin.php
@@ -277,6 +277,9 @@ private function define_public_hooks() {
 	private function define_enqueue_scripts() {
 		wp_register_script( 'product-type-script', plugin_dir_url( __FILE__ ) . '../admin/js/product-type.js', array(), $this->get_version(), true );
 		wp_enqueue_script( 'product-type-script' );
+
+		wp_register_script( 'course-id-restriction-script', plugin_dir_url( __FILE__ ) . '../admin/js/course-id-restriction.js', array(), $this->get_version(), true );
+		wp_enqueue_script( 'course-id-restriction-script' );
 	}
 
 	/**