diff --git a/src/App.vue b/src/App.vue index 0668d304..de94b5c1 100644 --- a/src/App.vue +++ b/src/App.vue @@ -9,7 +9,7 @@
{{section.title}} - + {{ item.icon }} @@ -82,6 +82,7 @@ - \ No newline at end of file diff --git a/src/router.js b/src/router.js index c77bde3f..4942f8bf 100644 --- a/src/router.js +++ b/src/router.js @@ -7,38 +7,81 @@ import DateConverter from "./routes/tools/DateConverter"; import UrlEncoder from "./routes/tools/UrlEncoder"; import FileToBase64 from "./routes/tools/FileToBase64"; import TextCypher from "./routes/tools/TextCypher"; +import TextStats from "./routes/tools/TextStats"; Vue.use(VueRouter) -const toolsRoutes = [ + +const toolsComponents = [ { - path: '/token-generator', - component: TokenGenerator + title: 'Crypto', + child: [ + { + icon: 'fa-key', + text: 'Token generator', + path: '/token-generator', + component: TokenGenerator, + keywords: ['md5'] + }, + { + icon: 'fa-font', + text: 'Hash text', + path: '/hash', + component: Hash + }, + { + icon: 'fa-lock', + text: 'Cypher/uncypher text', + path: '/cypher', + component: TextCypher + }, + ], }, { - path: '/hash', - component: Hash + title: 'Converter', + child: [ + { + icon: 'fa-calendar', + text: 'Date/Time converter', + path: '/date-converter', + component: DateConverter + }, + ], }, { - path: '/date-converter', - component: DateConverter + title: 'Web', + child: [ + { + icon: 'fa-link', + text: 'URL encode/decode', + path: '/url-encoder', + component: UrlEncoder + }, + { + icon: 'fa-file-image-o', + text: 'File to Base64', + path: '/file-to-base64', + component: FileToBase64 + }, + ], }, { - path: '/url-encoder', - component: UrlEncoder - }, - { - path: '/file-to-base64', - component: FileToBase64 - }, - { - path: '/cypher', - component: TextCypher + title: 'Miscellaneous', + child: [ + { + icon: 'fa-file-text', + text: 'Text stats', + path: '/text-stats', + component: TextStats + }, + ], } -] +]; + +const toolsComponentsFlat = toolsComponents.reduce((acc, section) => [...acc, ...section.child], []) const routes = [ - ...toolsRoutes, + ...toolsComponentsFlat, { path: '/', component: Home @@ -59,5 +102,6 @@ const router = new VueRouter({ export default router; export { routes, - toolsRoutes + toolsComponents, + toolsComponentsFlat }; diff --git a/src/routes/Home.vue b/src/routes/Home.vue index 0e251552..10fac343 100644 --- a/src/routes/Home.vue +++ b/src/routes/Home.vue @@ -2,7 +2,6 @@ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad at cumque dolore dolores, dolorum eius error est eum eveniet hic illum ipsum labore minus odio quibusdam repudiandae sed ullam veritatis! - diff --git a/src/routes/tools/TextStats.vue b/src/routes/tools/TextStats.vue new file mode 100644 index 00000000..a19e1345 --- /dev/null +++ b/src/routes/tools/TextStats.vue @@ -0,0 +1,72 @@ + + + + + \ No newline at end of file diff --git a/src/utils/helpers.js b/src/utils/helpers.js index 0da2c304..17f4b337 100644 --- a/src/utils/helpers.js +++ b/src/utils/helpers.js @@ -12,7 +12,20 @@ const fileIsImage = (file) => { return file.type.split('/')[0] === 'image'; } +const formatBytes = (bytes, decimals = 2) => { + if (bytes === 0) return '0 Bytes'; + + const k = 1024; + const dm = decimals < 0 ? 0 : decimals; + const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']; + + const i = Math.floor(Math.log(bytes) / Math.log(k)); + + return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; +} + export { copyToClipboard, - fileIsImage + fileIsImage, + formatBytes } \ No newline at end of file