feat(new tool): unicode to java entities

This commit is contained in:
TuanNA1 2024-05-16 14:08:58 +07:00 committed by ng-anhhtuann
parent 2821655554
commit e9a4d06d39
8 changed files with 76 additions and 117 deletions

18
components.d.ts vendored
View file

@ -88,24 +88,16 @@ declare module 'vue' {
IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default'] IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default']
'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default'] 'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default']
'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default'] 'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default']
IconMdiArrowRightBottom: typeof import('~icons/mdi/arrow-right-bottom')['default']
IconMdiCamera: typeof import('~icons/mdi/camera')['default']
IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default'] IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default']
IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default'] IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default']
IconMdiClose: typeof import('~icons/mdi/close')['default'] IconMdiClose: typeof import('~icons/mdi/close')['default']
IconMdiContentCopy: typeof import('~icons/mdi/content-copy')['default'] IconMdiContentCopy: typeof import('~icons/mdi/content-copy')['default']
IconMdiDeleteOutline: typeof import('~icons/mdi/delete-outline')['default']
IconMdiDownload: typeof import('~icons/mdi/download')['default']
IconMdiEye: typeof import('~icons/mdi/eye')['default'] IconMdiEye: typeof import('~icons/mdi/eye')['default']
IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default'] IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default']
IconMdiHeart: typeof import('~icons/mdi/heart')['default'] IconMdiHeart: typeof import('~icons/mdi/heart')['default']
IconMdiPause: typeof import('~icons/mdi/pause')['default']
IconMdiPlay: typeof import('~icons/mdi/play')['default']
IconMdiRecord: typeof import('~icons/mdi/record')['default']
IconMdiSearch: typeof import('~icons/mdi/search')['default'] IconMdiSearch: typeof import('~icons/mdi/search')['default']
IconMdiTranslate: typeof import('~icons/mdi/translate')['default'] IconMdiTranslate: typeof import('~icons/mdi/translate')['default']
IconMdiTriangleDown: typeof import('~icons/mdi/triangle-down')['default'] IconMdiTriangleDown: typeof import('~icons/mdi/triangle-down')['default']
IconMdiVideo: typeof import('~icons/mdi/video')['default']
InputCopyable: typeof import('./src/components/InputCopyable.vue')['default'] InputCopyable: typeof import('./src/components/InputCopyable.vue')['default']
IntegerBaseConverter: typeof import('./src/tools/integer-base-converter/integer-base-converter.vue')['default'] IntegerBaseConverter: typeof import('./src/tools/integer-base-converter/integer-base-converter.vue')['default']
Ipv4AddressConverter: typeof import('./src/tools/ipv4-address-converter/ipv4-address-converter.vue')['default'] Ipv4AddressConverter: typeof import('./src/tools/ipv4-address-converter/ipv4-address-converter.vue')['default']
@ -132,33 +124,25 @@ declare module 'vue' {
MenuLayout: typeof import('./src/components/MenuLayout.vue')['default'] MenuLayout: typeof import('./src/components/MenuLayout.vue')['default']
MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default'] MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default'] MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
NAlert: typeof import('naive-ui')['NAlert']
NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default'] NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
NCheckbox: typeof import('naive-ui')['NCheckbox']
NCode: typeof import('naive-ui')['NCode'] NCode: typeof import('naive-ui')['NCode']
NCollapseTransition: typeof import('naive-ui')['NCollapseTransition'] NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
NColorPicker: typeof import('naive-ui')['NColorPicker']
NConfigProvider: typeof import('naive-ui')['NConfigProvider'] NConfigProvider: typeof import('naive-ui')['NConfigProvider']
NDivider: typeof import('naive-ui')['NDivider'] NDivider: typeof import('naive-ui')['NDivider']
NEllipsis: typeof import('naive-ui')['NEllipsis'] NEllipsis: typeof import('naive-ui')['NEllipsis']
NForm: typeof import('naive-ui')['NForm']
NFormItem: typeof import('naive-ui')['NFormItem'] NFormItem: typeof import('naive-ui')['NFormItem']
NGi: typeof import('naive-ui')['NGi'] NGi: typeof import('naive-ui')['NGi']
NGrid: typeof import('naive-ui')['NGrid'] NGrid: typeof import('naive-ui')['NGrid']
NH1: typeof import('naive-ui')['NH1'] NH1: typeof import('naive-ui')['NH1']
NH3: typeof import('naive-ui')['NH3'] NH3: typeof import('naive-ui')['NH3']
NIcon: typeof import('naive-ui')['NIcon'] NIcon: typeof import('naive-ui')['NIcon']
NInputGroup: typeof import('naive-ui')['NInputGroup']
NInputGroupLabel: typeof import('naive-ui')['NInputGroupLabel']
NInputNumber: typeof import('naive-ui')['NInputNumber'] NInputNumber: typeof import('naive-ui')['NInputNumber']
NLabel: typeof import('naive-ui')['NLabel']
NLayout: typeof import('naive-ui')['NLayout'] NLayout: typeof import('naive-ui')['NLayout']
NLayoutSider: typeof import('naive-ui')['NLayoutSider'] NLayoutSider: typeof import('naive-ui')['NLayoutSider']
NMenu: typeof import('naive-ui')['NMenu'] NMenu: typeof import('naive-ui')['NMenu']
NScrollbar: typeof import('naive-ui')['NScrollbar'] NScrollbar: typeof import('naive-ui')['NScrollbar']
NSlider: typeof import('naive-ui')['NSlider']
NSpin: typeof import('naive-ui')['NSpin'] NSpin: typeof import('naive-ui')['NSpin']
NSwitch: typeof import('naive-ui')['NSwitch']
NTable: typeof import('naive-ui')['NTable']
NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default'] NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default'] OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default'] PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default']

View file

@ -392,6 +392,6 @@ tools:
title: Text to ASCII binary title: Text to ASCII binary
description: Convert text to its ASCII binary representation and vice-versa. description: Convert text to its ASCII binary representation and vice-versa.
unicode-to-java-entites: unicode-to-java-entities:
title: Unicode Characters to Java Entities Converter title: Unicode Characters to Java Entities Converter
description: Unicode Characters to Java Entities Converter and vice-versa description: Unicode Characters to Java Entities Converter and vice-versa

View file

@ -381,6 +381,6 @@ tools:
title: Chuyển đổi văn bản thành nhị phân ASCII title: Chuyển đổi văn bản thành nhị phân ASCII
description: Chuyển đổi văn bản thành biểu diễn nhị phân ASCII của nó và ngược lại. description: Chuyển đổi văn bản thành biểu diễn nhị phân ASCII của nó và ngược lại.
unicode-to-java-entites: unicode-to-java-entities:
title: Chuyển đổi ký tự Unicode sang thực thể Java title: Chuyển đổi ký tự Unicode sang thực thể Java
description: Chuyển đổi ký tự Unicode sang thực thể Java và ngược lại description: Chuyển đổi ký tự Unicode sang thực thể Java và ngược lại

View file

@ -3,11 +3,11 @@ import { defineTool } from '../tool';
import { translate } from '@/plugins/i18n.plugin'; import { translate } from '@/plugins/i18n.plugin';
export const tool = defineTool({ export const tool = defineTool({
name: translate('tools.unicode-to-java-entites.title'), name: translate('tools.unicode-to-java-entities.title'),
path: '/unicode-to-java-entites', path: '/unicode-to-java-entities',
description: translate('tools.unicode-to-java-entites.description'), description: translate('tools.unicode-to-java-entities.description'),
keywords: ['text', 'to', 'unicode'], keywords: ['java-entities', 'to', 'unicode', 'text'],
component: () => import('./unicode-characters-to-java-entities.vue'), component: () => import('./unicode-characters-to-java-entities.vue'),
icon: TextWrapDisabled, icon: TextWrapDisabled,
createdAt: new Date('2024-01-31'), createdAt: new Date('2024-05-16'),
}); });

View file

@ -5,11 +5,9 @@ function strlenFix(str: string): string {
return str; return str;
} }
function parseUnicodeToJavaEntities(source: string, direction: '0' | '-1'): string { function parseUnicodeToJavaEntities(source: string): string {
let result = ''; let result = '';
if (direction === '0') {
// UTF-8 to entities
for (let i = 0; i < source.length; i++) { for (let i = 0; i < source.length; i++) {
const charCode = source.charCodeAt(i); const charCode = source.charCodeAt(i);
if (charCode <= 127) { if (charCode <= 127) {
@ -19,9 +17,11 @@ function parseUnicodeToJavaEntities(source: string, direction: '0' | '-1'): stri
result += `\\u${strlenFix(charCode.toString(16).toUpperCase())}`; result += `\\u${strlenFix(charCode.toString(16).toUpperCase())}`;
} }
} }
} return result;
else { }
// Entities to UTF-8
function parseJavaEntitiesToUnicode(source: string): string {
let result = '';
let state: 0 | 1 | 2 = 0; let state: 0 | 1 | 2 = 0;
let chars = 0; let chars = 0;
let value = ''; let value = '';
@ -56,8 +56,8 @@ function parseUnicodeToJavaEntities(source: string, direction: '0' | '-1'): stri
break; break;
} }
} }
}
return result; return result;
} }
export { parseUnicodeToJavaEntities }; export { parseUnicodeToJavaEntities, parseJavaEntitiesToUnicode };

View file

@ -1,25 +0,0 @@
import { expect, test } from '@playwright/test';
test.describe('Tool - Unicode to Java entities', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/unicode-to-java-entites');
});
test('Has correct title', async ({ page }) => {
await expect(page).toHaveTitle('Unicode to Java Entities - IT Tools');
});
test('Unicode to Entities conversion', async ({ page }) => {
await page.getByTestId('unicode-to-entities-input').fill('việt nam');
const unicode = await page.getByTestId('unicode-to-entities-output').inputValue();
expect(unicode).toEqual('vi\u1EC7t nam');
});
test('Entities to Unicode conversion', async ({ page }) => {
await page.getByTestId('entities-to-unicode-input').fill('vi\u1EC7t nam');
const text = await page.getByTestId('entities-to-unicode-output').inputValue();
expect(text).toEqual('việt nam');
});
});

View file

@ -1,20 +1,20 @@
import { describe, expect, it } from 'vitest'; import { describe, expect, it } from 'vitest';
import { parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service'; import { parseJavaEntitiesToUnicode, parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service';
describe('unicode-to-entities', () => { describe('unicode-to-entities', () => {
describe('convertTextToUnicode', () => { describe('convertTextToUnicode', () => {
it('a unicode string is converted to java entities representation', () => { it('a unicode string is converted to java entities representation', () => {
expect(parseUnicodeToJavaEntities('là', '0')).toBe('l\u00E0'); expect(parseUnicodeToJavaEntities('là')).toBe('l\\u00E0');
expect(parseUnicodeToJavaEntities('sơn tùng MTP', '0')).toBe('s\u01A1n t\u00F9ng MTP'); expect(parseUnicodeToJavaEntities('sơn tùng MTP')).toBe('s\\u01A1n t\\u00F9ng MTP');
expect(parseUnicodeToJavaEntities('', '0')).toBe(''); expect(parseUnicodeToJavaEntities('')).toBe('');
}); });
}); });
describe('entities-to-unicode', () => { describe('entities-to-unicode', () => {
it('java entities string is converted to its unicode representation', () => { it('java entities string is converted to its unicode representation', () => {
expect(parseUnicodeToJavaEntities('l\u00E0', '-1')).toBe('là'); expect(parseJavaEntitiesToUnicode('l\u00E0')).toBe('là');
expect(parseUnicodeToJavaEntities('s\u01A1n t\u00F9ng MTP', '-1')).toBe('sơn tùng MTP'); expect(parseJavaEntitiesToUnicode('s\u01A1n t\u00F9ng MTP')).toBe('sơn tùng MTP');
expect(parseUnicodeToJavaEntities('', '-1')).toBe(''); expect(parseJavaEntitiesToUnicode('')).toBe('');
}); });
}); });
}); });

View file

@ -1,33 +1,33 @@
<script setup lang="ts"> <script setup lang="ts">
import { parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service'; import { parseJavaEntitiesToUnicode, parseUnicodeToJavaEntities } from './unicode-characters-to-java-entities.service';
import { useCopy } from '@/composable/copy'; import { useCopy } from '@/composable/copy';
const inputUnicode = ref(''); const inputUnicode = ref('');
const entitiesFromUnicode = computed(() => inputUnicode.value.trim() === '' ? '' : parseUnicodeToJavaEntities(inputUnicode.value, '0')); const entitiesFromUnicode = computed(() => inputUnicode.value.trim() === '' ? '' : parseUnicodeToJavaEntities(inputUnicode.value));
const { copy: copyUnicode } = useCopy({ source: entitiesFromUnicode }); const { copy: copyJavaEntities } = useCopy({ source: entitiesFromUnicode });
const inputJavaEntities = ref(''); const inputJavaEntities = ref('');
const unicodeFromEntities = computed(() => inputJavaEntities.value.trim() === '' ? '' : parseUnicodeToJavaEntities(inputJavaEntities.value, '-1')); const unicodeFromEntities = computed(() => inputJavaEntities.value.trim() === '' ? '' : parseJavaEntitiesToUnicode(inputJavaEntities.value));
const { copy: copyText } = useCopy({ source: unicodeFromEntities }); const { copy: copyUnicode } = useCopy({ source: unicodeFromEntities });
</script> </script>
<template> <template>
<c-card title="Unicode Characters to Java entities"> <c-card title="Unicode Characters to Java entities">
<c-input-text v-model:value="inputUnicode" multiline placeholder="e.g. 'Hello Avengers'" label="Enter Unicode Characters to convert to Java entities" autosize autofocus raw-text test-id="unicode-to-entities-input" /> <c-input-text v-model:value="inputUnicode" placeholder="e.g. 'Hello Avengers'" label="Enter Unicode Characters to convert to Java entities" autosize raw-text multiline autofocus test-id="unicode-to-entities-input" />
<c-input-text v-model:value="entitiesFromUnicode" label="Java entities from your text" multiline raw-text readonly mt-2 placeholder="The unicode representation of your text will be here" test-id="unicode-to-entities-output" /> <c-input-text v-model:value="entitiesFromUnicode" label="Java entities from your text" placeholder="The unicode representation of your text will be here" raw-text multiline readonly mt-2 test-id="unicode-to-entities-output" />
<div mt-2 flex justify-center> <div mt-2 flex justify-center>
<c-button :disabled="!entitiesFromUnicode" @click="copyUnicode()"> <c-button :disabled="!entitiesFromUnicode" @click="copyJavaEntities()">
Copy unicode to clipboard Copy Java entities to clipboard
</c-button> </c-button>
</div> </div>
</c-card> </c-card>
<c-card title="Java entities to Unicode Characters"> <c-card title="Java entities to Unicode Characters">
<c-input-text v-model:value="inputJavaEntities" multiline placeholder="Input Java entities" label="Enter Java entities to convert to Unicode Characters" autosize raw-text test-id="entities-to-unicode-input" /> <c-input-text v-model:value="inputJavaEntities" placeholder="Input Java entities" label="Enter Java entities to convert to Unicode Characters" autosize raw-text multiline test-id="entities-to-unicode-input" />
<c-input-text v-model:value="unicodeFromEntities" label="Text from your Java entities" multiline raw-text readonly mt-2 placeholder="The text representation of your unicode will be here" test-id="entities-to-unicode-output" /> <c-input-text v-model:value="unicodeFromEntities" label="Text from your Java entities" placeholder="The text representation of your unicode will be here" multiline raw-text readonly mt-2 test-id="entities-to-unicode-output" />
<div mt-2 flex justify-center> <div mt-2 flex justify-center>
<c-button :disabled="!unicodeFromEntities" @click="copyText()"> <c-button :disabled="!unicodeFromEntities" @click="copyUnicode()">
Copy text to clipboard Copy Unicode to clipboard
</c-button> </c-button>
</div> </div>
</c-card> </c-card>