UNPKG

@angular-material-extensions/link-preview

Version:
3 lines (2 loc) 5.64 kB
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/common"),require("@angular/core"),require("@angular/common/http"),require("rxjs/operators"),require("ngx-linkifyjs"),require("@angular/material"),require("rxjs")):"function"==typeof define&&define.amd?define(["exports","@angular/common","@angular/core","@angular/common/http","rxjs/operators","ngx-linkifyjs","@angular/material","rxjs"],n):n((e=e||self).angularMaterialExtensionsLinkPreview={},e.ng.common,e.ng.core,e.ng.common.http,e.operators,e.ngxLinkifyjs,e.ng.material,e.rxjs)}(this,function(e,n,t,i,r,o,s,a){"use strict";var l=function(){function e(e){var n=this;this.http=e,this._accessKey="5b54e80a65c77848ceaa4630331e8384950e09d392365",this._apiURL="https://api.linkpreview.net/",this.onLinkFound=new t.EventEmitter,this.links=[],this.onLinkFound.subscribe(function(e){return n.links=e})}return e.prototype.fetchLink=function(e){console.log("fetching the following link: ",e);var n=(new i.HttpParams).append("key",this._accessKey).append("q",e);return this.http.get(this._apiURL,{params:n}).pipe(r.map(function(e){return e}))},e.decorators=[{type:t.Injectable}],e.ctorParameters=function(){return[{type:i.HttpClient}]},e}(),c=function(){function e(e,n){this.linkifyService=e,this.linkPreviewService=n}return e.prototype.ngOnInit=function(){this._init()},e.prototype._init=function(){var e=this;a.fromEvent(document,"input").pipe(r.debounceTime(2e3),r.distinctUntilChanged(),r.map(function(n){var t=n.target.value,i=e.linkifyService.find(t);return console.log("data: ",t),console.log("links: ",i),i})).subscribe(function(n){e.linkPreviewService.onLinkFound.emit(n)})},e.decorators=[{type:t.Directive,args:[{selector:"[matLinkPreview]",exportAs:"[matLinkPreview]"}]}],e.ctorParameters=function(){return[{type:o.NgxLinkifyjsService},{type:l}]},e}(),p=function(){function e(e){this.linkPreviewService=e,this.color="primary",this.showLoadingsProgress=!0}return e.prototype.ngOnInit=function(){var e=this;this.link&&!this.linkPreview&&(this._subscription=this.linkPreviewService.fetchLink(this.link.href).subscribe(function(n){return e.linkPreview=n},function(n){return e.hasError=!0},function(){return e.loaded=!0}))},e.prototype.ngOnDestroy=function(){this._subscription&&this._subscription.unsubscribe()},e.decorators=[{type:t.Component,args:[{selector:"mat-link-preview",exportAs:"matLinkPreview",template:'\n <ng-container *ngIf="!this.linkPreview && !this.loaded && this.showLoadingsProgress;then fetch else preview">\n </ng-container>\n <ng-template #preview>\n <mat-card *ngIf="this.linkPreview">\n <mat-card-content class="cut-text">\n <div class="img-container" *ngIf="linkPreview.image">\n <img mat-card-image [src]="linkPreview?.image">\n </div>\n <div>\n <mat-card-title>{{linkPreview?.title}}</mat-card-title>\n <mat-card-subtitle>{{linkPreview?.description}}</mat-card-subtitle>\n <a [href]="linkPreview?.url" mat-button [color]="color">{{linkPreview?.url}}</a>\n </div>\n </mat-card-content>\n </mat-card>\n </ng-template>\n\n <ng-template #fetch>\n <mat-spinner *ngIf="!this.hasError"></mat-spinner>\n </ng-template>\n ',styles:["\n :host{display:block}mat-card-content{flex-direction:row;box-sizing:border-box;display:flex}mat-card-content a{padding-left:0;padding-right:0}.img-container{margin-right:1rem;place-content:center;align-items:center;flex-direction:row;box-sizing:border-box;display:flex;flex:1 1 100%;max-width:20%;padding:24px 16px}.center-auto{margin-left:auto!important;margin-right:auto!important}.cut-text{text-overflow:ellipsis;overflow:hidden}\n "]}]}],e.ctorParameters=function(){return[{type:l}]},e.propDecorators={link:[{type:t.Input}],linkPreview:[{type:t.Input}],color:[{type:t.Input}],showLoadingsProgress:[{type:t.Input}]},e}(),u=function(){function e(e){this.linkPreviewService=e,this.color="primary",this.showLoadingsProgress=!0}return e.prototype.trackLinks=function(e,n){return n?n.href:void 0},e.decorators=[{type:t.Component,args:[{selector:"mat-link-preview-container",exportAs:"matLinkPreviewContainer",template:'\n <ng-container *ngIf="!multiple && linkPreviewService.links.length > 0; then first else list"></ng-container>\n\n <ng-template #first>\n <mat-link-preview [link]="linkPreviewService?.links[0]"\n [showLoadingsProgress]="showLoadingsProgress">\n </mat-link-preview>\n </ng-template>\n <ng-template #list>\n <div *ngFor="let link of linkPreviewService.links; trackBy: trackLinks">\n <mat-link-preview [link]="link"\n [showLoadingsProgress]="showLoadingsProgress">\n </mat-link-preview>\n </div>\n </ng-template>\n ',styles:["\n :host{display:block}\n "]}]}],e.ctorParameters=function(){return[{type:l}]},e.propDecorators={color:[{type:t.Input}],multiple:[{type:t.Input}],showLoadingsProgress:[{type:t.Input}]},e}(),g=function(){function e(){}return e.forRoot=function(){return{ngModule:e,providers:[l,o.NgxLinkifyjsService,{provide:o.NgxLinkifyjsConfigToken,useValue:o.DEFAULT_CONFIG}]}},e.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule,i.HttpClientModule,o.NgxLinkifyjsModule,s.MatCardModule,s.MatButtonModule,s.MatProgressSpinnerModule],exports:[p,u,c],declarations:[p,u,c]}]}],e}();e.MatLinkPreviewComponent=p,e.MatLinkPreviewContainerComponent=u,e.MatLinkPreviewDirective=c,e.MatLinkPreviewService=l,e.MatLinkPreviewModule=g,Object.defineProperty(e,"__esModule",{value:!0})}); //# sourceMappingURL=link-preview.umd.min.js.map