moved javascript to its own file
This commit is contained in:
parent
1551aba864
commit
563d5fbc30
2 changed files with 73 additions and 74 deletions
72
dencoder.js
Normal file
72
dencoder.js
Normal file
|
|
@ -0,0 +1,72 @@
|
||||||
|
(function($) {
|
||||||
|
var template = "<div id='wrapper-{index}'><textarea id='input-{index}' class='input'>{content}</textarea>"
|
||||||
|
+ "<select id='type-{index}' class='conversion' onchange='den.convert(this);'>"
|
||||||
|
+ "<option name='CHOOSE'>Please choose your method ...</option>"
|
||||||
|
+ "<option name='base64encode'>Base64 encode</option>"
|
||||||
|
+ "<option name='base64decode'>Base64 decode</option>"
|
||||||
|
+ "</select></div>";
|
||||||
|
$(document).ready(function() {
|
||||||
|
var $new = $(template.replace(/\{index\}/g, "0").replace(/\{content\}/g, "Please enter your input here."));
|
||||||
|
$("body").append($new);
|
||||||
|
});
|
||||||
|
|
||||||
|
function convert(select) {
|
||||||
|
var $select = $(select);
|
||||||
|
var selectid = $select.attr("id");
|
||||||
|
var inputIndex = +selectid.split("-")[1];
|
||||||
|
var outputIndex = inputIndex + 1;
|
||||||
|
var $input = $("#input-" + inputIndex);
|
||||||
|
var $output = $("#input-" + outputIndex);
|
||||||
|
var appendNewOutput = false;
|
||||||
|
var input = $input.val();
|
||||||
|
var conversion = $select.find(":selected").attr("name");
|
||||||
|
var output;
|
||||||
|
if ($output.length == 0) {
|
||||||
|
appendNewOutput = true;
|
||||||
|
}
|
||||||
|
switch (conversion) {
|
||||||
|
case "CHOOSE":
|
||||||
|
output = "";
|
||||||
|
break;
|
||||||
|
case "base64encode":
|
||||||
|
output = btoa(input);
|
||||||
|
break;
|
||||||
|
case "base64decode":
|
||||||
|
output = atob(input);
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
alert("Unknown: " + conversion);
|
||||||
|
output = "ERROR!";
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (appendNewOutput) {
|
||||||
|
$output = $(template.replace(/\{index\}/g, "" + outputIndex).replace(/\{content\}/g, output));
|
||||||
|
$("body").append($output);
|
||||||
|
} else {
|
||||||
|
$output.val(output);
|
||||||
|
}
|
||||||
|
|
||||||
|
clean(outputIndex);
|
||||||
|
}
|
||||||
|
|
||||||
|
function clean(index) {
|
||||||
|
var found = true;
|
||||||
|
var $wrapper;
|
||||||
|
$("#type-" + index + " option[name=CHOOSE]").prop("selected", true);
|
||||||
|
index++;
|
||||||
|
do {
|
||||||
|
$wrapper = $("#wrapper-" + index);
|
||||||
|
if ($wrapper.length > 0) {
|
||||||
|
$wrapper.remove();
|
||||||
|
index++;
|
||||||
|
} else {
|
||||||
|
found = false;
|
||||||
|
}
|
||||||
|
} while (found);
|
||||||
|
}
|
||||||
|
|
||||||
|
var den = {};
|
||||||
|
den.convert = convert;
|
||||||
|
window.den = window.den || den;
|
||||||
|
|
||||||
|
})(jQuery);
|
||||||
75
index.html
75
index.html
|
|
@ -3,80 +3,7 @@
|
||||||
<head>
|
<head>
|
||||||
<title>encoder-decoder</title>
|
<title>encoder-decoder</title>
|
||||||
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
|
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript" src="dencoder.js"></script>
|
||||||
(function($) {
|
|
||||||
var template = "<div id='wrapper-{index}'><textarea id='input-{index}' class='input'>{content}</textarea>"
|
|
||||||
+ "<select id='type-{index}' class='conversion' onchange='den.convert(this);'>"
|
|
||||||
+ "<option name='CHOOSE'>Please choose your method ...</option>"
|
|
||||||
+ "<option name='base64encode'>Base64 encode</option>"
|
|
||||||
+ "<option name='base64decode'>Base64 decode</option>"
|
|
||||||
+ "</select></div>";
|
|
||||||
$(document).ready(function() {
|
|
||||||
var $new = $(template.replace(/\{index\}/g, "0").replace(/\{content\}/g, "Please enter your input here."));
|
|
||||||
$("body").append($new);
|
|
||||||
});
|
|
||||||
|
|
||||||
function convert(select) {
|
|
||||||
var $select = $(select);
|
|
||||||
var selectid = $select.attr("id");
|
|
||||||
var inputIndex = +selectid.split("-")[1];
|
|
||||||
var outputIndex = inputIndex + 1;
|
|
||||||
var $input = $("#input-" + inputIndex);
|
|
||||||
var $output = $("#input-" + outputIndex);
|
|
||||||
var appendNewOutput = false;
|
|
||||||
var input = $input.val();
|
|
||||||
var conversion = $select.find(":selected").attr("name");
|
|
||||||
var output;
|
|
||||||
if ($output.length == 0) {
|
|
||||||
appendNewOutput = true;
|
|
||||||
}
|
|
||||||
switch (conversion) {
|
|
||||||
case "CHOOSE":
|
|
||||||
output = "";
|
|
||||||
break;
|
|
||||||
case "base64encode":
|
|
||||||
output = btoa(input);
|
|
||||||
break;
|
|
||||||
case "base64decode":
|
|
||||||
output = atob(input);
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
alert("Unknown: " + conversion);
|
|
||||||
output = "ERROR!";
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
if (appendNewOutput) {
|
|
||||||
$output = $(template.replace(/\{index\}/g, "" + outputIndex).replace(/\{content\}/g, output));
|
|
||||||
$("body").append($output);
|
|
||||||
} else {
|
|
||||||
$output.val(output);
|
|
||||||
}
|
|
||||||
|
|
||||||
clean(outputIndex);
|
|
||||||
}
|
|
||||||
|
|
||||||
function clean(index) {
|
|
||||||
var found = true;
|
|
||||||
var $wrapper;
|
|
||||||
$("#type-" + index + " option[name=CHOOSE]").prop("selected", true);
|
|
||||||
index++;
|
|
||||||
do {
|
|
||||||
$wrapper = $("#wrapper-" + index);
|
|
||||||
if ($wrapper.length > 0) {
|
|
||||||
$wrapper.remove();
|
|
||||||
index++;
|
|
||||||
} else {
|
|
||||||
found = false;
|
|
||||||
}
|
|
||||||
} while (found);
|
|
||||||
}
|
|
||||||
|
|
||||||
var den = {};
|
|
||||||
den.convert = convert;
|
|
||||||
window.den = window.den || den;
|
|
||||||
|
|
||||||
})(jQuery);
|
|
||||||
</script>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
</body>
|
</body>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue