[develop | DONE | CHANGED]: sdg-fos-suggest.component.ts: Added field "isOpen: boolean = false;" and check if isOpen to show modal content | resultLanding.component: Removed old unused code and old comments, updated and added more checks e.g. not load content of modals if they are not open.
This commit is contained in:
parent
efa0f72cc3
commit
edf49c4019
|
|
@ -15,6 +15,7 @@ import {StringUtils} from "../../../utils/string-utils.class";
|
|||
template: `
|
||||
<modal-alert #selectionModal [large]="true" (alertOutput)="modalOutput()" (cancelOutput)="modalCancel()"
|
||||
[okDisabled]="!sent && !selectionStep1 && (form.invalid || sending)">
|
||||
<ng-container *ngIf="isOpen">
|
||||
<sdg-selection *ngIf="subjects && subjectType == 'sdg'" #selection [class.uk-hidden]="!selectionStep1"
|
||||
[subjects]="subjects" [entityType]="entityType"></sdg-selection>
|
||||
<fos-selection *ngIf="subjects && subjectType == 'fos'" #selection [class.uk-hidden]="!selectionStep1"
|
||||
|
|
@ -43,6 +44,7 @@ import {StringUtils} from "../../../utils/string-utils.class";
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</modal-alert>
|
||||
`
|
||||
})
|
||||
|
|
@ -62,6 +64,7 @@ export class SdgFosSuggestComponent {
|
|||
public sent: boolean = false;
|
||||
public error: boolean = false;
|
||||
subscriptions: Subscription[] = [];
|
||||
isOpen: boolean = false;
|
||||
|
||||
constructor(private emailService: EmailService, private fb: FormBuilder, private cdr: ChangeDetectorRef) {}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
[searchActionRoute]="properties.searchLinkToResults"></schema2jsonld>
|
||||
|
||||
<!-- Desktop view -->
|
||||
<div id="tm-main" class="uk-visible@m landing uk-section uk-padding-remove tm-middle">
|
||||
<div *ngIf="!isMobile" class="tm-main">
|
||||
<div *ngIf="!isMobile" id="tm-main" class="landing uk-section uk-padding-remove tm-middle">
|
||||
<div class="tm-main">
|
||||
<div class="publication">
|
||||
<div *ngIf="properties.adminToolsPortalType == 'eosc'" class="eosc-explore-back-search-bar">
|
||||
<div class="uk-light uk-container uk-container-large uk-margin-left uk-height-1-1">
|
||||
|
|
@ -18,70 +18,6 @@
|
|||
</div>
|
||||
</div>
|
||||
<div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid>
|
||||
|
||||
<!-- left box/sidebar - actions -->
|
||||
<!-- <div id="landing-left-sidebar" *ngIf="resultLandingInfo" class="uk-visible@s uk-padding-remove-horizontal">
|
||||
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
|
||||
uk-sticky="end: true" [attr.offset]="offset">
|
||||
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
|
||||
<ng-container *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)">
|
||||
<metrics *ngIf="hasMetrics" class="uk-margin-bottom"
|
||||
[pageViews]="pageViews"
|
||||
[id]="id" [entityType]="'results'" [entity]="title"
|
||||
[viewsFrameUrl]="viewsFrameUrl" [downloadsFrameUrl]="downloadsFrameUrl"
|
||||
(metricsResults)="metricsResults($event)" [properties]=properties
|
||||
[prevPath]="prevPath">
|
||||
</metrics>
|
||||
<altmetrics *ngIf="hasAltMetrics" id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi"></altmetrics>
|
||||
</ng-container>
|
||||
</div>
|
||||
<div class="uk-margin-large-bottom uk-align-center">
|
||||
<div class="uk-text-meta uk-text-uppercase">Actions</div>
|
||||
<ul class="uk-list">
|
||||
<li class="uk-text-center">
|
||||
<a (click)="openAddThisModal()"
|
||||
[title]="'Share this '+getTypeName() + ' in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-text-center"
|
||||
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
|
||||
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
|
||||
routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="link" visuallyHidden="link"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="uk-text-center">
|
||||
<a (click)="openCiteModal()"
|
||||
[title]="'Cite this '+getTypeName()"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="quotes" visuallyHidden="cite"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li *ngIf="properties.adminToolsPortalType == 'explore' || properties.adminToolsPortalType == 'community' || properties.adminToolsPortalType == 'aggregator'"
|
||||
class="uk-text-center">
|
||||
<orcid-work [resultId]="id" [resultTitle]="resultLandingInfo.title" [resultLandingInfo]="resultLandingInfo"
|
||||
[pids]="pidsArrayString" [pageType]="'landing'">
|
||||
</orcid-work>
|
||||
</li>
|
||||
<li *ngIf=" properties.enableEoscDataTransfer && resultLandingInfo.resultType == 'dataset' &&
|
||||
resultLandingInfo.identifiers && resultLandingInfo.identifiers.get('doi')"
|
||||
class="uk-text-center">
|
||||
<egi-transfer-data [dois]="resultLandingInfo.identifiers.get('doi')" [isOpen]="egiTransferModalOpen"></egi-transfer-data>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<!-- center box-->
|
||||
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
|
||||
|
||||
|
|
@ -166,54 +102,6 @@
|
|||
<!-- in small screens there is no sticky #graph_and_feedback so margin-top is medium (40px) -->
|
||||
<!-- else margin is medium (40px) - the actual height of uk-sticky-placeholder (graph_height - 20px -> margins of #graph_and_feedback) -->
|
||||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||
|
||||
<!-- Actions for mobile viewport -->
|
||||
<div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s">
|
||||
<!-- Share -->
|
||||
<div class="uk-margin-small-right">
|
||||
<a (click)="openAddThisModal()"
|
||||
[title]="'Share this '+getTypeName() + ' in your social networks'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="share" visuallyHidden="share"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Link to -->
|
||||
<div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right"
|
||||
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
|
||||
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
|
||||
routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="link" visuallyHidden="link"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- Cite this -->
|
||||
<div class="uk-margin-small-right">
|
||||
<a (click)="openCiteModal()"
|
||||
[title]="'Cite this '+getTypeName()"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<icon name="quotes" visuallyHidden="cite"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- ORCID -->
|
||||
<div *ngIf="properties.adminToolsPortalType == 'explore' || properties.adminToolsPortalType == 'community' || properties.adminToolsPortalType == 'aggregator'"
|
||||
class="uk-margin-small-right">
|
||||
<orcid-work [resultId]="id" [resultTitle]="resultLandingInfo.title" [resultLandingInfo]="resultLandingInfo"
|
||||
[pids]="pidsArrayString" [pageType]="'landing'">
|
||||
</orcid-work>
|
||||
</div>
|
||||
<div *ngIf=" properties.enableEoscDataTransfer && resultLandingInfo.resultType == 'dataset' &&
|
||||
resultLandingInfo.identifiers && resultLandingInfo.identifiers.get('doi') &&
|
||||
resultLandingInfo.identifiers.get('doi').join('').indexOf('zenodo.')!=-1"
|
||||
class="">
|
||||
<egi-transfer-data [dois]="resultLandingInfo.identifiers.get('doi')" [isOpen]="egiTransferModalOpen"></egi-transfer-data>
|
||||
</div>
|
||||
</div>
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
|
||||
|
|
@ -232,48 +120,15 @@
|
|||
[publiclyFunded]="resultLandingInfo.publiclyFunded"
|
||||
[projects]="resultLandingInfo.fundedByProjects">
|
||||
</landing-header>
|
||||
<!-- Labels -->
|
||||
<!-- Not used anymore - access labels will be in action bars, languages in the landing-header component -->
|
||||
<!-- <div class="uk-margin-bottom uk-grid uk-grid-small uk-flex-middle" uk-grid>
|
||||
<ng-container *ngIf="resultLandingInfo.accessMode && resultLandingInfo.accessMode.toLowerCase() !== 'not available'">
|
||||
<div>
|
||||
<span [class]="'uk-label uk-text-truncate '+ (accessClass(resultLandingInfo.accessMode) == 'open' ? 'uk-label-success' : '')"
|
||||
title="Access Mode">{{resultLandingInfo.accessMode}}
|
||||
</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="resultLandingInfo.languages &&
|
||||
removeUnknown(resultLandingInfo.languages).length > 0">
|
||||
<ng-container *ngFor="let language of removeUnknown(resultLandingInfo.languages)">
|
||||
<div>
|
||||
<span class="uk-label custom-label label-language" title="Language">{{language}}</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="resultLandingInfo.programmingLanguages && resultLandingInfo.programmingLanguages.length > 0">
|
||||
<ng-container *ngFor="let programmingLanguage of resultLandingInfo.programmingLanguages">
|
||||
<div>
|
||||
<span class="uk-label custom-label label-language"
|
||||
title="Programming Language">{{programmingLanguage}}</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</div> -->
|
||||
<div class="uk-text-small">
|
||||
<!-- Identifiers -->
|
||||
<div *ngIf="resultLandingInfo.identifiers && resultLandingInfo.identifiers.size > 0" class="uk-margin-small-top">
|
||||
<showIdentifiers [identifiers]="resultLandingInfo.identifiers" [showViewAll]="true"></showIdentifiers>
|
||||
</div>
|
||||
<!--Published Date, Journal and Publisher-->
|
||||
<!-- Moved inside landing-header component -->
|
||||
<!-- <div showPublisher [publisher]="resultLandingInfo.publisher"
|
||||
[publishDate]="resultLandingInfo.dateofacceptance"
|
||||
[journal]="resultLandingInfo.journal" [properties]="properties" class="uk-margin-small-top"></div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="main-tabs-div" class="uk-sticky uk-blur-background"
|
||||
uk-sticky="end: true; media: @m" [attr.offset]="offset">
|
||||
<div id="main-tabs-div" class="uk-sticky uk-blur-background" uk-sticky="end: true; media: @m" [attr.offset]="offset">
|
||||
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
|
||||
<landing-header [ngClass]="stickyHeader ? 'uk-visible@m' : 'uk-invisible'"
|
||||
[properties]="properties" [title]="resultLandingInfo.title"
|
||||
|
|
@ -282,7 +137,6 @@
|
|||
[date]="resultLandingInfo.dateofacceptance" [embargoEndDate]="resultLandingInfo.embargoEndDate"
|
||||
isSticky="true" [prevPath]="prevPath">
|
||||
</landing-header>
|
||||
<!-- <showTitle *ngIf="stickyHeader" [titleName]="resultLandingInfo.title" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
|
||||
<my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [offsetForSticky]="offset" [(isSticky)]="stickyHeader">
|
||||
<my-tab tabTitle="Summary" [tabId]="'summary'" [active]="true"></my-tab>
|
||||
<my-tab *ngIf="hasSubjects"
|
||||
|
|
@ -362,26 +216,6 @@
|
|||
</ng-container>
|
||||
</div>
|
||||
|
||||
<!-- right box/ sidebar-->
|
||||
<ng-container *ngIf="!showFeedback && resultLandingInfo && hasRightSidebarInfo">
|
||||
<a id="landing-right-sidebar-switcher" uk-toggle href="#right-column-offcanvas"
|
||||
class="uk-offcanvas-switcher uk-flex uk-link-reset uk-flex-center uk-flex-middle uk-hidden@m"
|
||||
(click)="rightSidebarOffcanvasClicked = true;">
|
||||
<icon name="more" [ratio]="1.5" customClass="uk-text-primary" [flex]="true" visuallyHidden="sidebar"></icon>
|
||||
</a>
|
||||
<div id="right-column-offcanvas" class="uk-offcanvas" uk-offcanvas="flip: true; overlay: true;">
|
||||
<div class="uk-offcanvas-bar">
|
||||
<button class="uk-offcanvas-close uk-close uk-icon" type="button"
|
||||
(click)="rightSidebarOffcanvasClicked = false">
|
||||
<icon name="close" [ratio]="1.5" visuallyHidden="close"></icon>
|
||||
</button>
|
||||
<div *ngIf="rightSidebarOffcanvasClicked">
|
||||
<ng-container *ngTemplateOutlet="right_column"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<ng-template #right_column>
|
||||
<!-- new metrics box -->
|
||||
<div *ngIf="resultLandingInfo && resultLandingInfo.measure && (resultLandingInfo.measure.bip.length || resultLandingInfo.measure.counts.length) && !viewAll"
|
||||
|
|
@ -509,11 +343,10 @@
|
|||
</div>
|
||||
</ng-template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<feedback *ngIf="resultLandingInfo && properties.reCaptchaSiteKey" [resultLandingInfo]="resultLandingInfo"
|
||||
<feedback *ngIf="showFeedback && resultLandingInfo && properties.reCaptchaSiteKey" [resultLandingInfo]="resultLandingInfo"
|
||||
[properties]="properties" [entityType]="getTypeName()" [fields]="feedbackFields"
|
||||
[(showForm)]="showFeedback" [preSelectedField]="feedbackPreSelectedField"></feedback>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Mobile view -->
|
||||
|
|
@ -886,16 +719,18 @@
|
|||
</modal-alert>
|
||||
|
||||
<modal-alert *ngIf="resultLandingInfo" #addThisModal classBody="uk-flex uk-flex-center uk-flex-middle">
|
||||
<addThis></addThis>
|
||||
<addThis *ngIf="addThisClicked"></addThis>
|
||||
</modal-alert>
|
||||
|
||||
<modal-alert *ngIf="resultLandingInfo && resultLandingInfo.organizations" #organizationsModal>
|
||||
<ng-container *ngIf="viewAllOrganizations">
|
||||
<ng-container *ngTemplateOutlet="organizations_template; context: { threshold: resultLandingInfo.organizations.length}"></ng-container>
|
||||
</ng-container>
|
||||
</modal-alert>
|
||||
|
||||
<modal-alert *ngIf="!isMobile && resultLandingInfo?.description" #descriptionModal
|
||||
[large]="true">
|
||||
<div [innerHTML]="resultLandingInfo.description"></div>
|
||||
<div *ngIf="descriptionClicked" [innerHTML]="resultLandingInfo.description"></div>
|
||||
</modal-alert>
|
||||
|
||||
<!--<modal-alert *ngIf="resultLandingInfo && resultLandingInfo.sdg?.length > 0"-->
|
||||
|
|
@ -1327,6 +1162,7 @@
|
|||
</div>
|
||||
</ng-template>
|
||||
|
||||
<ng-container *ngIf="isMobile">
|
||||
<fs-modal *ngIf="resultLandingInfo && resultLandingInfo.deletedByInferenceIds" #AlertModalDeletedByInferenceFS classTitle="uk-tile-default uk-border-bottom">
|
||||
<deletedByInference *ngIf="type == 'publication' && deleteByInferenceOpened"
|
||||
[id]="resultLandingInfo.record['result']['header']['dri:objIdentifier']"
|
||||
|
|
@ -1352,5 +1188,6 @@
|
|||
</fs-modal>
|
||||
|
||||
<fs-modal *ngIf="resultLandingInfo" #addThisFsModal classTitle="uk-tile-default uk-border-bottom" classBody="uk-flex uk-flex-center uk-flex-middle">
|
||||
<addThis></addThis>
|
||||
<addThis *ngIf="addThisClicked"></addThis>
|
||||
</fs-modal>
|
||||
</ng-container>
|
||||
|
|
@ -74,6 +74,8 @@ export class ResultLandingComponent {
|
|||
public linkToSearchPage: string = null;
|
||||
|
||||
public citeThisClicked: boolean;
|
||||
public addThisClicked: boolean;
|
||||
public descriptionClicked: boolean;
|
||||
|
||||
// Metrics tab variables
|
||||
public metricsClicked: boolean;
|
||||
|
|
@ -864,6 +866,7 @@ export class ResultLandingComponent {
|
|||
}
|
||||
|
||||
public openAddThisModal() {
|
||||
this.addThisClicked = true;
|
||||
this.addThisModal.cancelButton = false;
|
||||
this.addThisModal.okButton = false;
|
||||
this.addThisModal.alertTitle = "Share this " + this.getTypeName() + " in your social networks";
|
||||
|
|
@ -1076,6 +1079,7 @@ export class ResultLandingComponent {
|
|||
this.sdgFosSuggest.subjectType="fos";
|
||||
}
|
||||
this.cdr.detectChanges();
|
||||
this.sdgFosSuggest.isOpen = true;
|
||||
this.sdgFosSuggest.openSelectionModal();
|
||||
}
|
||||
|
||||
|
|
@ -1090,6 +1094,7 @@ export class ResultLandingComponent {
|
|||
}
|
||||
|
||||
public openDescriptionModal() {
|
||||
this.descriptionClicked = true;
|
||||
this.descriptionModal.alertFooter = false;
|
||||
this.descriptionModal.alertTitle = "Abstract";
|
||||
this.descriptionModal.open();
|
||||
|
|
|
|||
Loading…
Reference in New Issue