Skip to content
Konrad Abicht edited this page Sep 18, 2013 · 7 revisions

The following introductions are focused on Linux users. If you use a different OS please adapt the commands. Well, lets start setup the environment.

Using Virtuoso backend

If you need to access the data store itself and you are using Virtuoso, just open http://localhost:8890, whereby 8890 is the standard port to access Virtuoso conductor.

Sometimes its necessary to install the conductor by yourself:

sudo apt-get install virtuoso-vad-conductor

TypeScript and the user interface

CubeViz's frontend is written in TypeScript, but compiled to one JavaScript file later on. One reason was the improved usability of the code itself, enabling real object oriented programming etc. pp. Do not worry, JavaScript is a subset of TypeScript and every JavaScript program is a valid TypeScript program too.

There is a folder called typescript. Here are all the TypeScript related content. in the following a description of its content:

  • Makefile - Small make file containing helpful commands to setup and compile TypeScript files
  • declaration - Contains declaration files for libraries CubeViz uses.
  • src - The heart of the user interface. Here is program logic as well as user interface related code located.
  • tsc - Files used as parameter for the TypeScript compiler to say him what TypeScript files he has to compile in one JavaScript file.

Install TypeScript

Use your terminal and switch to your CubeViz folder and than to the typescript one. After that execute the following command in it:

make install-typescript

It will install node.js and the TypeScript compiler. Node.js is necessary because the TypeScript compiler is one of its modules.

Compile changed TypeScript files

You changed some file in the src folder and want to see how it looks, than execute the following command in the typescript folder:

make build-javascript

That will compiles all files which are located in the src folder. Sorry, but you always have to execute this command after you changed something.

Add further TypeScript files

Usually its not required to add further TypeScript files. But you can add your own files to one of the files located in the tsc folder. There are two files:

  • Main.txt - It contains references to all files necessary for the user interface to work properly. Referenced files are only from:
    • typescript/src/ Model
    • typescript/src/ View
  • Test.txt - For test purpose only. It contains a couple of test cases for the user interface to execute directly in the browser using console.

Folder purposes

Model Folder

It contains the business logic of CubeViz. It is divided into the folder CubeViz and DataCube, both providing different types of functions.

CubeViz folder contains classes to setup and run the application itself. Here is a list of the most important parts:

  • View and Application related classes, but not the views itself
  • Setup and run Visualizations using foreign libraries such as HighCharts
  • some classes providing helpful tools

DataCube folder contains elements which represent elements of the DataCube vocabulary. Each class contains functionality to interact with the PHP-backend using AJAX.

View folder

It contains the views which represents certain parts of the user interface. It is divided into four folders, each groups views for a certain user interface area.

  • CompareAction - User interface to compare and merge data sets
  • DataselectionModule - Left sidebar, according to it there is the DataselectionModule.php in the root folder
  • IndexAction - Contains all views to build the exploration and visualization area

Set context in doap.n3

Your local doap.n3 contains the configuration for your CubeViz installation. As default, it contains the following line:

:context "production"^^xsd:string ;

The syntax of the file is Notation3. This line says that CubeViz runs in the production context. Which means, that there is NO console output and a couple of other things. In a nutshell: CubeViz hidse as much as possible of the problems and warnings that may appear while using it.

But as a developer you want to know such things. So, change the line to this one:

:context "development"^^xsd:string ;

After reloading the page in your browser, you should see console output. It may looks something like this (in Chrome):

cubeVizApp._:
Object {data: Object, ui: Object, backend: Object}

Its the application object for CubeViz and contains everything to make it run. For more information about this have a look here.

MVC related information (PHP, Zend)

Because CubeViz is an extension of OntoWiki, the whole backend is written in PHP, using Zend Framework (1.x).

Related files are