Merge pull request #59 from kamikazebr/feat/linux-support

feat: add Linux support

.github/workflows/build.yml

@@ -68,3 +68,32 @@ jobs:
           path: release/**/*.dmg
           retention-days: 30
 
+  build-linux:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '22'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Install app dependencies
+        run: npx electron-builder install-app-deps
+
+      - name: Build Linux app
+        run: npm run build:linux
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Upload Linux build
+        uses: actions/upload-artifact@v4
+        with:
+          name: linux-installer
+          path: release/**/*.AppImage
+          retention-days: 30
+

README.md

@@ -39,10 +39,12 @@ OpenScreen is 100% free for personal and commercial use. Use it, modify it, dist
 - Trim sections of the clip
 - Export in different aspect ratios and resolutions
 
-## macOS Installation instructions
+## Installation
 
 Download the latest installer for your platform from the [GitHub Releases](https://github.com/siddharthvaddem/openscreen/releases) page.
 
+### macOS
+
 If you encounter issues with macOS Gatekeeper blocking the app (since it does not come with a developer certificate), you can bypass this by running the following command in your terminal after installation:
 
 ```bash
@@ -51,6 +53,17 @@ xattr -rd com.apple.quarantine /Applications/Openscreen.app
 
 After running this command, proceed to **System Preferences > Security & Privacy** to grant the necessary permissions for "screen recording" and "accessibility". Once permissions are granted, you can launch the app.
 
+### Linux
+
+Download the `.AppImage` file from the releases page. Make it executable and run:
+
+```bash
+chmod +x Openscreen-Linux-*.AppImage
+./Openscreen-Linux-*.AppImage
+```
+
+You may need to grant screen recording permissions depending on your desktop environment.
+
 ## Built with
 - Electron
 - React

electron-builder.json5

@@ -41,7 +41,9 @@
     "target": [
       "AppImage"
     ],
-    "artifactName": "${productName}-Linux-${version}.${ext}"
+    "icon": "icons/icons/png",
+    "artifactName": "${productName}-Linux-${version}.${ext}",
+    "category": "AudioVideo"
   },
   "win": {
     "target": [

electron/windows.ts

@@ -77,13 +77,17 @@ export function createHudOverlayWindow(): BrowserWindow {
 }
 
 export function createEditorWindow(): BrowserWindow {
+  const isMac = process.platform === 'darwin';
+
   const win = new BrowserWindow({
     width: 1200,
     height: 800,
     minWidth: 800,
     minHeight: 600,
-    titleBarStyle: 'hiddenInset',
-    trafficLightPosition: { x: 12, y: 12 },
+    ...(isMac && {
+      titleBarStyle: 'hiddenInset',
+      trafficLightPosition: { x: 12, y: 12 },
+    }),
     transparent: false,
     resizable: true,
     alwaysOnTop: false,

package.json

@@ -9,7 +9,8 @@
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
     "build:mac": "tsc && vite build && electron-builder --mac",
-    "build:win": "tsc && vite build && electron-builder --win"
+    "build:win": "tsc && vite build && electron-builder --win",
+    "build:linux": "tsc && vite build && electron-builder --linux"
   },
   "dependencies": {
     "@fix-webm-duration/fix": "^1.0.1",