cacheejs

cachee

Cachee is a simple library that helps developer cache resources and requests and reuse them during a long lived application. That way if the app looses connectivity during usage the user will not experience any problems

Install

bower install --save cachee

Usage

<!-- Format: -->
<!-- <tag-name cachee="<attr>:<resource-url>"></tag-name> -->
<img cachee="src:/my-resource1" />
<img cachee="src:/my-resource2" />
<img cachee="src:/my-resource3" />
 
<script>
  cachee.cache([
      cachee.resource('/my-resource1'),
      cachee.resource('/my-resource2'),
      cachee.resource('/my-resource3')
  ]).then(function() {
      //resources loaded
      cachee.load(); or cache.load(myElem);
  });
</script> 

Documentation

cachee : object

A namespace that holds methods to help cache data inside blob urls

Kind: global namespace

• cachee : object
  • .cache(cacheRequests) ⇒ Promise
  • .load([elem])
  • .request(opt) ⇒ Promise
  • .resource(url, opt) ⇒ Promise
  • .readResource(url, [type]) ⇒ Promise
  • .writeResource(id, content, [mimeType]) ⇒ Promise
  • .deleteResource(id)
  • .$$(context, selector) ⇒ Array

cachee.cache(cacheRequests) ⇒ Promise

cache resource requests

Kind: static method of cachee

Param	Type	Description
cacheRequests	Array	list of chache requests

Example

<!-- Format: -->
<!-- <tag-name cachee="<attr>:<resource-url>"></tag-name> -->
<img cachee="src:/my-resource1" />
<img cachee="src:/my-resource2" />
<img cachee="src:/my-resource3" />
<img cachee="src:custom-resource" />
 
<script>
 cachee.cache([
     cachee.resource('/my-resource1'),
     cachee.resource('/my-resource2'),
     cachee.resource('/my-resource3'),
     cachee.writeResource('custom-resource', 'Custom Content', 'image/png')
 ]).then(function() {
     //resources loaded
     cachee.load(); or cache.load(myElem);
     // => <img src="blob:http://...1" />
     // => <img src="blob:http://...2" />
     // => <img src="blob:http://...3" />
     // => <img src="blob:http://...4" />
 });
</script>
 
<!-- Using deep attribute set and template attribute -->
<!-- Format -->
<!-- <tag-name cachee-tpl="my url resource ${<attr>}" cachee="<attr>:<resource-url"></tag-name> -->
<div cachee="style.backgroundImage:/my-resource1" cachee-tpl="url(${style.backgroundImage})"></div>
 
<script>
 cachee.cache([
     cachee.resource('/my-resource')
 ]).then(function() { 
     cachee.load(); // => <div style="background-image: url('blob:http://...')" cachee-tpl="url(${style.backgroundImage})"></div>
 });
</script>

cachee.load([elem])

load specfic resources

Kind: static method of cachee

Param	Type	Default	Description
[elem]	Element	document	root element or document

cachee.request(opt) ⇒ Promise

send an http request

Kind: static method of cachee

Param	Type
opt	Object

Example

//get request
cachee.request({
 url: '/example/resource',
 method: 'GET',
 responseType: 'arraybuffer'
}).then(function(xhr) {
 console.log(xhr.response);
});
 
// post request
cachee.request({
 url: '/my-resource',
 method: 'POST',
 data: FormData,
 headers: {
     'Content-type': 'multipart/form-data'
 }
}).then(handle);

cachee.resource(url, opt) ⇒ Promise

Sends a resource request and if the resource is not in cache it will cache it and retun it's blob url

Kind: static method of cachee

Param	Type	Description
url	String	resource url
opt	Object	http request options

cachee.readResource(url, [type]) ⇒ Promise

Reads a resource and returns a specific type

Kind: static method of cachee

Param	Type	Default	Description
url	String		the resource url
[type]	String	"text"	http compliant responseType string

Example

cachee.readResource('/my-resource', 'arraybuffer').then(function(data) {
 console.log(data);
});

cachee.writeResource(id, content, [mimeType]) ⇒ Promise

Write a resource to the cache table

Kind: static method of cachee
Returns: Promise - the blob url in a promise

Param	Type	Default	Description
id	String		unique identifyer
content	Mixed		the resource content
[mimeType]	String	"text/plain"	the resource's mime type

Example

cachee.writeResource('hello-world', 'Hello, World', 'text/plain');
 
// reading the resource
 
cachee.readResource('hello-world', 'text').then(function(data) { 
 console.log(data); // => "Hello, World"
});

cachee.deleteResource(id)

removes a resource form cache

Kind: static method of cachee

Param	Type
id	String

Example

cachee.writeResource('hello-world', 'Hello, World', 'text/plain');
...
// delete the resource after we are done with it
cachee.deleteResource('hello-world');

cachee.$$(context, selector) ⇒ Array

Dom helper method

Kind: static method of cachee

Param	Type
context	Element
selector	String

Example

cachee.$$(myElement, '.item-selected').forEach(...);

Contribution

Pull requests, Bug reports and feature requests