diff -r 000000000000 -r 40c8f766c9b8 src/cm/media/js/lib/yui/yui3.0.0/examples/datasource/datasource_function.html --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/cm/media/js/lib/yui/yui3.0.0/examples/datasource/datasource_function.html Mon Nov 23 15:14:29 2009 +0100 @@ -0,0 +1,439 @@ + + + + + YUI Library Examples: DataSource Utility: DataSource.Function + + + + + + + + + + + + +
+
+
+

+ + YUI 3.x Home - + +

+
+ + +
+ + + +
+
+
+
+

YUI Library Examples: DataSource Utility: DataSource.Function

+
+
+ + +
+
+
+
+ +

DataSource Utility: DataSource.Function

+ +
+
+ DataSource.Function allows the implementer to define a JavaScript function that returns data values, for maximum customizeability. A DataSchema plugin is used to normalize incoming data into a known format for consistency of usage by other components. +
+ +
+
+ + + + +
+

Array

+
Data
+
+[
+    {name:"abc",id:123},
+    {name:"def",id:456},
+    {name:"ghi",id:789}
+]
+    
+ +
Schema
+
+{
+    resultFields: ["name","id"]
+}
+    
+ +
Normalized data
+ +
+ +

JSON

+
Data
+
+{
+    "profile":{
+        "current":160,
+        "target":150
+    },
+    "reference": [
+        {
+            "category":"exercise",
+            "type":"expenditure",
+            "activities":[
+                {"name":"biking", "calories":550},
+                {"name":"golf", "calories":1000},
+                {"name":"running", "calories":650},
+                {"name":"swimming", "calories":650},
+                {"name":"walking", "calories":225}
+            ]
+        },
+        {
+            "category":"nutrition",
+            "type":"intake",
+            "fruit":[
+                {"name":"apple", "calories":70},
+                {"name":"banana", "calories":70},
+                {"name":"orange", "calories":90},
+            ],
+            "vegetables":[
+                {"name":"baked potato", "calories":150},
+                {"name":"broccoli", "calories":50},
+                {"name":"green beans", "calories":30}
+            ]
+        }
+    ],
+    "program": [
+        {
+            "category":"exercise",
+            "schedule":[
+                {"day":"sunday", "activity":"swimming"},
+                {"day":"monday", "activity":"running"},
+                {"day":"tuesday", "activity":"biking"},
+                {"day":"wednesday", "activity":"running"},
+                {"day":"thursday", "activity":"swimming"},
+                {"day":"friday", "activity":"running"},
+                {"day":"saturday", "activity":"golf"}
+            ]
+        },
+        {
+            "category":"diet",
+            "schedule":[
+            ]
+        }
+    ]
+}
+    
+ +
Schema
+
+{
+    resultListLocator: "reference[1].fruit",
+    resultFields: ["name","calories"]
+}
+    
+ +
Normalized data
+ +
+
+ + + + + + +
+
+
+ +

Your custom function can return arbitrary data, so use the appropriate schema plugin to normalize the data into a consistent format. Array data would use a DataSourceArraySchema plugin:

+ +
  1. YUI().use("datasource-function", "datasource-arrayschema", function(Y) {
  2. var myFunction = function(request) {
  3. return [
  4. {name:"abc",id:123},
  5. {name:"def",id:456},
  6. {name:"ghi",id:789}
  7. ];
  8. },
  9. myDataSource = new Y.DataSource.Function({source:myFunction}),
  10. myCallback = {
  11. success: function(e){
  12. alert(e.response);
  13. },
  14. failure: function(e){
  15. alert("Could not retrieve data: " + e.error.message);
  16. }
  17. };
  18.  
  19. myDataSource.plug(Y.Plugin.DataSourceArraySchema, {
  20. schema: {
  21. resultFields: ["name","id"]
  22. }
  23. });
  24.  
  25. myDataSource.sendRequest(null, myCallback);
  26. });
YUI().use("datasource-function", "datasource-arrayschema", function(Y) {
+    var myFunction = function(request) {
+        return [
+            {name:"abc",id:123},
+            {name:"def",id:456},
+            {name:"ghi",id:789}
+        ];
+    },
+    myDataSource = new Y.DataSource.Function({source:myFunction}),
+    myCallback = {
+        success: function(e){
+            alert(e.response);
+        },
+        failure: function(e){
+            alert("Could not retrieve data: " + e.error.message);
+        }
+    };
+ 
+    myDataSource.plug(Y.Plugin.DataSourceArraySchema, {
+        schema: {
+            resultFields: ["name","id"]
+        }
+    });
+ 
+    myDataSource.sendRequest(null, myCallback);
+});
+

Whereas JSON data would use a DataSourceJSONSchema plugin:

+ +
  1. YUI().use("datasource-function", "datasource-jsonschema", function(Y) {
  2. var myFunction = function(request) {
  3. return {
  4. "profile":{
  5. "current":160,
  6. "target":150
  7. },
  8. "reference": [
  9. {
  10. ...
  11. },
  12. {
  13. "category":"nutrition",
  14. "type":"intake",
  15. "fruit":[
  16. {"name":"apple", "calories":70},
  17. {"name":"banana", "calories":70},
  18. {"name":"orange", "calories":90},
  19. ],
  20. "vegetables":[
  21. {"name":"baked potato", "calories":150},
  22. {"name":"broccoli", "calories":50},
  23. {"name":"green beans", "calories":30}
  24. ]
  25. }
  26. ],
  27. "program": [
  28. ...
  29. ]
  30. };
  31. },
  32. myDataSource = new Y.DataSource.Function({source:myFunction}),
  33. myCallback = {
  34. success: function(e){
  35. alert(e.response);
  36. },
  37. failure: function(e){
  38. alert("Could not retrieve data: " + e.error.message);
  39. }
  40. };
  41.  
  42. myDataSource.plug(Y.Plugin.DataSourceJSONSchema, {
  43. schema: {
  44. resultListLocator: "reference[1].fruit",
  45. resultFields: ["name","calories"]
  46. }
  47. });
  48.  
  49. myDataSource.sendRequest(null, myCallback);
  50. });
YUI().use("datasource-function", "datasource-jsonschema", function(Y) {
+    var myFunction = function(request) {
+        return {
+            "profile":{
+                "current":160,
+                "target":150
+            },
+            "reference": [
+                {
+                    ...
+                },
+                {
+                    "category":"nutrition",
+                    "type":"intake",
+                    "fruit":[
+                        {"name":"apple", "calories":70},
+                        {"name":"banana", "calories":70},
+                        {"name":"orange", "calories":90},
+                    ],
+                    "vegetables":[
+                        {"name":"baked potato", "calories":150},
+                        {"name":"broccoli", "calories":50},
+                        {"name":"green beans", "calories":30}
+                    ]
+                }
+            ],
+            "program": [
+                ...
+            ]
+        };
+    },
+    myDataSource = new Y.DataSource.Function({source:myFunction}),
+    myCallback = {
+        success: function(e){
+            alert(e.response);
+        },
+        failure: function(e){
+            alert("Could not retrieve data: " + e.error.message);
+        }
+    };
+ 
+    myDataSource.plug(Y.Plugin.DataSourceJSONSchema, {
+        schema: {
+            resultListLocator: "reference[1].fruit",
+            resultFields: ["name","calories"]
+        }
+    });
+ 
+    myDataSource.sendRequest(null, myCallback);
+});
+ +
+ +
+
+ + + +
+ +
+

Copyright © 2009 Yahoo! Inc. All rights reserved.

+

Privacy Policy - + Terms of Service - + Copyright Policy - + Job Openings

+
+
+ + + + + +