mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-05-07 14:57:12 -04:00
fix: allow all units for bitrate
ie, in case of download speed in MB/s
This commit is contained in:
ShareVB
parent
7856df3918
commit
edfb3f575b
5 changed files with 59 additions and 37 deletions
|
|
@ -286,6 +286,9 @@
|
|||
"watchTriggerable": true,
|
||||
"watchWithFilter": true,
|
||||
"whenever": true,
|
||||
"toValue": true
|
||||
"toValue": true,
|
||||
"injectLocal": true,
|
||||
"provideLocal": true,
|
||||
"useClipboardItems": true
|
||||
}
|
||||
}
|
||||
|
|
|
|||
9
auto-imports.d.ts
vendored
9
auto-imports.d.ts
vendored
|
|
@ -36,6 +36,7 @@ declare global {
|
|||
const h: typeof import('vue')['h']
|
||||
const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
|
||||
const inject: typeof import('vue')['inject']
|
||||
const injectLocal: typeof import('@vueuse/core')['injectLocal']
|
||||
const isDefined: typeof import('@vueuse/core')['isDefined']
|
||||
const isProxy: typeof import('vue')['isProxy']
|
||||
const isReactive: typeof import('vue')['isReactive']
|
||||
|
|
@ -65,6 +66,7 @@ declare global {
|
|||
const onUpdated: typeof import('vue')['onUpdated']
|
||||
const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
|
||||
const provide: typeof import('vue')['provide']
|
||||
const provideLocal: typeof import('@vueuse/core')['provideLocal']
|
||||
const reactify: typeof import('@vueuse/core')['reactify']
|
||||
const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
|
||||
const reactive: typeof import('vue')['reactive']
|
||||
|
|
@ -128,6 +130,7 @@ declare global {
|
|||
const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
|
||||
const useCached: typeof import('@vueuse/core')['useCached']
|
||||
const useClipboard: typeof import('@vueuse/core')['useClipboard']
|
||||
const useClipboardItems: typeof import('@vueuse/core')['useClipboardItems']
|
||||
const useCloned: typeof import('@vueuse/core')['useCloned']
|
||||
const useColorMode: typeof import('@vueuse/core')['useColorMode']
|
||||
const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
|
||||
|
|
@ -326,6 +329,7 @@ declare module 'vue' {
|
|||
readonly h: UnwrapRef<typeof import('vue')['h']>
|
||||
readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
|
||||
readonly inject: UnwrapRef<typeof import('vue')['inject']>
|
||||
readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
|
||||
readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
|
||||
readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
|
||||
readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
|
||||
|
|
@ -355,6 +359,7 @@ declare module 'vue' {
|
|||
readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
|
||||
readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
|
||||
readonly provide: UnwrapRef<typeof import('vue')['provide']>
|
||||
readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
|
||||
readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
|
||||
readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
|
||||
readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
|
||||
|
|
@ -418,6 +423,7 @@ declare module 'vue' {
|
|||
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
|
||||
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
|
||||
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
|
||||
readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
|
||||
readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
|
||||
readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
|
||||
readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
|
||||
|
|
@ -610,6 +616,7 @@ declare module '@vue/runtime-core' {
|
|||
readonly h: UnwrapRef<typeof import('vue')['h']>
|
||||
readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
|
||||
readonly inject: UnwrapRef<typeof import('vue')['inject']>
|
||||
readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
|
||||
readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
|
||||
readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
|
||||
readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
|
||||
|
|
@ -639,6 +646,7 @@ declare module '@vue/runtime-core' {
|
|||
readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
|
||||
readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
|
||||
readonly provide: UnwrapRef<typeof import('vue')['provide']>
|
||||
readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
|
||||
readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
|
||||
readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
|
||||
readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
|
||||
|
|
@ -702,6 +710,7 @@ declare module '@vue/runtime-core' {
|
|||
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
|
||||
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
|
||||
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
|
||||
readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
|
||||
readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
|
||||
readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
|
||||
readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { describe, expect, it } from 'vitest';
|
||||
import { amountTransferable, neededRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
||||
import { amountTransferable, transferSpeedRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
||||
|
||||
describe('data-transfer-converter', () => {
|
||||
describe('transferTimeSeconds', () => {
|
||||
|
|
@ -12,9 +12,9 @@ describe('data-transfer-converter', () => {
|
|||
})).toBe(80);
|
||||
});
|
||||
});
|
||||
describe('neededRate', () => {
|
||||
it('compute neededRate', () => {
|
||||
expect(neededRate({
|
||||
describe('transferSpeedRate', () => {
|
||||
it('compute transferSpeedRate', () => {
|
||||
expect(transferSpeedRate({
|
||||
dataSize: 100,
|
||||
dataSizeUnit: 'MB',
|
||||
hours: 0,
|
||||
|
|
@ -22,6 +22,14 @@ describe('data-transfer-converter', () => {
|
|||
seconds: 20,
|
||||
bitRateUnit: 'Mb',
|
||||
})).toBe(10);
|
||||
expect(transferSpeedRate({
|
||||
dataSize: 100,
|
||||
dataSizeUnit: 'MB',
|
||||
hours: 0,
|
||||
minutes: 1,
|
||||
seconds: 20,
|
||||
bitRateUnit: 'MB',
|
||||
})).toBe(1.25);
|
||||
});
|
||||
});
|
||||
describe('amountTransferable', () => {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { type AllSupportedUnits, type BitsUnits, convertStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
||||
import { type AllSupportedUnits, convertStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
||||
|
||||
export function transferTimeSeconds({
|
||||
dataSize,
|
||||
|
|
@ -9,14 +9,14 @@ export function transferTimeSeconds({
|
|||
dataSize: number
|
||||
dataSizeUnit: AllSupportedUnits
|
||||
bitRate: number
|
||||
bitRateUnit: BitsUnits
|
||||
bitRateUnit: AllSupportedUnits
|
||||
}): number {
|
||||
const dataSizeInBytes = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'B' });
|
||||
const bitRateInBytes = convertStorageAndRateUnits({ value: bitRate, fromUnit: bitRateUnit, toUnit: 'B' });
|
||||
return bitRateInBytes > 0 ? dataSizeInBytes / bitRateInBytes : 0;
|
||||
}
|
||||
|
||||
export function neededRate({
|
||||
export function transferSpeedRate({
|
||||
dataSize,
|
||||
dataSizeUnit,
|
||||
hours,
|
||||
|
|
@ -29,7 +29,7 @@ export function neededRate({
|
|||
hours: number
|
||||
minutes: number
|
||||
seconds: number
|
||||
bitRateUnit: BitsUnits
|
||||
bitRateUnit: AllSupportedUnits
|
||||
}): number {
|
||||
const dataSizeInBits = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'b' });
|
||||
const timeInSeconds = hours * 3600 + minutes * 60 + seconds;
|
||||
|
|
@ -45,7 +45,7 @@ export function amountTransferable({
|
|||
dataSizeUnit,
|
||||
}: {
|
||||
bitRate: number
|
||||
bitRateUnit: BitsUnits
|
||||
bitRateUnit: AllSupportedUnits
|
||||
hours: number
|
||||
minutes: number
|
||||
seconds: number
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script setup lang="ts">
|
||||
import { formatDuration, intervalToDuration } from 'date-fns';
|
||||
import { type AllSupportedUnits, type BitsUnits, displayStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
||||
import { amountTransferable, neededRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
||||
import { type AllSupportedUnits, displayStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
||||
import { amountTransferable, transferSpeedRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
||||
|
||||
const allStorateUnits = [
|
||||
{ value: 'B', label: 'Bytes (B)' },
|
||||
|
|
@ -35,6 +35,8 @@ const allBitsUnits = [
|
|||
{ value: 'Yb', label: 'Yottabits (Ybit)' },
|
||||
];
|
||||
|
||||
const allRateUnits = [...allBitsUnits, ...allStorateUnits];
|
||||
|
||||
function convertToTimeDisplay(seconds: number) {
|
||||
if (seconds === 0) {
|
||||
return '0';
|
||||
|
|
@ -59,7 +61,7 @@ const transferTimeOutput = computed(() => {
|
|||
dataSize: Number(transferTimeInput.value.dataSize),
|
||||
dataSizeUnit: transferTimeInput.value.dataSizeUnit as AllSupportedUnits,
|
||||
bitRate: Number(transferTimeInput.value.bitRate),
|
||||
bitRateUnit: transferTimeInput.value.bitRateUnit as BitsUnits,
|
||||
bitRateUnit: transferTimeInput.value.bitRateUnit as AllSupportedUnits,
|
||||
}));
|
||||
}
|
||||
catch (e: any) {
|
||||
|
|
@ -67,7 +69,7 @@ const transferTimeOutput = computed(() => {
|
|||
}
|
||||
});
|
||||
|
||||
const neededRateInput = ref<{
|
||||
const transferSpeedRateInput = ref<{
|
||||
dataSize: string
|
||||
dataSizeUnit: string
|
||||
hours: number
|
||||
|
|
@ -82,18 +84,18 @@ const neededRateInput = ref<{
|
|||
seconds: 0,
|
||||
bitRateUnit: 'Mb',
|
||||
});
|
||||
const neededRateOutput = computed(() => {
|
||||
const transferSpeedRateOutput = computed(() => {
|
||||
try {
|
||||
return displayStorageAndRateUnits({
|
||||
unit: neededRateInput.value.bitRateUnit as BitsUnits,
|
||||
unit: transferSpeedRateInput.value.bitRateUnit as AllSupportedUnits,
|
||||
appendUnit: true,
|
||||
value: neededRate({
|
||||
dataSize: Number(neededRateInput.value.dataSize),
|
||||
dataSizeUnit: neededRateInput.value.dataSizeUnit as AllSupportedUnits,
|
||||
hours: neededRateInput.value.hours,
|
||||
minutes: neededRateInput.value.minutes,
|
||||
seconds: neededRateInput.value.seconds,
|
||||
bitRateUnit: neededRateInput.value.bitRateUnit as BitsUnits,
|
||||
value: transferSpeedRate({
|
||||
dataSize: Number(transferSpeedRateInput.value.dataSize),
|
||||
dataSizeUnit: transferSpeedRateInput.value.dataSizeUnit as AllSupportedUnits,
|
||||
hours: transferSpeedRateInput.value.hours,
|
||||
minutes: transferSpeedRateInput.value.minutes,
|
||||
seconds: transferSpeedRateInput.value.seconds,
|
||||
bitRateUnit: transferSpeedRateInput.value.bitRateUnit as AllSupportedUnits,
|
||||
}),
|
||||
});
|
||||
}
|
||||
|
|
@ -124,7 +126,7 @@ const amountTransferableOutput = computed(() => {
|
|||
appendUnit: true,
|
||||
value: amountTransferable({
|
||||
bitRate: Number(amountTransferableInput.value.bitRate),
|
||||
bitRateUnit: amountTransferableInput.value.bitRateUnit as BitsUnits,
|
||||
bitRateUnit: amountTransferableInput.value.bitRateUnit as AllSupportedUnits,
|
||||
hours: amountTransferableInput.value.hours,
|
||||
minutes: amountTransferableInput.value.minutes,
|
||||
seconds: amountTransferableInput.value.seconds,
|
||||
|
|
@ -157,7 +159,7 @@ const amountTransferableOutput = computed(() => {
|
|||
<c-select
|
||||
v-model:value="transferTimeInput.bitRateUnit"
|
||||
searchable
|
||||
:options="allBitsUnits"
|
||||
:options="allRateUnits"
|
||||
placeholder="Select a bit rate unit"
|
||||
ml-1
|
||||
/>
|
||||
|
|
@ -171,11 +173,11 @@ const amountTransferableOutput = computed(() => {
|
|||
placeholder="Transfer time will be here..."
|
||||
/>
|
||||
</c-card>
|
||||
<c-card title="Needed Bit Rate" mb-2>
|
||||
<c-card title="Transfer Bit Rate/Speed" mb-2>
|
||||
<n-form-item label="Data Size:" label-placement="left">
|
||||
<n-input v-model:value="neededRateInput.dataSize" placeholder="Data Size..." :min="0" w-full />
|
||||
<n-input v-model:value="transferSpeedRateInput.dataSize" placeholder="Data Size..." :min="0" w-full />
|
||||
<c-select
|
||||
v-model:value="neededRateInput.dataSizeUnit"
|
||||
v-model:value="transferSpeedRateInput.dataSizeUnit"
|
||||
:options="allStorateUnits"
|
||||
placeholder="Select a storage unit"
|
||||
ml-1
|
||||
|
|
@ -183,23 +185,23 @@ const amountTransferableOutput = computed(() => {
|
|||
</n-form-item>
|
||||
|
||||
<n-form-item label="Duration (h/m/s):" label-placement="left">
|
||||
<n-input-number v-model:value="neededRateInput.hours" mr-1 placeholder="Hours" :min="0" w-full />
|
||||
<n-input-number v-model:value="neededRateInput.minutes" mr-1 placeholder="Minutes" :min="0" w-full />
|
||||
<n-input-number v-model:value="neededRateInput.seconds" mr-1 placeholder="Seconds" :min="0" w-full />
|
||||
<n-input-number v-model:value="transferSpeedRateInput.hours" mr-1 placeholder="Hours" :min="0" w-full />
|
||||
<n-input-number v-model:value="transferSpeedRateInput.minutes" mr-1 placeholder="Minutes" :min="0" w-full />
|
||||
<n-input-number v-model:value="transferSpeedRateInput.seconds" mr-1 placeholder="Seconds" :min="0" w-full />
|
||||
</n-form-item>
|
||||
|
||||
<n-divider />
|
||||
|
||||
<div flex items-baseline gap-2>
|
||||
<InputCopyable
|
||||
label="Needed Bit Rate:"
|
||||
label="Transfer Bit Rate/Speed:"
|
||||
label-position="left"
|
||||
:value="neededRateOutput"
|
||||
placeholder="Needed Bit Rate will be here..."
|
||||
:value="transferSpeedRateOutput"
|
||||
placeholder="Bit Rate will be here..."
|
||||
/>
|
||||
<c-select
|
||||
v-model:value="transferTimeInput.bitRateUnit"
|
||||
:options="allBitsUnits"
|
||||
v-model:value="transferSpeedRateInput.bitRateUnit"
|
||||
:options="allRateUnits"
|
||||
placeholder="Select a bit rate unit"
|
||||
ml-1
|
||||
/>
|
||||
|
|
@ -210,7 +212,7 @@ const amountTransferableOutput = computed(() => {
|
|||
<n-input v-model:value="amountTransferableInput.bitRate" placeholder="Bit Rate..." :min="0" w-full />
|
||||
<c-select
|
||||
v-model:value="amountTransferableInput.bitRateUnit"
|
||||
:options="allBitsUnits"
|
||||
:options="allRateUnits"
|
||||
placeholder="Select a bit rate unit"
|
||||
ml-1
|
||||
/>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue