diff --git a/static/js/alert_button.js b/static/js/alert_button.js
new file mode 100644
index 0000000..da83cb0
--- /dev/null
+++ b/static/js/alert_button.js
@@ -0,0 +1,41 @@
+const alertPlaceholder = document.getElementById('liveAlertPlaceholder')
+const appendAlert = (message) => {
+  const wrapper = document.createElement('div')
+  wrapper.innerHTML = [
+    `<div class="alert alert-light alert-dismissible fade show" role="alert">`,
+    `   <div>${message}</div>`,
+    '   <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
+    '</div>'
+  ].join('')
+
+  alertPlaceholder.append(wrapper)
+}
+
+const alertTrigger = document.getElementById('copyCode')
+if (alertTrigger) {
+  alertTrigger.addEventListener('click', () => {
+    var codeElement = document.getElementById('code');
+    var codeText =  codeElement.innerText;
+    appendAlert('Code copied to clipboard: ' + codeText , 'success')
+  })
+}
+
+const alertTrigger1 = document.getElementById('copyViewCode')
+if (alertTrigger1) {
+  alertTrigger1.addEventListener('click', () => {
+    var codeElement = document.getElementById('code');
+    var codeText =  'kv ' + codeElement.innerText;
+    appendAlert('Code copied to clipboard: ' + codeText , 'success')
+  })
+}
+
+const alertTrigger2 = document.getElementById('burnButton')
+if (alertTrigger2) {
+  alertTrigger2.addEventListener('click', () => {
+    if (document.getElementById('burn').innerText === 'False') {
+        appendAlert('Undo Burn burn burn', 'success')
+    } else {
+        appendAlert('Burn burn burn', 'success')
+        }
+    })
+}
\ No newline at end of file
diff --git a/static/js/show_data.js b/static/js/show_data.js
new file mode 100644
index 0000000..f9b5a38
--- /dev/null
+++ b/static/js/show_data.js
@@ -0,0 +1,100 @@
+let codeList = [];
+var current = 0;
+
+function copyCode() {
+    var codeElement = document.getElementById('code');
+    var codeText =  codeElement.innerText;
+    var tempInput = document.createElement('input');
+    document.body.appendChild(tempInput);
+    tempInput.setAttribute('value', codeText);
+    tempInput.select();
+    document.execCommand('copy');
+    document.body.removeChild(tempInput);
+}
+
+function copyViewCode() {
+    var codeElement = document.getElementById('code');
+    var codeText =  'kv ' + codeElement.innerText;
+    var tempInput = document.createElement('input');
+    document.body.appendChild(tempInput);
+    tempInput.setAttribute('value', codeText);
+    tempInput.select();
+    document.execCommand('copy');
+    document.body.removeChild(tempInput);
+}
+
+function prevData() {
+    if (current > 0) {
+        current--;
+        updateData();
+    }
+}
+
+function nextData() {
+    if (current < maxIndex) {
+        current++;
+        updateData();
+    }
+}
+
+function backbtn() {
+    window.location.href = "/";
+}
+
+function updateData() {
+    if (data && current >= 0 && current < data.length) {
+        document.getElementById('code').innerText = data[current]['code'];
+        document.getElementById('character').innerText = data[current]['character'];
+        document.getElementById('series').innerText = data[current]['series'];
+        document.getElementById('wishlists').innerText = data[current]['wishlists'];      
+        document.getElementById('edition').innerText = data[current]['edition'];
+        document.getElementById('number').innerText = data[current]['number'];
+        document.getElementById('quality').innerText = data[current]['quality'];
+        document.getElementById('burnValue').innerText = data[current]['burnValue'];
+        document.getElementById('tag').innerText = data[current]['tag'];
+        
+
+        var indexToRemove = codeList.indexOf(document.getElementById('code').innerText);
+        if (indexToRemove !== -1) {
+            document.getElementById('burn').innerText = 'True';
+        } else {
+            document.getElementById('burn').innerText = 'False';
+        }      
+        
+        var imageUrl = 'http://d2l56h9h5tj8ue.cloudfront.net/images/cards/' +
+            data[current]['character'].replace(' ', '-').toLowerCase() +
+            '-' + data[current]['edition'] + '.jpg';
+
+        document.querySelector('.character-image').src = imageUrl;
+    }
+}
+
+function burnButton() {
+    if (document.getElementById('burn').innerText === 'False') {
+        var codeText = document.getElementById('code').innerText;
+        document.getElementById('burn').innerText = 'True';
+        codeList.push(codeText);
+    } else {
+        document.getElementById('burn').innerText = 'False';
+        var indexToRemove = codeList.indexOf(document.getElementById('code').innerText);
+        if (indexToRemove !== -1) {
+            codeList.splice(indexToRemove, 1);
+        }
+    }    
+}
+
+function downloadFile() {
+    if (codeList.length === 0) {
+      return;
+    }
+  
+    const zip = new JSZip();
+    const codeText = codeList.join(', ');
+  
+    zip.file('code.txt', codeText);
+  
+    zip.generateAsync({ type: 'blob' }).then(function(content) {
+      saveAs(content, 'burning cards.zip');
+      codeList = [];
+    });
+}
\ No newline at end of file
diff --git a/static/js/switches.js b/static/js/switches.js
new file mode 100644
index 0000000..bd4b646
--- /dev/null
+++ b/static/js/switches.js
@@ -0,0 +1,30 @@
+var switchQuality = document.getElementById('switch-quality');
+var switchBurnValue = document.getElementById('switch-burnValue');
+var switchTag = document.getElementById('switch-tag');
+                
+switchBurnValue.addEventListener('change', function () {
+    toggleColumnVisibility('th-burnValue', 'td-burnValue');
+});
+
+switchTag.addEventListener('change', function () {
+    toggleColumnVisibility('th-tag', 'td-tag');
+});
+
+switchQuality.addEventListener('change', function () {
+    toggleColumnVisibility('th-quality', 'td-quality');
+});
+                
+function toggleColumnVisibility(thId, tdClass) {
+    var th = document.getElementById(thId);
+    var tdList = document.getElementsByClassName(tdClass);
+                
+    if (th && tdList) {
+        var isSwitchOn = document.getElementById('switch-' + thId.split('-')[1]).checked;
+                
+        th.style.display = isSwitchOn ? 'table-cell' : 'none';
+                
+        for (var i = 0; i < tdList.length; i++) {
+            tdList[i].style.display = isSwitchOn ? 'table-cell' : 'none';
+        }
+    }
+}
\ No newline at end of file
diff --git a/static/js/upload.js b/static/js/upload.js
new file mode 100644
index 0000000..052fc01
--- /dev/null
+++ b/static/js/upload.js
@@ -0,0 +1,4 @@
+function submitForm(event) {
+    const form = document.getElementById('csv-form');
+    form.submit();
+}
\ No newline at end of file