<div class="col-xs-12" ng-show="eventsPage">
	<p class="small">
		<b>Datasource:</b> {{eventsPage.datasource}}<br />
		<b>Topic:</b> {{eventsPage.topic}}<br />
		<b>Total:</b> {{eventsPage.total}}<br />
		<b>Page:</b> {{eventsPage.currPage + 1}} / {{eventsPage.totalPages}}<br />
		<button class="btn btn-sm btn-primary" data-target="#showAdvancedSearchModal" data-toggle="modal" ng-click="prepareAdvancedSearchForm()">advanced search</button>
		<button class="btn btn-sm btn-primary" data-target="#showCreateSubscriptionModal" data-toggle="modal" ng-click="prepareSubscriptionForm()">create subscription</button>
	</p>

	<p ng-if="eventsPage.values.length == 0">
		<b>No records</b>
	</p>

	<div ng-if="eventsPage.values.length > 0">
	
		<div class="text-center">
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.currPage <= 0" disabled="disabled">&larr; Prev</button>
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.currPage > 0" ng-click="gotoPage(eventsPage.currPage - 1)">&larr; Prev</button>
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.totalPages <= eventsPage.currPage + 1" disabled="disabled">Next &rarr;</button>
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.currPage + 1 < eventsPage.totalPages" ng-click="gotoPage(eventsPage.currPage + 1)">Next &rarr;</button>
		</div>
	
		<div ng-repeat="val in eventsPage.values">
			<p class="text-right"><span class="badge badge-primary"><b>Trust:</b> {{val.trust}}</span></p>
			<table class="table table-sm table-striped small">
				<tr>
					<th style="width: 200px">ID</th>
					<td>{{val.result.openaireId}}</td>
				</tr>
				<tr>
					<th>Title(s)</th>
					<td>
						<span ng-repeat="t in val.result.titles track by $index">
							<br ng-if="$index > 0"/>
							{{t}}
						</span>
					</td>
				</tr>
				<tr>
					<th>Type</th>
					<td>{{val.result.typology}}</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.creators && val.highlight.creators.length > 0}">Author(s)</th>
					<td>
						<span ng-repeat="a in val.result.creators track by $index">
							<br ng-if="$index > 0"/>
							{{a.fullname}}<span ng-if="a.orcid"> (ORCID: {{a.orcid}})</span>
							<span ng-if="val.highlight.creators && isAuthorHighlighted(a, val.highlight.creators)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b> 
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
						</span>
					</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.pids && val.highlight.pids.length > 0}">PID(s)</th>
					<td>
						<span ng-repeat="pid in val.result.pids">
							<br ng-if="$index > 0"/>
							{{pid.value}} <b>({{pid.type}})</b> 
							
							<span ng-if="val.highlight.pids && isPidHighlighted(pid, val.highlight.pids)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b> 
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
						</span>
					</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.abstracts && val.highlight.abstracts.length > 0}">Abstract(s)</th>
					<td>
						<span ng-repeat="d in val.result.abstracts track by $index">
							<br ng-if="$index > 0"/>
							{{d}}
						</span>
						<span class="float-right" ng-if="val.highlight.abstracts && val.highlight.abstracts.length > 0">
							<b>from: </b> 
							<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
							<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
							<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
						</span>
					</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.subjects && val.highlight.subjects.length > 0}">Subject(s)</th>
					<td>
						<span ng-repeat="s in val.result.subjects track by $index">
							<br ng-if="$index > 0"/>
							{{s.value}}<b ng-if="s.type"> ({{s.type}})</b>
							<span ng-if="val.highlight.subjects && isSubjectHighlighted(s, val.highlight.subjects)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b>
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
						</span>
					</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.publicationdate }">Publication date</th>
					<td>
						{{val.result.publicationdate}}
						<span class="float-right" ng-if="val.highlight.publicationdate">
							<b>from: </b> 
							<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
							<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
							<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
						</span>
					</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.instances && val.highlight.instances.length > 0}">Rights</th>
					<td>
						<span ng-repeat="i in val.result.instances">
							<br ng-if="$index > 0"/>
							{{i.license}} <b>({{i.hostedby}})</b> 
							<span ng-if="val.highlight.instances && isInstanceHighlighted(i, val.highlight.instances)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b>
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
							<br />
							<a href="{{i.url}}" target="_blank">{{i.url}}</a>
						</span>
					</td>
				</tr>
				<tr>
					<th ng-class="{'text-success' : val.highlight.projects && val.highlight.projects.length > 0}">Related project(s)</th>
					<td>
						<span ng-repeat="p in val.result.projects">
							<br ng-if="$index > 0"/>
							{{p.title}} 
							<span ng-if="val.highlight.projects && isProjectHighlighted(p, val.highlight.projects)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b>
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
							<ul>
								<li ng-if="p.acronym">acronym: <i>{{p.acronym}}</i></li> 
								<li ng-if="p.code">code: <i>{{p.code}}</i></li> 
								<li ng-if="p.funder">funder: <i>{{p.funder}}</i></li> 
								<li ng-if="p.fundingProgram">fundingProgram: <i>{{p.fundingProgram}}</i></li>
								<li ng-if="p.jurisdiction">jurisdiction: <i>{{p.jurisdiction}}</i></li> 
							</ul>
						</span>
					</td>
				</tr>

				<!-- DATASETS, PUBLICATIONS AND SOFTWARES  -->
				<tr>
					<th ng-class="{'text-success' : val.highlight.datasets && val.highlight.datasets.length > 0}">Related dataset(s)</th>
					<td>
						<span ng-repeat="d in val.result.datasets">
							<br ng-if="$index > 0"/>
							{{d.title}} 
							<span ng-if="val.highlight.datasets && isDatasetHighlighted(d, val.highlight.datasets)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b>
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
							<ul class="small">
								<li ng-repeat="pid in d.pids"><b>{{pid.type}}:</b> {{pid.value}}</li>
							</ul>
						</span>
					</td>
				</tr>
				
				<tr>
					<th ng-class="{'text-success' : val.highlight.publications && val.highlight.publications.length > 0}">Related publications(s)</th>
					<td>
						<span ng-repeat="p in val.result.publications">
							<br ng-if="$index > 0"/>
							{{p.title}} 
							<span ng-if="val.highlight.publications && isRelatedPublicationHighlighted(p, val.highlight.publications)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b>
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
							<ul class="small">
								<li ng-repeat="pid in p.pids"><b>{{pid.type}}:</b> {{pid.value}}</li> 
							</ul>
						</span>
					</td>
				</tr>
				
				<tr>
					<th ng-class="{'text-success' : val.highlight.softwares && val.highlight.softwares.length > 0}">Related softwares(s)</th>
					<td>
						<span ng-repeat="sw in val.result.softwares">
							<br ng-if="$index > 0"/>
							{{sw}} 
							<span ng-if="val.highlight.softwares && isSoftwareHighlighted(sw, val.highlight.softwares)">
								<span class="badge badge-success">added</span>
								<span class="float-right">
									<b>from: </b>
									<a href="{{val.provenance.url}}" target="_blank" ng-if="val.provenance.url">{{val.provenance.repositoryName}}</a>
									<span ng-if="!val.provenance.url">{{val.provenance.repositoryName}}</span>
									<span ng-if="val.provenance.id">(ID: {{val.provenance.id}})</span>
								</span>
							</span>
							<ul class="small">
								<li ng-repeat="pid in d.pids"><b>{{pid.type}}:</b> {{pid.value}}</li>
							</ul>
						</span>
					</td>
				</tr>
			</table>
		</div>
		
		<div class="text-center">
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.currPage <= 0" disabled="disabled">&larr; Prev</button>
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.currPage > 0" ng-click="gotoPage(eventsPage.currPage - 1)">&larr; Prev</button>
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.totalPages <= eventsPage.currPage + 1" disabled="disabled">Next &rarr;</button>
			<button class="btn btn-sm btn-outline-primary" ng-if="eventsPage.currPage + 1 < eventsPage.totalPages" ng-click="gotoPage(eventsPage.currPage + 1)">Next &rarr;</button>
		</div>

	</div>
