Commit 2b9812d4 authored by Élodie Thiéblin's avatar Élodie Thiéblin
Browse files

Initial commit

Clone previous repository
parents
This diff is collapsed.
{
"name": "@logilab/views-logilab",
"version": "0.4.0",
"description": "Experimental implementation of a set of views for the linked-data borwser.",
"scripts": {
"clean": "rm -rf build",
"format": "tsfmt -r",
"build": "tsfmt --verify && tslint -p . -c tslint.json 'src/**/*.ts*' && webpack",
"build:production": "NODE_ENV=production tsfmt --verify && tslint -p . -c tslint.json 'src/**/*.ts*' && webpack",
"test": "mocha --reporter spec --require ts-node/register src/**/*.test.ts",
"linter": "tslint -p . -c tslint.json 'src/**/*.ts*' --fix",
"serve": "webpack && webpack-dev-server"
},
"main": "./build/index.js",
"types": "./build/lib/index.d.ts",
"repository": {
"type": "hg",
"url": "https://bitbucket.org/laurentw/logilab-cubicweb-client"
},
"keywords": [
"DataBrowser",
"Typescript"
],
"author": "LOGILAB <contact@logilab.fr>",
"license": "LGPL-3.0",
"dependencies": {
"@logilab/libview": "file:../libview",
"vue": "^2.5.16"
},
"devDependencies": {
"@types/chai": "^4.1.7",
"@types/mocha": "^5.2.5",
"@types/rdflib": "^0.17.0",
"ajv": "^6.5.2",
"chai": "^4.2.0",
"copy-webpack-plugin": "^4.5.2",
"css-loader": "^1.0.0",
"mocha": "^5.2.0",
"source-map-loader": "^0.2.3",
"tslint": "^5.11.0",
"ts-loader": "^4.4.2",
"ts-node": "^7.0.1",
"typescript": "^2.9.2",
"typescript-formatter": "^7.2.2",
"vue-loader": "^15.2.6",
"vue-template-compiler": "^2.5.16",
"webpack": "^4.20.2",
"webpack-cli": "^3.1.1",
"webpack-dev-server": "^3.0.0"
}
}
<template>
<div>
<div class="container">
<div class="row">
<div class="col-sm-12">
<h1>
{{blogpost.title}}
</h1>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: ["context", "blogpost"]
};
</script>
/*******************************************************************************
* 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 BlogPostImpl from "./BlogPostImpl.vue";
import { loadBlogPost, BlogPost, ONTOLOGY } from "../common/schema";
/**
* The descriptor for the default blog post view
*/
const DESCRIPTOR_BLOGPOST: definition.ViewDescriptor = {
identifier: "::Logilab::BlogPost",
name: "Logilab: Blog Post View",
description: "Renders a blog post",
entrypoint: "VIEW_BLOGPOST_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_blogpost.js"
} as definition.ViewResourceRemote
};
class BlogPostRendering implements implementation.ViewImplementation {
descriptor: definition.ViewDescriptor;
constructor() {
this.descriptor = DESCRIPTOR_BLOGPOST;
this.priorityFor = this.priorityFor.bind(this);
this.render = this.render.bind(this);
}
priorityFor(store: $rdf.Formula, target: application.Resource): number {
let repo = new rdfEntities.RdfEntityStore(
store,
ONTOLOGY.aliases,
ONTOLOGY.inverses
);
let entity = repo.entityForUri(target.uri);
let entityTypes = entity.getEntitiesForS(
"http://www.w3.org/1999/02/22-rdf-syntax-ns#type"
);
console.log("BLOGPOST : ", entity, entityTypes);
if (entityTypes.length > 0) {
let x = entityTypes.find(
(entity: rdfEntities.RdfEntity) =>
entity.uris.indexOf(
"http://ns.cubicweb.org/cubicweb/0.0/BlogEntry"
) >= 0
);
if (x) {
// The entity is a BlogPost
console.log("is A blogpost!");
return 10;
}
}
return implementation.VIEW_PRIORITY_INAPPROPRIATE;
}
render(
renderer: application.ViewRenderer,
context: application.RenderingContext,
target: application.Resource
): implementation.ViewRendering {
let blogpost = loadBlogPost(renderer, context, target);
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,
blogpost
},
components: { BlogPostImpl },
render: function(createElement) {
return createElement(
"BlogPostImpl",
{
props: {
context: context,
blogpost
}
},
[]
);
}
});
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,
suggestedResources: []
};
}
}
/**
* Export the view
*/
export const VIEW_BLOGPOST_ENTRYPOINT: BlogPostRendering = new BlogPostRendering();
<template>
<div>
<h1>
{{book.title}}
<span v-if="book.__warnings['title'] != undefined" style="color: yellow; font-size: 8pt;" :title="book.__warnings['title']">
&#x26A0;
</span>
</h1>
<table class="table table-bordered table-hover">
<tbody>
<tr>
<td><b>Authors</b></td>
<td>
<div v-for="person in book.authors" v-bind:key="person.__resource.uri" class="card">
<div className="card-body">
<span>Author: </span>
<a v-on:click="(event) => {event.preventDefault(); context.event.onRequestNavigateTo(person.__resource);}" :href=person.__resource.uri>{{person.name != null ? person.name : person.__resource.uri}}</a>
</div>
</div>
</td>
</tr>
<tr>
<td><b>Publisher</b></td>
<td>
{{book.publisher}}
<span v-if="book.__warnings['publisher'] != undefined" style="color: yellow; font-size: 8pt;" :title="book.__warnings['publisher']">
&#x26A0;
</span>
</td>
</tr>
<tr>
<td><b>Release date</b></td>
<td>
{{book.releaseDate}}
<span v-if="book.__warnings['releaseDate'] != undefined" style="color: yellow; font-size: 8pt;" :title="book.__warnings['releaseDate']">
&#x26A0;
</span>
</td>
</tr>
<tr>
<td><b>Abstract</b></td>
<td>
{{book.abstract}}
<span v-if="book.__warnings['abstract'] != undefined" style="color: yellow; font-size: 8pt;" :title="book.__warnings['abstract']">
&#x26A0;
</span>
</td>
</tr>
<tr>
<td><b>Comment</b></td>
<td>
{{book.comment}}
<span v-if="book.__warnings['comment'] != undefined" style="color: yellow; font-size: 8pt;" :title="book.__warnings['comment']">
&#x26A0;
</span>
</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", "book"]
};
</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 BookImpl from "./BookImpl.vue";
import { ONTOLOGY, loadBook, Person } from "../common/schema";
/**
* The descritptor for the default book view
*/
const DESCRIPTOR_BOOK: definition.ViewDescriptor = {
identifier: "::Logilab::Book",
name: "Logilab: Book View",
description: "Renders a book from a dataset",
entrypoint: "VIEW_BOOK_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_book.js"
} as definition.ViewResourceRemote
};
class BookRendering implements implementation.ViewImplementation {
descriptor: definition.ViewDescriptor;
constructor() {
this.descriptor = DESCRIPTOR_BOOK;
this.priorityFor = this.priorityFor.bind(this);
this.render = this.render.bind(this);
}
priorityFor(store: $rdf.Formula, target: application.Resource): number {
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://purl.org/ontology/bibo/Book") >= 0
);
if (x) {
// The entity is a Book
return 10;
}
}
return implementation.VIEW_PRIORITY_INAPPROPRIATE;
}
render(
renderer: application.ViewRenderer,
context: application.RenderingContext,
target: application.Resource
): implementation.ViewRendering {
let book = loadBook(renderer, context, target);
let externals = book.authors.map((person: Person) =>
application.cloneResource(person.__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,
book: book
},
components: { BookImpl },
render: function(createElement) {
return createElement(
"BookImpl",
{
props: {
context: context,
book: book
}
},
[]
);
}
});
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,
suggestedResources: externals
};
}
}
/**
* Export the view
*/
export const VIEW_BOOK_ENTRYPOINT: BookRendering = new BookRendering();
/*******************************************************************************
* 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, rdfMeta } from "@logilab/libview";
/**
* The main ontology for the views
*/
export const ONTOLOGY: rdfMeta.Ontology = {
aliases: [
[
"http://xmlns.com/foaf/0.1/Person",
"http://dbpedia.org/ontology/Person",
"http://purl.org/dc/terms/Agent"
],
["http://xmlns.com/foaf/0.1/title"],
["http://xmlns.com/foaf/0.1/gender"],
["http://xmlns.com/foaf/0.1/nick"],
[
"http://xmlns.com/foaf/0.1/name",
"http://www.w3.org/2000/01/rdf-schema#label"
],
[
"http://xmlns.com/foaf/0.1/firstName",
"http://xmlns.com/foaf/0.1/givenName",
"http://xmlns.com/foaf/0.1/givenName"
],
[
"http://xmlns.com/foaf/0.1/lastName",
"http://xmlns.com/foaf/0.1/familyName"
],
["http://xmlns.com/foaf/0.1/phone"],
[
"http://xmlns.com/foaf/0.1/homepage",
"http://dbpedia.org/ontology/wikiPageExternalLink",
"http://xmlns.com/foaf/0.1/isPrimaryTopicOf"
],
["http://xmlns.com/foaf/0.1/weblog"],
["http://xmlns.com/foaf/0.1/openid"],
[
"http://xmlns.com/foaf/0.1/made",
"http://dbpedia.org/ontology/soundRecording"
],
["http://xmlns.com/foaf/0.1/maker"],
["http://xmlns.com/foaf/0.1/img", "http://xmlns.com/foaf/0.1/depiction"],
[
"http://xmlns.com/foaf/0.1/thumbnail",
"http://dbpedia.org/ontology/thumbnail"
],
["http://xmlns.com/foaf/0.1/knows"],
["http://xmlns.com/foaf/0.1/interest"],
["http://xmlns.com/foaf/0.1/topic_interest"],
["http://xmlns.com/foaf/0.1/publications"],
["http://xmlns.com/foaf/0.1/currentProject"],
["http://xmlns.com/foaf/0.1/birthday"],
["http://xmlns.com/foaf/0.1/age"],
["http://xmlns.com/foaf/0.1/status"],
[
"http://rdvocab.info/ElementsGr2/biographicalInformation",
"http://www.w3.org/2000/01/rdf-schema#comment",
"http://purl.org/dc/terms/abstract",
"http://dbpedia.org/ontology/abstract"
],
["http://dbpedia.org/ontology/birthDate", "http://vocab.org/bio/0.1/birth"],
["http://dbpedia.org/ontology/birthPlace"],
["http://dbpedia.org/ontology/deathDate", "http://vocab.org/bio/0.1/death"],
["http://dbpedia.org/ontology/deathPlace"],
["http://dbpedia.org/ontology/influenced"],
["http://dbpedia.org/ontology/influencedBy"],
[
"http://dbpedia.org/ontology/notableWork",
"http://data.bnf.fr/vocabulary/roles/r70",
"http://id.loc.gov/vocabulary/relators/aut",
"http://purl.org/dc/terms/contributor"
],
[
"http://purl.org/dc/terms/creator",
"http://purl.org/dc/terms/contributor",
"http://dbpedia.org/ontology/author",
"http://dbpedia.org/ontology/writer",
"http://dbpedia.org/ontology/composer",
"http://dbpedia.org/ontology/musicComposer",
"http://id.loc.gov/vocabulary/relators/aut"
],
[
"http://purl.org/ontology/bibo/Book",
"http://schema.org/Book",
"http://umbel.org/umbel/rc/Book_CW",
"http://dbpedia.org/ontology/Book",
"http://dbpedia.org/ontology/WrittenWork"
],
[
"http://www.w3.org/2000/01/rdf-schema#label",
"http://dbpedia.org/property/title",
"http://dbpedia.org/property/name"
],
["http://dbpedia.org/ontology/abstract"],
["http://www.w3.org/2000/01/rdf-schema#comment"],
[
"http://dbpedia.org/ontology/publisher",
"http://purl.org/dc/elements/1.1/publisher"
],
["http://dbpedia.org/property/releaseDate"],
["http://data.semanticweb.org/ns/swc/ontology#ConferenceEvent"],
["http://data.semanticweb.org/ns/swc/ontology#TrackEvent"],
["http://data.semanticweb.org/ns/swc/ontology#TalkEvent"],
["http://data.semanticweb.org/ns/swc/ontology#hasAcronym"],
["http://swrc.ontoware.org/ontology#isSuperEventOf"],
["http://data.semanticweb.org/ns/swc/ontology#isPartOf"],
["http://swrc.ontoware.org/ontology#abstract"],
["http://swrc.ontoware.org/ontology#author"],
["http://data.semanticweb.org/ns/swc/ontology#hasRelatedDocument"],
["http://purl.org/dc/elements/1.1/title"],
["http://www.w3.org/2002/12/cal/ical#dtstart"],
["http://www.w3.org/2002/12/cal/ical#date"],
["http://www.w3.org/2002/12/cal/ical#dtend"],
["http://www.w3.org/2002/12/cal/ical#url"]
],
inverses: {
"http://dbpedia.org/ontology/influenced":
"http://dbpedia.org/ontology/influencedBy",
"http://dbpedia.org/ontology/notableWork":
"http://purl.org/dc/terms/creator"
}
};
/**
* The data for a blog
*/
export interface Weblog extends rdfMeta.Loadable {
description: string;
title: string;
containerOf: BlogPost[];
hasCreator: Person;
}
/**
* The data for a blog post
*/
export interface BlogPost extends rdfMeta.Loadable {
date: string;
modified: string;
title: string;
container: Weblog;
content: string;
hasCreator: Person;
}
/**
* The data for a person
*/
export interface Person extends rdfMeta.Loadable {
title: string;
gender: string;
nickname: string;
name: string;
firstName: string;
lastName: string;