Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixes #160: Length Converter JS Extension #242

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
103 changes: 103 additions & 0 deletions Length Converter JS Extension/js/length-converter.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
function CalculateLength(){
var fromLength = Number(document.getElementById("fromLength").value);

if(ValidateLengthConverter(fromLength)){

var fromUnit = document.getElementById("fromUnit").value;
var toUnit = document.getElementById("toUnit").value;

var outputLength = document.getElementById("outputLength");


var result = ConvertLength(fromLength,fromUnit,toUnit);

outputLength.value = result.toFixed(5);

}
}

function ResetConverter(){
if(confirm("Are you sure want to reset?")){
document.getElementById("fromLength").value = "";
document.getElementById("outputLength").value = "";
}
}

function ConvertLength(fromLength,fromUnit,toUnit){
fromLength = Number(fromLength);
var inMillimeter = 0;
var makeThisMillimeter = 0;
var result;

switch(fromUnit){
case "Millimeter":
makeThisMillimeter = 1;
break;
case "Centimeter":
makeThisMillimeter = 10;
break;
case "Decimeter":
makeThisMillimeter = 100;
break;
case "Meter":
makeThisMillimeter = 1000;
break;
case "Kilometer":
makeThisMillimeter = 1000000;
break;
case "Foot":
makeThisMillimeter = 304.8;
break;
case "Inch":
makeThisMillimeter = 25.4;
break;
case "Mile":
makeThisMillimeter = 1609344;
break;
case "Yard":
makeThisMillimeter = 914.4;
break;
}
inMillimeter = fromLength * makeThisMillimeter;

switch(toUnit){
case "Millimeter":
result = inMillimeter;
break;
case "Centimeter":
result = inMillimeter / 10;
break;
case "Decimeter":
result = inMillimeter / 100;
break;
case "Meter":
result = inMillimeter / 1000;
break;
case "Kilometer":
result = inMillimeter / 1000000;
break;
case "Foot":
result = inMillimeter / 304.8;
break;
case "Inch":
result = inMillimeter / 25.4;
break;
case "Mile":
result = inMillimeter / 1609344;
break;
case "Yard":
result = inMillimeter / 914.4;
break;
}
return result;
}

function ValidateLengthConverter(fromLength){
if(fromLength <= 0){

_cmnShowErrorMessageBottomOfTheInputFiled("fromLength","Please enter the valid length")

return false;
}
return true;
}
24 changes: 24 additions & 0 deletions Length Converter JS Extension/js/project-common.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
function _cmnRemoveAllErrorMessage(){
var allErrorBorder = document.getElementsByClassName('error-border');
var allErrorMessage = document.getElementsByClassName('error-message');
var i;

for(i = (allErrorBorder.length) - 1; i>=0; i--){
allErrorBorder[i].classList.remove("error-border");
}

for(i = (allErrorMessage.length) - 1; i>=0; i--){
allErrorMessage[i].remove();
}
}

function _cmnShowErrorMessageBottomOfTheInputFiled(fieldID,errorMessage){
var inputField = document.getElementById(fieldID);
inputField.classList.add("tool-error-border");
inputField.focus();

var errorMessageElement = document.createElement("p");
errorMessageElement.innerHTML = errorMessage;
errorMessageElement.classList.add("tool-error-message");
inputField.parentNode.insertBefore(errorMessageElement, inputField.nextSibling);
}
63 changes: 63 additions & 0 deletions Length Converter JS Extension/main.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./src/style.css">
<title>Length converter</title>
</head>
<body>

<div class="container">
<h1>Length Converter</h1>
<div class="container-field">
<div class="input-group">
<div class="input-label">
<label for="fromUnit">From:</label>
</div>
<select class="select-group" id="fromUnit">
<option selected value="Millimeter">Millimeter</option>
<option value="Centimeter">Centimeter</option>
<option value="Decimeter">Decimeter</option>
<option value="Meter">Meter</option>
<option value="Kilometer">Kilometer</option>
<option value="Foot">Foot</option>
<option value="Inch">Inch</option>
<option value="Mile">Mile</option>
<option value="Yard">Yard</option>
</select>
<input placeholder="Input Length" id="fromLength" type="number" name="from-length" min="0" class="input-field">
</div>

<div class="input-group">
<div class="input-label">
<label for="toUnit">To:&nbsp;&nbsp;&nbsp;&nbsp;</label>
</div>
<select class="select-group" id="toUnit">
<option value="Millimeter">Millimeter</option>
<option selected value="Centimeter">Centimeter</option>
<option value="Decimeter">Decimeter</option>
<option value="Meter">Meter</option>
<option value="Kilometer">Kilometer</option>
<option value="Foot">Foot</option>
<option value="Inch">Inch</option>
<option value="Mile">Mile</option>
<option value="Yard">Yard</option>
</select>
<input readonly placeholder="Output" id="outputLength" type="number" name="to-temperature" min="0" class="input-field readonly-background">
</div>

