VIE² - Vienna IKS Editable Entities

VIE² is the semantic enrichment layer on top of VIE and enables web developers to support an interactive usage of semantic information.

Main functionality

VIE² is written in Javascript and can be embedded into any HTML page. It is targeted to be used by web developers who want to support interactive usage of semantic knowledge. Thereby, VIE² offers the automatic as well as manual annotation of entities and their properties.

Example

Initialization

VIE² depends on several Javascript libraries, namely: jQuery, jQuery UI, rdfQuery, backbone JS, underscore JS and VIE.

<!-- 3rd-party libs -->
<script type="text/javascript" src=".../jquery-1.4.4.min.js"></script>
<script type="text/javascript" src=".../jquery-ui-1.8.11.custom.min.js"></script>
<script type="text/javascript" src=".../jquery.rdfquery.rules.js"></script>
<script type="text/javascript" src=".../underscore.js"></script>
<script type="text/javascript" src=".../backbone.js"></script>
<script type="text/javascript" src=".../vie.js"></script>

The core library of VIE² can be loaded like this:

<!-- VIE^2 -->
<script type="text/javascript" src="../dist/vie2-latest.js"></script>

In addition, we can install several connectors that are able to access backend services which offer functionalities for semantic lifting, querying for information and serialization.

<!-- Connector plug-ins -->
<script type="text/javascript" src="../src/connector/stanbol.js"></script>
<script type="text/javascript" src="../src/connector/dbpedia.js"></script>
<script type="text/javascript" src="../src/connector/rdfa.js"></script>

For each mapping that is loaded, a special type of backbone collection is registered and automatically filled with information if a matching entity is found.

<!-- Mapping plug-ins -->
<script type="text/javascript" src="../src/mapping/person.js"></script>
<script type="text/javascript" src="../src/mapping/task.js"></script>

Analysis of data

Each HTML element can be analyzed with the help of VIE² and it's registered connectors. Each connector that implements the analyze() method is automatically queried using the following command:

var elem = $('#test');
elem.vie2().vie2('analyze', callback, options);

Dependent on the implementation of the connector, the element is analyzed and for each registered mapping that matches the types of the found entities, a backbone JS model is registered and filled with default properties that are specified in the corresponding mapping.

Manual annotation

Manual annotation of entities (following the CRUD scheme) is available through the backbone JS model API.

Adding an entity

Adding a new entity of, e.g., a person with the name 'Mr. Unknown', can be achieved like shown. An id needs to follow the Turtule notation and if no id is provided, a blank one is initiated by default.

var model = VIE2.createEntity({
   id: '<http://demo.de/TestPerson>',
   a: 'foaf:Person',
   'foaf:name': "\"Mr. Unknown\""
});

Each entity that is instantiated, VIE² will traverse all registered connectors and call VIE2.Connector.query() if they can provide information about type-specific properties, that are defined in a mapping's default properties array (i.e., for a person this is defined as ['rdfs:label', 'foaf:name', 'foaf:page', 'foaf:depiction']).

Removing an entity

VIE2.entities.remove(VIE.EntityManager.getBySubject(subject));

Add a value to an entities' property

var prop = 'foaf:name';
var model = VIE.EntityManager.getBySubject(subject);
var inst = VIE2.createLiteral(newName, {lang: 'en'});
model.get(prop).add(inst);

Update a value of an entities' property

var prop = 'foaf:name';
var model = VIE.EntityManager.getBySubject(subject);
var oldValueModel = model.get(prop).getByValue(from);
oldValueModel.set({
   value: to
});

Remove a value from an entities' property

var prop = 'foaf:name';
var model = VIE.EntityManager.getBySubject(subject);
var values = model.get(prop);
var value = values.getByValue(name);
values.remove(value);

Serialization into RDFa

var model = VIE.EntityManager.getBySubject(subject);
var name = model.get('foaf:name').at(0);
VIE2.serialize(model, { //note: if we pass the entity-model, the RDFa serializer only adds 'id' & 'a'
     elem: elem,
     connectors: ['rdfa']
});
VIE2.serialize(name, { //note: passing the object-model starts the serialization of the literal
     elem: $('.name', elem),
     connectors: ['rdfa']
});

Developing your own connector

Developing an own connector is fairly easy. If you instatiate a connector, it will automatically be registered within VIE². You might want to add connector-specific namespaces to the connector that are automatically registered as well.

new VIE2.Connector('dbpedia', {
   namespaces: {
       owl : "http://www.w3.org/2002/07/owl#",
       yago: "http://dbpedia.org/class/yago/"
   }
});

A connector has two main functionalities:

• The query for properties:

  VIE2.Connector.query = function (uri, properties, callback);

Overwriting this function should return an object using the callback method, where the keys are the properties that we want to retrieve information whereas the corresponding value is an array of one of the following types: jQuery.rdf.resource, jQuery.rdf.blank_, jQuery.rdf.literal

• The semantic lifting of an HTML element's content:

  VIE2.Connector.analyze = function (object, options);

Overwriting this function should return an jQuery.rdf object. This object needs to be passed via the callback in options.success.

Providing a mapping

A mapping provides a mapping from the ontological instances of entities to backbone models and collections. For each registered mapping, a backbone collection is allocated and can be accessed through the VIE2.mappings object.

new VIE2.Mapping (
   'person',  //the id of the mapping 
   ['foaf:Person', 'opencalais:Person'],  //a list of all types that fall into this category
   ['rdfs:label', 'foaf:name', 'foaf:depiction'], //a list of default properties
   {// optional options
       namespaces: { //the used namespaces, these can be given here, or placed directly into the HTML document's xmlns attribute.
           'rdfs'   : 'http://www.w3.org/2000/01/rdf-schema#',
           'foaf'   : 'http://xmlns.com/foaf/0.1/',
           'opencalais' : 'http://s.opencalais.com/1/type/em/e/'
       }
   }
);

Using a proxy

As the VIE² library needs to query other systems and services, you might encounter the well-known Cross-domain policy problem.

VIE² provides some proxy implementations that hopefully give you a first start to circumvent this issue. Here is an example of the usage of the PHP proxy for the dbPedia connector:

VIE2.connectors['dbpedia'].options({
   "proxy_url" : "../utils/proxy/proxy.php"
});