From dedbab689f1f9793b9cc3ebac160733d2f79e770 Mon Sep 17 00:00:00 2001
From: Johannes Eder <ederj@cip.ifi.lmu.de>
Date: Tue, 20 Jul 2021 11:05:55 +0200
Subject: [PATCH] chore(checkbox): implemented destroy

---
 frontend/src/utils/inputs/checkbox.js | 34 +++++++++++++++++----------
 1 file changed, 22 insertions(+), 12 deletions(-)

diff --git a/frontend/src/utils/inputs/checkbox.js b/frontend/src/utils/inputs/checkbox.js
index 9b1b541ff..8c96d201d 100644
--- a/frontend/src/utils/inputs/checkbox.js
+++ b/frontend/src/utils/inputs/checkbox.js
@@ -9,43 +9,53 @@ const CHECKBOX_INITIALIZED_CLASS = 'checkbox--initialized';
   selector: 'input[type="checkbox"]:not([uw-no-checkbox]), input[type="radio"]:not([uw-no-radiobox])',
 })
 export class Checkbox {
+
+  _element;
+  _wrapperEl;
+
   constructor(element) {
     if (!element) {
       throw new Error('Checkbox utility cannot be setup without an element!');
     }
+    this._element = element;
 
-    const isRadio = element.type === 'radio';
+    const isRadio = this._element.type === 'radio';
     const box_class = isRadio ? RADIOBOX_CLASS : CHECKBOX_CLASS;
 
-    if (isRadio && element.closest('.radio-group')) {
+    if (isRadio && this._element.closest('.radio-group')) {
       // Don't initialize radiobox, if radio is part of a group
       return false;
     }
 
-    if (element.classList.contains(CHECKBOX_INITIALIZED_CLASS)) {
+    if (this._element.classList.contains(CHECKBOX_INITIALIZED_CLASS)) {
       // throw new Error('Checkbox utility already initialized!');
       return false;
     }
 
-    if (element.parentElement.classList.contains(box_class)) {
+    if (this._element.parentElement.classList.contains(box_class)) {
       // throw new Error('Checkbox element\'s wrapper already has class '' + box_class + ''!');
       return false;
     }
 
-    const siblingEl = element.nextSibling;
-    const parentEl = element.parentElement;
+    const siblingEl = this._element.nextSibling;
+    const parentEl = this._element.parentElement;
 
-    const wrapperEl = document.createElement('div');
-    wrapperEl.classList.add(box_class);
+    this._wrapperEl = document.createElement('div');
+    this._wrapperEl.classList.add(box_class);
 
     const labelEl = document.createElement('label');
     labelEl.setAttribute('for', element.id);
 
-    wrapperEl.appendChild(element);
-    wrapperEl.appendChild(labelEl);
+    this._wrapperEl.appendChild(element);
+    this._wrapperEl.appendChild(labelEl);
 
-    parentEl.insertBefore(wrapperEl, siblingEl);
+    parentEl.insertBefore(this._wrapperEl, siblingEl);
 
-    element.classList.add(CHECKBOX_INITIALIZED_CLASS);
+    this._element.classList.add(CHECKBOX_INITIALIZED_CLASS);
+  }
+
+  destroy() {
+    this._wrapperEl.remove();
+    this._element.classList.remove(CHECKBOX_INITIALIZED_CLASS);
   }
 }