2.5.0

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+out
+.gitignore

.eslintrc

@@ -3,7 +3,7 @@
     "sourceType": "module",
     "ecmaVersion": 2020
   },
-  "extends": ["eslint:recommended", "plugin:react/recommended", "plugin:react/jsx-runtime"],
+  "extends": ["eslint:recommended", "plugin:react/recommended", "plugin:react/jsx-runtime", "@electron-toolkit", "@electron-toolkit/eslint-config-prettier"],
   "rules": {
     "react/prop-types": "off"
   },

.github/workflows/pipeline.yml

@@ -9,11 +9,16 @@ on:
 jobs:
   release:
     name: Build & package
-    runs-on: ${{ matrix.os }}
+    runs-on: ${{ matrix.versions.os }}
 
     strategy:
       matrix:
-        os: [ ubuntu-latest, windows-latest, macos-latest ]
+        versions: [
+          {os: "ubuntu-latest", type: "web" },
+          {os: "ubuntu-latest", type: "app" },
+          {os: "windows-latest", type: "app" },
+          {os: "macos-latest", type: "app" }
+        ]
 
     steps:
       - name: Clone source code
@@ -32,39 +37,43 @@ jobs:
           rm package-lock.json
           npm i --force
 
-      - name: Build web bundle
-        run: npm run build
-        env:
-          CI: true
-
       - name: Packaging Windows
-        if: matrix.os == 'windows-latest'
-        run: npm run package:windows
+        if: ${{ (matrix.versions.os == 'windows-latest') && (matrix.versions.type == 'app') }}
+        run: npm run build:win
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Packaging MacOS
-        if: matrix.os == 'macos-latest'
-        run: npm run package:mac
+        if: ${{ (matrix.versions.os == 'macos-latest') && (matrix.versions.type == 'app') }}
+        run: npm run build:mac
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Packaging Linux
-        if: matrix.os == 'ubuntu-latest'
-        run: npm run package:linux
+        if: ${{ (matrix.versions.os == 'ubuntu-latest') && (matrix.versions.type == 'app') }}
+        run: npm run build:linux
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      # - name: Upload release files
-      #   uses: softprops/action-gh-release@v1
-      #   if: github.ref == 'refs/heads/master'
-      #   with:
-      #     files: binaries/@brick-a-brack/*
+      - name: Packaging Web
+        if: ${{ (matrix.versions.os == 'ubuntu-latest') && (matrix.versions.type == 'web') }}
+        run: |
+          echo "VITE_PUBLIC_URL=${{ secrets.RUN_PUBLIC_URL }}" >> .env
+          echo "VITE_COMMIT_HASH=`git rev-parse HEAD`" >> .env
+          npm run build:web
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      #- name: Package app
-      #  uses: cryogenicplanet/action-electron-builder@v2
-      #  with:
-      #    github_token: ${{ secrets.github_token }}
-      #    release: true
-      #    skip_build: true
-      #    skip_install: true
+      - name: Install and configure rclone
+        run: |
+          echo "${{ secrets.RCLONE_CONFIG }}" > /tmp/rclone.conf
+          sudo -v ; curl https://rclone.org/install.sh | sudo bash
+
+      - name: Upload assets to Cloudflare (Release)
+        if: ${{ (matrix.versions.os == 'ubuntu-latest') && (matrix.versions.type == 'web') && (github.ref == 'refs/heads/master') }}
+        run: |
+          mv out/web/index.html ./
+          mv out/web/sw.js ./ || true
+          rclone --config /tmp/rclone.conf copy out/web/ r2:/eagle-animation-web/
+          rclone --config /tmp/rclone.conf copy index.html r2:/eagle-animation-web/
+          rclone --config /tmp/rclone.conf copy sw.js r2:/eagle-animation-web/ || true

.gitignore

@@ -11,21 +11,25 @@
 # production
 /build
 /dist
+/out
 /binaries
 /.parcel-cache
 
 # misc
 .DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
 .eslintcache
 
+# logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-
 debug.log
+*.log*
+
+#env
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
 
-.env

.i18n-gpt-translator.json

@@ -0,0 +1,21 @@
+{
+    "folder": "resources/i18n/",
+    "sourceLngs": [
+        "fr",
+        "en"
+    ],
+    "destinationLngs": [
+        "es",
+        "de",
+        "pl",
+        "pt",
+        "it",
+        "eo"
+    ],
+    "context": "EagleAnimation is an awesome, free and open-source stop motion animation software. It is available for Windows, macOS and Linux.",
+    "doNotEdit": [
+        "Brick à Brack",
+        "Brickfilms.com",
+        "Eagle Animation"
+    ]
+}

.prettierignore

@@ -0,0 +1,6 @@
+out
+dist
+pnpm-lock.yaml
+LICENSE.md
+tsconfig.json
+tsconfig.*.json

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["dbaeumer.vscode-eslint"]
+}

.vscode/launch.json

@@ -0,0 +1,39 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Debug Main Process",
+      "type": "node",
+      "request": "launch",
+      "cwd": "${workspaceRoot}",
+      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron-vite",
+      "windows": {
+        "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron-vite.cmd"
+      },
+      "runtimeArgs": ["--sourcemap"],
+      "env": {
+        "REMOTE_DEBUGGING_PORT": "9222"
+      }
+    },
+    {
+      "name": "Debug Renderer Process",
+      "port": 9222,
+      "request": "attach",
+      "type": "chrome",
+      "webRoot": "${workspaceFolder}/src/renderer",
+      "timeout": 60000,
+      "presentation": {
+        "hidden": true
+      }
+    }
+  ],
+  "compounds": [
+    {
+      "name": "Debug All",
+      "configurations": ["Debug Main Process", "Debug Renderer Process"],
+      "presentation": {
+        "order": 1
+      }
+    }
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,11 @@
+{
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
+}

README.md

@@ -32,22 +32,32 @@ The logo was created by Nishant Shukla and sound effects were obtained from [Zap
 
 Feel free to make pull-requests, help us to translate the software or report issues 😉
 
-### Production build and release process
+## Configuration
+
+Some variables can be configured using a `.env` file, values with a "\*" are required.
+
+| **Name**         | **Description**                                                                                         | **Example**                                |
+| ---------------- | ------------------------------------------------------------------------------------------------------- | ------------------------------------------ |
+| VITE_PUBLIC_URL  | The full url of the assets server, must be ended by a slash "/". If it is not defined, we will use "/". | `https://web-ea.brickfilms.com/`           |
+| VITE_COMMIT_HASH | The hash of the current git commit, if it is not provided, the bundle will be flagged as "local".       | `cda02bf88498ce97d947fb357a6e4f459812122a` |
+
+### Build process
+
+- Run `npm i --force` to install dependencies (`--force` is required because we use an old dependency).
+- Update `src/config.js` file if needed.
+- Run `npm run build:win`, `npm run build:linux`, `npm run build:mac` and `npm run build:web` to build release files.
+
+### Release process
 
-- Run `npm i --force` to install dependencies.
-- Update `config.js` file.
 - Update `version` value in `package.json` if needed.
-- Run `npm run build` to build the web bundle and main script in the `dist/electron` directory.
-- Run `npm run package:windows`, `npm run package:linux` and `npm run package:mac` to build release files.
-- Create a draft release on Github.
-- Merge into master.
+- Create a draft release on Github and tag it with the same version number: `vX.X.X`.
+- Merge your branch/dev into master.
 
 ### Development mode
 
 - Run `npm i --force` to install dependencies.
-- Run `npm start` to launch the application in dev mode.
-
-_Note: Because app backend and web bundle are splitted, any change in the backend part will relaunch the whole app. At the moment, it does not kill the previous openned window._
+- Run `npm run start:electron` to launch the application in dev mode.
+- Run `npm run start:web` to launch the web app in dev mode.
 
 ### Telemetry
 
@@ -58,10 +68,12 @@ To improve the quality of **Eagle Animation**, runtime errors are automatically
 
 Some features are device-dependent or platform-limited. Here's a summary table.
 
-| Feature                 | Windows | MacOS | Linux |
-| ----------------------- | ------- | ----- | ----- |
-| Video export            | ✅      | ✅    | ✅    |
-| Frames export           | ✅      | ✅    | ✅    |
-| Workshop features       | ✅      | ✅    | ✅    |
-| Control webcam settings | ✅      | ⚠️    | ❌    |
-| Use Canon cameras       | ✅      | ❌    | ❌    |
+| Feature                                           | Windows | MacOS | Linux | Web (Chrome / Edge) | Web (Firefox) | Web (Safari) |
+| ------------------------------------------------- | ------- | ----- | ----- | ------------------- | ------------- | ------------ |
+| Use webcam to take photos                         | ✅      | ✅    | ✅    | ✅                  | ✅            | ✅           |
+| Export captured frames                            | ✅      | ✅    | ✅    | ✅                  | ✅            | ✅           |
+| Video export                                      | ✅      | ✅    | ✅    | ✅                  | ✅            | ✅           |
+| Improve quality by reducing the preview framerate | ✅      | ✅    | ✅    | ✅                  | ❌            | ❓           |
+| Control webcam settings                           | ✅      | ✅    | ✅    | ✅                  | ❌            | ❓           |
+| Workshop features                                 | ✅      | ✅    | ✅    | ❌                  | ❌            | ❌           |
+| Use Canon camera to take photos                   | ✅      | ❌    | ❌    | ❌                  | ❌            | ❌           |

TODO.md

@@ -1,31 +1,41 @@
-# Bugs
-- Exported videos are always exported with a 16:9 aspect ratio
-- The resolution select can upscale the video
-
 # Todo
 
-- Tech: Add camera informations on each photo
-- Rework the project deletion to add a confirmation, maybe a new "project settings" page ?
-- Add a light theme
-- Add the ability to mirror the camera image (X + Y)
-- Aspect ratio support and allow opacity configuration on settings page
-- Multi scene/take support
-- Allow drawing for easing help
-- Allow to export/import a project
-- Masking
-- Support cameras
-- Webapp version
-- Mobile version (Based on capacitor)
+- Group project settings
+   - Delete button
+   - Title
+   - Number of FPS
+   - Ratio
+
+- App settings
+   - Choose the aspect ratio layer opacity
+
+- Improve UI
+   - Add light theme
+   - Rework user experience (based on Fire's screens)
+   - Rework the mobile version
+
+- Export 
+   - Limit resolution to max frame height
+   - Avoid upscale during export
+   - Support custom ratio
+   - Allow to export Eagle Animation projects as ZIP (JSON + frames)
+   - Allow to import Eagle Animation projects
 
-detecter perte camera + rechargement
+- Build
+   - Build APK using Capacitor (Android)
 
----
-- Aspect ratio
-- raw support sur canon
-- resize images pour opti les perfs
-- Nom du projet dans la barre en haut
-- Parametre de projet
-- opti thumbnail
-- Ability to mark frame as "masked" to test an animation without some frames, can be usefull before a deletion
+- Core
+   - Generate picture preview to improve playback performances
+   - Store frames as PNG for webcams
+   - Add the ability apply mirror effect to the camera image (X + Y + Both)
+   - Ability to mark frame as "masked" to test an animation without some frames, can be useful before a deletion
+   - Support custom ratio
+   - Support several scene by project
+   - Support masking
+   - Add ease-in / ease-out tools
 
-full screen
+- Camera compatilibity
+   - Phone as remote camera
+   - gPhoto2 support using WebUSB
+   - Support Canon cameras on Mac and Linux
+   - Support Canon RAW capture