'Making custom encryption with javascript (stuck in decrypt function)

I want to make new custom encryption engine with javascript, but i have a problem when i make a decryption function. In my decryption function I don't understand how to switch 3 characters to 1 character. In the decryption function section, 3 characters from the case I do not want are changing to the characters that are returned.

If you need my full code, i can share in here.

So please help me to solve this problem. Sorry for my bad English :)

<body>
	<h3>Encrypt and Decrypt</h3>
	<!-- Encrypt -->
<!-- 	<input placeholder="Ketikan sesuatu disini, pasti bisa:v" id="input"><br>
	<button onclick="encrypt()">Encrypt</button> -->
	<!-- Decrypt -->
	<br><input placeholder="Ketikan sesuatu disini, pasti bisa:v" id="input2"><br>
	<button onclick="decrypt()">Decrypt</button>
	<!-- Result -->
	<div id="result"></div>
	<!-- Enginenya -->
	<script>
		function encrypt(){
			var rawtext = document.getElementById("input").value;
			var temptext = "";
			for(i = 0; i < rawtext.length; i++){
				temptext += enc(rawtext[i]);
			}
			document.getElementById("result").innerHTML = temptext;
		}
		function decrypt(){
			var rawtext = document.getElementById("input2").value;
			var temptext = "";
			for(i = 0; i < rawtext.length; i++){
				temptext += dec(rawtext[i]);
			}
			document.getElementById("result").innerHTML = temptext;
		}
		function enc(x){
			switch(x){
				case " " :
				return " ";
				break;

				case "A" :
				return "+/=";
				break;

				case "B" :
				return "36=";
				break;
			}
		}
		function dec(x){
			switch(x){
				case "+/=" :
				return "A";
				break;

				case "36=" :
				return "B";
				break;
			}
		}
	</script>
</body>
javascripthtml


Solution 1:[1]

You could take three caracters for decrypting an encrypted string.

while (i < rawtext.length) {
    temptext += dec(rawtext.slice(i, i += 3)); // take from index i and increment i by 3
}


function encrypt() {
    var rawtext = document.getElementById("input").value,
        temptext = "",
        i;
    for (i = 0; i < rawtext.length; i++) {
        temptext += enc(rawtext[i]);
    }
    document.getElementById("result").innerHTML = temptext;
}

function decrypt() {
    var rawtext = document.getElementById("input2").value,
        temptext = "",
        i = 0;
    while (i < rawtext.length) {
        temptext += dec(rawtext.slice(i, i += 3));
    }
    document.getElementById("result").innerHTML = temptext;
}

function enc(x) {
    switch (x) {
        case " ":
            return " ";
        case "A":
            return "+/=";
        case "B":
            return "36=";
    }
}

function dec(x) {
    switch (x) {
        case "+/=":
            return "A";
        case "36=":
            return "B";
    }
}
<h3>Encrypt and Decrypt</h3>
<input placeholder="Ketikan sesuatu disini, pasti bisa:v" id="input"><br>
<button onclick="encrypt()">Encrypt</button>
<!-- Decrypt -->
<br><input placeholder="Ketikan sesuatu disini, pasti bisa:v" id="input2"><br>
<button onclick="decrypt()">Decrypt</button>
<!-- Result -->
<div id="result"></div>

Solution 2:[2]

Looks like you're iterating over the text to decrypt character by character, but then your dec function expects three characters. This never happens, so dec() returns undefined.

Example: 

decrypt("36=") -> 
    dec("3") + dec("6") + dec("=") ->
    undefined + undefined + undefined
    undefinedundefinedundefined

You should change your decrypt function to avoid this. Additionally, some pointers:

  • You don't initialise i in your encrypt/decrypt function
  • There's no need for a break; after a return in your case statements as return will end the execution.

Edit: Here's an example with map since some other answers had some with for loops. And also because I suspected it could be done with one line (and I was right!)

<body>
	<h3>Encrypt and Decrypt</h3>
	<br><input placeholder="Ketikan sesuatu disini, pasti bisa:v" id="input2"><br>
	<button onclick="decrypt()">Decrypt</button>
	<div id="result"></div>
	<script>
		function decrypt(){
			document.getElementById("result").innerHTML = document.getElementById("input2").value.match(/.{1,3}/g).map(dec).join('');
		}
		function dec(x){
			switch(x){
				case "+/=" :
				  return "A";
				case "36=" :
				  return "B";
                default:
                  return "?";
			}
		}
	</script>
</body>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nina Scholz
Solution 2

Related Questions