refactor: Convert JS from jQuery to vanilla JS

PurdueRCAC · Jul 31, 2023 · 872a425 · 872a425
1 parent 78dea6a
commit 872a425
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 14 deletions.
diff --git a/app/Widgets/CookiePolicy/assets/js/cookiepolicy.js b/app/Widgets/CookiePolicy/assets/js/cookiepolicy.js
@@ -2,25 +2,28 @@
  * Cookie Policy scripts
  */
 
-jQuery(document).ready(function($){
+document.addEventListener('DOMContentLoaded', function () {
 
-	$('body').addClass('has-eprivacy-warning');
+	let bdy = document.querySelector('body');
+	bdy.classList.add('has-eprivacy-warning');
 
 	// Add an event to close the notice
-	$('.eprivacy-close').on('click', function(e) {
-		e.preventDefault();
+	document.querySelectorAll('.eprivacy-close').forEach(function (el) {
+		el.addEventListener('click', function (e) {
+			e.preventDefault();
 
-		var id = $($(this).parent().parent()).attr('id'),
-			days = $(this).attr('data-duration');
+			let id = this.getAttribute('data-target'),
+				days = this.getAttribute('data-duration'),
+				date = new Date();
 
-		$($(this).parent().parent()).hide();
+			date.setTime(date.getTime()+(days*24*60*60*1000));
 
-		var date = new Date();
-		date.setTime(date.getTime()+(days*24*60*60*1000));
+			document.cookie = id + '=acknowledged; expires=' + date.toGMTString() + ';';
 
-		document.cookie = id + '=acknowledged; expires=' + date.toGMTString() + ';';
+			bdy.classList.remove('has-eprivacy-warning');
 
-		$('body').removeClass('has-eprivacy-warning');
+			document.getElementById(id).remove();
+		});
 	});
 
 });
diff --git a/app/Widgets/CookiePolicy/views/index.blade.php b/app/Widgets/CookiePolicy/views/index.blade.php
@@ -2,11 +2,11 @@
 <link rel="stylesheet" type="text/css" media="all" href="{{ timestamped_asset('widgets/cookiepolicy/css/cookiepolicy.css') }}" />
 @endpush
 
-<div class="cookiepolicy" id="{{ $id }}">
-	<div class="cookiepolicy-message">
+<div class="cookiepolicy fixed-bottom shadow-lg" id="{{ $id }}">
+	<div class="cookiepolicy-message text-center alert alert-warning m-0 p-4">
 		{!! $message !!}
 
-		<a class="cookiepolicy-close" href="{{ $uri }}" data-duration="{{ $duration }}" title="{{ trans('widget.cookiepolicy::cookiepolicy.close') }}">
+		<a class="btn btn-warning cookiepolicy-close" href="{{ $uri }}" data-target="{{ $id }}" data-duration="{{ $duration }}" title="{{ trans('widget.cookiepolicy::cookiepolicy.close') }}">
 			<span>{{ trans('widget.cookiepolicy::cookiepolicy.close') }}</span>
 		</a>
 	</div>