Several changes

- some `Wine-GE` things recommended now
- added loading gif during dxvk (runner) applying / something deleting
- added dxvk installation, deletion and applying
- `DXVK.current` field was reworked as a `DXVK.current()` method
- added `DXVK.delete()` method
- added `DXVK.apply()` method

public/runners.json

@@ -173,7 +173,7 @@
                     "wineserver": "bin/wineserver",
                     "winecfg": "lib64/wine/x86_64-windows/winecfg.exe"
                 },
-                "recommended": false
+                "recommended": true
             },
             {
                 "family": "Wine-GE",
@@ -185,7 +185,7 @@
                     "wineserver": "bin/wineserver",
                     "winecfg": "lib64/wine/x86_64-windows/winecfg.exe"
                 },
-                "recommended": false
+                "recommended": true
             },
             {
                 "family": "Wine-GE",

src/components/DXVKSelectionList.svelte

@@ -4,42 +4,117 @@
     export let recommendable = true;
 
     import DXVK from '../ts/core/DXVK';
+    import constants from '../ts/Constants';
 
     import type {
         DXVK as TDXVK
     } from '../ts/types/DXVK';
-    
-    let dxvks: TDXVK[] = [], selectedVersion;
-
-    DXVK.list().then((list) => dxvks = list);
-    DXVK.current.then((current) => selectedVersion = current?.version);
 
     import Delete from '../assets/images/delete.png';
     import Download from '../assets/images/download.png';
+    import Loading from '../assets/gifs/loading.gif';
+    
+    let dxvks: TDXVK[] = [],
+        installedDxvks = {},
+        disabledDxvks = {},
+        selectedVersion;
 
-    const dxvkInstalled = (dxvk: TDXVK): boolean => {
-        const filtered = dxvks.filter((item) => item.version === dxvk.version);
+    DXVK.list().then((list) => {
+        dxvks = list;
 
-        if (filtered.length === 1)
-            return filtered[0].installed;
+        list.forEach((dxvk) => {
+            installedDxvks[dxvk.version] = dxvk.installed;
+            disabledDxvks[dxvk.version] = false;
+        });
+    });
 
-        else return false;
+    DXVK.current().then((current) => selectedVersion = current?.version);
+
+    let progress = {}, applying = {};
+
+    const downloadDxvk = (dxvk: TDXVK) => {
+        DXVK.download(dxvk).then((stream) => {
+            stream?.downloadStart(() => disabledDxvks[dxvk.version] = true);
+
+            stream?.downloadProgress((current, total) => {
+                progress[dxvk.version] = `${Math.round(current / total * 100)}%`;
+            });
+
+            stream?.unpackProgress((current, total) => {
+                progress[dxvk.version] = `${Math.round(current / total * 100)}%`;
+            });
+
+            stream?.unpackFinish(async () => {
+                installedDxvks[dxvk.version] = true;
+                progress[dxvk.version] = undefined;
+
+                applying[dxvk.version] = true;
+
+                DXVK.apply(await constants.paths.prefix.current, dxvk).then(() => {
+                    applying[dxvk.version] = false;
+                    disabledDxvks[dxvk.version] = false;
+
+                    selectedVersion = dxvk.version;
+                });
+            });
+        });
+    };
+
+    const deleteDxvk = (dxvk: TDXVK) => {
+        disabledDxvks[dxvk.version] = true;
+        applying[dxvk.version] = true;
+
+        DXVK.delete(dxvk).then(() => {
+            installedDxvks[dxvk.version] = false;
+            disabledDxvks[dxvk.version] = false;
+            applying[dxvk.version] = false;
+        });
+    };
+
+    const selectDxvk = async (dxvk: TDXVK) => {
+        disabledDxvks[dxvk.version] = true;
+        applying[dxvk.version] = true;
+
+        DXVK.current(dxvk);
+
+        DXVK.apply(await constants.paths.prefix.current, dxvk).then(() => {
+            disabledDxvks[dxvk.version] = false;
+            applying[dxvk.version] = false;
+
+            selectedVersion = dxvk.version;
+        });
     };
 </script>
 
 <div class="list">
     {#each dxvks as dxvk}
-        <div class="list-item" class:list-item-downloaded={dxvkInstalled(dxvk)} class:list-item-active={dxvk.version === selectedVersion} class:list-item-hidden={recommendable && !dxvk.recommended}>
+        <div
+            class="list-item"
+            class:list-item-downloaded={installedDxvks[dxvk.version]}
+            class:list-item-active={dxvk.version === selectedVersion}
+            class:list-item-hidden={recommendable && !dxvk.recommended}
+            class:list-item-downloading={progress[dxvk.version]}
+            class:list-item-applying={applying[dxvk.version]}
+            class:list-item-disabled={disabledDxvks[dxvk.version]}
+
+            on:click|self={() => {
+                if (installedDxvks[dxvk.version])
+                    selectDxvk(dxvk);
+            }}
+        >
             { dxvk.version }
 
             <div>
-                <span></span>
+                <span>{progress[dxvk.version] ?? ''}</span>
 
                 <!-- svelte-ignore a11y-missing-attribute -->
-                <img class="item-delete" src={Delete}>
+                <img class="item-loading" src={Loading}>
 
                 <!-- svelte-ignore a11y-missing-attribute -->
-                <img class="item-download" src={Download}>
+                <img class="item-delete" src={Delete} on:click={() => deleteDxvk(dxvk)}>
+
+                <!-- svelte-ignore a11y-missing-attribute -->
+                <img class="item-download" src={Download} on:click={() => downloadDxvk(dxvk)}>
             </div>
         </div>
     {/each}

src/components/RunnerSelectionList.svelte

@@ -28,7 +28,7 @@
 
     Runners.current().then((current) => selectedVersion = current?.name);
 
-    let progress = {};
+    let progress = {}, applying = {};
 
     const downloadRunner = (runner: Runner) => {
         Runners.download(runner).then((stream) => {
@@ -53,10 +53,12 @@
 
     const deleteRunner = (runner: Runner) => {
         disabledRunners[runner.name] = true;
+        applying[runner.name] = true;
 
         Runners.delete(runner).then(() => {
             installedRunners[runner.name] = false;
             disabledRunners[runner.name] = false;
+            applying[runner.name] = false;
         });
     };
 </script>
@@ -71,9 +73,11 @@
                 class:list-item-downloaded={installedRunners[runner.name]}
                 class:list-item-active={runner.name === selectedVersion}
                 class:list-item-hidden={recommendable && !runner.recommended}
-                class:list-item-downloading={progress[runner.name] !== undefined}
+                class:list-item-downloading={progress[runner.name]}
+                class:list-item-applying={applying[runner.name]}
                 class:list-item-disabled={disabledRunners[runner.name]}
-                on:click={() => {
+
+                on:click|self={() => {
                     if (installedRunners[runner.name])
                     {
                         selectedVersion = runner.name;

src/sass/components/selectionList.sass

@@ -33,6 +33,9 @@
                 display: flex
                 align-items: center
 
+                span
+                    color: #abadbd
+
                 img
                     width: 16px
                     height: 16px
@@ -47,6 +50,14 @@
 
                     display: none
 
+                img.item-loading
+                    display: none
+
+                    width: 20px
+                    height: 20px
+
+                    image-rendering: optimizeQuality
+
         .list-item-active
             background-color: map.get($theme-map, "primary") !important
             color: white !important
@@ -78,6 +89,13 @@
                 img.item-delete
                     display: block
 
+        .list-item-applying
+            img
+                display: none !important
+
+            img.item-loading
+                display: block !important
+
 @import "../themes/light"
 @import "../themes/dark"
 

src/ts/core/DXVK.ts

@@ -3,6 +3,9 @@ import type { DXVK as TDXVK } from '../types/DXVK';
 import constants from '../Constants';
 import Configs from '../Configs';
 import AbstractInstaller from './AbstractInstaller';
+import Process from '../neutralino/Process';
+import promisify from './promisify';
+import Runners from './Runners';
 
 declare const Neutralino;
 
@@ -18,16 +21,29 @@ export default class DXVK
 {
     /**
      * Get the current DXVK according to the config file
+     * or set the new one
      */
-    public static get current(): Promise<TDXVK|null>
+    public static current(dxvk: TDXVK|TDXVK['version']|null = null): Promise<TDXVK|null>
     {
-        return new Promise((resolve) => {
-            Configs.get('dxvk').then((dxvk) => {
-                if (typeof dxvk === 'string')
-                    DXVK.get(dxvk).then((dxvk) => resolve(dxvk));
+        return new Promise(async (resolve) => {
+            if (dxvk === null)
+            {
+                Configs.get('dxvk').then((dxvk) => {
+                    if (typeof dxvk === 'string')
+                        DXVK.get(dxvk).then((dxvk) => resolve(dxvk));
+    
+                    else resolve(null);
+                });
+            }
+            
+            else
+            {
+                Configs.set('dxvk', typeof dxvk === 'string' ?
+                    dxvk : dxvk.version);
 
-                else resolve(null);
-            });
+                resolve(typeof dxvk === 'string' ?
+                    await this.get(dxvk) : dxvk);
+            }
         });
     }
 
@@ -111,6 +127,65 @@ export default class DXVK
             else resolve(new Stream(dxvk));
         });
     }
+
+    /**
+     * Delete specified DXVK
+     */
+    public static delete(dxvk: TDXVK|TDXVK['version']): Promise<void>
+    {
+        return new Promise(async (resolve) => {
+            const version = typeof dxvk !== 'string' ?
+                dxvk.version : dxvk;
+
+            Process.run(`rm -rf '${Process.addSlashes(await constants.paths.dxvksDir + '/dxvk-' + version)}'`)
+                .then((process) => {
+                    process.finish(() => resolve());
+                });
+        });
+    }
+
+    /**
+     * Apply DXVK to the prefix
+     */
+    public static apply(prefix: string, dxvk: TDXVK|TDXVK['version']): Promise<void>
+    {
+        return new Promise(async (resolve) => {
+            const version = typeof dxvk !== 'string' ?
+                dxvk.version : dxvk;
+            
+            const dxvkDir = `${await constants.paths.dxvksDir}/dxvk-${version}`;
+            const runner = await Runners.current();
+            const runnerDir = `${await constants.paths.runnersDir}/${runner?.name}`;
+
+            const pipeline = promisify({
+                callbacks: [
+                    /**
+                     * Make the installation script executable
+                     */
+                    () => Neutralino.os.execCommand(`chmod +x '${dxvkDir}/setup_dxvk.sh'`),
+
+                    /**
+                     * And then run it
+                     */
+                    (): Promise<void> => new Promise(async (resolve) => {
+                        Process.run(`bash '${dxvkDir}/setup_dxvk.sh' install`, {
+                            cwd: dxvkDir,
+                            env: {
+                                WINE: runner ? `${runnerDir}/${runner.files.wine}` : 'wine',
+                                WINECFG: runner ? `${runnerDir}/${runner.files.winecfg}` : 'winecfg',
+                                WINESERVER: runner ? `${runnerDir}/${runner.files.wineserver}` : 'wineserver',
+                                WINEPREFIX: prefix
+                            }
+                        }).then((process) => {
+                            process.finish(() => resolve());
+                        });
+                    })
+                ]
+            });
+
+            pipeline.then(() => resolve());
+        });
+    }
 }
 
 export type { TDXVK };