Feature : Création d'un kernel modularisé

package.json

@@ -8,7 +8,8 @@
     "dev": "vite",
     "build": "vite build",
     "preview": "vite preview",
-    "cert": "rm -rf .certs && mkdir -p .certs && mkcert -key-file ./.certs/key.pem -cert-file ./.certs/cert.pem 'localhost' '::1' '192.168.1.2' "
+    "cert": "rm -rf .certs && mkdir -p .certs && mkcert -key-file ./.certs/key.pem -cert-file ./.certs/cert.pem 'localhost' '::1' '192.168.1.2' ",
+    "deploy": "scp -r $(pwd)/* [email protected]:/home/nicolas-choquet/www/portfolio-apple/"
   },
   "dependencies": {
     "@vitejs/plugin-basic-ssl": "^1.0.2",
@@ -25,7 +26,7 @@
     "@types/uuid": "^9.0.7",
     "@vitejs/plugin-vue": "^4.5.0",
     "sass": "^1.69.5",
-    "vite": "^5.0.0",
+    "vite": "^5.0.3",
     "vite-plugin-pwa": "^0.17.2",
     "vue-tsc": "^1.8.25"
   }

src/hooks/kernel/clipboard/index.ts

@@ -0,0 +1,42 @@
+import {useClipboard as useClipboardFromVueUse} from '@vueuse/core';
+import type {UseClipboardOptions} from '@vueuse/core';
+import {ref} from 'vue';
+import type {Ref} from 'vue';
+
+const copiedDuring = ref(1500);
+const textIfNotSupported = ref('');
+const copiedIfNotSupported = ref(false);
+const copyIfNotSupported = async (text?: string|undefined) => {
+    textIfNotSupported.value = text ?? '';
+    copiedIfNotSupported.value = true;
+
+    setTimeout(() => {
+        textIfNotSupported.value = '';
+        copiedIfNotSupported.value = false;
+    }, copiedDuring.value)
+};
+
+export const useClipboard = (options?: Pick<UseClipboardOptions<Ref<string>>, 'copiedDuring'>) => {
+    const source = ref('');
+    if (options?.copiedDuring) (copiedDuring.value = options.copiedDuring);
+
+    const {
+        isSupported, copy,
+        text, copied
+    } = useClipboardFromVueUse({
+        read: true,
+        source,
+        legacy: true,
+        copiedDuring: copiedDuring.value
+    });
+
+    return isSupported.value ? {
+        copy,
+        text,
+        copied
+    } : {
+        copy: copyIfNotSupported,
+        text: textIfNotSupported,
+        copied: copiedIfNotSupported
+    };
+}

src/hooks/kernel/filesystem/functions.ts

@@ -0,0 +1,21 @@
+import {fsTree} from './index';
+import type {Directory, File} from './types';
+
+export const directoryHasChildren = (directory: Directory): boolean =>
+    fsTree.value.filter(i =>
+        i.path.startsWith(directory.path + '/' + directory.name)
+    ).length >=1;
+export const directoryExists = (directory: Directory): boolean =>
+    fsTree.value.filter(i =>
+        i.type === 'directory' &&
+        i.path === directory.path &&
+        i.name === directory.name
+    ).length === 1;
+
+export const fileExists = (file: File): boolean =>
+    fsTree.value.filter(i =>
+        i.type === 'file' &&
+        i.path === file.path &&
+        i.name === file.name &&
+        i.extension === file.extension
+    ).length === 1;

src/hooks/kernel/filesystem/index.ts

