The VIOS Reference Implementation

For a description of the VIOS Network project, please see the VIOS Network article.

This document describes the principles of the VIOS App DARYL concept, and makes use of the reference implementation (PoC).


The Data Relationships and YASGUI Lister (DARYL) is a reference implementation of the linked data browser concept used by VIOS Network. The DARYL features innovations introduced in several linked data browsers, including:


The reference implementation uses JQuery and HTML5 and queries the Virtuoso Faceted Browsing service (i.e., the /fct/service Virtuoso endpoint).


VIOS App is a semantic web client and server, which means a vocabulary developed by the scientific community describes the features of this product. For example, things in VIOS Network have properties, and properties have values. These concepts were originally developed for use in the field of mathematics, and were later applied in the domain of computer programming, where data needed to be assigned to variables. When attempting to introduce these concepts to non-technical users, it is important to draw analogies to things with which they are already familiar. Most people have filled a form, and understand the concept of a record, and (perhaps to a lesser extent) the fields in a record, so this mental lexicon should be used to convey the concept of URI resource, properties, and value, over mathematics-based concepts.

Here are the terms of the VIOS Network business object model:

  1. Data Server — this is the semantic web analogy to a Web Server. A Data Server uses the same infrastructure as a Web Server, but instead of web documents, it serves metadata exclusively. In DBMS speak, it is a DBMS. In semantic web speak, a Data Server is a triplestore/quadstore/RDF repository which provides certain data assurance controls and data quality metrics, such as authority ranking, for the statements it serves.
  2. Data Space — this is the semantic web analog to a Web Site. In DBMS speak, it is the result set of SELECT *. In semantic web speak it the content exposed by a SPARQL Endpoint.
  3. Giant Global Graph — this is the semantic web analog to the World Wide Web. The GGG refers to the collection of all Data Spaces and all documents on the Linked Data Web.
  4. Library — this is the semantic web analogy to a Web Server directory. A library houses one or more records, and allows access to records via path-based locators (smart folders). Each library is identified by a URI, and therefore corresponds to a record. In DBMS speak, it is a data source name. In semantic web speak, a library is a named graph whose URI is of type tbd:Library. The fields in tbd:Library endow libraries with various business features when hosted by Data Servers.
  5. Record — this is the semantic web analogy to a web page. Unlike a web page, which can only be found in a single, physical store (the Web Server directory), a record can span multiple libraries. Just as a web page is identified by a URL, a record is identified by a URI. The term record refers to the metadata statements made about the URI. The thing the URI represents is called the subject of the record. In DBMS speak, the URI is a primary key. In semantic web speak, a record is the amalgamation of all legitimate statements made about a URI, where legitimacy is determined by a record provider (a Data Server).
  6. Field — this is the semantic web analogy to a web link. Unlike a web link, which can only describe a monolith edge from one web page to another, fields come in various data types and correspond to different vocabularies. In DBMS speak, it is a field. In semantic web speak, a field is a RDF property.
  7. Data Field — this is a field that stores text, date, and numeric data.
  8. Reference Field — this is a field that stores another record. In DBMS speak, it is a foreign key constraint.
  9. Vocabulary — this is missing from the World Wide Web. If you think about how #hashtags and @handles are used, you might notice how discourse on the web is becoming more structured with regard to syntax, and to a certain extent, with regard to meaning. A vocabulary is fundamentally a natural language document which suggest what various strings of characters should mean. The string actually has that meaning to the degree that people use the string as if it means what the document says it does. Vocabulary is a moniker for ontology, “the glue” of Linked Open Data. In DBMS speak, it is a schema. In VIOS Network, the words of a vocabulary are identified by the QName syntax vocab:word, where vocab identifies the vocabulary to which the word belongs. When the context is unambiguous, the vocab prefix is omitted.
  10. Smart Folder — this is a path-based locator of records in a Data Space. It is the semantic web analogy to a Web Search. More specially, a Smart Folder displays the records of a faceted, metadata query in a folder format. It is “smart”, because there is no physical container to house its records, the records are instead created dynamically. Smart folders can contain smart folders, and when they do, they are linked to their parent folder by a field. Smart Folder refers to the Virtuoso faceted view over SPARQL query records, and its content corresponds to the records of the query.
  11. Focus — this represents the current location of the user within the Data Space. A location in the Data Space corresponds to a faceted path, where edges along the path are two dimensional (a field and optional content in the field), and nodes are smart folders. This should make clear the notion that a smart folder is the cascading intersection of all criteria of (i.e. the 2D links between) its ancestor smart folders.


Here are the functional components of the DARYL:

Top-menu bar — this area houses the main VIOS Network menu, along with tool-bar buttons for quick access to frequent actions. Its counterpart in the mPoc is the Explore bar:

mPoC Explore Bar

The quick access actions are:

  1. Search field — this text fields allows enter of a list of keywords or a URI. When the text is submitted, records whose text fields contain the keywords are returned. The keywords have a very specific relationship to the records in the record list, namely, only certain parts of the record were searched (those holding text data), and these values have strict relationships to the subject of the record. These relationships are assigned “by fiat” of the creators of the field’s vocabulary. When a URI is submitted, the ‘Categories’ and ‘Fields’ menu of the ‘Control:” menu are populated
  2. Explore button — this button activates submission of the input in the Search field
  3. Clear keywords — this button clears the keywords from the current smart folder, but does not clear the Search field
  4. Clear Library — this button clears the library from the current smart folder
  5. Permalink — this link points to the current contents of the smart folder, and takes the form Each criteria-altering action performed using the DARYL updates the permalink and the browser URL. When the permalink is visited, all configurable components are updated from the query parameters of the URL
  6. /root — this link clears all criteria from the smart folder and updates the DARYL by executing the altered query. When the smart folder is cleared of criteria, the root of the Data Space is returned, meaning, all items in the Data Space are returned unfiltered. Since the /fct service will timeout at the root, only categories and fields of the items of the record list are returned for the /root smart folder. The record list of the root contains 0 items. The /root smart folder of the Data Space is the semantic web analog of the homepage of a Web Site.
  7. Cache — toggling on this checkbox causes the record list of each query submitted by the DARYL to be cached locally. Cache is enabled by default. The browser’s localStorage is used if available, otherwise, the cache is stored in memory. The cache maps the hashcode of the string representation of the smart folder to the smart folder record list. Note, all variable data in the smart folder’s string representation must be removed before using it as a cache key.
  8. Debug — toggling on this checkbox causes debug information to appear in the browser’s console, and prevents the browser URL from being updated by changes to the smart folder criteria.
  9. Data Space — this menu lists the Data Servers available to the user. This list is customized in the user’s account area. Choosing an item in this list updates the SPARQL Endpoint and executes the smart folder
  10. Allow — this menu lists the Anytime Query timeout of the smart folder execution job. Selecting an item from the list triggers the smart folder to re-execute. When the record list is sparse and the “complete” field of the Data Server’s response is ‘no’, then the Allow label and menu are highlighted for a brief period, and a beep is sounded. This is to alert the user that records, or menu items, are missing in the DARYL due to inadequate allowed time. This concept is best implemented as a slider.

Breadcrumb bar — this area houses the breadcrumbs. A breadcrumb corresponds to a smart folder. A nested list of smart folders signifies a breadcrumb trail. For example, the below breadcrumb is the Data Space location of the rank of the product released by the developer of things whose records are titled “teddy bear”:

mPoC Breadcrumbs

