Update README.md

Author: lazarv

README.md

@@ -12,7 +12,7 @@
 
 JayData is a unified data access library for JavaScript to CRUD data from different sources like WebSQL/SQLite,
 IndexedDB, MongoDb, OData, HTML5 localStorage.
-The library can be integrated with KendoUI, Knockout.js, Handlebars.js or Sencha Touch 2 and can be used on
+The library can be integrated with React, Angular2, Durandal, KendoUI, Knockout.js, Handlebars.js or Sencha Touch 2 and can be used on
 Node.js as well. Check out the latest [JayData examples](https://github.com/jaystack/odata-v4-client-examples) 
 
 JayData not only provides JavaScript Language Query (JSLQ) syntax to access local (in-browser and mobile)
@@ -55,6 +55,338 @@ $ npm install
 $ gulp
 ```
 
+## Use JayData as a standalone global library
+
+```html
+<script  type="text/javascript" src="jaydata.min.js"></script>
+```
+
+Providers are lazy loaded from the same location as the core JayData script under the ```jaydataproviders``` folder.
+If you want to use a JayData module, include it manually in a ```<script>``` tag.
+
+## Use Jaydata with System.js
+
+Using JayData with System.js needs a little bit of a setup and you have to map all providers you want to use in your application.
+
+```javascript
+var map = {
+    'jaydata/core': 'lib/jaydata/jaydata.min',
+    'jaydata/odata': 'lib/jaydata/jaydataproviders/oDataProvider.min'
+};
+
+var meta = {
+    'jaydata/odata': {
+        format: 'cjs',
+        deps: ['jaydata/core']
+    }
+};
+
+var config = {
+    map: map,
+    meta: meta
+};
+
+System.config(config);
+```
+
+With this setup you can now import the ```jaydata/odata``` module in your application code. See a full example in Angular2 [here](https://github.com/jaystack/odata-v4-client-examples/tree/master/angular2-product-editor).
+
+## Use JayData with Require.js
+
+If you want to use Require.js to import JayData into your application, you need to set the path configuration correctly:
+
+```javascript
+requirejs.config({
+    paths: {
+        'jaydata/core': '../lib/jaydata/jaydata.min',
+        'jaydata/odata': '../lib/jaydata/jaydataproviders/oDataProvider.min',
+    }
+});
+```
+
+See a working example using Require.js and Durandal [here](https://github.com/jaystack/odata-v4-client-examples/tree/master/durandal-product-editor).
+
+## JayData basics in 7 simple steps
+
+In most scenarios, the 7 simple steps of JayData basics are enough to handle data of your application. For more details, visit [http://jaydata.org](http://jaydata.org).
+
+### Step 1 - Define your data model
+
+Simple model that works online and offline as well. Define your data model:
+
+```javascript
+var Todo = $data.Entity.extend("Todo", {
+    Id: { type: "int", key: true, computed: true },
+    Task: { type: String, required: true, maxLength: 200 },
+    DueDate: { type: Date },
+    Completed: { type: Boolean }
+});
+
+var TodoDatabase = $data.EntityContext.extend("TodoDatabase", {
+    Todos: { type: $data.EntitySet, elementType: "Todo" }
+});
+```
+
+### Step 2 - Initialize the data storage
+
+#### OData
+
+You can Initialize your context to handle an OData endpoint just by passing the OData service URL as a single string parameter.
+
+```javascript
+var todoDB = new TodoDatabase("http://mysite.com/my.svc");
+```
+
+#### Local database
+
+If you want to use a local database, pass the name of your database as a string.
+JayData automatically detects what type of local database solution is available on the client and creates a context to an IndexedDB, WebSQL, LocalStorage or InMemory database.
+
+```javascript
+var todoDB = new TodoDatabase("MyTodoDatase");
+```
+
+#### WebSQL
+
+You can even specify, what type of database you want to use by providing a storage provider configuration object.
+
+```javascript
+var todoDB = new TodoDatabase({ 
+    provider: 'webSql', databaseName: 'MyTodoDatabase' 
+});
+```
+
+### Step 3 - Create data
+
+You can create new data by adding new entities to an entity set.
+
+#### Simple
+
+You can add a single entity to an entity set...
+
+```javascript
+todoDB.onReady(function(){
+    var task = todoDB.Todos.add({ Task: 'Step0: Get this list', Completed: true });
+    todoDB.saveChanges(function(){
+        alert(task.Id);
+    });
+});
+```
+
+#### Batch
+
+...or you can create multiple new entities by using the ```addMany``` function. In the handler of the ```saveChanges``` function you will get how many entities were saved.
+
+```javascript
+todoDB.onReady(function(){
+    var tasks = todoDB.Todos.addMany([
+        { Task: 'Step1: Define your data model'},
+        { Task: 'Step2: Initialize the data storage'},
+        { Task: 'Step3: Create data' }
+    ]);
+    todoDB.saveChanges(function(count){
+        alert("Created " + count + " new task");
+        tasks.forEach(function(todo){ alert(todo.Id); });
+    });
+});
+```
+
+### Step 4 - Read data
+
+#### All items
+
+To retrieve all database items as an array, use the ```toArray``` function.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos.toArray(function(todos){
+        yourTemplate.render(todos);
+    });
+});
+```
+
+#### Filter #1
+
+You can filter your data just like the native ```filter``` function of JavaScript. If you want to handle your result in a loop use the ```forEach``` function. 
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .filter(function(todo){
+            return todo.Completed == true || todo.Task.startsWith("Step2");
+        })
+        .forEach(function(todo){
+            yourTemplate.render(todo);
+        });
+});
+```
+
+Using ```forEach``` is equivalent to this:
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .filter(function(todo){
+            return todo.Completed == true || todo.Task.startsWith("Step2");
+        })
+        .toArray(function(todos){
+            todos.forEach(function(todo){
+                yourTemplate.render(todo);
+            });
+        });
+});
+```
+
+#### Filter #2
+
+You can pass a query parameters object as the second argument of the ```filter``` function and access these query parameters on ```this``` in the query function. 
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .filter(function(todo){
+            return todo.Completed == true || todo.Task.startsWith(this.stepName);
+        }, {
+            stepName: 'Step2'
+        })
+        .forEach(function(todo){
+            yourTemplate.render(todo); 
+        });
+});
+```
+
+#### Filter #3
+
+Instead of a JavaScript function you can use a query string in the ```filter``` function. This is specially useful, when you want to create your query dynamically.
+
+```javascript
+todoDB.onReady(function(){
+    var stepName = 'Step2';
+    todoDB.Todos
+        .filter("it.Completed || it.task.startsWith('" + stepName + "')")
+        .forEach(function(todo){
+            yourTemplate.render(todo); 
+        });
+});
+```
+
+#### Mapping
+
+In some scenarios you want to just retrieve some fields of your entity and map these fields as different names.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .map(function(todo){
+            return {
+                _task: todo.Task,
+                _completed: todo.Completed
+            }
+        })
+        .toArray(function(todos){
+            yourTemplate.render(todos);
+        });
+});
+```
+
+#### Paging
+
+As you store more and more entities in your database, it's practical to retrieve only a subset of your data by using paging functions. 
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .skip(2)
+        .take(3)
+        .toArray(function(todo){
+            yourTemplate.render(todo);
+        });
+});
+```
+
+#### Ordering
+
+If you want to sort your result by a selected field, use ```orderBy``` or ```orderByDescending```. As you can still use a string instead of a function in the query function, you can dynamically construct your ordering query.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .orderBy("it.Task")
+        .toArray(function(todo){
+            yourTemplate.render(todo);
+        });
+});
+```
+
+If you want more dynamic control over order direction, use the ```order``` function. If you need descending ordering on the field, use the ```-``` sign before the field name.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .order("-it.Task")
+        .toArray(function(todo){
+            yourTemplate.render(todo);
+        });
+});
+```
+
+### Step 5 - Update data
+
+To update an entity, attach it to the context and JayData will track the changes on the entity. On calling the ```saveChanges``` function, your attached and updated entities will be saved.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos.single("it.Id == 1", function(todo){
+        todoDB.attach(todo);
+        todo.Completed = true;
+        todoDB.saveChanges(function(count){
+            alert("Updated " + count + " task");
+        });
+    });
+});
+```
+
+### Step 6 - Delete data
+
+#### Simple
+
+Just like updating data, but instead of ```attach``` you will use ```remove```.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos.single("it.Id == 3", function(todo){
+        todoDB.Todos.remove(todo);
+        todoDB.saveChanges(function(count){
+            alert("Removed " + count + " task");
+        });
+    });
+});
+```
+
+#### Batch
+
+Use the ```removeAll``` function if you want to truncate all data in a single entity set.
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos.removeAll(function(){
+        alert("Removed all tasks");
+    });
+});
+```
+
+### Step 7 - Generate some UI with jQuery
+
+```javascript
+todoDB.onReady(function(){
+    todoDB.Todos
+        .forEach(function(todo) {
+            $('#todos')
+                .append('<li><b>' + todo.Task + '</b>' + (todo.Completed ? ' - completed' : '') + '</li>');
+        });
+});
+```
+
 ## Related projects
