UNPKG

ngx-face-api-js

Version:

Angular directives for face detection and face recognition in the browser. It is a wrapper for face-api.js, so it is not dependent on the browser implementation.

2 lines 13.6 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/platform-browser"),require("rxjs"),require("face-api.js"),require("rxjs/operators"),require("@angular/cdk/portal"),require("@angular/core"),require("@angular/cdk/overlay")):"function"==typeof define&&define.amd?define("ngx-face-api-js",["exports","@angular/platform-browser","rxjs","face-api.js","rxjs/operators","@angular/cdk/portal","@angular/core","@angular/cdk/overlay"],t):t(e["ngx-face-api-js"]={},e.ng.platformBrowser,e.rxjs,e["face-api"].js,e.rxjs.operators,e.ng.cdk.portal,e.ng.core,e.ng.cdk.overlay)}(this,function(e,r,o,c,n,i,a,s){"use strict";var u=function(e,t){return(u=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r])})(e,t)};function t(e,t){function r(){this.constructor=e}u(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}function l(t,a,s,c){return new(s||(s=Promise))(function(e,r){function n(e){try{i(c.next(e))}catch(t){r(t)}}function o(e){try{i(c["throw"](e))}catch(t){r(t)}}function i(t){t.done?e(t.value):new s(function(e){e(t.value)}).then(n,o)}i((c=c.apply(t,a||[])).next())})}function d(n,o){var i,a,s,e,c={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]};return e={next:t(0),"throw":t(1),"return":t(2)},"function"==typeof Symbol&&(e[Symbol.iterator]=function(){return this}),e;function t(t){return function(e){return function r(e){if(i)throw new TypeError("Generator is already executing.");for(;c;)try{if(i=1,a&&(s=2&e[0]?a["return"]:e[0]?a["throw"]||((s=a["return"])&&s.call(a),0):a.next)&&!(s=s.call(a,e[1])).done)return s;switch(a=0,s&&(e=[2&e[0],s.value]),e[0]){case 0:case 1:s=e;break;case 4:return c.label++,{value:e[1],done:!1};case 5:c.label++,a=e[1],e=[0];continue;case 7:e=c.ops.pop(),c.trys.pop();continue;default:if(!(s=0<(s=c.trys).length&&s[s.length-1])&&(6===e[0]||2===e[0])){c=0;continue}if(3===e[0]&&(!s||e[1]>s[0]&&e[1]<s[3])){c.label=e[1];break}if(6===e[0]&&c.label<s[1]){c.label=s[1],s=e;break}if(s&&c.label<s[2]){c.label=s[2],c.ops.push(e);break}s[2]&&c.ops.pop(),c.trys.pop();continue}e=o.call(n,c)}catch(t){e=[6,t],a=0}finally{i=s=0}if(5&e[0])throw e[1];return{value:e[0]?e[1]:void 0,done:!0}}([t,e])}}}function p(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,o,i=r.call(e),a=[];try{for(;(void 0===t||0<t--)&&!(n=i.next()).done;)a.push(n.value)}catch(s){o={error:s}}finally{try{n&&!n.done&&(r=i["return"])&&r.call(i)}finally{if(o)throw o.error}}return a}function h(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(p(arguments[t]));return e}var f=function(){function e(e){var t=this;this.type=e.type,this.tokens=e.tokens,this.realtime=e.realtime||!1,this.target=new Promise(function(e){return t.targetResolver=e})}return Object.defineProperty(e.prototype,"resolveTarget",{get:function(){return this.targetResolver},enumerable:!0,configurable:!0}),e.prototype.isMatchPattern=function(e,t){return e.every(function(e){return t.includes(e)})},e.prototype["with"]=function(){for(var e,t=[],r=0;r<arguments.length;r++)t[r]=arguments[r];return(e=this.tokens).push.apply(e,h(t)),this},e.prototype.detect=function(a){return l(this,void 0,void 0,function(){var t,r,n,o,i;return d(this,function(e){switch(e.label){case 0:return"all"!==this.type?[3,2]:(n=(r=c).detectAllFaces,[4,this.target]);case 1:return t=n.apply(r,[e.sent(),a||undefined]),[3,4];case 2:return i=(o=c).detectSingleFace,[4,this.target];case 3:t=i.apply(o,[e.sent(),a||undefined]),e.label=4;case 4:if(this.isMatchPattern(["expressions","landmarks","ageAndGender","descriptors"],this.tokens)){if(t instanceof c.DetectSingleFaceTask)return[2,t.withFaceLandmarks().withFaceExpressions().withAgeAndGender().withFaceDescriptor().run()];if(t instanceof c.DetectAllFacesTask)return[2,t.withFaceLandmarks().withFaceExpressions().withAgeAndGender().withFaceDescriptors().run()]}else if(this.isMatchPattern(["expressions","landmarks","descriptors"],this.tokens)){if(t instanceof c.DetectSingleFaceTask)return[2,t.withFaceLandmarks().withFaceExpressions().withFaceDescriptor().run()];if(t instanceof c.DetectAllFacesTask)return[2,t.withFaceLandmarks().withFaceExpressions().withFaceDescriptors().run()]}else{if(this.isMatchPattern(["expressions","landmarks","ageAndGender"],this.tokens))return[2,t.withFaceLandmarks().withFaceExpressions().withAgeAndGender().run()];if(this.isMatchPattern(["expressions","landmarks"],this.tokens))return[2,t.withFaceLandmarks().withFaceExpressions().run()];if(this.isMatchPattern(["expressions","ageAndGender"],this.tokens))return[2,t.withFaceExpressions().withAgeAndGender().run()];if(this.isMatchPattern(["expressions"],this.tokens))return[2,t.withFaceExpressions().run()];if(this.isMatchPattern(["landmarks","ageAndGender"],this.tokens))return[2,t.withFaceLandmarks().withAgeAndGender().run()];if(this.isMatchPattern(["landmarks"],this.tokens))return[2,t.withFaceLandmarks().run()]}return[2,t.run()]}})})},e}(),y=new a.InjectionToken("ngx-face-api-js.face-detection-options"),v="expressions",w="landmarks",g="descriptors",m="ageAndGender",k="SsdMobilenetv1Model",b="MtcnnModel",M="FaceExpressionModel",F="FaceLandmarkModel",x="FaceRecognitionModel",j="TinyFaceDetectorModel",A="AgeAndGenderModel",D=new a.InjectionToken("ngx-face-api-js.models-url"),P=function(){function e(e){this.modelUrl=e,this.loadedModels=[]}return e.prototype.getReqiredModels=function(o){var e;return[k].concat(Object.entries(((e={})[v]=[M,k],e[w]=[F,k],e[g]=[x],e[m]=[A],e)).map(function(e){var t=p(e,2),r=t[0],n=t[1];return o.includes(r)?n:[]}).reduce(function(e,t){return e.concat(t)}).filter(function(e,t,r){return r.indexOf(e)===t}))},e.prototype.mapLoadFunction=function(e){switch(e){case k:return c.loadSsdMobilenetv1Model;case b:return c.loadMtcnnModel;case M:return c.loadFaceExpressionModel;case F:return c.loadFaceLandmarkModel;case x:return c.loadFaceRecognitionModel;case j:return c.loadTinyFaceDetectorModel;case A:return c.loadAgeGenderModel}},e.prototype.isLoaded=function(e){return this.loadedModels.includes(e)},e.prototype.load=function(){for(var n=[],e=0;e<arguments.length;e++)n[e]=arguments[e];return l(this,void 0,void 0,function(){var t,r=this;return d(this,function(e){switch(e.label){case 0:return t=n.filter(function(e){return!1===r.isLoaded(e)}),[4,Promise.all(t.map(function(e){return r.mapLoadFunction(e)}).map(function(e){return e(r.modelUrl)}))];case 1:return e.sent(),0<=t.length&&(this.loadedModels=t.concat(this.loadedModels)),[2]}})})},e.prototype.loadForFeature=function(r){return l(this,void 0,void 0,function(){var t;return d(this,function(e){switch(e.label){case 0:return t=this.getReqiredModels(r),console.log({reqiredModels:t}),[4,this.load.apply(this,h(t))];case 1:return e.sent(),[2]}})})},e.decorators=[{type:a.Injectable}],e.ctorParameters=function(){return[{type:String,decorators:[{type:a.Inject,args:[D]}]}]},e}(),E=function(){function e(e,t){this.modelLoader=e,this.option=t}return e.prototype.detect=function(t){var e=this;return!0===t.realtime?o.of(t).pipe(n.switchMap(function(t){return l(e,void 0,void 0,function(){return d(this,function(e){switch(e.label){case 0:return[4,t.target];case 1:return[2,e.sent()]}})})}),n.switchMap(function(e){return o.fromEvent(e,"loadeddata")}),n.switchMap(function(){return e.modelLoader.loadForFeature(t.tokens)}),n.switchMap(function(){return o.interval(300)}),n.switchMap(function(){return t.detect(e.option)}),n.shareReplay(1)):o.of(t).pipe(n.switchMap(function(t){return l(e,void 0,void 0,function(){return d(this,function(e){switch(e.label){case 0:return[4,t.target];case 1:return[2,e.sent()]}})})}),n.switchMap(function(e){return o.fromEvent(e,"load")}),n.switchMap(function(){return l(e,void 0,void 0,function(){return d(this,function(e){switch(e.label){case 0:return[4,this.modelLoader.loadForFeature(t.tokens)];case 1:return[2,e.sent()]}})})}),n.switchMap(function(){return t.detect(e.option)}),n.shareReplay(1))},e.decorators=[{type:a.Injectable}],e.ctorParameters=function(){return[{type:P},{type:undefined,decorators:[{type:a.Optional},{type:a.Inject,args:[y]}]}]},e}(),L=function(){function e(e,t,r,n){this.task=e,this.el=t,this.renderer=r,this.faceDetector=n,this.subscription=new o.Subscription,this.resize$=new o.Subject}return Object.defineProperty(e.prototype,"canvas",{get:function(){return this.canvasEl.nativeElement},enumerable:!0,configurable:!0}),e.prototype.onResize=function(){this.resize$.next("onResize")},e.prototype.convertResultToArray=function(e){return Array.isArray(e)?e:[e]},e.prototype.ngOnInit=function(){var r=this;this.subscription.add(o.combineLatest(this.faceDetector.detect(this.task),this.resize$.pipe(n.startWith("init"))).pipe(n.map(function(e){var t=p(e,1)[0];return r.convertResultToArray(t)})).subscribe(function(e){return r.draw(e)}))},e.prototype.ngOnDestroy=function(){this.subscription.unsubscribe()},e.prototype.draw=function(s){return l(this,void 0,void 0,function(){var t,r,n,o,i,a=this;return d(this,function(e){switch(e.label){case 0:return[4,this.task.target];case 1:return t=e.sent(),r=t.width,n=t.height,t instanceof HTMLVideoElement&&(n=t.videoHeight,r=t.videoWidth),o=c.resizeResults(s.map(function(e){return e instanceof c.FaceDetection?e:e.detection}),{width:r,height:n}),this.canvas.width=r,this.canvas.height=n,this.renderer.setStyle(this.canvas,"width",r+"px"),this.renderer.setStyle(this.canvas,"height",n+"px"),1<=this.task.tokens.length?(c.draw.drawDetections(this.canvas,o),i=c.resizeResults(s,{width:r,height:n}),this.task.tokens.includes("expressions")&&c.draw.drawFaceExpressions(this.canvas,i.map(function(e){var t=e.detection,r=e.expressions;return{position:t.box,expressions:r}})),this.task.tokens.includes("landmarks")&&c.draw.drawFaceLandmarks(this.canvas,i.map(function(e){return e.landmarks})),this.task.tokens.includes("ageAndGender")&&i.forEach(function(e){var t=e.age,r=e.gender,n=e.genderProbability;new c.draw.DrawTextField([c.round(t,0)+" years",r+" ("+c.round(n)+")"],e.detection.box.bottomLeft).draw(a.canvas)})):c.draw.drawDetections(this.canvas,o),[2]}})})},e.decorators=[{type:a.Component,args:[{template:"<canvas #canvas></canvas>\n",styles:["canvas{width:100%;height:100%}"]}]}],e.ctorParameters=function(){return[{type:f},{type:a.ElementRef},{type:a.Renderer2},{type:E}]},e.propDecorators={canvasEl:[{type:a.ViewChild,args:["canvas"]}],onResize:[{type:a.HostListener,args:["window:resize"]}]},e}(),O=function(){function e(e,t,r){this.el=e,this.overlay=t,this.injector=r,this["with"]=[]}return e.prototype.ngOnInit=function(){this.task=new f({type:this.type,tokens:this["with"],realtime:this.stream})},Object.defineProperty(e.prototype,"orverlayPositionStrategy",{get:function(){return this.overlay.position().flexibleConnectedTo(this.el).withPositions([{overlayX:"start",overlayY:"top",originX:"start",originY:"top"}]).withFlexibleDimensions(!1).withLockedPosition(!0)},enumerable:!0,configurable:!0}),e.prototype.createOverlay=function(){var e=this.overlay.scrollStrategies.reposition(),t=new s.OverlayConfig({positionStrategy:this.orverlayPositionStrategy,scrollStrategy:e,hasBackdrop:!1});return this.overlay.create(t)},e.prototype.createInjector=function(){return a.Injector.create({parent:this.injector,providers:[{provide:f,useValue:this.task}]})},e.prototype.ngAfterViewInit=function(){this.task.resolveTarget(this.el.nativeElement);var e=this.createOverlay(),t=this.createInjector(),r=new i.ComponentPortal(L,undefined,t);e.attach(r)},e}(),R=function(o){function e(e,t,r){var n=o.call(this,e,t,r)||this;return n["with"]=[],n.type="all",n.stream=!1,n}return t(e,o),e.decorators=[{type:a.Directive,args:[{selector:"img[allFaces]",exportAs:"faces"}]}],e.ctorParameters=function(){return[{type:a.ElementRef},{type:s.Overlay},{type:a.Injector}]},e.propDecorators={"with":[{type:a.Input}]},e}(O),S=function(o){function e(e,t,r){var n=o.call(this,e,t,r)||this;return n["with"]=[],n.type="single",n.stream=!1,n}return t(e,o),e.prototype.ngOnInit=function(){this.task=new f({type:this.type,tokens:this["with"],realtime:this.stream})},e.decorators=[{type:a.Directive,args:[{selector:"img[singleFace]",exportAs:"face"}]}],e.ctorParameters=function(){return[{type:a.ElementRef},{type:s.Overlay},{type:a.Injector}]},e.propDecorators={"with":[{type:a.Input}]},e}(O),T=function(o){function e(e,t,r){var n=o.call(this,e,t,r)||this;return n["with"]=[],n.type="all",n.stream=!0,n}return t(e,o),e.decorators=[{type:a.Directive,args:[{selector:"video[allFaces]",exportAs:"faces"}]}],e.ctorParameters=function(){return[{type:a.ElementRef},{type:s.Overlay},{type:a.Injector}]},e.propDecorators={"with":[{type:a.Input}]},e}(O),I=function(){function t(){}return t.forRoot=function(e){return{ngModule:t,providers:h([{provide:D,useValue:e.modelsUrl},P,E],[e.faceDetectionOptions?{provide:y,useValue:e.faceDetectionOptions}:[]])}},t.decorators=[{type:a.NgModule,args:[{declarations:[L,R,S,T],imports:[r.BrowserModule,s.OverlayModule,i.PortalModule],exports:[R,S,T],entryComponents:[L]}]}],t}();e.DetectTask=f,e.FaceDetectionOptions=y,e.ExpressionsFeatureToken=v,e.LandmarksFeatureToken=w,e.DescriptorsFeatureToken=g,e.AgeAndGenderToken=m,e.SsdMobilenetv1Model=k,e.MtcnnModel=b,e.FaceExpressionModel=M,e.FaceLandmarkModel=F,e.FaceRecognitionModel=x,e.TinyFaceDetectorModel=j,e.AgeAndGenderModel=A,e.ModelsUrl=D,e.FaceDetectorService=E,e.ModelLoaderService=P,e.NgxFaceApiJsModule=I,e.ɵa=L,e.ɵc=O,e.ɵb=R,e.ɵe=T,e.ɵd=S,Object.defineProperty(e,"__esModule",{value:!0})}); //# sourceMappingURL=ngx-face-api-js.umd.min.js.map