feat(new-tool): temperature converter

src/tools/index.ts

@@ -1,13 +1,10 @@
-import { tool as jwtParser } from './jwt-parser';
-import { tool as chmodCalculator } from './chmod-calculator';
-import { tool as mimeTypes } from './mime-types';
-import { tool as otpCodeGeneratorAndValidator } from './otp-code-generator-and-validator';
 import { tool as base64FileConverter } from './base64-file-converter';
 import { tool as base64StringConverter } from './base64-string-converter';
 import { tool as basicAuthGenerator } from './basic-auth-generator';
 import { tool as bcrypt } from './bcrypt';
 import { tool as bip39 } from './bip39-generator';
 import { tool as caseConverter } from './case-converter';
+import { tool as chmodCalculator } from './chmod-calculator';
 import { tool as chronometer } from './chronometer';
 import { tool as colorConverter } from './color-converter';
 import { tool as crontabGenerator } from './crontab-generator';
@@ -21,20 +18,24 @@ import { tool as hmacGenerator } from './hmac-generator';
 import { tool as htmlEntities } from './html-entities';
 import { tool as baseConverter } from './integer-base-converter';
 import { tool as jsonViewer } from './json-viewer';
+import { tool as jwtParser } from './jwt-parser';
 import { tool as loremIpsumGenerator } from './lorem-ipsum-generator';
 import { tool as mathEvaluator } from './math-evaluator';
 import { tool as metaTagGenerator } from './meta-tag-generator';
+import { tool as mimeTypes } from './mime-types';
+import { tool as otpCodeGeneratorAndValidator } from './otp-code-generator-and-validator';
 import { tool as qrCodeGenerator } from './qr-code-generator';
 import { tool as randomPortGenerator } from './random-port-generator';
 import { tool as romanNumeralConverter } from './roman-numeral-converter';
 import { tool as sqlPrettify } from './sql-prettify';
 import { tool as svgPlaceholderGenerator } from './svg-placeholder-generator';
+import { tool as temperatureConverter } from './temperature-converter';
 import { tool as textStatistics } from './text-statistics';
 import { tool as tokenGenerator } from './token-generator';
+import type { ToolCategory } from './tools.types';
 import { tool as urlEncoder } from './url-encoder';
 import { tool as urlParser } from './url-parser';
 import { tool as uuidGenerator } from './uuid-generator';
