Merge pull request #20 from lovegaoshi/dev-noxplayer

feat: ffmpeg

.github/workflows/nightly.yml

@@ -58,13 +58,13 @@ jobs:
         run: echo "date=$(date +'%Y-%m-%d')" >> $GITHUB_OUTPUT
 
       - name: get custom react music player
-        run: git clone https://github.com/lovegaoshi/react-music-player.git Dependencies/react-jinke-music-player
+        run: git clone https://github.com/lovegaoshi/react-music-player.git ../react-jinke-music-player
 
       - name: build rjmp
-        run: cd Dependencies/react-jinke-music-player && yarn && yarn build
+        run: cd ../react-jinke-music-player && yarn && yarn build
 
       - name: Install dependencies
-        run: yarn
+        run: yarn; git submodule update --init --recursive
 
       - name: 'Create env file'
         run: |

package.json

@@ -8,8 +8,8 @@
   "scripts": {
     "start": "webpack serve --env dev",
     "watch": "webpack --env devBuild --watch",
-    "dev": "webpack --env devBuild",
-    "build": "webpack --env prod",
+    "dev": "mv build/js/ffmpeg-core.js ffmpeg-core.js && mv build/js/ffmpeg-core.wasm ffmpeg-core.wasm && webpack --env devBuild && mv ffmpeg-core.js build/js/ffmpeg-core.js && mv ffmpeg-core.wasm build/js/ffmpeg-core.wasm",
+    "build": "webpack --env prod && cp node_modules/@ffmpeg/core/dist/umd/ffmpeg-core.js build/js/ffmpeg-core.js && cp node_modules/@ffmpeg/core/dist/umd/ffmpeg-core.wasm build/js/ffmpeg-core.wasm",
     "dep": "git submodule update --remote --merge",
     "compile": "tsc"
   },
@@ -62,6 +62,7 @@
   "dependencies": {
     "@emotion/react": "^11.7.1",
     "@emotion/styled": "^11.6.0",
+    "@ffmpeg/core": "^0.12.4",
     "@ffmpeg/ffmpeg": "^0.12.7",
     "@ffmpeg/util": "^0.12.1",
     "@fontsource/roboto": "^5.0.8",

public/manifest.json

@@ -12,10 +12,20 @@
       "128": "icons/logo2-128.png"
     }
   },
+  "web_accessible_resources": [
+    {
+      "resources": ["js/ffmpeg-core.js"],
+      "matches": ["<all_urls>"]
+    }
+  ],
+  "content_security_policy": {
+    "extension_pages": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self';",
+    "sandbox": "sandbox allow-scripts allow-forms allow-popups allow-modals; script-src 'self' 'unsafe-inline' 'unsafe-eval' 'wasm-unsafe-eval'; child-src 'self';"
+  },
   "content_scripts": [
     {
       "matches": ["*://*/*"],
-      "js": ["js/contentscript.js"]
+      "js": ["js/contentscript.js", "js/ffmpeg-core.js"]
     }
   ],
   "icons": {

src/utils/ffmpeg.ts

@@ -0,0 +1,33 @@
+import { FFmpeg } from '@ffmpeg/ffmpeg';
+import { fetchFile } from '@ffmpeg/util';
+
+const ffmpeg = new FFmpeg();
+let r128gain = 0;
+
+ffmpeg.on('log', ({ message }) => {
+  const parseTrackGain = /track_gain = (-?\d+\.\d+) dB/.exec(message);
+  if (parseTrackGain !== null) {
+    // eslint-disable-next-line prefer-destructuring
+    r128gain = Number(parseTrackGain[1]!);
+  }
+  console.debug(message);
+});
+await ffmpeg.load({
+  coreURL: chrome.runtime.getURL('js/ffmpeg-core.js'),
+});
+
+export default async (url: string) => {
+  await ffmpeg.writeFile('temp.m4a', await fetchFile(url));
+  await ffmpeg.exec([
+    '-nostats',
+    '-i',
+    'temp.m4a',
+    '-filter_complex',
+    'replaygain',
+    '-f',
+    'null',
+    '-',
+  ]);
+  console.log(`[r128gain] found r128gain: ${r128gain}`);
+  return r128gain;
+};

tsconfig.json

@@ -50,5 +50,5 @@
     "forceConsistentCasingInFileNames": true
   },
   "include": ["src"],
-  "exclude": ["node_modules", "build", "public", "src/azusa-player-mobile"]
+  "exclude": ["node_modules", "build", "public"]
 }

yarn.lock

@@ -1251,6 +1251,11 @@
   resolved "https://registry.npmjs.org/@eslint/js/-/js-8.53.0.tgz#bea56f2ed2b5baea164348ff4d5a879f6f81f20d"
   integrity sha512-Kn7K8dx/5U6+cT1yEhpX1w4PCSg0M+XyRILPgvwcEBjerFWCwQj5sbr3/VmxqV0JGHCBCzyd6LxypEuehypY1w==
 
+"@ffmpeg/core@^0.12.4":
+  version "0.12.4"
+  resolved "https://registry.npmjs.org/@ffmpeg/core/-/core-0.12.4.tgz#8303680922b3af021b8ca9cfdf7cafa6f81b84ec"
+  integrity sha512-m+H+P66TSEPlf1vK5WwVDr+Uksd1GULi7jk4o/447X5HQouTLaZjicAXC00C/IrrmyqJ8YX/8cfhqMryvNZGSg==
+
 "@ffmpeg/ffmpeg@^0.12.7":
   version "0.12.7"
   resolved "https://registry.npmjs.org/@ffmpeg/ffmpeg/-/ffmpeg-0.12.7.tgz#fbe8b28cae2183ff74456d77fdc2803e54048df0"