@@ -0,0 +1,74 @@
+import {computed, ComputedRef, onMounted, Ref, ref, watch, watchEffect} from 'vue';
+import type {
+    FSTree,
+    UseDirectories, UseDirectoriesReturn,
+    UseFiles,
+    UseFilesReturn,
+    UseFileSystem,
+    UseFolders,
+    UseFoldersReturn
+} from './types';
+import initMocked, * as mockedFS from './mocked';
+import initPersistent, * as persistentFS from './persistent';
+
+export const fsTree = ref<FSTree>([]);
+const asMock = ref(false);
+
+watch(fsTree, (fsTree) => {
+    console.log(fsTree)
+});
+
+export const useMock = <T extends boolean>(mock: Ref<T>|T) => {
+    if (typeof mock === 'object') {
+        watchEffect(() => {
+            asMock.value = mock.value
+        });
+    }
+    else {
+        asMock.value = mock;
+    }
+};
+
+export const useFileSystem: UseFileSystem =
+    ({ mocked = false } = {}) => {
+        if (mocked !== asMock.value) {
+            asMock.value = mocked;
+        }
+
+        onMounted(() => {
+            if (mocked) {
+                initMocked();
+            }
+            else {
+                initPersistent();
+            }
+        })
+
+        return mocked ? mockedFS : persistentFS;
+    };
+
+export const useFSTree = (): ComputedRef<FSTree> => computed(() => fsTree.value);
+export const useFiles: UseFiles = () => {
+    const { file } = useFileSystem({mocked: asMock.value});
+
+    return Array.from(Object.keys(file)).reduce<UseFilesReturn>((r, k) => ({
+        ...r,
+        [`${k}File`]: file[k as keyof typeof file]
+    }), {} as UseFilesReturn);
+};
+export const useFolders: UseFolders = () => {
+    const { directory } = useFileSystem({mocked: asMock.value});
+
+    return Array.from(Object.keys(directory)).reduce<UseFoldersReturn>((r, k) => ({
+        ...r,
+        [`${k}Folder`]: directory[k as keyof typeof directory]
+    }), {} as UseFoldersReturn);
+};
+export const useDirectories: UseDirectories = () => {
+    const folders = useFolders();
+
+    return Array.from(Object.keys(folders)).reduce<UseDirectoriesReturn>((r, k) => ({
+        ...r,
+        [k.replace('Folder', 'Directory')]: folders[k as keyof typeof folders]
+    }), {} as UseDirectoriesReturn);
+};

src/hooks/kernel/filesystem/mimeTypes.ts

@@ -0,0 +1,91 @@
+/**
+ * @author nicolachoqyet06250
+ *
+ * use this lib for uncompress archive in javascript from web worker :
+ * https://github.com/nika-begiashvili/libarchivejs?ref=hackernoon.com
+ *
+ * use this lib for compress archives in javascript :
+ * https://github.com/Stuk/jszip
+ *
+ * use this lib for read word (docx) documents in HTML :
+ * https://github.com/scuderia-fe/docx-to-html
+ *
+ * invert, use this lib :
+ * https://github.com/caiyexiang/html-docx-js-typescript
+ *
+ * for convert excels documents to html and invert, use this lib :
+ * https://docs.sheetjs.com/
+ *
+ * @source https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
+ */
+
+export default {
+    // images
+    png: 'image/png',
+    apng: 'image/apng',
+    avif: 'image/avif',
+    gif: 'image/gif',
+    ico: 'image/vnd.microsoft.icon',
+    jpeg: 'image/jpeg',
+    jpg: 'image/jpeg',
+    svg: 'image/svg+xml',
+    webp: 'image/webp',
+
+    // audios
+    mp3: 'audio/mpeg',
+    oga: 'audio/ogg',
+    opus: 'audio/opus',
+    wav: 'audio/wav',
+    weba: 'audio/webm',
+
+    // video
+    mp4: 'video/mp4',
+    mpeg: 'video/mpeg',
+    ogv: 'video/ogg',
+    webm: 'video/webm',
+
+    // audio - video mix
+    '3gp': [
+        'video/3gpp',
+        'audio/3gpp'
+    ],
+    '3g2': [
+        'video/3gpp2',
+        'audio/3gpp2'
+    ],
+
+    // archives
+    '7z': 'application/x-7z-compressed',
+    bz: 'application/x-bzip',
+    bz2: 'application/x-bzip2',
+    gz: 'application/gzip',
+    rar: 'application/vnd.rar',
+    tar: 'application/x-tar',
+
+    // applications
+    ods: 'application/vnd.oasis.opendocument.spreadsheet',
+    odt: 'application/vnd.oasis.opendocument.text',
+    arc: 'application/x-freearc',
+    csh: 'application/x-csh',
+    sh: 'application/x-sh',
+    docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+    xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+    json: 'application/json',
+    jsonld: 'application/ld+json',
+    pdf: 'application/pdf',
+    php: 'application/x-httpd-php',
+    rtf: 'application/rtf',
+    xhtml: 'application/xhtml+xml',
+    xml: 'application/xml',
+    zip: 'application/zip',
+
+    // text
+    css: 'text/css',
+    csv: 'text/csv',
+    html: 'text/html',
+    htm: 'text/html',
+    ics: 'text/calendar',
+    js: 'text/javascript',
+    mjs: 'text/javascript',
+    txt: 'text/plain',
+} as const;

src/hooks/kernel/filesystem/mocked/directory.ts