</div>

<div id="showAdvancedSearchModal" class="modal fade" tabindex="-1" role="dialog">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Advanced search</h4>
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body">
				<form>
					<div class="form-group row">
						<label class="control-label col-sm-4">Datasource</label>
						<div class="col-sm-8">
							<p class="form-control-static">{{eventsPage.datasource}}</p>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-4">Topic</label>
						<div class="col-sm-8">
							<p class="form-control-static">{{eventsPage.topic}}</p>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-4">Trust</label>
						<div class="col-sm-8">
							<rzslider 
								rz-slider-model="tempQuery.trust.min"
								rz-slider-high="tempQuery.trust.max" 
								rz-slider-options="{floor: 0, ceil: 1, step: 0.01, precision: 2, hideLimitLabels: true}"></rzslider>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-4">Title(s)</label>
						<div class="col-sm-8">
							<div class="input-group"  ng-repeat="t in tempQuery.titles track by $index" style="margin-bottom: 4px;">
								<input type="text" class="form-control input-sm" ng-model="tempQuery.titles[$index]" />
								<span class="input-group-btn">
									<button class="btn btn-sm btn-danger" ng-click="tempQuery.titles.splice($index, 1)">
										<i class="fas fa-minus"></i>
									</button>
								</span>
							</div>
							<button class="btn btn-sm btn-primary" ng-click="tempQuery.titles.push('')">add</button>														
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-4">Author(s)</label>
						<div class="col-sm-8">
							<div class="input-group"  ng-repeat="aut in tempQuery.authors track by $index" style="margin-bottom: 4px;">
								<input type="text" class="form-control input-sm" ng-model="tempQuery.authors[$index]" />
								<span class="input-group-btn">
									<button class="btn btn-sm btn-danger" ng-click="tempQuery.authors.splice($index, 1)">
										<i class="fas fa-minus"></i>
									</button>
								</span>
							</div>
							<button class="btn btn-sm btn-primary" ng-click="tempQuery.authors.push('')">add</button>														
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-4">Subject(s)</label>
						<div class="col-sm-8">
							<div class="input-group"  ng-repeat="s in tempQuery.subjects track by $index" style="margin-bottom: 4px;">
								<input type="text" class="form-control input-sm" ng-model="tempQuery.subjects[$index]" />
								<span class="input-group-btn">
									<button class="btn btn-sm btn-danger" ng-click="tempQuery.subjects.splice($index, 1)">
										<i class="fas fa-minus"></i>
									</button>
								</span>
							</div>
							<button class="btn btn-sm btn-primary" ng-click="tempQuery.subjects.push('')">add</button>														
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-4">Date(s)</label>
						<div class="col-sm-8">
							<div class="input-group"  ng-repeat="s in tempQuery.dates track by $index" style="margin-bottom: 4px;">
								<span class="input-group-addon">from</span>
								<input type="text" class="form-control input-sm" ng-model="tempQuery.dates[$index].min" placeholder="yyyy-MM-dd" />
								<span class="input-group-addon">to</span>
								<input type="text" class="form-control input-sm" ng-model="tempQuery.dates[$index].max" placeholder="yyyy-MM-dd" />
								<span class="input-group-btn">
									<button class="btn btn-sm btn-danger" ng-click="tempQuery.dates.splice($index, 1)">
										<i class="fas fa-minus"></i>
									</button>
								</span>
							</div>
							<button class="btn btn-sm btn-primary" ng-click="tempQuery.dates.push({from: '', to: ''})">add</button>
						</div>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="gotoEventsPageAdv(tempQuery)">Update</button>
			</div>
		</div>
	</div>