+
 [JaySvcUtil](https://github.com/jaystack/jaysvcutil) - Code generator tool that builds JayData data model classes from $metadata service of OData endpoints. 
-[Dynamic Metadata](https://github.com/jaystack/jaydata-dynamic-metadata)

dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jaydata",
-  "version": "1.5.6",
+  "version": "1.5.8",
   "description": "Cross-platform HTML5 data-management, JavaScript Language Query (JSLQ) support for OData, SQLite, WebSQL, IndexedDB, YQL and Facebook (packaged for Node.JS)",
   "keywords": [
     "HTML5 data management",

gulpfile.js

@@ -60,7 +60,12 @@ gulp.task('lint', function(){
     .pipe(eslint.failAfterError())
 });
 
-gulp.task('nodejs', function() {
+gulp.task('readme', function(){
+    gulp.src('README.md')
+    .pipe(gulp.dest('./dist'));
+});
+
+gulp.task('nodejs', ['readme'], function() {
     return gulp.src(['src/**/*.js'])
     .pipe(babel({
         compact: false

package.json

@@ -1,6 +1,6 @@
 {
   "name": "jaydata",
-  "version": "1.5.6",
+  "version": "1.5.8",
   "description": "Cross-platform HTML5 data-management, JavaScript Language Query (JSLQ) support for OData, SQLite, WebSQL, IndexedDB, YQL and Facebook (packaged for Node.JS)",
   "keywords": [
     "HTML5 data management",