[Library & common-assets | explore-redesign]: addThis.component.ts: Replaced addthis external library with addtoany - addthis is no longer supported | general.less: css for addtoany social icons (classes .fully_rounded .a2a_svg).
This commit is contained in:
parent
2fa4c9e810
commit
8029aafb36
|
@ -1,34 +1,28 @@
|
|||
import {
|
||||
ChangeDetectorRef,
|
||||
Component,
|
||||
EventEmitter,
|
||||
Inject, Input,
|
||||
OnInit,
|
||||
Output,
|
||||
RendererFactory2,
|
||||
ViewChild,
|
||||
ViewEncapsulation
|
||||
} from '@angular/core';
|
||||
import {ActivatedRoute} from '@angular/router';
|
||||
import {DOCUMENT} from "@angular/common";
|
||||
import {Subscriber} from "rxjs";
|
||||
|
||||
interface addthis {
|
||||
layers: Refresh;
|
||||
init: Function;
|
||||
toolbox: Function;
|
||||
}
|
||||
|
||||
interface Refresh {
|
||||
refresh: Function;
|
||||
}
|
||||
|
||||
declare var addthis: addthis;
|
||||
declare var a2a;
|
||||
|
||||
@Component({
|
||||
selector: 'addThis',
|
||||
template: `
|
||||
<div id="addThis" class="addthis_inline_share_toolbox_lcx9_8cfy" [attr.data-url]="url"></div>
|
||||
<div [id]="'addToAny'+(url ? ('_'+url) : '')" #addToAny class="a2a_kit a2a_kit_size_42 a2a_default_style fully_rounded" [attr.data-a2a-url]="url">
|
||||
<a class="a2a_button_twitter"></a>
|
||||
<a class="a2a_button_facebook"></a>
|
||||
<a class="a2a_button_linkedin"></a>
|
||||
<a class="a2a_button_mendeley"></a>
|
||||
<a class="a2a_button_reddit"></a>
|
||||
<a class="a2a_button_email"></a>
|
||||
<a class="a2a_dd" href="https://www.addtoany.com/share"></a>
|
||||
</div>
|
||||
<div *ngIf="showWarning" class="uk-alert uk-alert-warning uk-animation-fade">
|
||||
Do the share buttons not appear? Please make sure, any blocking addon is disabled, and then reload the page.
|
||||
</div>
|
||||
|
@ -38,7 +32,7 @@ export class AddThisComponent implements OnInit {
|
|||
subs = [];
|
||||
showWarning = false;
|
||||
@Input() url: string = null;
|
||||
|
||||
|
||||
constructor(private route: ActivatedRoute, @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2) {
|
||||
}
|
||||
|
||||
|
@ -50,15 +44,41 @@ export class AddThisComponent implements OnInit {
|
|||
value();
|
||||
}
|
||||
}
|
||||
//
|
||||
// if(typeof document !== 'undefined') {
|
||||
// const renderer = this.rendererFactory.createRenderer(this.document, {
|
||||
// id: '-1',
|
||||
// encapsulation: ViewEncapsulation.None,
|
||||
// styles: [],
|
||||
// data: {}
|
||||
// });
|
||||
// const head = this.document.body;
|
||||
// if (head === null) {
|
||||
// throw new Error('<head> not found within DOCUMENT.');
|
||||
// }
|
||||
//
|
||||
//
|
||||
// let script = null;
|
||||
// head.childNodes.forEach(node => {
|
||||
// if(node.id === "addToAnyScript") {
|
||||
// // script = node;
|
||||
// node.remove();
|
||||
// }
|
||||
// })
|
||||
// // let script = head.nativeElement.getElementById("script");
|
||||
// // if(script) {
|
||||
// // renderer.removeChild(head, script);
|
||||
// // script.remove();
|
||||
// // }
|
||||
// }
|
||||
}
|
||||
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
|
||||
this.subs.push(this.route.queryParams.subscribe(data => {
|
||||
this.showWarning = false;
|
||||
try {
|
||||
if (!this.document.getElementById('addThisScript') && typeof document !== 'undefined') {
|
||||
// console.log(" create script AddThis");
|
||||
if (!this.document.getElementById('addToAnyScript') && typeof document !== 'undefined') {
|
||||
const renderer = this.rendererFactory.createRenderer(this.document, {
|
||||
id: '-1',
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
|
@ -70,26 +90,25 @@ export class AddThisComponent implements OnInit {
|
|||
throw new Error('<head> not found within DOCUMENT.');
|
||||
}
|
||||
const script = renderer.createElement('script');
|
||||
renderer.setAttribute(script, "id", "addThisScript");
|
||||
renderer.setAttribute(script, "src", "https://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-559d24521cd8c080");
|
||||
renderer.setAttribute(script, "id", "addToAnyScript");
|
||||
renderer.setAttribute(script, "src", "https://static.addtoany.com/menu/page.js");
|
||||
renderer.setAttribute(script, "type", "text/javascript");
|
||||
renderer.appendChild(head, script);
|
||||
}
|
||||
if (typeof document !== 'undefined') {
|
||||
if (typeof addthis !== 'undefined' && addthis.layers && addthis.layers.refresh) {
|
||||
// console.log("Add This: Call Refresh")
|
||||
addthis.layers.refresh();
|
||||
if(typeof a2a !== 'undefined' && this.document.getElementById('addToAny'+(this.url ? ('_'+this.url) : '')) && !this.document.getElementById('addToAny'+(this.url ? ('_'+this.url) : '')).innerText) {
|
||||
a2a.init_all();
|
||||
}
|
||||
}
|
||||
this.subs.push(setTimeout(() => {
|
||||
if (this.document.getElementById('addThis') && !this.document.getElementById('addThis').innerText) {
|
||||
if (this.document.getElementById('addToAny'+(this.url ? ('_'+this.url) : '')) && !this.document.getElementById('addToAny'+(this.url ? ('_'+this.url) : '')).innerText) {
|
||||
this.showWarning = true;
|
||||
}
|
||||
}, 4000));
|
||||
} catch (e) {
|
||||
// console.error(e)
|
||||
}
|
||||
|
||||
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue