[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:
Konstantina Galouni 2023-07-04 19:12:34 +03:00
parent 2fa4c9e810
commit 8029aafb36
1 changed files with 47 additions and 28 deletions

View File

@ -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>
@ -50,6 +44,33 @@ 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() {
@ -57,8 +78,7 @@ export class AddThisComponent implements OnInit {
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,19 +90,18 @@ 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));