{"_id":"vie","_rev":"19-b0e3515b46754086ea40349c785957cc","name":"vie","description":"Editable RDFa with Backbone.js and JSON-LD","dist-tags":{"latest":"2.1.2"},"versions":{"0.0.2":{"name":"vie","description":"RDFa processing with Backbone.js and JSON-LD.","url":"http://wiki.iks-project.eu/index.php/VIE","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[],"dependencies":{"backbone":">=0.3.3","jquery":">=1.5.0"},"lib":".","main":"vie.js","version":"0.0.2","_id":"vie@0.0.2","engines":{"node":"*"},"_engineSupported":true,"_npmVersion":"0.3.7","_nodeVersion":"v0.4.2","directories":{},"files":[""],"_defaultsLoaded":true,"dist":{"shasum":"185f3ee71712fbe1b8efcfc9ff01dcbdbb74a6f0","tarball":"https://registry.npmjs.org/vie/-/vie-0.0.2.tgz","integrity":"sha512-U8BB5nCFl8lcGVv+DwTN6sXnr8S9oZTXa5TAL096rmv3VlT4689d1tH4b88T7sXQrqHgRWfqhJz9goejmlzXtA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD9kL4c8g8D4vRVaY8yR1YbhLGREkJ8kQNfdAJbxVPErQIgclquQhtIOhJ+rLH6eVxi/nMQXfH9Rx79A+qarzqtXMk="}]}},"1.0.0":{"name":"vie","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://wiki.iks-project.eu/index.php/VIE","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius"},"contributors":[{"name":"Rene Kapusta"},{"name":"Christopher Hlubek"},{"name":"Benjamin Eberlei"},{"name":"Nicolas Karageuzian"},{"name":"Szaby Grünwald"},{"name":"Johannes Schüth"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"}],"dependencies":{"backbone":">=0.3.3","jquery":">=1.5.0"},"lib":".","main":"vie.js","version":"1.0.0","_id":"vie@1.0.0","engines":{"node":"*"},"_engineSupported":true,"_npmVersion":"0.3.18","_nodeVersion":"v0.4.9","directories":{},"files":[""],"_defaultsLoaded":true,"dist":{"shasum":"c2e8cb7e3eff5b17643512268fa43bea031c8904","tarball":"https://registry.npmjs.org/vie/-/vie-1.0.0.tgz","integrity":"sha512-Nk2zM/Lfn/mnNrgI8Jm6GhR5l/D8UVT2aISYTUcKn3w9uNhWnGgZq3dXYHa+z2OdLK5oyPmW43C0Qtn5EsAjrQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGNeZWRtYfF9+J4wJLk8UCo80ZTKf2+uAo+tdoKBcESCAiEAtW9/TMOrqanCAQoP2xMqUvOXZG5VtBcMFN9i1w1Hukk="}]}},"2.0.0":{"name":"vie","version":"2.0.0","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://viejs.org","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[{"name":"Rene Kapusta"},{"name":"Christopher Hlubek"},{"name":"Benjamin Eberlei"},{"name":"Nicolas Karageuzian"},{"name":"Sebastian Germesin"},{"name":"Szaby Grünwald"},{"name":"Johannes Schüth"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"}],"dependencies":{"backbone":">=0.9.0","underscore":">=1.2.0","jquery":">=1.5.0","request":">=2.2.0"},"devDependencies":{"nodeunit":">=0.6.0","docco-husky":">=0.3.0","zombie":">=0.12.0","express":"2.5.x"},"lib":".","main":"dist/vie-latest.js","scripts":{"test":"./node_modules/nodeunit/bin/nodeunit test/nodejs"},"docco_husky":{"output_dir":"docs_tmp","project_name":"VIE"},"_npmUser":{"name":"bergie","email":"henri.bergius@iki.fi"},"_id":"vie@2.0.0","optionalDependencies":{},"engines":{"node":"*"},"_engineSupported":true,"_npmVersion":"1.1.16","_nodeVersion":"v0.6.15","_defaultsLoaded":true,"dist":{"shasum":"e27eeb3fc1a412e799df82fe75f7049c77feac07","tarball":"https://registry.npmjs.org/vie/-/vie-2.0.0.tgz","integrity":"sha512-36ldxGSmCXHc7KGq9l5QSkJMoPstAdLcd8OaWY2MLhc1rL53er/27l2dDn8p1eBAsHRnOkN/x5nmQzH2bVc1fA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEsRahKqMu5SZk8FGl+XFXDiXiAbLm6arxS/DRWSfStAAiBQSiv9uBi+i3QoRK7Vnngnj65tlrnfN63lsWshwM57Zg=="}]},"readme":"![VIE](https://raw.github.com/bergie/VIE/master/design/vie_logo_100.png) Vienna IKS Editables\n====================\n\nVIE is a utility library for implementing [decoupled Content Management systems](http://bergie.iki.fi/blog/decoupling_content_management/). VIE is developed [as part of](http://www.iks-project.eu/projects/vienna-iks-editables) the EU-funded [IKS project](http://www.iks-project.eu/).\n\n![Decoupled CMS communications](https://raw.github.com/bergie/VIE/master/design/cms-decoupled-communications.png)\n\n* In French, _vie_ means life, showcasing how VIE makes your website come alive\n* In English, _vie_ means striving for victory or superiority\n\nVIE development is now targeting a 2.0 release. [Read this blog post](http://bergie.iki.fi/blog/vie_2-0_is_starting_to_emerge/) to find out the changes from VIE 1.0. There is also a [good introductory post on VIE](http://blog.iks-project.eu/semantic-ui-development-with-vie/) on the IKS blog.\n\n## VIE integration in nutshell\n\nAdding VIE to your system is as easy as:\n\n1. Mark up your pages with RDFa annotations\n2. Include `vie.js` into the pages\n3. Implement [Backbone.sync](http://documentcloud.github.com/backbone/#Sync)\n\n## Common representation of content on HTML level\n\nA web editing tool has to understand the contents of the page. It has to understand what parts of the page should be editable, and how they connect together. If there is a list of news for instance, the tool needs to understand it enough to enable users to add new news items. The easy way of accomplishing this is to add some semantic annotations to the HTML pages. These annotations could be handled via Microformats, HTML5 microdata, but the most power lies with RDFa.\n\nRDFa is a way to describe the meaning of particular HTML elements using simple attributes. For example:\n\n    <div id=\"myarticle\" typeof=\"http://rdfs.org/sioc/ns#Post\" about=\"http://example.net/blog/news_item\">\n        <h1 property=\"dcterms:title\">News item title</h1>\n        <div property=\"sioc:content\">News item contents</div>\n    </div>\n\nHere we get all the necessary information for making a blog entry editable:\n\n* typeof tells us the type of the editable object. On typical CMSs this would map to a content model or a database table\n* about gives us the identifier of a particular object. On typical CMSs this would be the object identifier or database row primary key\n* property ties a particular HTML element to a property of the content object. On a CMS this could be a database column\n\nAs a side effect, this also makes pages more understandable to search engines and other semantic tools. So the annotations are not just needed for UI, but also for SEO.\n\n## Common representation of content on JavaScript level\n\nHaving contents of a page described via RDFa makes it very easy to extract the content model into JavaScript. We can have a common utility library for doing this, but we also should have a common way of keeping track of these content objects. Enter [Backbone.js](http://documentcloud.github.com/backbone/):\n\n> Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.\n\nWith Backbone, the content extracted from the RDFa-annotated HTML page is easily manageable via JavaScript. Consider for example:\n\n    v = new VIE();\n    v.use(new v.RdfaService());\n    v.load({element: jQuery('#myarticle')}).from('rdfa').execute().success(function(entities) {\n        _.forEach(entities, function(entity) {\n            entity.set({'dcterms:title': 'Hello, world'});\n            entity.save(null, {\n                success: function(savedModel, response) {\n                    alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n                }\n            });\n        })\n        console.log(\"We got \" + entities.length + \" editable objects from the page\");\n    });\n\nThe classic VIE API will also work:\n\n    var v = new VIE({classic: true});\n    var objectInstance = v.RDFaEntities.getInstance(jQuery('#myarticle'));\n    objectInstance.set({'dcterms:title': 'Hello, world'});\n    objectInstance.save(null, {\n        success: function(savedModel, response) {\n            alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n        }\n    });\n\nThis JS would work across all the different CMS implementations. Backbone.js provides a quite nice RESTful implementation of communicating with the server with JSON, but it can be easily overridden with CMS-specific implementation by just implementing a new [Backbone.sync method](http://documentcloud.github.com/backbone/#Sync).\n\n## Example\n\nThere is a full static HTML example of VIE at work. Saving outputs the edited contents as JSON into the JavaScript console:\n\n* [Example with Hallo](http://createjs.org)\n\nBe sure to read the [annotated VIE source code](http://viejs.org/docs/2.0.0/VIE.html) for API documentation.\n\n## I/O operations\n\nAll Input/Output operations of VIE are based on the [jQuery Deferred](http://api.jquery.com/category/deferred-object/) object, which means that you can attach callbacks to them either before they run, or also after they've been run.\n\nThe operations may either succeed, in which case the `then` callbacks will fire, or be rejected, in which case the `fail` callbacks will fire. Any `then` callbacks will fire in either case.\n\n## Dependencies\n\nVIE uses the following JavaScript libraries:\n\n* [jQuery](http://jquery.com/) for DOM manipulation and [Deferreds](http://api.jquery.com/category/deferred-object/)\n* [Backbone.js](http://documentcloud.github.com/backbone/) for entities (models) and collections\n* [Underscore.js](http://documentcloud.github.com/underscore/) for various JavaScript utilities\n\nSome functionality in VIE additionally uses:\n\n* [RdfQuery](http://code.google.com/p/rdfquery/) as a triplestore and for reasoning over rules\n\n## Integrations\n\n* [Create](https://github.com/bergie/create)\n* [Google Web Toolkit](https://github.com/alkacon/vie-gwt)\n* [Symfony2](https://github.com/liip/LiipVieBundle)\n* [Palsu](https://github.com/bergie/ViePalsu)\n\n## Using VIE on Node.js\n\nVIE is a CommonJS library that works on both browser and the server. On [Node.js](http://nodejs.org/) you can install it with:\n\n    npm install vie\n\nHere is a simple Node.js script that uses VIE for parsing RDFa:\n\n    var jQuery = require('jquery');\n    var vie = require('vie');\n\n    // Instantiate VIE\n    var VIE = new vie.VIE();\n\n    // Enable the RDFa service\n    VIE.use(new VIE.RdfaService());\n\n    var html = jQuery('<p xmlns:dc=\"http://purl.org/dc/elements/1.1/\" about=\"http://www.example.com/books/wikinomics\">In his latest book <cite property=\"dc:title\">Wikinomics</cite>, <span property=\"dc:creator\">Don Tapscott</span> explains deep changes in technology, demographics and business.</p>');\n\n    // \n    VIE.load({element: html}).from('rdfa').execute().done(function() {\n    \n      var objectInstance = VIE.entities.get('http://www.example.com/books/wikinomics');\n\n      console.log(objectInstance.get('dc:title'));\n\n    });\n\n## Development\n\nVIE development is coordinated using Git. [VIE@IKS](https://github.com/IKS/VIE) is the canonical \"blessed repository\", with actual development happening at [VIE@bergie](https://github.com/bergie/VIE).\n\nFeel free to [report issues](https://github.com/bergie/VIE/issues) or send [pull requests](http://help.github.com/pull-requests/) if you have ideas for pushing VIE forward. Contributions that include their own unit tests appreciated! \n\nDevelopment discussions happen on the [VIE mailing list](http://groups.google.com/group/viejs) and the `#iks` channel on Freenode. See also [VIE on Ohloh](http://www.ohloh.net/p/vie).\n\n### Code organization\n\nVIE source code is inside the `src` directory. Each separate unit of functionality should be handled in its own file, with the `src/VIE.js` being the entry point to the system.\n\n![VIE architecture](https://raw.github.com/bergie/VIE/master/design/architecture.png)\n\n### Building VIE\n\nThe VIE library consists of many individual pieces that we merge together in the build process. You'll need [Apache Ant](http://ant.apache.org/). Then just run:\n\n    $ ant\n\nThe built VIE library will appear in the `dist` folder.\n\n### Running Unit Tests\n\nDirect your browser to the `test/index.html` file to run VIE's [QUnit](http://docs.jquery.com/Qunit) tests.\n\n#### Unit tests on Node.js\n\nYou need Node.js and [NPM](http://npmjs.org/). Then just run:\n\n    $ npm install --dev\n    $ npm test\n\n#### Continuous integration\n\nVIE uses [Travis](http://travis-ci.org/) for continuous integration. Simply add your fork there and every time you push you'll get the tests run.\n\n[![Build Status](https://secure.travis-ci.org/bergie/VIE.png)](http://travis-ci.org/bergie/VIE)\n","maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}]},"2.0.1":{"name":"vie","version":"2.0.1","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://viejs.org","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[{"name":"Rene Kapusta"},{"name":"Christopher Hlubek"},{"name":"Benjamin Eberlei"},{"name":"Nicolas Karageuzian"},{"name":"Sebastian Germesin"},{"name":"Szaby Grünwald"},{"name":"Johannes Schüth"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"}],"dependencies":{"backbone":">=0.9.0","underscore":">=1.2.0","jquery":">=1.5.0","request":">=2.2.0"},"devDependencies":{"nodeunit":">=0.6.0","docco-husky":">=0.3.0","zombie":">=0.12.0","express":"2.5.x"},"lib":".","main":"dist/vie-latest.js","scripts":{"test":"./node_modules/nodeunit/bin/nodeunit test/nodejs"},"docco_husky":{"output_dir":"docs_tmp","project_name":"VIE"},"_npmUser":{"name":"bergie","email":"henri.bergius@iki.fi"},"_id":"vie@2.0.1","optionalDependencies":{},"engines":{"node":"*"},"_engineSupported":true,"_npmVersion":"1.1.16","_nodeVersion":"v0.6.15","_defaultsLoaded":true,"dist":{"shasum":"f7811d1f6d1889836abe9f99e95ef2c91869228b","tarball":"https://registry.npmjs.org/vie/-/vie-2.0.1.tgz","integrity":"sha512-SPc07/+C2Qpxm2DaEmBnda5/B0clt48t90boAZ3kNfzXeqAp6HeEsZLNQ+GKH5XLoFXxKsKYjcF5wij6qRUjPg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICA4Hs8xRn+SQa/Ff2vErN4nS0XLpF47tr4+O5VIBY8eAiEAo2thdPRydQ5/K58qX25MkBBt2pix49egYmmy2CmnM2Y="}]},"readme":"![VIE](https://raw.github.com/bergie/VIE/master/design/vie_logo_100.png) Vienna IKS Editables\n====================\n\nVIE is a utility library for implementing [decoupled Content Management systems](http://bergie.iki.fi/blog/decoupling_content_management/). VIE is developed [as part of](http://www.iks-project.eu/projects/vienna-iks-editables) the EU-funded [IKS project](http://www.iks-project.eu/).\n\n![Decoupled CMS communications](https://raw.github.com/bergie/VIE/master/design/cms-decoupled-communications.png)\n\n* In French, _vie_ means life, showcasing how VIE makes your website come alive\n* In English, _vie_ means striving for victory or superiority\n\nVIE development is now targeting a 2.0 release. [Read this blog post](http://bergie.iki.fi/blog/vie_2-0_is_starting_to_emerge/) to find out the changes from VIE 1.0. There is also a [good introductory post on VIE](http://blog.iks-project.eu/semantic-ui-development-with-vie/) on the IKS blog.\n\n## VIE integration in nutshell\n\nAdding VIE to your system is as easy as:\n\n1. Mark up your pages with RDFa annotations\n2. Include `vie.js` into the pages\n3. Implement [Backbone.sync](http://documentcloud.github.com/backbone/#Sync)\n\n## Common representation of content on HTML level\n\nA web editing tool has to understand the contents of the page. It has to understand what parts of the page should be editable, and how they connect together. If there is a list of news for instance, the tool needs to understand it enough to enable users to add new news items. The easy way of accomplishing this is to add some semantic annotations to the HTML pages. These annotations could be handled via Microformats, HTML5 microdata, but the most power lies with RDFa.\n\nRDFa is a way to describe the meaning of particular HTML elements using simple attributes. For example:\n\n    <div id=\"myarticle\" typeof=\"http://rdfs.org/sioc/ns#Post\" about=\"http://example.net/blog/news_item\">\n        <h1 property=\"dcterms:title\">News item title</h1>\n        <div property=\"sioc:content\">News item contents</div>\n    </div>\n\nHere we get all the necessary information for making a blog entry editable:\n\n* typeof tells us the type of the editable object. On typical CMSs this would map to a content model or a database table\n* about gives us the identifier of a particular object. On typical CMSs this would be the object identifier or database row primary key\n* property ties a particular HTML element to a property of the content object. On a CMS this could be a database column\n\nAs a side effect, this also makes pages more understandable to search engines and other semantic tools. So the annotations are not just needed for UI, but also for SEO.\n\n## Common representation of content on JavaScript level\n\nHaving contents of a page described via RDFa makes it very easy to extract the content model into JavaScript. We can have a common utility library for doing this, but we also should have a common way of keeping track of these content objects. Enter [Backbone.js](http://documentcloud.github.com/backbone/):\n\n> Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.\n\nWith Backbone, the content extracted from the RDFa-annotated HTML page is easily manageable via JavaScript. Consider for example:\n\n    v = new VIE();\n    v.use(new v.RdfaService());\n    v.load({element: jQuery('#myarticle')}).from('rdfa').execute().success(function(entities) {\n        _.forEach(entities, function(entity) {\n            entity.set({'dcterms:title': 'Hello, world'});\n            entity.save(null, {\n                success: function(savedModel, response) {\n                    alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n                }\n            });\n        })\n        console.log(\"We got \" + entities.length + \" editable objects from the page\");\n    });\n\nThe classic VIE API will also work:\n\n    var v = new VIE({classic: true});\n    var objectInstance = v.RDFaEntities.getInstance(jQuery('#myarticle'));\n    objectInstance.set({'dcterms:title': 'Hello, world'});\n    objectInstance.save(null, {\n        success: function(savedModel, response) {\n            alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n        }\n    });\n\nThis JS would work across all the different CMS implementations. Backbone.js provides a quite nice RESTful implementation of communicating with the server with JSON, but it can be easily overridden with CMS-specific implementation by just implementing a new [Backbone.sync method](http://documentcloud.github.com/backbone/#Sync).\n\n## Example\n\nThere is a full static HTML example of VIE at work. Saving outputs the edited contents as JSON into the JavaScript console:\n\n* [Example with Hallo](http://createjs.org)\n\nBe sure to read the [annotated VIE source code](http://viejs.org/docs/2.0.0/VIE.html) for API documentation.\n\n## I/O operations\n\nAll Input/Output operations of VIE are based on the [jQuery Deferred](http://api.jquery.com/category/deferred-object/) object, which means that you can attach callbacks to them either before they run, or also after they've been run.\n\nThe operations may either succeed, in which case the `then` callbacks will fire, or be rejected, in which case the `fail` callbacks will fire. Any `then` callbacks will fire in either case.\n\n## Dependencies\n\nVIE uses the following JavaScript libraries:\n\n* [jQuery](http://jquery.com/) for DOM manipulation and [Deferreds](http://api.jquery.com/category/deferred-object/)\n* [Backbone.js](http://documentcloud.github.com/backbone/) for entities (models) and collections\n* [Underscore.js](http://documentcloud.github.com/underscore/) for various JavaScript utilities\n\nSome functionality in VIE additionally uses:\n\n* [RdfQuery](http://code.google.com/p/rdfquery/) as a triplestore and for reasoning over rules\n\n## Integrations\n\n* [Create](https://github.com/bergie/create)\n* [Google Web Toolkit](https://github.com/alkacon/vie-gwt)\n* [Symfony2](https://github.com/liip/LiipVieBundle)\n* [Palsu](https://github.com/bergie/ViePalsu)\n\n## Using VIE on Node.js\n\nVIE is a CommonJS library that works on both browser and the server. On [Node.js](http://nodejs.org/) you can install it with:\n\n    npm install vie\n\nHere is a simple Node.js script that uses VIE for parsing RDFa:\n\n    var jQuery = require('jquery');\n    var vie = require('vie');\n\n    // Instantiate VIE\n    var VIE = new vie.VIE();\n\n    // Enable the RDFa service\n    VIE.use(new VIE.RdfaService());\n\n    var html = jQuery('<p xmlns:dc=\"http://purl.org/dc/elements/1.1/\" about=\"http://www.example.com/books/wikinomics\">In his latest book <cite property=\"dc:title\">Wikinomics</cite>, <span property=\"dc:creator\">Don Tapscott</span> explains deep changes in technology, demographics and business.</p>');\n\n    // \n    VIE.load({element: html}).from('rdfa').execute().done(function() {\n    \n      var objectInstance = VIE.entities.get('http://www.example.com/books/wikinomics');\n\n      console.log(objectInstance.get('dc:title'));\n\n    });\n\n## Development\n\nVIE development is coordinated using Git. [VIE@IKS](https://github.com/IKS/VIE) is the canonical \"blessed repository\", with actual development happening at [VIE@bergie](https://github.com/bergie/VIE).\n\nFeel free to [report issues](https://github.com/bergie/VIE/issues) or send [pull requests](http://help.github.com/pull-requests/) if you have ideas for pushing VIE forward. Contributions that include their own unit tests appreciated! \n\nDevelopment discussions happen on the [VIE mailing list](http://groups.google.com/group/viejs) and the `#iks` channel on Freenode. See also [VIE on Ohloh](http://www.ohloh.net/p/vie).\n\n### Code organization\n\nVIE source code is inside the `src` directory. Each separate unit of functionality should be handled in its own file, with the `src/VIE.js` being the entry point to the system.\n\n![VIE architecture](https://raw.github.com/bergie/VIE/master/design/architecture.png)\n\n### Building VIE\n\nThe VIE library consists of many individual pieces that we merge together in the build process. You'll need [Apache Ant](http://ant.apache.org/). Then just run:\n\n    $ ant\n\nThe built VIE library will appear in the `dist` folder.\n\n### Running Unit Tests\n\nDirect your browser to the `test/index.html` file to run VIE's [QUnit](http://docs.jquery.com/Qunit) tests.\n\n#### Unit tests on Node.js\n\nYou need Node.js and [NPM](http://npmjs.org/). Then just run:\n\n    $ npm install --dev\n    $ npm test\n\n#### Continuous integration\n\nVIE uses [Travis](http://travis-ci.org/) for continuous integration. Simply add your fork there and every time you push you'll get the tests run.\n\n[![Build Status](https://secure.travis-ci.org/bergie/VIE.png)](http://travis-ci.org/bergie/VIE)\n","maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}]},"2.0.2":{"name":"vie","version":"2.0.2","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://viejs.org","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[{"name":"Rene Kapusta"},{"name":"Christopher Hlubek"},{"name":"Benjamin Eberlei"},{"name":"Nicolas Karageuzian"},{"name":"Sebastian Germesin"},{"name":"Szaby Grünwald"},{"name":"Johannes Schüth"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"}],"dependencies":{"backbone":">=0.9.0","underscore":">=1.2.0","jquery":">=1.5.0","request":">=2.2.0"},"devDependencies":{"nodeunit":">=0.6.0","docco-husky":">=0.3.0","zombie":">=0.12.0","express":"2.5.x"},"lib":".","main":"dist/vie-latest.js","scripts":{"test":"./node_modules/nodeunit/bin/nodeunit test/nodejs"},"docco_husky":{"output_dir":"docs_tmp","project_name":"VIE"},"_npmUser":{"name":"bergie","email":"henri.bergius@iki.fi"},"_id":"vie@2.0.2","optionalDependencies":{},"engines":{"node":"*"},"_engineSupported":true,"_npmVersion":"1.1.16","_nodeVersion":"v0.6.15","_defaultsLoaded":true,"dist":{"shasum":"dca673211ea05eb823d54cd42c561d678105832a","tarball":"https://registry.npmjs.org/vie/-/vie-2.0.2.tgz","integrity":"sha512-9U/l8+iYoUh87UVTbqK34R2zl3NdDq7SeW86gqZR2AFvEJBxeATcz6ZT0dTQlD1DyC93yJLxBaz6xhvCb+2NUA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC+S4RqHy44ppa7UabA5e1DFk2JilIghroT6N1ZMriXjQIgXMDZeR+SR0SHNINaae3m/aqNRB2AYD750R81unTE3yQ="}]},"readme":"![VIE](https://raw.github.com/bergie/VIE/master/design/vie_logo_100.png) Vienna IKS Editables\n====================\n\nVIE is a utility library for implementing [decoupled Content Management systems](http://bergie.iki.fi/blog/decoupling_content_management/). VIE is developed [as part of](http://www.iks-project.eu/projects/vienna-iks-editables) the EU-funded [IKS project](http://www.iks-project.eu/).\n\n![Decoupled CMS communications](https://raw.github.com/bergie/VIE/master/design/cms-decoupled-communications.png)\n\n* In French, _vie_ means life, showcasing how VIE makes your website come alive\n* In English, _vie_ means striving for victory or superiority\n\nVIE development is now targeting a 2.0 release. [Read this blog post](http://bergie.iki.fi/blog/vie_2-0_is_starting_to_emerge/) to find out the changes from VIE 1.0. There is also a [good introductory post on VIE](http://blog.iks-project.eu/semantic-ui-development-with-vie/) on the IKS blog.\n\n## VIE integration in nutshell\n\nAdding VIE to your system is as easy as:\n\n1. Mark up your pages with RDFa annotations\n2. Include `vie.js` into the pages\n3. Implement [Backbone.sync](http://documentcloud.github.com/backbone/#Sync)\n\n## Common representation of content on HTML level\n\nA web editing tool has to understand the contents of the page. It has to understand what parts of the page should be editable, and how they connect together. If there is a list of news for instance, the tool needs to understand it enough to enable users to add new news items. The easy way of accomplishing this is to add some semantic annotations to the HTML pages. These annotations could be handled via Microformats, HTML5 microdata, but the most power lies with RDFa.\n\nRDFa is a way to describe the meaning of particular HTML elements using simple attributes. For example:\n\n    <div id=\"myarticle\" typeof=\"http://rdfs.org/sioc/ns#Post\" about=\"http://example.net/blog/news_item\">\n        <h1 property=\"dcterms:title\">News item title</h1>\n        <div property=\"sioc:content\">News item contents</div>\n    </div>\n\nHere we get all the necessary information for making a blog entry editable:\n\n* typeof tells us the type of the editable object. On typical CMSs this would map to a content model or a database table\n* about gives us the identifier of a particular object. On typical CMSs this would be the object identifier or database row primary key\n* property ties a particular HTML element to a property of the content object. On a CMS this could be a database column\n\nAs a side effect, this also makes pages more understandable to search engines and other semantic tools. So the annotations are not just needed for UI, but also for SEO.\n\n## Common representation of content on JavaScript level\n\nHaving contents of a page described via RDFa makes it very easy to extract the content model into JavaScript. We can have a common utility library for doing this, but we also should have a common way of keeping track of these content objects. Enter [Backbone.js](http://documentcloud.github.com/backbone/):\n\n> Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.\n\nWith Backbone, the content extracted from the RDFa-annotated HTML page is easily manageable via JavaScript. Consider for example:\n\n    v = new VIE();\n    v.use(new v.RdfaService());\n    v.load({element: jQuery('#myarticle')}).from('rdfa').execute().success(function(entities) {\n        _.forEach(entities, function(entity) {\n            entity.set({'dcterms:title': 'Hello, world'});\n            entity.save(null, {\n                success: function(savedModel, response) {\n                    alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n                }\n            });\n        })\n        console.log(\"We got \" + entities.length + \" editable objects from the page\");\n    });\n\nThe classic VIE API will also work:\n\n    var v = new VIE({classic: true});\n    var objectInstance = v.RDFaEntities.getInstance(jQuery('#myarticle'));\n    objectInstance.set({'dcterms:title': 'Hello, world'});\n    objectInstance.save(null, {\n        success: function(savedModel, response) {\n            alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n        }\n    });\n\nThis JS would work across all the different CMS implementations. Backbone.js provides a quite nice RESTful implementation of communicating with the server with JSON, but it can be easily overridden with CMS-specific implementation by just implementing a new [Backbone.sync method](http://documentcloud.github.com/backbone/#Sync).\n\n## Example\n\nThere is a full static HTML example of VIE at work. Saving outputs the edited contents as JSON into the JavaScript console:\n\n* [Example with Hallo](http://createjs.org)\n\nBe sure to read the [annotated VIE source code](http://viejs.org/docs/2.0.0/VIE.html) for API documentation.\n\n## I/O operations\n\nAll Input/Output operations of VIE are based on the [jQuery Deferred](http://api.jquery.com/category/deferred-object/) object, which means that you can attach callbacks to them either before they run, or also after they've been run.\n\nThe operations may either succeed, in which case the `then` callbacks will fire, or be rejected, in which case the `fail` callbacks will fire. Any `then` callbacks will fire in either case.\n\n## Dependencies\n\nVIE uses the following JavaScript libraries:\n\n* [jQuery](http://jquery.com/) for DOM manipulation and [Deferreds](http://api.jquery.com/category/deferred-object/)\n* [Backbone.js](http://documentcloud.github.com/backbone/) for entities (models) and collections\n* [Underscore.js](http://documentcloud.github.com/underscore/) for various JavaScript utilities\n\nSome functionality in VIE additionally uses:\n\n* [RdfQuery](http://code.google.com/p/rdfquery/) as a triplestore and for reasoning over rules\n\n## Integrations\n\n* [Create](https://github.com/bergie/create)\n* [Google Web Toolkit](https://github.com/alkacon/vie-gwt)\n* [Symfony2](https://github.com/liip/LiipVieBundle)\n* [Palsu](https://github.com/bergie/ViePalsu)\n\n## Using VIE on Node.js\n\nVIE is a CommonJS library that works on both browser and the server. On [Node.js](http://nodejs.org/) you can install it with:\n\n    npm install vie\n\nHere is a simple Node.js script that uses VIE for parsing RDFa:\n\n    var jQuery = require('jquery');\n    var vie = require('vie');\n\n    // Instantiate VIE\n    var VIE = new vie.VIE();\n\n    // Enable the RDFa service\n    VIE.use(new VIE.RdfaService());\n\n    var html = jQuery('<p xmlns:dc=\"http://purl.org/dc/elements/1.1/\" about=\"http://www.example.com/books/wikinomics\">In his latest book <cite property=\"dc:title\">Wikinomics</cite>, <span property=\"dc:creator\">Don Tapscott</span> explains deep changes in technology, demographics and business.</p>');\n\n    // \n    VIE.load({element: html}).from('rdfa').execute().done(function() {\n    \n      var objectInstance = VIE.entities.get('http://www.example.com/books/wikinomics');\n\n      console.log(objectInstance.get('dc:title'));\n\n    });\n\n## Development\n\nVIE development is coordinated using Git. [VIE@IKS](https://github.com/IKS/VIE) is the canonical \"blessed repository\", with actual development happening at [VIE@bergie](https://github.com/bergie/VIE).\n\nFeel free to [report issues](https://github.com/bergie/VIE/issues) or send [pull requests](http://help.github.com/pull-requests/) if you have ideas for pushing VIE forward. Contributions that include their own unit tests appreciated! \n\nDevelopment discussions happen on the [VIE mailing list](http://groups.google.com/group/viejs) and the `#iks` channel on Freenode. See also [VIE on Ohloh](http://www.ohloh.net/p/vie).\n\n### Code organization\n\nVIE source code is inside the `src` directory. Each separate unit of functionality should be handled in its own file, with the `src/VIE.js` being the entry point to the system.\n\n![VIE architecture](https://raw.github.com/bergie/VIE/master/design/architecture.png)\n\n### Building VIE\n\nThe VIE library consists of many individual pieces that we merge together in the build process. You'll need [Apache Ant](http://ant.apache.org/). Then just run:\n\n    $ ant\n\nThe built VIE library will appear in the `dist` folder.\n\n### Running Unit Tests\n\nDirect your browser to the `test/index.html` file to run VIE's [QUnit](http://docs.jquery.com/Qunit) tests.\n\n#### Unit tests on Node.js\n\nYou need Node.js and [NPM](http://npmjs.org/). Then just run:\n\n    $ npm install --dev\n    $ npm test\n\n#### Continuous integration\n\nVIE uses [Travis](http://travis-ci.org/) for continuous integration. Simply add your fork there and every time you push you'll get the tests run.\n\n[![Build Status](https://secure.travis-ci.org/bergie/VIE.png)](http://travis-ci.org/bergie/VIE)\n","maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}]},"2.1.0":{"name":"vie","version":"2.1.0","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://viejs.org","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[{"name":"Benjamin Eberlei"},{"name":"Sebastian Germesin"},{"name":"Szaby Grünwald"},{"name":"Christopher Hlubek"},{"name":"Rene Kapusta"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"},{"name":"Nicolas Karageuzian"},{"name":"Johannes Schüth"}],"dependencies":{"backbone":">=0.9.0","underscore":">=1.2.0","jquery":"1.6.x","request":">=2.2.0"},"devDependencies":{"nodeunit":">=0.6.0","docco-husky":">=0.3.0","jshint":"0.9.x"},"lib":".","main":"dist/vie-latest.js","scripts":{"test":"./node_modules/nodeunit/bin/nodeunit test/nodejs"},"docco_husky":{"output_dir":"docs_tmp","project_name":"VIE"},"_npmUser":{"name":"bergie","email":"henri.bergius@iki.fi"},"_id":"vie@2.1.0","optionalDependencies":{},"engines":{"node":"*"},"_engineSupported":true,"_npmVersion":"1.1.16","_nodeVersion":"v0.6.15","_defaultsLoaded":true,"dist":{"shasum":"3b5f4c54b17c240f131a3b021a3ede700d92c36b","tarball":"https://registry.npmjs.org/vie/-/vie-2.1.0.tgz","integrity":"sha512-cx4JBxhIWXfeLlVU+/79eOVL4pWonh93SAF28YoXdthavyxcxrx6d/w1PQiZ9H4hd9y4waergjgHzRLLry8uRw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCAPtiSEDFJhzHV7RnAShowgeCkMnFU9pY6La0fYuKIoQIgXYhm/I8TBhgivB3sTP176XeV8JdgATq6UstvB9K8yVU="}]},"readme":"![VIE](https://raw.github.com/bergie/VIE/master/design/vie_logo_100.png) Vienna IKS Editables\n====================\n\nVIE is a utility library for implementing [decoupled Content Management systems](http://bergie.iki.fi/blog/decoupling_content_management/). VIE is developed [as part of](http://www.iks-project.eu/projects/vienna-iks-editables) the EU-funded [IKS project](http://www.iks-project.eu/).\n\n![Decoupled CMS communications](https://raw.github.com/bergie/VIE/master/design/cms-decoupled-communications.png)\n\n* In French, _vie_ means life, showcasing how VIE makes your website come alive\n* In English, _vie_ means striving for victory or superiority\n\nVIE development is now targeting a 2.0 release. [Read this blog post](http://bergie.iki.fi/blog/vie_2-0_is_starting_to_emerge/) to find out the changes from VIE 1.0. There is also a [good introductory post on VIE](http://blog.iks-project.eu/semantic-ui-development-with-vie/) on the IKS blog.\n\n## VIE integration in nutshell\n\nAdding VIE to your system is as easy as:\n\n1. Mark up your pages with RDFa annotations\n2. Include `vie.js` into the pages\n3. Implement [Backbone.sync](http://documentcloud.github.com/backbone/#Sync)\n\n## Common representation of content on HTML level\n\nA web editing tool has to understand the contents of the page. It has to understand what parts of the page should be editable, and how they connect together. If there is a list of news for instance, the tool needs to understand it enough to enable users to add new news items. The easy way of accomplishing this is to add some semantic annotations to the HTML pages. These annotations could be handled via Microformats, HTML5 microdata, but the most power lies with RDFa.\n\nRDFa is a way to describe the meaning of particular HTML elements using simple attributes. For example:\n\n    <div id=\"myarticle\" typeof=\"http://rdfs.org/sioc/ns#Post\" about=\"http://example.net/blog/news_item\">\n        <h1 property=\"dcterms:title\">News item title</h1>\n        <div property=\"sioc:content\">News item contents</div>\n    </div>\n\nHere we get all the necessary information for making a blog entry editable:\n\n* typeof tells us the type of the editable object. On typical CMSs this would map to a content model or a database table\n* about gives us the identifier of a particular object. On typical CMSs this would be the object identifier or database row primary key\n* property ties a particular HTML element to a property of the content object. On a CMS this could be a database column\n\nAs a side effect, this also makes pages more understandable to search engines and other semantic tools. So the annotations are not just needed for UI, but also for SEO.\n\n## Common representation of content on JavaScript level\n\nHaving contents of a page described via RDFa makes it very easy to extract the content model into JavaScript. We can have a common utility library for doing this, but we also should have a common way of keeping track of these content objects. Enter [Backbone.js](http://documentcloud.github.com/backbone/):\n\n> Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.\n\nWith Backbone, the content extracted from the RDFa-annotated HTML page is easily manageable via JavaScript. Consider for example:\n\n    v = new VIE();\n    v.use(new v.RdfaService());\n    v.load({element: jQuery('#myarticle')}).from('rdfa').execute().success(function(entities) {\n        _.forEach(entities, function(entity) {\n            entity.set({'dcterms:title': 'Hello, world'});\n            entity.save(null, {\n                success: function(savedModel, response) {\n                    alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n                }\n            });\n        })\n        console.log(\"We got \" + entities.length + \" editable objects from the page\");\n    });\n\nThe classic VIE API will also work:\n\n    var v = new VIE({classic: true});\n    var objectInstance = v.RDFaEntities.getInstance(jQuery('#myarticle'));\n    objectInstance.set({'dcterms:title': 'Hello, world'});\n    objectInstance.save(null, {\n        success: function(savedModel, response) {\n            alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n        }\n    });\n\nThis JS would work across all the different CMS implementations. Backbone.js provides a quite nice RESTful implementation of communicating with the server with JSON, but it can be easily overridden with CMS-specific implementation by just implementing a new [Backbone.sync method](http://documentcloud.github.com/backbone/#Sync).\n\n## Example\n\nThere is a full static HTML example of VIE at work. Saving outputs the edited contents as JSON into the JavaScript console:\n\n* [Example with Hallo](http://createjs.org)\n\nBe sure to read the [annotated VIE source code](http://viejs.org/docs/2.0.0/src/VIE.js.html) for API documentation.\n\n## I/O operations\n\nAll Input/Output operations of VIE are based on the [jQuery Deferred](http://api.jquery.com/category/deferred-object/) object, which means that you can attach callbacks to them either before they run, or also after they've been run.\n\nThe operations may either succeed, in which case the `then` callbacks will fire, or be rejected, in which case the `fail` callbacks will fire. Any `then` callbacks will fire in either case.\n\n## Dependencies\n\nVIE uses the following JavaScript libraries:\n\n* [jQuery](http://jquery.com/) for DOM manipulation and [Deferreds](http://api.jquery.com/category/deferred-object/)\n* [Backbone.js](http://documentcloud.github.com/backbone/) for entities (models) and collections\n* [Underscore.js](http://documentcloud.github.com/underscore/) for various JavaScript utilities\n\nSome functionality in VIE additionally uses:\n\n* [RdfQuery](http://code.google.com/p/rdfquery/) as a triplestore and for reasoning over rules\n\n## Integrations\n\n* [Create](https://github.com/bergie/create)\n* [Google Web Toolkit](https://github.com/alkacon/vie-gwt)\n* [Symfony2](https://github.com/liip/LiipVieBundle)\n* [Palsu](https://github.com/bergie/ViePalsu)\n\n## Using VIE on Node.js\n\nVIE is a CommonJS library that works on both browser and the server. On [Node.js](http://nodejs.org/) you can install it with:\n\n    npm install vie\n\nHere is a simple Node.js script that uses VIE for parsing RDFa:\n\n    var jQuery = require('jquery');\n    var vie = require('vie');\n\n    // Instantiate VIE\n    var VIE = new vie.VIE();\n\n    // Enable the RDFa service\n    VIE.use(new VIE.RdfaService());\n\n    var html = jQuery('<p xmlns:dc=\"http://purl.org/dc/elements/1.1/\" about=\"http://www.example.com/books/wikinomics\">In his latest book <cite property=\"dc:title\">Wikinomics</cite>, <span property=\"dc:creator\">Don Tapscott</span> explains deep changes in technology, demographics and business.</p>');\n\n    // \n    VIE.load({element: html}).from('rdfa').execute().done(function() {\n    \n      var objectInstance = VIE.entities.get('http://www.example.com/books/wikinomics');\n\n      console.log(objectInstance.get('dc:title'));\n\n    });\n\n## Development\n\nVIE development is coordinated using Git. [VIE@IKS](https://github.com/IKS/VIE) is the canonical \"blessed repository\", with actual development happening at [VIE@bergie](https://github.com/bergie/VIE).\n\nFeel free to [report issues](https://github.com/bergie/VIE/issues) or send [pull requests](http://help.github.com/pull-requests/) if you have ideas for pushing VIE forward. Contributions that include their own unit tests appreciated! \n\nDevelopment discussions happen on the [VIE mailing list](http://groups.google.com/group/viejs) and the `#iks` channel on Freenode. See also [VIE on Ohloh](http://www.ohloh.net/p/vie).\n\n### Code organization\n\nVIE source code is inside the `src` directory. Each separate unit of functionality should be handled in its own file, with the `src/VIE.js` being the entry point to the system.\n\n![VIE architecture](https://raw.github.com/bergie/VIE/master/design/architecture.png)\n\n### Building VIE\n\nThe VIE library consists of many individual pieces that we merge together in the build process. You'll need [Apache Ant](http://ant.apache.org/). Then just run:\n\n    $ ant\n\nThe built VIE library will appear in the `dist` folder.\n\n### Running Unit Tests\n\nDirect your browser to the `test/index.html` file to run VIE's [QUnit](http://docs.jquery.com/Qunit) tests.\n\n#### Unit tests on Node.js\n\nYou need Node.js and [NPM](http://npmjs.org/). Then just run:\n\n    $ npm install --dev\n    $ npm test\n\n#### Continuous integration\n\nVIE uses [Travis](http://travis-ci.org/) for continuous integration. Simply add your fork there and every time you push you'll get the tests run.\n\n[![Build Status](https://secure.travis-ci.org/bergie/VIE.png)](http://travis-ci.org/bergie/VIE)\n","maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}]},"2.1.1":{"name":"vie","version":"2.1.1","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://viejs.org","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[{"name":"Benjamin Eberlei"},{"name":"Sebastian Germesin"},{"name":"Szaby Grünwald"},{"name":"Christopher Hlubek"},{"name":"Rene Kapusta"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"},{"name":"Nicolas Karageuzian"},{"name":"Johannes Schüth"}],"dependencies":{"backbone":"1.x.x","underscore":"1.4.x","jquery":"1.6.x","request":">=2.2.0"},"devDependencies":{"grunt":"~0.4.1","grunt-contrib-uglify":"~0.2.0","grunt-contrib-concat":"~0.2.0","grunt-contrib-jshint":"~0.4.3","grunt-contrib-qunit":"~0.2.1","grunt-contrib-nodeunit":"~0.1.2","grunt-contrib-watch":"~0.3.1","grunt-bower-task":"~0.3.2"},"lib":".","main":"dist/vie.js","scripts":{"test":"grunt test"},"docco_husky":{"output_dir":"docs_tmp","project_name":"VIE"},"readme":"![VIE](https://raw.github.com/bergie/VIE/master/design/vie_logo_100.png) Vienna IKS Editables\n====================\n\nVIE is a utility library for implementing [decoupled Content Management systems](http://bergie.iki.fi/blog/decoupling_content_management/). VIE is developed [as part of](http://www.iks-project.eu/projects/vienna-iks-editables) the EU-funded [IKS project](http://www.iks-project.eu/).\n\n![Decoupled CMS communications](https://raw.github.com/bergie/VIE/master/design/cms-decoupled-communications.png)\n\n* In French, _vie_ means life, showcasing how VIE makes your website come alive\n* In English, _vie_ means striving for victory or superiority\n\nVIE development is now targeting a 2.0 release. [Read this blog post](http://bergie.iki.fi/blog/vie_2-0_is_starting_to_emerge/) to find out the changes from VIE 1.0. There is also a [good introductory post on VIE](http://blog.iks-project.eu/semantic-ui-development-with-vie/) on the IKS blog.\n\n## VIE integration in nutshell\n\nAdding VIE to your system is as easy as:\n\n1. Mark up your pages with RDFa annotations\n2. Include `vie.js` into the pages\n3. Implement [Backbone.sync](http://documentcloud.github.com/backbone/#Sync)\n\n## Changes\n\nPlease refer to the [CHANGES.md document](https://github.com/bergie/VIE/blob/master/CHANGES.md).\n\n## Common representation of content on HTML level\n\nA web editing tool has to understand the contents of the page. It has to understand what parts of the page should be editable, and how they connect together. If there is a list of news for instance, the tool needs to understand it enough to enable users to add new news items. The easy way of accomplishing this is to add some semantic annotations to the HTML pages. These annotations could be handled via Microformats, HTML5 microdata, but the most power lies with RDFa.\n\nRDFa is a way to describe the meaning of particular HTML elements using simple attributes. For example:\n\n    <div id=\"myarticle\" typeof=\"http://rdfs.org/sioc/ns#Post\" about=\"http://example.net/blog/news_item\">\n        <h1 property=\"dcterms:title\">News item title</h1>\n        <div property=\"sioc:content\">News item contents</div>\n    </div>\n\nHere we get all the necessary information for making a blog entry editable:\n\n* typeof tells us the type of the editable object. On typical CMSs this would map to a content model or a database table\n* about gives us the identifier of a particular object. On typical CMSs this would be the object identifier or database row primary key\n* property ties a particular HTML element to a property of the content object. On a CMS this could be a database column\n\nAs a side effect, this also makes pages more understandable to search engines and other semantic tools. So the annotations are not just needed for UI, but also for SEO.\n\n## Common representation of content on JavaScript level\n\nHaving contents of a page described via RDFa makes it very easy to extract the content model into JavaScript. We can have a common utility library for doing this, but we also should have a common way of keeping track of these content objects. Enter [Backbone.js](http://documentcloud.github.com/backbone/):\n\n> Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.\n\nWith Backbone, the content extracted from the RDFa-annotated HTML page is easily manageable via JavaScript. Consider for example:\n\n    v = new VIE();\n    v.use(new v.RdfaService());\n    v.load({element: jQuery('#myarticle')}).from('rdfa').execute().success(function(entities) {\n        _.forEach(entities, function(entity) {\n            entity.set({'dcterms:title': 'Hello, world'});\n            entity.save(null, {\n                success: function(savedModel, response) {\n                    alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n                }\n            });\n        })\n        console.log(\"We got \" + entities.length + \" editable objects from the page\");\n    });\n\nThe classic VIE API will also work:\n\n    var v = new VIE({classic: true});\n    var objectInstance = v.RDFaEntities.getInstance(jQuery('#myarticle'));\n    objectInstance.set({'dcterms:title': 'Hello, world'});\n    objectInstance.save(null, {\n        success: function(savedModel, response) {\n            alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n        }\n    });\n\nThis JS would work across all the different CMS implementations. Backbone.js provides a quite nice RESTful implementation of communicating with the server with JSON, but it can be easily overridden with CMS-specific implementation by just implementing a new [Backbone.sync method](http://documentcloud.github.com/backbone/#Sync).\n\n## Example\n\nThere is a full static HTML example of VIE at work. Saving outputs the edited contents as JSON into the JavaScript console:\n\n* [Example with Hallo](http://createjs.org)\n\nBe sure to read the [annotated VIE source code](http://viejs.org/docs/2.0.0/src/VIE.js.html) for API documentation.\n\n## I/O operations\n\nAll Input/Output operations of VIE are based on the [jQuery Deferred](http://api.jquery.com/category/deferred-object/) object, which means that you can attach callbacks to them either before they run, or also after they've been run.\n\nThe operations may either succeed, in which case the `then` callbacks will fire, or be rejected, in which case the `fail` callbacks will fire. Any `then` callbacks will fire in either case.\n\n## Dependencies\n\nVIE uses the following JavaScript libraries:\n\n* [jQuery](http://jquery.com/) for DOM manipulation and [Deferreds](http://api.jquery.com/category/deferred-object/)\n* [Backbone.js](http://documentcloud.github.com/backbone/) for entities (models) and collections\n* [Underscore.js](http://documentcloud.github.com/underscore/) for various JavaScript utilities\n\nSome functionality in VIE additionally uses:\n\n* [RdfQuery](http://code.google.com/p/rdfquery/) as a triplestore and for reasoning over rules\n\n## Integrations\n\n* [Create](https://github.com/bergie/create)\n* [Google Web Toolkit](https://github.com/alkacon/vie-gwt)\n* [Symfony2](https://github.com/liip/LiipVieBundle)\n* [Palsu](https://github.com/bergie/ViePalsu)\n\n## Using VIE on Node.js\n\nVIE is a CommonJS library that works on both browser and the server. On [Node.js](http://nodejs.org/) you can install it with:\n\n    npm install vie\n\nHere is a simple Node.js script that uses VIE for parsing RDFa:\n\n    var jQuery = require('jquery');\n    var vie = require('vie');\n\n    // Instantiate VIE\n    var VIE = new vie.VIE();\n\n    // Enable the RDFa service\n    VIE.use(new VIE.RdfaService());\n\n    var html = jQuery('<p xmlns:dc=\"http://purl.org/dc/elements/1.1/\" about=\"http://www.example.com/books/wikinomics\">In his latest book <cite property=\"dc:title\">Wikinomics</cite>, <span property=\"dc:creator\">Don Tapscott</span> explains deep changes in technology, demographics and business.</p>');\n\n    // \n    VIE.load({element: html}).from('rdfa').execute().done(function() {\n    \n      var objectInstance = VIE.entities.get('http://www.example.com/books/wikinomics');\n\n      console.log(objectInstance.get('dc:title'));\n\n    });\n\n## Development\n\nVIE development is coordinated using Git at [bergie/VIE](https://github.com/bergie/VIE).\n\nFeel free to [report issues](https://github.com/bergie/VIE/issues) or send [pull requests](http://help.github.com/pull-requests/) if you have ideas for pushing VIE forward. Contributions that include their own unit tests appreciated! \n\nDevelopment discussions happen on the [VIE mailing list](http://groups.google.com/group/viejs) and the `#iks` channel on Freenode. See also [VIE on Ohloh](http://www.ohloh.net/p/vie).\n\n### Code organization\n\nVIE source code is inside the `src` directory. Each separate unit of functionality should be handled in its own file, with the `src/VIE.js` being the entry point to the system.\n\n![VIE architecture](https://raw.github.com/bergie/VIE/master/design/architecture.png)\n\n### Building VIE\n\nThe VIE library consists of many individual pieces that we merge together in the build process. You'll need [Grunt](http://gruntjs.com). Then just run:\n\n    $ grunt build\n\nThe built VIE library will appear in the `dist` folder.\n\n#### Core-only distribution\n\nIn addition to the regular full build, there is also a slimmer build of VIE available that only includes the core parts of the library and no external service. To build that instead, run:\n\n    $ grunt build:core\n\n### Running Unit Tests\n\nDirect your browser to the `test/index.html` file to run VIE's [QUnit](http://docs.jquery.com/Qunit) tests.\n\n#### Unit tests on Node.js\n\nThe Grunt testing setup includes multiple parts. With it, you can test the library on both Node.js and a headless browser. Run:\n\n    $ grunt test\n\nor:\n\n    $ npm test\n\n#### Automatic unit tests\n\nYou can also run the Grunt setup in *watch mode*, where any change in VIE sources or tests will trigger a rebuild and test run:\n\n    $ grunt watch\n\n#### Continuous integration\n\nVIE uses [Travis](http://travis-ci.org/) for continuous integration. Simply add your fork there and every time you push you'll get the tests run.\n\n[![Build Status](https://secure.travis-ci.org/bergie/VIE.png)](http://travis-ci.org/bergie/VIE)\n","readmeFilename":"README.md","_id":"vie@2.1.1","dist":{"shasum":"ba7f78dc3a5278b53b4b8f9d2a5a8d7c178025e4","tarball":"https://registry.npmjs.org/vie/-/vie-2.1.1.tgz","integrity":"sha512-zA7wwHfoJiEky7ksEhLb+P2/IZADzFwtNfaNqiISsWtT/yvRARSooghc+8zHxqlsXr1epJnfl6hXX8MWcVg0iw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDXRaoliwP6YWbby9d1Yj1LM2uXerUIR4fnVgHEe006bAiEA3pN0gH/y02NM3R9tqq3sNYnFi1tekjuZFWkq6+HB7Ms="}]},"_from":".","_npmVersion":"1.3.8","_npmUser":{"name":"bergie","email":"henri.bergius@iki.fi"},"maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}]},"2.1.2":{"name":"vie","version":"2.1.2","description":"Editable RDFa with Backbone.js and JSON-LD","url":"http://viejs.org","keywords":["util","rdfa","model","template","server","client","browser"],"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"},"contributors":[{"name":"Benjamin Eberlei"},{"name":"Sebastian Germesin"},{"name":"Szaby Grünwald"},{"name":"Christopher Hlubek"},{"name":"Rene Kapusta"},{"name":"Sebastian Kurfuerst"},{"name":"Jonatan Lundin"},{"name":"Nicolas Karageuzian"},{"name":"Johannes Schüth"}],"dependencies":{"backbone":"1.x.x","underscore":"1.4.x","jquery":"1.6.x","request":">=2.2.0"},"devDependencies":{"grunt":"~0.4.1","grunt-contrib-uglify":"~0.2.0","grunt-contrib-concat":"~0.2.0","grunt-contrib-jshint":"~0.4.3","grunt-contrib-qunit":"~0.2.1","grunt-contrib-nodeunit":"~0.1.2","grunt-contrib-watch":"~0.3.1","grunt-bower-task":"~0.3.2"},"lib":".","main":"dist/vie.js","scripts":{"test":"grunt test"},"docco_husky":{"output_dir":"docs_tmp","project_name":"VIE"},"readme":"![VIE](https://raw.github.com/bergie/VIE/master/design/vie_logo_100.png) Vienna IKS Editables\n====================\n\nVIE is a utility library for implementing [decoupled Content Management systems](http://bergie.iki.fi/blog/decoupling_content_management/). VIE is developed [as part of](http://www.iks-project.eu/projects/vienna-iks-editables) the EU-funded [IKS project](http://www.iks-project.eu/).\n\n![Decoupled CMS communications](https://raw.github.com/bergie/VIE/master/design/cms-decoupled-communications.png)\n\n* In French, _vie_ means life, showcasing how VIE makes your website come alive\n* In English, _vie_ means striving for victory or superiority\n\nVIE development is now targeting a 2.0 release. [Read this blog post](http://bergie.iki.fi/blog/vie_2-0_is_starting_to_emerge/) to find out the changes from VIE 1.0. There is also a [good introductory post on VIE](http://blog.iks-project.eu/semantic-ui-development-with-vie/) on the IKS blog.\n\n## VIE integration in nutshell\n\nAdding VIE to your system is as easy as:\n\n1. Mark up your pages with RDFa annotations\n2. Include `vie.js` into the pages\n3. Implement [Backbone.sync](http://documentcloud.github.com/backbone/#Sync)\n\n## Changes\n\nPlease refer to the [CHANGES.md document](https://github.com/bergie/VIE/blob/master/CHANGES.md).\n\n## Common representation of content on HTML level\n\nA web editing tool has to understand the contents of the page. It has to understand what parts of the page should be editable, and how they connect together. If there is a list of news for instance, the tool needs to understand it enough to enable users to add new news items. The easy way of accomplishing this is to add some semantic annotations to the HTML pages. These annotations could be handled via Microformats, HTML5 microdata, but the most power lies with RDFa.\n\nRDFa is a way to describe the meaning of particular HTML elements using simple attributes. For example:\n\n    <div id=\"myarticle\" typeof=\"http://rdfs.org/sioc/ns#Post\" about=\"http://example.net/blog/news_item\">\n        <h1 property=\"dcterms:title\">News item title</h1>\n        <div property=\"sioc:content\">News item contents</div>\n    </div>\n\nHere we get all the necessary information for making a blog entry editable:\n\n* typeof tells us the type of the editable object. On typical CMSs this would map to a content model or a database table\n* about gives us the identifier of a particular object. On typical CMSs this would be the object identifier or database row primary key\n* property ties a particular HTML element to a property of the content object. On a CMS this could be a database column\n\nAs a side effect, this also makes pages more understandable to search engines and other semantic tools. So the annotations are not just needed for UI, but also for SEO.\n\n## Common representation of content on JavaScript level\n\nHaving contents of a page described via RDFa makes it very easy to extract the content model into JavaScript. We can have a common utility library for doing this, but we also should have a common way of keeping track of these content objects. Enter [Backbone.js](http://documentcloud.github.com/backbone/):\n\n> Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.\n\nWith Backbone, the content extracted from the RDFa-annotated HTML page is easily manageable via JavaScript. Consider for example:\n\n    v = new VIE();\n    v.use(new v.RdfaService());\n    v.load({element: jQuery('#myarticle')}).from('rdfa').execute().success(function(entities) {\n        _.forEach(entities, function(entity) {\n            entity.set({'dcterms:title': 'Hello, world'});\n            entity.save(null, {\n                success: function(savedModel, response) {\n                    alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n                }\n            });\n        })\n        console.log(\"We got \" + entities.length + \" editable objects from the page\");\n    });\n\nThe classic VIE API will also work:\n\n    var v = new VIE({classic: true});\n    var objectInstance = v.RDFaEntities.getInstance(jQuery('#myarticle'));\n    objectInstance.set({'dcterms:title': 'Hello, world'});\n    objectInstance.save(null, {\n        success: function(savedModel, response) {\n            alert(\"Your article '\" + savedModel.get('dcterms:title') + \"' was saved to server\");\n        }\n    });\n\nThis JS would work across all the different CMS implementations. Backbone.js provides a quite nice RESTful implementation of communicating with the server with JSON, but it can be easily overridden with CMS-specific implementation by just implementing a new [Backbone.sync method](http://documentcloud.github.com/backbone/#Sync).\n\n## Example\n\nThere is a full static HTML example of VIE at work. Saving outputs the edited contents as JSON into the JavaScript console:\n\n* [Example with Hallo](http://createjs.org)\n\nBe sure to read the [annotated VIE source code](http://viejs.org/docs/2.0.0/src/VIE.js.html) for API documentation.\n\n## I/O operations\n\nAll Input/Output operations of VIE are based on the [jQuery Deferred](http://api.jquery.com/category/deferred-object/) object, which means that you can attach callbacks to them either before they run, or also after they've been run.\n\nThe operations may either succeed, in which case the `then` callbacks will fire, or be rejected, in which case the `fail` callbacks will fire. Any `then` callbacks will fire in either case.\n\n## Dependencies\n\nVIE uses the following JavaScript libraries:\n\n* [jQuery](http://jquery.com/) for DOM manipulation and [Deferreds](http://api.jquery.com/category/deferred-object/)\n* [Backbone.js](http://documentcloud.github.com/backbone/) for entities (models) and collections\n* [Underscore.js](http://documentcloud.github.com/underscore/) for various JavaScript utilities\n\nSome functionality in VIE additionally uses:\n\n* [RdfQuery](http://code.google.com/p/rdfquery/) as a triplestore and for reasoning over rules\n\n## Integrations\n\n* [Create](https://github.com/bergie/create)\n* [Google Web Toolkit](https://github.com/alkacon/vie-gwt)\n* [Symfony2](https://github.com/liip/LiipVieBundle)\n* [Palsu](https://github.com/bergie/ViePalsu)\n\n## Using VIE on Node.js\n\nVIE is a CommonJS library that works on both browser and the server. On [Node.js](http://nodejs.org/) you can install it with:\n\n    npm install vie\n\nHere is a simple Node.js script that uses VIE for parsing RDFa:\n\n    var jQuery = require('jquery');\n    var vie = require('vie');\n\n    // Instantiate VIE\n    var VIE = new vie.VIE();\n\n    // Enable the RDFa service\n    VIE.use(new VIE.RdfaService());\n\n    var html = jQuery('<p xmlns:dc=\"http://purl.org/dc/elements/1.1/\" about=\"http://www.example.com/books/wikinomics\">In his latest book <cite property=\"dc:title\">Wikinomics</cite>, <span property=\"dc:creator\">Don Tapscott</span> explains deep changes in technology, demographics and business.</p>');\n\n    // \n    VIE.load({element: html}).from('rdfa').execute().done(function() {\n    \n      var objectInstance = VIE.entities.get('http://www.example.com/books/wikinomics');\n\n      console.log(objectInstance.get('dc:title'));\n\n    });\n\n## Development\n\nVIE development is coordinated using Git at [bergie/VIE](https://github.com/bergie/VIE).\n\nFeel free to [report issues](https://github.com/bergie/VIE/issues) or send [pull requests](http://help.github.com/pull-requests/) if you have ideas for pushing VIE forward. Contributions that include their own unit tests appreciated! \n\nDevelopment discussions happen on the [VIE mailing list](http://groups.google.com/group/viejs) and the `#iks` channel on Freenode. See also [VIE on Ohloh](http://www.ohloh.net/p/vie).\n\n### Code organization\n\nVIE source code is inside the `src` directory. Each separate unit of functionality should be handled in its own file, with the `src/VIE.js` being the entry point to the system.\n\n![VIE architecture](https://raw.github.com/bergie/VIE/master/design/architecture.png)\n\n### Building VIE\n\nThe VIE library consists of many individual pieces that we merge together in the build process. You'll need [Grunt](http://gruntjs.com). Then just run:\n\n    $ grunt build\n\nThe built VIE library will appear in the `dist` folder.\n\n#### Core-only distribution\n\nIn addition to the regular full build, there is also a slimmer build of VIE available that only includes the core parts of the library and no external service. To build that instead, run:\n\n    $ grunt build:core\n\n### Running Unit Tests\n\nDirect your browser to the `test/index.html` file to run VIE's [QUnit](http://docs.jquery.com/Qunit) tests.\n\n#### Unit tests on Node.js\n\nThe Grunt testing setup includes multiple parts. With it, you can test the library on both Node.js and a headless browser. Run:\n\n    $ grunt test\n\nor:\n\n    $ npm test\n\n#### Automatic unit tests\n\nYou can also run the Grunt setup in *watch mode*, where any change in VIE sources or tests will trigger a rebuild and test run:\n\n    $ grunt watch\n\n#### Continuous integration\n\nVIE uses [Travis](http://travis-ci.org/) for continuous integration. Simply add your fork there and every time you push you'll get the tests run.\n\n[![Build Status](https://secure.travis-ci.org/bergie/VIE.png)](http://travis-ci.org/bergie/VIE)\n","readmeFilename":"README.md","_id":"vie@2.1.2","dist":{"shasum":"9c189eb29b58f47b332b0db7f3bdba55a0accb5a","tarball":"https://registry.npmjs.org/vie/-/vie-2.1.2.tgz","integrity":"sha512-q3L2q9fOJO01dQPDc00gShRCus/hZ9FUTMfIzOuZOQCyiEXC4mXRgoFGQZdh1oTAWNqIH/f9eJvt677Dnso4kw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCY/B4J+Z6z24WrqqqcLfiJClJn430wSTrX1D2k+7uKNAIgJ3sKXyF55lOOcAa++fcLtQm9KGFJVwp3/Rqro/+bUXM="}]},"_from":".","_npmVersion":"1.3.8","_npmUser":{"name":"bergie","email":"henri.bergius@iki.fi"},"maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}]}},"maintainers":[{"name":"bergie","email":"henri.bergius@iki.fi"}],"time":{"modified":"2022-06-28T17:09:48.319Z","created":"2011-03-09T16:30:13.856Z","0.0.2":"2011-03-09T16:30:14.341Z","1.0.0":"2011-07-15T13:54:30.156Z","2.0.0":"2012-04-25T09:18:46.283Z","2.0.1":"2012-04-25T09:49:25.326Z","2.0.2":"2012-04-25T09:50:12.968Z","2.1.0":"2012-12-05T18:51:06.685Z","2.1.1":"2013-09-10T12:14:55.909Z","2.1.2":"2013-09-10T16:16:20.807Z"},"author":{"name":"Henri Bergius","email":"henri.bergius@iki.fi"}}