-import type { ToolCategory } from './tools.types';
 
 export const toolsByCategory: ToolCategory[] = [
   {
@@ -81,7 +82,7 @@ export const toolsByCategory: ToolCategory[] = [
   },
   {
     name: 'Measurement',
-    components: [chronometer],
+    components: [chronometer, temperatureConverter],
   },
   {
     name: 'Text',

src/tools/temperature-converter/index.ts

@@ -0,0 +1,24 @@
+import { Temperature } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Temperature converter',
+  path: '/temperature-converter',
+  description:
+    'Temperature degrees conversions for Kelvin, Celsius, Fahrenheit, Rankine, Delisle, Newton, Réaumur and Rømer.',
+  keywords: [
+    'temperature',
+    'converter',
+    'degree',
+    'Kelvin',
+    'Celsius',
+    'Fahrenheit',
+    'Rankine',
+    'Delisle',
+    'Newton',
+    'Réaumur',
+    'Rømer',
+  ],
+  component: () => import('./temperature-converter.vue'),
+  icon: Temperature,
+});

src/tools/temperature-converter/temperature-converter.models.ts

@@ -0,0 +1,20 @@
+export const convertCelsiusToKelvin = (temperature: number) => temperature + 273.15;
+export const convertKelvinToCelsius = (temperature: number) => temperature - 273.15;
+
+export const convertFahrenheitToKelvin = (temperature: number) => (temperature + 459.67) * (5 / 9);
+export const convertKelvinToFahrenheit = (temperature: number) => temperature * (9 / 5) - 459.67;
+
+export const convertRankineToKelvin = (temperature: number) => temperature * (5 / 9);
+export const convertKelvinToRankine = (temperature: number) => temperature * (9 / 5);
+
+export const convertDelisleToKelvin = (temperature: number) => 373.15 - (2 / 3) * temperature;
+export const convertKelvinToDelisle = (temperature: number) => (3 / 2) * (373.15 - temperature);
+
+export const convertNewtonToKelvin = (temperature: number) => temperature * (100 / 33) + 273.15;
+export const convertKelvinToNewton = (temperature: number) => (temperature - 273.15) * (33 / 100);
+
+export const convertReaumurToKelvin = (temperature: number) => temperature * (5 / 4) + 273.15;
+export const convertKelvinToReaumur = (temperature: number) => (temperature - 273.15) * (4 / 5);
+
+export const convertRomerToKelvin = (temperature: number) => (temperature - 7.5) * (40 / 21) + 273.15;
+export const convertKelvinToRomer = (temperature: number) => (temperature - 273.15) * (21 / 40) + 7.5;

src/tools/temperature-converter/temperature-converter.vue

@@ -0,0 +1,127 @@
+<template>
+  <div>
+    <n-input-group
+      v-for="[key, { title, unit }] in Object.entries(units)"
+      :key="key"
+      style="width: 100%; margin-bottom: 15px"
+    >
+      <n-input-group-label style="width: 100px">
+        {{ title }}
+      </n-input-group-label>
+
+      <n-input-number
+        v-model:value="units[key].ref"
+        style="flex: 1"
+        @update:value="() => update(key as TemperatureScale)"
+      />
+
+      <n-input-group-label style="width: 50px">
+        {{ unit }}
+      </n-input-group-label>
+    </n-input-group>
+  </div>
+</template>
+
+<script setup lang="ts">
+import _ from 'lodash';
+import { reactive } from 'vue';
+import {
+  convertCelsiusToKelvin,
+  convertDelisleToKelvin,
+  convertFahrenheitToKelvin,
+  convertKelvinToCelsius,
+  convertKelvinToDelisle,
+  convertKelvinToFahrenheit,
+  convertKelvinToNewton,
+  convertKelvinToRankine,
+  convertKelvinToReaumur,
+  convertKelvinToRomer,
+  convertNewtonToKelvin,
+  convertRankineToKelvin,
+  convertReaumurToKelvin,
+  convertRomerToKelvin,
+} from './temperature-converter.models';
+
+type TemperatureScale = 'kelvin' | 'celsius' | 'fahrenheit' | 'rankine' | 'delisle' | 'newton' | 'reaumur' | 'romer';
+
+const units = reactive<
+  Record<
+    string | TemperatureScale,
+    { title: string; unit: string; ref: number; toKelvin: (v: number) => number; fromKelvin: (v: number) => number }
+  >
+>({
+  kelvin: {
+    title: 'Kelvin',
+    unit: 'K',
+    ref: 0,
+    toKelvin: _.identity,
+    fromKelvin: _.identity,
+  },
+  celsius: {
+    title: 'Celsius',
+    unit: '°C',
+    ref: 0,
+    toKelvin: convertCelsiusToKelvin,
+    fromKelvin: convertKelvinToCelsius,
+  },
+  fahrenheit: {
+    title: 'Fahrenheit',
+    unit: '°F',
+    ref: 0,
+    toKelvin: convertFahrenheitToKelvin,
+    fromKelvin: convertKelvinToFahrenheit,
+  },
+  rankine: {
+    title: 'Rankine',
+    unit: '°R',
+    ref: 0,
+    toKelvin: convertRankineToKelvin,
+    fromKelvin: convertKelvinToRankine,
+  },
+  delisle: {
+    title: 'Delisle',
+    unit: '°De',
+    ref: 0,
+    toKelvin: convertDelisleToKelvin,
+    fromKelvin: convertKelvinToDelisle,
+  },
+  newton: {
+    title: 'Newton',
+    unit: '°N',
+    ref: 0,
+    toKelvin: convertNewtonToKelvin,
+    fromKelvin: convertKelvinToNewton,
+  },
+  reaumur: {
+    title: 'Réaumur',
+    unit: '°Ré',
+    ref: 0,
+    toKelvin: convertReaumurToKelvin,
+    fromKelvin: convertKelvinToReaumur,
+  },
+  romer: {
+    title: 'Rømer',
+    unit: '°Rø',
+    ref: 0,
+    toKelvin: convertRomerToKelvin,
+    fromKelvin: convertKelvinToRomer,
+  },
+});
+
+function update(key: TemperatureScale) {
+  const { ref: value, toKelvin } = units[key];
+
+  const kelvins = toKelvin(value) ?? 0;
+
+  _.chain(units)
+    .omit(key)
+    .forEach(({ fromKelvin }, index) => {
+      units[index].ref = Math.floor((fromKelvin(kelvins) ?? 0) * 100) / 100;
+    })
+    .value();
+}
+
+update('kelvin');
+</script>
+
+<style lang="less" scoped></style>