Breadcrumbs on the breadcrumb bar are delimited by the forward slash. Each breadcrumb is composed of two main components, the top and bottom areas. The root breadcrumb has characteristic that make it distinct from its children. The term “breadcrumb” will refer to a descendant of the root breadcrumb, unless otherwise indicated.

  1. Top area — this area of the breadcrumb displays the field linking the smart folder to its parent folder. If this area is clicked while the breadcrumb’s value is bound, then the click cause the value to become unbound, and an empty value (e.g. “[ ]”) to appear in its place. If the value is unbound when the top area is clicked, then the breadcrumb is removed. Clicking this area triggers an update to the smart folder after the remove action occurs.
  2. Bottom area — this area of the breadcrumb displays the value bound to the node. Mousing over the following components cause the breadcrumb to be highlighted during the duration of the mouseover if the breadcrumb is the focus (i.e. the terminal) of the breadcrumb trail: 1) the file icon next to an item in the ungrouped record in record list panel, 2) the file icon next to an item in the accordion drop-down menu of the record list panel, and 3) the number next to a item in the Category center panel record list. Unlike the top area, the bottom area of the breadcrumb allows multiple values to be “stacked”. However, only the latest value is displayed on the bottom area of the breadcrumb. Each click of the top area removes an item from the value stack, in the order they were added.
  3. Tooltips — nearly all components in the data canvas have tooltips. Tooltips are grouped, and the display policy corresponding to each type of tooltip is configured in the user’s preferences. The breadcrumb tooltip explains the criteria corresponding to the breadcrumb.
  4. Root node — this area of the breadcrumb bar houses the root node. Taking the bindable components above as 1, 2 and 3, mousing over any of the three will cause the root node to highlight if it has focus. Clicking 1 and 2 will cause those values to appear in the bottom area of the root node. Clicking 3 will cause the value to replace the value displayed in the top area, however, the value is stacked with the value it replaced. Clicking the file cabinet icon next to an item under the Libraries center panel record list will cause the value to be appended to the value in the top area, with the ‘@’ character as the delimiter. In the below example, the root is all Releases in the MusicBrainz libraries whose records contain the keywords ‘iphone x’:
mPoC Root Node

Facet collector — this area houses the facets of the current smart folder. In addition to the properties of breadcrumbs, these components have the following features:

  1. Depth — unlike the nodes of the breadcrumb trail, folders in the facet collector can nest folders. The number of descendants of the folder is appended to the value in its top area:
mPoC Facet Collector

2. Take focus — clicking a smart folder in the facet collector will take the user to that place. This means the folder will be appended to the breadcrumb trail, and its direct children will be displayed in the facet collector.

Group by Panel — this area houses the main record list (the content) of the smart folder, and presents controls for grouping the records. We say that these items are “in focus”. It’s counterpart in the mPoC is the record list panel:

mPoC Record List Panel

Here are the components of the record list panel:

  1. Group by menu — this menu houses the list of fields associated with the records in the record list. When a timeout alert occurs, this menu highlights for a brief duration. When a smart folder is executed, this menu is reloaded. In addition to the dynamically loaded items, this menu has two hardcoded items which appear at the first and second index: 1) “no particular field” corresponds to no group by field (ungrouped records), and 2) “text matches” displays the values of the text fields which matched the keywords of each record in the list, and highlights the keywords:
mPoC Text Matches
  1. Default Group by — the user can specified in their preferences a prioritized list of fields to group records by, by default. When the list is loaded, the data canvas will group the records according to the users preference, if the preference is found in the Group by list. If the user specifies no preference, they the system default list is applied. If the user specified “no particular field” as the preference, then the list is ungrouped by default.
  2. Page left — this button pages the record list backward. When it is long-pressed, it pages to the beginning of the record list.
  3. Page right — this button pages the record list forward. When it is long-pressed, it pages to the end of the record list.
  4. Record list — this area house the records of the smart folder. Each item in the list is composed of three parts: 1) a number if the item represents a group of the records (related by the field selected in the group by menu), or a file icon if the record is ungrouped or if the record is an item in the grouped item’s accordion drop-down, 2) a link, which, when clicked, opens the URI in the record viewer; the item is a literal value, it is displayed as plain text, not a link, 3) a number, which, when clicked, causes the accordion to expand to reveal the list of records whose field contain the numbered item, where the field matches the one selected in the group by menu. In the above image, the records are grouped by subject, and the user has elected to view the group of records whose subject is “2010 Introductions”. The favicon of the URI’s domain is superimposed on all file icons, and the favicon of the first record in a folder is superimposed on the folder.

Control Panel — this area houses additional metadata associated with the records in the record list. This area functions in the same way as the Group by panel, with the exceptions stated above.

Here are the types of Control options:

  1. Categories — this option lists the categories (i.e. classes) of the items in the record list. Clicking the number next to a category will cause the list of instances of that category to appear in the accordion drop-down menu:
mPoC Categories
  1. Fields — this list the fields of the in-focus records:
mPoC Fields
  1. Text — this option list the text fields of the records in focus. Only text fields that contain keywords are displayed:
mPoC Text
  1. Roles — this option lists the fields of other records the smart folder’s subject is used in:
mPoC Roles
  1. Libraries — this option lists the libraries housing the items in the record list. The items in this list have neither accordion drop-down, nor item counts.
mPoC Libraries