[Library|Trunk]
Add This: add js dynamically when the component is loaded for the first time Cite This: add js dynamically when the component is loaded for the first time add padding Bottom menu: Fix menu width when it is not centered git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@58780 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
1fe05f52d6
commit
8e0a427b0b
|
@ -1,15 +1,6 @@
|
|||
import {
|
||||
AfterContentInit,
|
||||
AfterViewInit,
|
||||
Component,
|
||||
ElementRef,
|
||||
EventEmitter,
|
||||
Input,
|
||||
OnInit,
|
||||
Output,
|
||||
ViewChild
|
||||
} from '@angular/core';
|
||||
import {Component, EventEmitter, Inject, OnInit, Output, RendererFactory2, ViewEncapsulation} from '@angular/core';
|
||||
import {ActivatedRoute} from '@angular/router';
|
||||
import {DOCUMENT} from "@angular/common";
|
||||
|
||||
interface addthis {
|
||||
layers: Refresh;
|
||||
|
@ -26,25 +17,45 @@ declare var addthis: addthis;
|
|||
@Component({
|
||||
selector: 'addThis',
|
||||
template: `
|
||||
<p class="addthis_inline_share_toolbox"></p>
|
||||
<div class="addthis_inline_share_toolbox_lcx9"></div>
|
||||
`
|
||||
})
|
||||
export class AddThisComponent implements OnInit {
|
||||
@Output() event: EventEmitter<boolean> = new EventEmitter<boolean>();
|
||||
|
||||
constructor(private route: ActivatedRoute) {}
|
||||
|
||||
constructor(private route: ActivatedRoute, @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2) {}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
this.route.queryParams.subscribe(data => {
|
||||
if (typeof document !== 'undefined' && typeof addthis !== 'undefined') {
|
||||
if(addthis.layers && addthis.layers.refresh) {
|
||||
addthis.layers.refresh();
|
||||
} else {
|
||||
this.event.emit(false);
|
||||
try {
|
||||
if (!this.document.getElementById('addThisScript') && typeof document !== 'undefined') {
|
||||
console.log(" create script AddThis")
|
||||
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.');
|
||||
}
|
||||
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, "type", "text/javascript");
|
||||
renderer.appendChild(head, script);
|
||||
}
|
||||
} else {
|
||||
this.event.emit(false);
|
||||
if (typeof document !== 'undefined') {
|
||||
if(typeof addthis !== 'undefined' && addthis.layers && addthis.layers.refresh) {
|
||||
// console.log("Add This: Call Refresh")
|
||||
addthis.layers.refresh();
|
||||
}
|
||||
}
|
||||
}catch (e) {
|
||||
console.error(e)
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,13 +1,23 @@
|
|||
import {Component, ElementRef, Input, OnDestroy, OnInit} from '@angular/core';
|
||||
import {
|
||||
Component,
|
||||
ElementRef,
|
||||
Inject,
|
||||
Input,
|
||||
OnDestroy,
|
||||
OnInit,
|
||||
RendererFactory2,
|
||||
ViewEncapsulation
|
||||
} from '@angular/core';
|
||||
import {ActivatedRoute} from '@angular/router';
|
||||
import {Citation, CitationData} from './citation.class';
|
||||
import {ResultLandingInfo} from "../../../utils/entities/resultLandingInfo";
|
||||
import {DOCUMENT} from "@angular/common";
|
||||
|
||||
declare var CSL: any;
|
||||
declare var Sys: any;
|
||||
declare var UIkit: any;
|
||||
|
||||
//<addThis ></addThis>
|
||||
//<citeThis ></citeThis>
|
||||
@Component({
|
||||
selector: 'citeThis',
|
||||
template: `
|
||||
|
@ -23,7 +33,7 @@ declare var UIkit: any;
|
|||
</mat-select>
|
||||
</mat-form-field>
|
||||
<div *ngIf="selectedStyle">
|
||||
<div id="citation" class="box-content uk-margin-small-top uk-overflow-auto" [innerHTML]=citationText></div>
|
||||
<div id="citation" class="box-content uk-margin-small-top uk-overflow-auto uk-padding-small" [innerHTML]=citationText></div>
|
||||
<button
|
||||
class="clipboard_btn uk-button uk-button-small uk-button-secondary uk-margin-small-top uk-icon uk-float-right"
|
||||
data-clipboard-target="#citation" title="Copy to clipboard">
|
||||
|
@ -49,16 +59,39 @@ export class CiteThisComponent implements OnInit, OnDestroy {
|
|||
public citeproc;
|
||||
public data;
|
||||
public clipboard;
|
||||
|
||||
constructor( @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2){
|
||||
|
||||
|
||||
}
|
||||
ngOnInit() {
|
||||
if (typeof window !== 'undefined') {
|
||||
// this.citeproc = require('./citeproc.js');
|
||||
// console.log(this.citeproc);
|
||||
try{
|
||||
if (!this.document.getElementById('citeThisScript')) {
|
||||
const renderer = this.rendererFactory.createRenderer(this.document, {
|
||||
id: '-1',
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
styles: [],
|
||||
data: {}
|
||||
});
|
||||
const head = this.document.head;
|
||||
if (head === null) {
|
||||
throw new Error('<head> not found within DOCUMENT.');
|
||||
}
|
||||
const script = renderer.createElement('script');
|
||||
renderer.setAttribute(script, "id", "citeThisScript");
|
||||
renderer.setAttribute(script, "src", "assets/common-assets/citeproc.js");
|
||||
renderer.setAttribute(script, "type", "text/javascript");
|
||||
renderer.appendChild(head, script);
|
||||
}
|
||||
setTimeout(() => {
|
||||
this.parseData();
|
||||
this.selectedStyle = this.citation.templates[0];
|
||||
this.updateCitation();
|
||||
this.createClipboard();
|
||||
}
|
||||
}, 800);
|
||||
|
||||
}catch (e) {
|
||||
console.error(e)
|
||||
}
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
|
@ -174,11 +207,14 @@ export class CiteThisComponent implements OnInit, OnDestroy {
|
|||
return this.data;
|
||||
}
|
||||
};
|
||||
|
||||
var citeproc = new CSL.Engine(new Sys(this.citation.locale, this.data), this.citation[(this.selectedStyle == "0") ? this.citation.templates[0] : this.selectedStyle]);
|
||||
citeproc.updateItems([this.data.id]);
|
||||
this.citationText = citeproc.makeBibliography();
|
||||
this.citationText = ((this.citationText != null) && (this.citationText.length > 1) && (this.citationText[1].length > 0)) ? this.citationText[1][0] : '';
|
||||
try {
|
||||
var citeproc = new CSL.Engine(new Sys(this.citation.locale, this.data), this.citation[(this.selectedStyle == "0") ? this.citation.templates[0] : this.selectedStyle]);
|
||||
citeproc.updateItems([this.data.id]);
|
||||
this.citationText = citeproc.makeBibliography();
|
||||
this.citationText = ((this.citationText != null) && (this.citationText.length > 1) && (this.citationText[1].length > 0)) ? this.citationText[1][0] : '';
|
||||
}catch (e) {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<!-- <div class="uk-container uk-container-expand uk-margin-small">-->
|
||||
<div [class]="(centered?'':'uk-grid uk-grid-collapse ') " >
|
||||
<div id="footer#3" [class]="'uk-first-column uk-text-left ' +
|
||||
(centered?'uk-grid uk-margin-remove-right':'')">
|
||||
(centered?'uk-grid uk-margin-remove-right':'uk-margin-large-right uk-width-1-3@m')">
|
||||
<div *ngIf="showOpenaire"
|
||||
[class]="'uk-margin-top uk-text-left '+(centered?'uk-width-1-4':'')">
|
||||
<img [src]="assetsPath + 'common/Logo_Horizontal_'+(darkBackground?'white':'dark')+'_small.png'"
|
||||
|
|
Loading…
Reference in New Issue