@@ -0,0 +1,136 @@
+import type {
+    DirectoryItem,
+    UseFileSystemReturn
+} from '../types.ts';
+
+import {fsTree} from '../index';
+import {directoryExists, directoryHasChildren} from '@/hooks/kernel/filesystem/functions.ts';
+
+export const create: UseFileSystemReturn['directory']['create'] =
+    (directory, force = false) => {
+        const pathExists = fsTree.value.filter(i => {
+            const path = directory.path.split('/');
+            const name = path.pop();
+            return i.type === 'directory'
+                && i.path === path.join('/')
+                && i.name === name;
+        }).length === 1;
+
+        const directoryExists = fsTree.value.filter(i =>
+            i.type === 'directory' &&
+            i.path === directory.path &&
+            i.name === directory.name
+        ).length === 1;
+
+        if (!force && (!pathExists || !directoryExists)) {
+            throw Error(`impossible de créer le répertoire «${directory.path}/${directory.name}»: Aucun fichier ou dossier de ce type`);
+        }
+
+        if (force && (!pathExists || !directoryExists)) {
+            let iterationPath = '';
+            const rootPath = '/';
+            for (let i = 0; i < directory.path.split('/').length; i++) {
+                iterationPath += '/' + directory.path.split('/')[i];
+                iterationPath = (iterationPath.startsWith('//') ? iterationPath.substring(1) : iterationPath);
+
+                const path = iterationPath.split('/');
+                path.shift()
+                const name = path.pop();
+                const joinedPath = '/' + path.join('/');
+
+                const iterationPathExists = fsTree.value.filter(i =>
+                    i.type === 'directory' &&
+                    (
+                        (
+                            iterationPath === rootPath &&
+                            i.path === '' && i.name === rootPath
+                        ) ||
+                        (
+                            i.path === joinedPath
+                            && i.name === name
+                        )
+                    )
+                ).length === 1;
+
+                if (!iterationPathExists) {
+                    const path = iterationPath.split('/');
+                    path.shift()
+                    const name = path.pop();
+
+                    const item: DirectoryItem = {
+                        type: 'directory',
+                        path: '/' + path.join('/'),
+                        name: name!
+                    };
+
+                    fsTree.value = [...fsTree.value, item]
+                }
+            }
+        }
+
+        if (pathExists && !directoryExists) {
+            const item: DirectoryItem = {
+                type: 'directory',
+                ...directory
+            };
+
+            fsTree.value = [...fsTree.value, item]
+        }
+    }
+
+export const remove: UseFileSystemReturn['directory']['remove'] =
+    (directory, force = false) => {
+        if (!directoryExists(directory) && !force) {
+            throw new Error(`impossible de supprimer '/${directory.path}/${directory.name}': Aucun fichier ou dossier de ce type`);
+        }
+
+        const hasChildren = directoryHasChildren(directory);
+        if (hasChildren) {
+            if (!force) {
+                throw new Error(`impossible de supprimer '${directory.path}/${directory.name}/': est un dossier`)
+            }
+
+            fsTree.value = fsTree.value.filter(i =>
+                !i.path.startsWith(directory.path + '/' + directory.name)
+            )
+        }
+
+        fsTree.value = fsTree.value.filter(i =>
+            i.type === 'file' ||
+            (
+                i.path !== directory.path ||
+                i.name !== directory.name
+            )
+        )
+    };
+
+export const rename: UseFileSystemReturn['directory']['rename'] =
+    (from, to) => {
+        if (!directoryExists(from)) {
+            throw new Error(`impossible d'évaluer '${from.path}/${from.name}': Aucun fichier ou dossier de ce type`)
+        }
+
+        const toPath = to.path.split('/');
+        const toName = toPath.pop();
+        const fromPath = from.path.split('/');
+        fromPath.pop();
+
+        if (!directoryExists({
+            path: toPath.join('/'),
+            name: toName!
+        }) && toPath.length > fromPath.length) {
+            throw new Error(`impossible de déplacer '${from.path}/${from.name}/' vers '${to.path}/${to.name}': Aucun fichier ou dossier de ce type`)
+        }
+
+        fsTree.value = fsTree.value.map(i => i.path.startsWith(from.path + '/' + from.name) ? {
+            ...i,
+            path: to.path + '/' + to.name + i.path.substring((from.path + '/' + from.name).length)
+        } : i);
+
+        fsTree.value = fsTree.value.map(i =>
+            i.type === 'directory' &&
+            i.path === from.path &&
+            i.name === from.name ?
+                { ...i, ...to } : i
+        );
+    };