+
+
+The DataSourceCache plugin enables caching on any DataSource to reduce high-latency calls to remote sources and to reduce server load. In this example, the Cache's max value has been set to 3.
+
+
+
+
+
+
+
+
+Use the plug() method to initialize the
+DataSourceCache plugin and pass in the configuration value
+max to set the maximum size.
YUI().use("datasource", "dataschema", "cache", function (Y) {
+ var callback = {
+ success: function (e) { /* output to screen */ },
+ failure: function (e) { /* output to screen */ }
+ },
+
+ myDataSource = new Y.DataSource.Get({
+ source: "https://api.github.com/users/",
+
+ // this is only needed because the query appends the url
+ // rather than the url's query params
+ generateRequestCallback: function (guid) {
+ return '/repos?callback=YUI.Env.DataSource.callbacks.' + guid;
+ }
+ }),
+
+ myDataSource.plug(Y.Plugin.DataSourceJSONSchema, {
+ schema: {
+ resultListLocator: "data",
+ resultFields: ["name"]
+ }
+ });
+
+ myDataSource.plug(Y.Plugin.DataSourceCache, { max: 3 });
+
+ // Adds to cache
+ myDataSource.sendRequest({
+ request : "lsmith",
+ callback: callback
+ });
+
+ // Adds to cache
+ myDataSource.sendRequest({
+ request : "davglass",
+ callback: callback
+ });
+
+ // Retrieves from cache
+ myDataSource.sendRequest({
+ request : "lsmith",
+ callback: callback
+ });
+});
+
+
+Full Example Source Listing
+ +<form id="demo" action="http://search.yahoo.com/search">
+<h6>Look up github repositories by username (e.g., davglass, lsmith or rgrove):</h6>
+<input type="input" id="demo_input_query" name="p">
+<input type="submit" id="demo_query_retrieve" value="Retrieve data">
+<input type="button" id="demo_cache_clear" value="Clear cache">
+<div id="demo_output_response" class="output"></div>
+</form>
+
+<script type="text/javascript">
+YUI().use("json-stringify","node", "datasource-get", "datasource-jsonschema", "datasource-cache", "datatype-date", function (Y) {
+var output = Y.one("#demo_output_response"),
+ source = "remote source",
+
+ myDataSource = new Y.DataSource.Get({
+ source:"https://api.github.com/users/",
+ generateRequestCallback: function (guid) {
+ return '/repos?callback=YUI.Env.DataSource.callbacks.' + guid;
+ }
+ }),
+
+ callback = {
+ success: function(e){
+ var when = Y.DataType.Date.format(new Date(), {format:"%F %r"}),
+ data = Y.JSON.stringify(e.response, null, 2);
+
+ output.setHTML(
+ "<p>[" + when + "] Retrieved from " +
+ "<strong>" + source + "</strong></p>" +
+ "<pre>" +
+ data.replace(/&/g,"&")
+ .replace(/</g,"<")
+ .replace(/>/g,">") +
+ "</pre>");
+ },
+ failure: function(e){
+ var when = Y.DataType.Date.format(new Date(), {format:"%F %r"}),
+ message = /fields retrieval/.test(e.error.message) ?
+ "User not found" : e.error.message;
+
+ output.setHTML(
+ "<p>[" + when + "] Could not retrieve data: " +
+ "<em>" + message + "</em>" +
+ "</p>");
+ }
+ };
+
+myDataSource.plug(Y.Plugin.DataSourceJSONSchema, {
+ schema: {
+ resultListLocator: "data",
+ resultFields: ["name"]
+ }
+});
+
+myDataSource.plug(Y.Plugin.DataSourceCache, { max: 3 });
+myDataSource.cache.on("retrieve", function(){
+ source = "cache";
+});
+
+Y.one("#demo_cache_clear").on("click", function(){
+ var when = Y.DataType.Date.format(new Date(), {format:"%F %r"});
+
+ myDataSource.cache.flush();
+ output.setHTML("<p>[" + when + "] Cache cleared.</p>");
+});
+
+Y.on("submit", function(e){
+ e.halt();
+ var query = encodeURIComponent(
+ Y.one("#demo_input_query")
+ .get("value")
+ .replace(/"/g,'\\"')
+ .replace(/\W/g, ''));
+
+ if(query) {
+ source = "remote source";
+ myDataSource.sendRequest({
+ request:query,
+ callback:callback
+ });
+ } else {
+ output.setHTML("<p>Please enter a query.</p>");
+ }
+}, "#demo");
+});
+</script>
+
+