Change face-landmarks-detection to depend on face-detection package (#970)

* Change dependency of face-landmarks-detection to package instead of local code

* Fix model names in link

Author: ahmedsabie

face-detection/README.md

@@ -5,7 +5,7 @@ This package provides models for running real-time face detection.
 Currently, we provide 1 model option:
 
 #### MediaPipe FaceDetection:
-[Demo](https://storage.googleapis.com/tfjs-models/demos/face-detection/index.html?model=mediapipe_face_detection)
+[Demo](https://storage.googleapis.com/tfjs-models/demos/face-detection/index.html?model=mediapipe_face_detector)
 
 MediaPipe FaceDetection can detect multiple faces, each face contains 6 keypoints.
 

face-detection/src/tfjs/README.md

@@ -17,7 +17,7 @@ In the runtime-backend dropdown, choose 'tfjs-webgl'.
 To use MediaPipeFaceDetector, you need to first select a runtime (TensorFlow.js or MediaPipe).
 This guide is for TensorFlow.js
 runtime. The guide for MediaPipe runtime can be found
-[here](https://github.com/tensorflow/tfjs-models/tree/master/face-detection/src/mediapipe_face_detector).
+[here](https://github.com/tensorflow/tfjs-models/tree/master/face-detection/src/mediapipe).
 
 Via script tags:
 

face-landmarks-detection/README.md

@@ -5,7 +5,7 @@ This package provides models for running real-time face detection and landmark t
 Currently, we provide 1 model option:
 
 #### MediaPipe:
-[Demo](https://storage.googleapis.com/tfjs-models/demos/face-landmarks-detection/index.html?model=mediapipe_facemesh)
+[Demo](https://storage.googleapis.com/tfjs-models/demos/face-landmarks-detection/index.html?model=mediapipe_face_mesh)
 
 MediaPipe Facemesh can detect multiple faces, each face contains 468 keypoints.
 

face-landmarks-detection/karma.conf.js

@@ -15,7 +15,7 @@
  * =============================================================================
  */
 
- const karmaTypescriptConfig = {
+const karmaTypescriptConfig = {
   tsconfig: 'tsconfig.test.json',
   // Disable coverage reports and instrumentation by default for tests
   coverageOptions: {instrumentation: false},
@@ -103,8 +103,8 @@ module.exports = function(config) {
       username: process.env.BROWSERSTACK_USERNAME,
       accessKey: process.env.BROWSERSTACK_KEY,
       timeout: 1800,
-      tunnelIdentifier:
-          `face_detection_${Date.now()}_${Math.floor(Math.random() * 1000)}`
+      tunnelIdentifier: `face_landmarks_detection_${Date.now()}_${
+          Math.floor(Math.random() * 1000)}`
     },
     captureTimeout: 3e5,
     reportSlowerThan: 500,

face-landmarks-detection/package.json

@@ -16,18 +16,21 @@
     "@mediapipe/face_mesh": "~0.4.0",
     "@tensorflow/tfjs-backend-webgl": "^3.12.0",
     "@tensorflow/tfjs-converter": "^3.12.0",
-    "@tensorflow/tfjs-core": "^3.12.0"
+    "@tensorflow/tfjs-core": "^3.12.0",
+    "@tensorflow-models/face-detection": "~1.0.0"
   },
   "devDependencies": {
     "@babel/polyfill": "^7.10.4",
+    "@mediapipe/face_detection": "^0.4.0",
     "@mediapipe/face_mesh": "^0.4.0",
-    "@rollup/plugin-commonjs": "^11.0.2",
+    "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-node-resolve": "^7.1.1",
     "@rollup/plugin-typescript": "^3.0.0",
     "@tensorflow/tfjs-backend-cpu": "^3.12.0",
     "@tensorflow/tfjs-backend-webgl": "^3.12.0",
     "@tensorflow/tfjs-converter": "^3.12.0",
     "@tensorflow/tfjs-core": "^3.12.0",
+    "@tensorflow-models/face-detection": "^1.0.0",
     "@types/jasmine": "~2.8.8",
     "babel-core": "~6.26.0",
     "babel-plugin-transform-runtime": "~6.23.0",
@@ -40,7 +43,7 @@
     "karma-spec-reporter": "~0.0.32",
     "karma-typescript": "~5.5.1",
     "karma-typescript-es6-transform": "^5.1.0",
-    "rollup": "~2.3.2",
+    "rollup": "~2.70.1",
     "rollup-plugin-terser": "~7.0.2",
     "rollup-plugin-visualizer": "~3.3.2",
     "ts-node": "~8.8.2",

face-landmarks-detection/rollup.config.js

@@ -15,6 +15,7 @@
  * =============================================================================
  */
 
+import commonjs from '@rollup/plugin-commonjs';
 import resolve from '@rollup/plugin-node-resolve';
 import typescript from '@rollup/plugin-typescript';
 import {terser} from 'rollup-plugin-terser';
@@ -45,20 +46,25 @@ function config({plugins = [], output = {}, tsCompilerOptions = {}}) {
 
   return {
     input: 'src/index.ts',
-    plugins: [typescript(tsoptions), resolve(), ...plugins],
+    plugins: [
+      typescript(tsoptions), resolve(),
+      commonjs({include: ['node_modules/@mediapipe/face_detection/**']}),
+      ...plugins
+    ],
     output: {
       banner: PREAMBLE,
       globals: {
         '@tensorflow/tfjs-core': 'tf',
         '@tensorflow/tfjs-converter': 'tf',
+        '@tensorflow-models/face-detection': 'faceDetection',
         // Package is obfuscated so class is directly attached to globalThis.
         '@mediapipe/face_mesh': 'globalThis'
       },
       ...output,
     },
     external: [
       '@tensorflow/tfjs-core', '@tensorflow/tfjs-converter',
-      '@mediapipe/face_mesh'
+      'tensorflow-models/face-detection', '@mediapipe/face_mesh'
     ]
   };
 }