Commit c4c06444 authored by Laurent Wouters's avatar Laurent Wouters
Browse files

Implementing the views for the conferences

parent 3f58f86237c2
......@@ -36,7 +36,7 @@
{
"identifier": "::Logilab::Conference",
"name": "Logilab: Conference View",
"description": "Renders a conference from a (possibly FoaF) dataset",
"description": "Renders a conference from a dataset",
"entrypoint": "VIEW_CONFERENCE_ENTRYPOINT",
"resourceCss": [
{
......@@ -49,5 +49,39 @@
"location": "remote",
"uri": "http://localhost:8080/view_conference.js"
}
},
{
"identifier": "::Logilab::ConferenceTrack",
"name": "Logilab: Conference Track View",
"description": "Renders a conference track from a dataset",
"entrypoint": "VIEW_TRACK_ENTRYPOINT",
"resourceCss": [
{
"location": "remote",
"uri": "https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
}
],
"resourceJs": [],
"resourceMain": {
"location": "remote",
"uri": "http://localhost:8080/view_track.js"
}
},
{
"identifier": "::Logilab::ConferenceTalk",
"name": "Logilab: Conference Talk View",
"description": "Renders a conference talk from a dataset",
"entrypoint": "VIEW_TALK_ENTRYPOINT",
"resourceCss": [
{
"location": "remote",
"uri": "https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
}
],
"resourceJs": [],
"resourceMain": {
"location": "remote",
"uri": "http://localhost:8080/view_talk.js"
}
}
]
<template>
<div>
<h1>
{{talk.title}}
<span v-if="talk.__warnings['title'] != undefined" style="color: yellow; font-size: 8pt;" :title="talk.__warnings['title']">
&#x26A0;
</span>
</h1>
<table class="table table-bordered table-hover">
<tbody>
<tr>
<td><b>Abstract</b></td>
<td>
{{talk.abstract}}
<span v-if="talk.__warnings['abstract'] != undefined" style="color: yellow; font-size: 8pt;" :title="talk.__warnings['abstract']">
&#x26A0;
</span>
</td>
</tr>
<tr>
<td><b>Authors</b></td>
<td>
<div v-for="author in talk.authors" v-bind:key="author.__resource.uri" class="card">
<div className="card-body">
<span>Author: </span>
<a v-on:click="(event) => {event.preventDefault(); context.event.onRequestNavigateTo(author.__resource);}" :href=author.__resource.uri>{{author.__resource.uri}}</a>
</div>
</div>
</td>
</tr>
<tr>
<td><b>Part of</b></td>
<td>
<div v-for="parent in talk.trackOrConferences" v-bind:key="parent.__resource.uri" class="card">
<div className="card-body">
<span>EVent: </span>
<a v-on:click="(event) => {event.preventDefault(); context.event.onRequestNavigateTo(parent.__resource);}" :href=parent.__resource.uri>{{parent.title != null ? parent.title : parent.__resource.uri}}</a>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<hr/>
<div class="row" style="color: darkgrey; font-size: 8pt; margin-top: 15pt;">
<span>Root: {{context.root}}</span>
<span style="margin-left: 10pt;">
Selected language:
<span v-if="context.options[context.root.uri].language != null || context.options[context.root.uri].language ==''">{{context.options[context.root.uri].language.name}}</span>
<span v-else>=&gt;</span>
</span>
<span style="margin-left: 10pt;">
Browser language:
<span v-if="context.browserLanguage != null">{{context.browserLanguage.name}}</span>
<span v-else>=&gt;</span>
</span>
</div>
</div>
</template>
<script>
export default {
props: ["context", "talk"]
};
</script>
<style>
.view-header {
width: 75%;
margin-left: 12.5%;
margin-top: 2vh;
margin-bottom: 2vh;
}
</style>
\ No newline at end of file
/*******************************************************************************
* Copyright 2003-2018 LOGILAB S.A. (Paris, FRANCE), all rights reserved.
* contact http://www.logilab.fr/ -- mailto:contact@logilab.fr
*
* This file is part of CubicWeb.
*
* CubicWeb is free software: you can redistribute it and/or modify it under the
* terms of the GNU Lesser General Public License as published by the Free
* Software Foundation, either version 2.1 of the License, or (at your option)
* any later version.
*
* CubicWeb is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
* FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
* details.
*
* You should have received a copy of the GNU Lesser General Public License along
* with CubicWeb. If not, see <http://www.gnu.org/licenses/>.
******************************************************************************/
import {
application,
definition,
implementation,
rdfEntities
} from "@logilab/libview";
import * as $rdf from "rdflib";
import Vue from "vue";
/// <reference path="../common/vue.d.ts" />
import TalkImpl from "./TalkImpl.vue";
import { ONTOLOGY, loadTalk, Track, Conference } from "../common/schema";
/**
* The descritptor for the default Dbpedia Talk view
*/
const DESCRIPTOR_TALK: definition.ViewDescriptor = {
identifier: "::Logilab::Talk",
name: "Logilab: Talk View",
description: "Renders a talk from a dataset",
entrypoint: "VIEW_TALK_ENTRYPOINT",
resourceCss: [
{
location: "remote",
uri:
"https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
} as definition.ViewResourceRemote
],
resourceJs: [],
resourceMain: {
location: "remote",
uri: "http://localhost:8080/view_talk.js"
} as definition.ViewResourceRemote
};
class TalkRendering implements implementation.ViewImplementation {
descriptor: definition.ViewDescriptor;
constructor() {
this.descriptor = DESCRIPTOR_TALK;
this.priorityFor = this.priorityFor.bind(this);
this.render = this.render.bind(this);
}
priorityFor(store: $rdf.Formula, target: application.Resource): number {
if (target == null || target == undefined) return -1;
let repo = new rdfEntities.RdfEntityStore(
store,
ONTOLOGY.aliases,
ONTOLOGY.inverses
);
let entity = repo.entityForUri(target.uri);
let focus = entity.getEntityForS("http://xmlns.com/foaf/0.1/focus");
if (focus != null) entity = focus;
let entityTypes = entity.getEntitiesForS(
"http://www.w3.org/1999/02/22-rdf-syntax-ns#type"
);
if (entityTypes.length > 0) {
let x = entityTypes.find(
(entity: rdfEntities.RdfEntity) =>
entity.uris.indexOf(
"http://data.semanticweb.org/ns/swc/ontology#TalkEvent"
) >= 0
);
if (x != null && x != undefined)
// The entity is a Talk
return 10;
}
return implementation.VIEW_PRIORITY_INAPPROPRIATE;
}
render(
renderer: application.ViewRenderer,
context: application.RenderingContext,
target: application.Resource
): application.ViewRendering {
let talk = loadTalk(renderer, context, target);
let externals = talk.trackOrConferences.map((item: Track | Conference) =>
application.cloneResource(item.__resource)
);
let errors: string[] = [];
let previous = Vue.config.errorHandler;
Vue.config.errorHandler = function(err, vm, info) {
errors.push(err.message);
};
let vm = new Vue({
data: {
descriptor: this.descriptor,
talk: talk
},
components: { TalkImpl },
render: function(createElement) {
return createElement(
"TalkImpl",
{
props: {
context: context,
talk: talk
}
},
[]
);
}
});
let result = document.createElement("div");
vm.$mount(result);
vm.$forceUpdate();
Vue.config.errorHandler = previous;
if (errors.length > 0) throw errors[0];
return {
dom: vm.$el,
viewId: this.descriptor.identifier,
suggestedResources: externals
};
}
}
/**
* Export the view
*/
export const VIEW_TALK_ENTRYPOINT: TalkRendering = new TalkRendering();
<template>
<div>
<h1>
{{track.title}}
<span v-if="track.__warnings['title'] != undefined" style="color: yellow; font-size: 8pt;" :title="track.__warnings['title']">
&#x26A0;
</span>
</h1>
<table class="table table-bordered table-hover">
<tbody>
<tr>
<td><b>Talks</b></td>
<td>
<div v-for="talk in track.talks" v-bind:key="talk.__resource.uri" class="card">
<div className="card-body">
<span>Talk: </span>
<a v-on:click="(event) => {event.preventDefault(); context.event.onRequestNavigateTo(talk.__resource);}" :href=talk.__resource.uri>{{talk.title != null ? talk.title : talk.__resource.uri}}</a>
</div>
</div>
</td>
</tr>
<tr>
<td><b>Parent conference</b></td>
<td>
<div v-for="conference in track.conferences" v-bind:key="conference.__resource.uri" class="card">
<div className="card-body">
<span>Conference: </span>
<a v-on:click="(event) => {event.preventDefault(); context.event.onRequestNavigateTo(conference.__resource);}" :href=conference.__resource.uri>{{conference.title != null ? conference.title : conference.__resource.uri}}</a>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<hr/>
<div class="row" style="color: darkgrey; font-size: 8pt; margin-top: 15pt;">
<span>Root: {{context.root}}</span>
<span style="margin-left: 10pt;">
Selected language:
<span v-if="context.options[context.root.uri].language != null || context.options[context.root.uri].language ==''">{{context.options[context.root.uri].language.name}}</span>
<span v-else>=&gt;</span>
</span>
<span style="margin-left: 10pt;">
Browser language:
<span v-if="context.browserLanguage != null">{{context.browserLanguage.name}}</span>
<span v-else>=&gt;</span>
</span>
</div>
</div>
</template>
<script>
export default {
props: ["context", "track"]
};
</script>
<style>
.view-header {
width: 75%;
margin-left: 12.5%;
margin-top: 2vh;
margin-bottom: 2vh;
}
</style>
\ No newline at end of file
/*******************************************************************************
* Copyright 2003-2018 LOGILAB S.A. (Paris, FRANCE), all rights reserved.
* contact http://www.logilab.fr/ -- mailto:contact@logilab.fr
*
* This file is part of CubicWeb.
*
* CubicWeb is free software: you can redistribute it and/or modify it under the
* terms of the GNU Lesser General Public License as published by the Free
* Software Foundation, either version 2.1 of the License, or (at your option)
* any later version.
*
* CubicWeb is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
* FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
* details.
*
* You should have received a copy of the GNU Lesser General Public License along
* with CubicWeb. If not, see <http://www.gnu.org/licenses/>.
******************************************************************************/
import {
application,
definition,
implementation,
rdfEntities
} from "@logilab/libview";
import * as $rdf from "rdflib";
import Vue from "vue";
/// <reference path="../common/vue.d.ts" />
import TrackImpl from "./TrackImpl.vue";
import { ONTOLOGY, loadTrack, Track, Talk, Conference } from "../common/schema";
/**
* The descritptor for the default Dbpedia Track view
*/
const DESCRIPTOR_TRACK: definition.ViewDescriptor = {
identifier: "::Logilab::Track",
name: "Logilab: Track View",
description: "Renders a track from a dataset",
entrypoint: "VIEW_TRACK_ENTRYPOINT",
resourceCss: [
{
location: "remote",
uri:
"https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
} as definition.ViewResourceRemote
],
resourceJs: [],
resourceMain: {
location: "remote",
uri: "http://localhost:8080/view_track.js"
} as definition.ViewResourceRemote
};
class TrackRendering implements implementation.ViewImplementation {
descriptor: definition.ViewDescriptor;
constructor() {
this.descriptor = DESCRIPTOR_TRACK;
this.priorityFor = this.priorityFor.bind(this);
this.render = this.render.bind(this);
}
priorityFor(store: $rdf.Formula, target: application.Resource): number {
if (target == null || target == undefined) return -1;
let repo = new rdfEntities.RdfEntityStore(
store,
ONTOLOGY.aliases,
ONTOLOGY.inverses
);
let entity = repo.entityForUri(target.uri);
let focus = entity.getEntityForS("http://xmlns.com/foaf/0.1/focus");
if (focus != null) entity = focus;
let entityTypes = entity.getEntitiesForS(
"http://www.w3.org/1999/02/22-rdf-syntax-ns#type"
);
if (entityTypes.length > 0) {
let x = entityTypes.find(
(entity: rdfEntities.RdfEntity) =>
entity.uris.indexOf(
"http://data.semanticweb.org/ns/swc/ontology#TrackEvent"
) >= 0
);
if (x != null && x != undefined)
// The entity is a Track
return 10;
}
return implementation.VIEW_PRIORITY_INAPPROPRIATE;
}
render(
renderer: application.ViewRenderer,
context: application.RenderingContext,
target: application.Resource
): application.ViewRendering {
let track = loadTrack(renderer, context, target);
let externals = track.talks
.map((talk: Talk) => application.cloneResource(talk.__resource))
.concat(
track.conferences.map((conference: Conference) =>
application.cloneResource(conference.__resource)
)
);
let errors: string[] = [];
let previous = Vue.config.errorHandler;
Vue.config.errorHandler = function(err, vm, info) {
errors.push(err.message);
};
let vm = new Vue({
data: {
descriptor: this.descriptor,
track: track
},
components: { TrackImpl },
render: function(createElement) {
return createElement(
"TrackImpl",
{
props: {
context: context,
track: track
}
},
[]
);
}
});
let result = document.createElement("div");
vm.$mount(result);
vm.$forceUpdate();
Vue.config.errorHandler = previous;
if (errors.length > 0) throw errors[0];
return {
dom: vm.$el,
viewId: this.descriptor.identifier,
suggestedResources: externals
};
}
}
/**
* Export the view
*/
export const VIEW_TRACK_ENTRYPOINT: TrackRendering = new TrackRendering();
......@@ -8,7 +8,9 @@ module.exports = [
entry: {
person: "./src/person/person.ts",
book: "./src/book/book.ts",
conference: "./src/conference/conference.ts"
conference: "./src/conference/conference.ts",
track: "./src/track/track.ts",
talk: "./src/talk/talk.ts"
},
mode: isProd ? "production" : "development",
output: {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment