Skip to content

Commit

Permalink
Merge pull request Sulagna-Dutta-Roy#242 from isha-dutta/LengthConver…
Browse files Browse the repository at this point in the history 
…terJS-1

Fixes Sulagna-Dutta-Roy#160: Length Converter JS Extension
  • Loading branch information
@Sulagna-Dutta-Roy
Sulagna-Dutta-Roy authored May 16, 2024
2 parents 07c142b + 3b5a914 commit 9b47ad1
Show file tree
Hide file tree
Showing 14 changed files with 517 additions and 0 deletions.
Binary file added Length Converter JS Extension/img/background-blue-aesthetic-flowers.jpg
View file
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
View file
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
View file
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
View file
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
View file
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" : "[email protected]",

"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
View file
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
View file
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);
}
Binary file added Length Converter JS Extension/src/background-blue-aesthetic-flowers.jpg
View file
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
View file
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
View file
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
View file
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
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 9b47ad1

Please sign in to comment.