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
bower install --save cachee
<!-- 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>
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
- .cache(cacheRequests) ⇒
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>
load specfic resources
Kind: static method of cachee
Param | Type | Default | Description |
---|---|---|---|
[elem] | Element |
document |
root element or document |
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);
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 |
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);
});
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"
});
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');
Dom helper method
Kind: static method of cachee
Param | Type |
---|---|
context | Element |
selector | String |
Example
cachee.$$(myElement, '.item-selected').forEach(...);
Pull requests, Bug reports and feature requests