<div class="input-group">
<button id="btnReset" class="btn btn-reset">Reset</button>
<button id="btnCalculate" class="btn btn-calculate">Calculate</button>

</div>
</div>
</div>

<script src="./scripts/project-common.js"></script>
<script src="./scripts/length-converter.js"></script>

</body>
</html>
27 changes: 27 additions & 0 deletions Length Converter JS Extension/manifest.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
{
"manifest_version": 3,
"name": "Length Converter JS Extension",
"version": "1.0",
"description": "Length Converter Extension offers a seamless experience for converting lengths, allowing users to effortlessly switch between various units of measurement...",
"author" : "ishadutta.193@gmail.com",

"icons":{
"16": "./src/icon-16.png",
"32": "./src/icon-32.png",
"48": "./src/icon-48.png",
"128": "./src/icon-128.png"

},
"permissions": [
"storage"
],
"action": {
"default_popup": "main.html"
},
"web_accessible_resources": [
{
"resources": ["main.html"],
"matches": ["<all_urls>"]
}
]
}
106 changes: 106 additions & 0 deletions Length Converter JS Extension/scripts/length-converter.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
document.getElementById("btnReset").addEventListener("click", ResetConverter);
document.getElementById("btnCalculate").addEventListener("click", CalculateLength);

function CalculateLength(){
var fromLength = Number(document.getElementById("fromLength").value);

if(ValidateLengthConverter(fromLength)){

var fromUnit = document.getElementById("fromUnit").value;
var toUnit = document.getElementById("toUnit").value;

var outputLength = document.getElementById("outputLength");


var result = ConvertLength(fromLength,fromUnit,toUnit);

outputLength.value = result.toFixed(5);

}
}

function ResetConverter(){
if(confirm("Are you sure want to reset?")){
document.getElementById("fromLength").value = "";
document.getElementById("outputLength").value = "";
}
}

function ConvertLength(fromLength,fromUnit,toUnit){
fromLength = Number(fromLength);
var inMillimeter = 0;
var makeThisMillimeter = 0;
var result;

switch(fromUnit){
case "Millimeter":
makeThisMillimeter = 1;
break;
case "Centimeter":
makeThisMillimeter = 10;
break;
case "Decimeter":
makeThisMillimeter = 100;
break;
case "Meter":
makeThisMillimeter = 1000;
break;
case "Kilometer":
makeThisMillimeter = 1000000;
break;
case "Foot":
makeThisMillimeter = 304.8;
break;
case "Inch":
makeThisMillimeter = 25.4;
break;
case "Mile":
makeThisMillimeter = 1609344;
break;
case "Yard":
makeThisMillimeter = 914.4;
break;
}
inMillimeter = fromLength * makeThisMillimeter;

switch(toUnit){
case "Millimeter":
result = inMillimeter;
break;
case "Centimeter":
result = inMillimeter / 10;
break;
case "Decimeter":
result = inMillimeter / 100;
break;
case "Meter":
result = inMillimeter / 1000;
break;
case "Kilometer":
result = inMillimeter / 1000000;
break;
case "Foot":
result = inMillimeter / 304.8;
break;
case "Inch":
result = inMillimeter / 25.4;
break;
case "Mile":
result = inMillimeter / 1609344;
break;
case "Yard":
result = inMillimeter / 914.4;
break;
}
return result;
}

function ValidateLengthConverter(fromLength){
if(fromLength <= 0){

_cmnShowErrorMessageBottomOfTheInputFiled("fromLength","Please enter the valid length")

return false;
}
return true;
}
24 changes: 24 additions & 0 deletions Length Converter JS Extension/scripts/project-common.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
function _cmnRemoveAllErrorMessage(){
var allErrorBorder = document.getElementsByClassName('error-border');
var allErrorMessage = document.getElementsByClassName('error-message');
var i;

for(i = (allErrorBorder.length) - 1; i>=0; i--){
allErrorBorder[i].classList.remove("error-border");
}

for(i = (allErrorMessage.length) - 1; i>=0; i--){
allErrorMessage[i].remove();
}
}

function _cmnShowErrorMessageBottomOfTheInputFiled(fieldID,errorMessage){
var inputField = document.getElementById(fieldID);
inputField.classList.add("tool-error-border");
inputField.focus();

var errorMessageElement = document.createElement("p");
errorMessageElement.innerHTML = errorMessage;
errorMessageElement.classList.add("tool-error-message");
inputField.parentNode.insertBefore(errorMessageElement, inputField.nextSibling);
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Length Converter JS Extension/src/icon-128.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Length Converter JS Extension/src/icon-16.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Length Converter JS Extension/src/icon-32.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Length Converter JS Extension/src/icon-48.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Loading