UIAngular/Client/src/app/components/popups/share-popup/share-popup.component.ts

78 lines
3.0 KiB
TypeScript

import { GoogleAnalyticsService } from './../../../services/google-analytics.service';
import { MatDialogRef, MatSnackBar } from '@angular/material';
import { DOCUMENT } from '@angular/platform-browser';
import { MAT_DIALOG_DATA } from '@angular/material';
import { Component, OnInit, Inject } from '@angular/core';
@Component({
selector: 'app-share-popup',
templateUrl: './share-popup.component.html',
styleUrls: ['./share-popup.component.css']
})
export class SharePopupComponent implements OnInit {
//private urlPartA: string = "https://www.facebook.com/plugins/share_button.php?href=";
//private urlPartB: string = "&layout=button_count&size=large&mobile_iframe=true&width=106&height=28&appId";
private urlPartA: string = "https://www.facebook.com/sharer/sharer.php?kid_directed_site=0&u=";
private urlPartB: string = "&display=popup&ref=plugin&src=share_button";
private twitterPartA: string = "https://twitter.com/intent/tweet?text=";
private twitterPartB: string = "https://twitter.com/intent/tweet?text=ShareThis&url=http%3A%2F%2Fwww.sharethis.com%2F";
public twitterUrl: string;
private id: string;
public facebookIframeUrl: string;
private shareBaseUrl: string = "/api2/share/";
public shareUrl: string;
constructor(@Inject(MAT_DIALOG_DATA) public data: any,
@Inject(DOCUMENT) private document,
private MatDialogRef: MatDialogRef<SharePopupComponent>,
private snackbar: MatSnackBar,
private googleAnalyticsService: GoogleAnalyticsService) {
this.id = data.id;
let port = this.document.location.port ? ":"+this.document.location.port : "";
this.shareUrl = this.document.location.protocol +'//'+ this.document.location.hostname + port + this.shareBaseUrl + data.prefix + this.id;
if (this.data.prefix === 'o') {
this.shareUrl = this.document.location.protocol + '//' + this.document.location.hostname + port + this.shareBaseUrl + data.prefix + data.otherName;
}
this.facebookIframeUrl = this.urlPartA + this.shareUrl + this.urlPartB;
this.twitterUrl = this.twitterPartA + data.title + " - " + data.description + "&url=" + this.shareUrl;
}
ngOnInit() {
}
close(){
this.MatDialogRef.close();
}
copyLink(target){
target.select();
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
target.blur();
let s = this.snackbar.open("Link Copied","OK");
s.onAction().subscribe(()=>{ s.dismiss(); });
s.afterOpened().subscribe(()=>{ setTimeout(()=>{ s.dismiss(); },3000); });
this.share("link");
} catch (err) {
console.error('Oops, unable to copy');
}
}
share(method: string){
if (this.data.prefix === 's'){
this.googleAnalyticsService.shareSermon(Number(this.id),this.data.title,method);
} else if (this.data.prefix === 'e'){
this.googleAnalyticsService.shareEvent(Number(this.id),this.data.title,method);
}
}
facebookShare(){
this.share('facebook');
}
twitterShare(){
this.share('twitter');
}
}