diff --git a/html/js/app.js b/html/js/app.js
index 40c608e5..f5da2027 100644
--- a/html/js/app.js
+++ b/html/js/app.js
@@ -1,58 +1,4 @@
-$(".character-box").hover(
-    function() {
-        $(this).css({
-            "background": "rgb(34, 31, 39)",
-            "transition": "200ms",
-        });
-    }, function() {
-        $(this).css({
-            "background": "rgba(44, 51, 69, 0.6)",
-            "transition": "200ms",          
-        });
-    }
-);
 
-$(document).ready(() => {
-	$(".character-info-new").html(translate.new)
-	$(".btn-delete").html(translate.delete);
-	$(".modalTitle").html(translate.modalTitle);
-	$(".modalText").html(translate.modalText);
-});
-
-$(".character-box").click(function () {
-    $(".character-box").removeClass('active-char');
-    $(this).addClass('active-char');
-    $(".character-buttons").css({"display":"block"});
-    if ($(this).attr("data-ischar") === "true") {
-        $("#delete").css({"display":"block"});
-    } else {
-        $("#delete").css({"display":"none"});
-    }
-});
-
-$(".character-box").click(function () {
-    if ($(this).attr("data-ischar") === "true") {
-        $("#play-char").html(translate.play);
-    } else {
-        $("#play-char").html(translate.playNew);
-    }
-});
-
-
-$("#play-char").click(function () {
-    $.post("http://esx_multicharacter/CharacterChosen", JSON.stringify({
-        charid: Number($('.active-char').attr("data-charid")),
-        ischar: ($('.active-char').attr("data-ischar") == "true"),
-    }));
-    Kashacter.CloseUI();
-});
-
-$("#deletechar").click(function () {
-    $.post("http://esx_multicharacter/DeleteCharacter", JSON.stringify({
-        charid: Number($('.active-char').attr("data-charid")),
-    }));
-    Kashacter.CloseUI();
-});
 
 (() => {
     Kashacter = {};
@@ -60,31 +6,26 @@ $("#deletechar").click(function () {
     Kashacter.ShowUI = function(data) {
         $('body').css({"display":"block"});
         $('.main-container').css({"display":"block"});
-        if(data.characters !== null) {
-            $.each(data.characters, function (index, char) {
-                if (char.charid !== 0) {
-                    var charid = char.identifier.charAt(4);
-                    $('[data-charid=' + charid + ']').html('<h3 class="character-fullname">'+ char.firstname +'</h3><div class="character-info"><p class="character-info-name"><strong>' + `${translate.name}: ` + '</strong><span>' + char.firstname +' '+ char.lastname +'</span></p><p class="character-info-work"><strong>' + `${translate.job}: ` + '</strong><span>'+ char.job +' '+ char.job_grade +'</span></p><p class="character-info-money"><strong>' + `${translate.money}: ` + '</strong><span> $'+ char.money +'</span></p><p class="character-info-bank"><strong>' + `${translate.bank}: ` + '</strong><span> $'+ char.bank +'</span></p> <p class="character-info-dateofbirth"><strong>' + `${translate.dob}: ` + '</strong><span>'+ char.dateofbirth +'</span></p> <p class="character-info-gender"><strong>' + `${translate.gender}: ` + '</strong><span>'+ char.sex +'</span></p></div>').attr("data-ischar", "true");
-                }
-            });
-        }
+		$('[data-charid=1]').html('<div class="character-info"><p class="character-info-name"><h1>' + `${translate.name} ` + '</h1><span>' + data.firstname +' '+ data.lastname +'</span></p><p class="character-info-work"><h1>' + `${translate.job} ` + '</h1><span>'+ data.job +' '+ data.job_grade +'</span></p><p class="character-info-money"><h1>' + `${translate.money} ` + '</h1><span> $'+ data.money +'</span></p><p class="character-info-bank"><h1>' + `${translate.bank} ` + '</h1><span> $'+ data.bank +'</span></p> <p class="character-info-dateofbirth"><h1>' + `${translate.dob} ` + '</h1><span>'+ data.dateofbirth +'</span></p> <p class="character-info-gender"><h1>' + `${translate.gender} ` + '</h1><span>'+ data.sex +'</span></p></div>').attr("data-ischar", "true");
     };
 
     Kashacter.CloseUI = function() {
         $('body').css({"display":"none"});
         $('.main-container').css({"display":"none"});
-        $(".character-box").removeClass('active-char');
-        $("#delete").css({"display":"none"});
-		$(".character-box").html('<h3 class="character-fullname">Empty Slot</h3><div class="character-info"><p class="character-info-new">' + `${translate.new}` + '</p></div>').attr("data-ischar", "false");
+		$('[data-charid=1]').html('<h3 class="character-fullname"></h3><div class="character-info"><p class="character-info-new"></p></div>');
     };
+
     window.onload = function(e) {
         window.addEventListener('message', function(event) {
             switch(event.data.action) {
                 case 'openui':
-                    Kashacter.ShowUI(event.data);
+                    Kashacter.ShowUI(event.data.character);
                     break;
+				case 'closeui':
+					Kashacter.CloseUI();
+					break;
             }
         })
     }
 
-})();
\ No newline at end of file
+})();