</div>

<div id="showCreateSubscriptionModal" class="modal fade" tabindex="-1" role="dialog">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Create subscription</h4>
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="modal-body small">
				<form name="newSubscriptionForm">
					<div class="form-group row" ng-class="{'text-danger' : !subscription.subscriber, 'text-success' : subscription.subscriber }">
						<label class="control-label col-sm-3">Email</label>
						<div class="col-sm-9">
							<p class="form-control-static">{{subscription.subscriber}}</p>
						</div>
					</div>
					<div class="form-group row" ng-class="{'text-danger' : !subscription.frequency, 'text-success' : subscription.frequency }">
						<label class="control-label col-sm-3">Frequency</label>
						<div class="col-sm-9">
							<select class="form-control form-control-sm" ng-model="subscription.frequency" required="required">
								<option>never</option>
								<option>daily</option>
								<option>weekly</option>
								<option>monthly</option>
								<option>realtime</option>
							</select>
						</div>
					</div>	
					<div class="form-group row" ng-class="{'text-danger' : !subscription.mode, 'text-success' : subscription.mode }">
						<label class="control-label col-sm-3">Mode</label>
						<div class="col-sm-9">
							<select class="form-control form-control-sm" ng-model="subscription.mode" required="required">
								<option>MOCK</option>
								<option>EMAIL</option>
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-sm-3">Query</label>
						<div class="col-sm-9">
							<pre>{{subscription.query | json: 4}}</pre>
						</div>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-primary" data-dismiss="modal" ng-disabled="newSubscriptionForm.$invalid" ng-click="createSubscription()">Save</button>
			</div>
		</div>
	</div>
</div>

<back-top><i class="fas fa-chevron-up"></i> top</back-top>
