Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

367 lines (304 sloc) 90.425 kb
<!DOCTYPE html> <html> <head> <title>locache.0.3.1.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> locache.0.3.1.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">&#182;</a> </div> <pre><code> locache 0.3.1
(c) 2012 Dougal Matthews
locache may be freely distributed under the MIT licence.
locache is a client side caching framework that stores data
with DOM Storage and proves a memcache inspired API for
setting and retrieving values.
</code></pre> </td> <td class="code"> <div class="highlight"><pre><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
<span class="s2">&quot;use strict&quot;</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">&#182;</a> </div> <h2>Initial Setup</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">&#182;</a> </div> <p>Save a reference to the global object, in most cases this is <code>window</code>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">root</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">&#182;</a> </div> <p>Cache class constructor. This is the base &ldquo;class&rdquo; for
locache and is used for the global instance plus any of your own
custom caches.
The constructor accepts a properties object, and assigns each value
of the object to the instance. At the moment, this is only really used
to set the 'storage' property - so you can choose a builtin or use
your own storage mechanism.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">function</span> <span class="nx">LocacheCache</span><span class="p">(</span><span class="nx">options</span><span class="p">){</span>
<span class="k">if</span><span class="p">(</span><span class="nx">options</span> <span class="o">&amp;&amp;</span> <span class="nx">options</span><span class="p">.</span><span class="nx">storage</span><span class="p">){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">storage</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">storage</span><span class="p">;</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">&#182;</a> </div> <p>Re-bind the context of the two async methods so <code>this</code> is equal to
the instance of locache. This allows them to easily access the
other methods and storage objects. This is a bit of hack, and may
not be the best idea.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">async</span><span class="p">.</span><span class="nx">set</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">async</span><span class="p">.</span><span class="nx">set</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">async</span><span class="p">.</span><span class="nx">get</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">async</span><span class="p">.</span><span class="nx">get</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">&#182;</a> </div> <p>Current version of locache, this is inserted in the build process.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">VERSION</span> <span class="o">=</span> <span class="s2">&quot;0.3.1&quot;</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">&#182;</a> </div> <p>Boolean value that determines if they browser supports localStorage or
not. This is based on the Modernizr implementation that can be found
in <a href="https://github.com/Modernizr/Modernizr/blob/c56fb8b09515f629806ca44742932902ac145302/modernizr.js#L696-731">the Modernizr GitHub repository.</a></p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">supportsLocalStorage</span> <span class="o">=</span> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">supportsLocalStorage</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">try</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">&#182;</a> </div> <p>Create a test value and attempt to set, get and remove the
value. These are the core functionality required by locache</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">test_val</span> <span class="o">=</span> <span class="s2">&quot;___locache___&quot;</span><span class="p">;</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">setItem</span><span class="p">(</span><span class="nx">test_val</span><span class="p">,</span> <span class="nx">test_val</span><span class="p">);</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">getItem</span><span class="p">(</span><span class="nx">test_val</span><span class="p">);</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">removeItem</span><span class="p">(</span><span class="nx">test_val</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">&#182;</a> </div> <p>If any of the checks fail, an exception will be raised. At
that point we can flag the browser as not supporting
localStorage.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
<span class="p">}</span> <span class="k">catch</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">})();</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">&#182;</a> </div> <p>Boolean value that determines if they browser supports sessionStorage or
not. This is based on the Modernizr implementation that can be found
in <a href="https://github.com/Modernizr/Modernizr/blob/c56fb8b09515f629806ca44742932902ac145302/modernizr.js#L696-731">the Modernizr GitHub repository.</a></p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">supportsSessionStorage</span> <span class="o">=</span> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">supportsSessionStorage</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">try</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">&#182;</a> </div> <p>Create a test value and attempt to set, get and remove the
value. These are the core functionality required by locache</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">test_val</span> <span class="o">=</span> <span class="s2">&quot;___locache___&quot;</span><span class="p">;</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">setItem</span><span class="p">(</span><span class="nx">test_val</span><span class="p">,</span> <span class="nx">test_val</span><span class="p">);</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">getItem</span><span class="p">(</span><span class="nx">test_val</span><span class="p">);</span>
<span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">removeItem</span><span class="p">(</span><span class="nx">test_val</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">&#182;</a> </div> <p>If any of the checks fail, an exception will be raised. At
that point we can flag the browser as not supporting
sessionStorage.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
<span class="p">}</span> <span class="k">catch</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">})();</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">&#182;</a> </div> <p>Boolean flag to check if the browser supports native JSON.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">supportsNativeJSON</span> <span class="o">=</span> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">supportsNativeJSON</span> <span class="o">=</span> <span class="o">!!</span><span class="nx">root</span><span class="p">.</span><span class="nx">JSON</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">&#182;</a> </div> <h2>Internal utility functions</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">&#182;</a> </div> <p>A defer implempmentation to avoid IO access blocking the current
thread. This is exposed on the LocacheCache prototype, simply so it
can be accessed from within the unit tests. It's not intended for
public use.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">defer</span> <span class="o">=</span> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">_defer</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">&#182;</a> </div> <p>Store of the pending functions</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">timeouts</span> <span class="o">=</span> <span class="p">[];</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">&#182;</a> </div> <p>Message name used to identify posts related to the defer</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">messageName</span> <span class="o">=</span> <span class="s2">&quot;function-defer-message&quot;</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">&#182;</a> </div> <p>Add a message event listner. If its not from this window or doesn't
have the message name defined above, don't do anything and allow it
to propogate to other handlers. Otherwise, its meant for us so stop
the event.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">root</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span><span class="s2">&quot;message&quot;</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">event</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">event</span><span class="p">.</span><span class="nx">source</span> <span class="o">!==</span> <span class="nx">root</span> <span class="o">||</span> <span class="nx">event</span><span class="p">.</span><span class="nx">data</span> <span class="o">!==</span> <span class="nx">messageName</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span>
<span class="nx">event</span><span class="p">.</span><span class="nx">stopPropagation</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">&#182;</a> </div> <p>Make sure we have some pending functions, otherwise return.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">timeouts</span><span class="p">.</span><span class="nx">length</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">&#182;</a> </div> <p>take the oldest from the 'queue' and call that functions.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">fn</span> <span class="o">=</span> <span class="nx">timeouts</span><span class="p">.</span><span class="nx">shift</span><span class="p">();</span>
<span class="nx">fn</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">&#182;</a> </div> <p>Return false, to make sure the event isn't propogated</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
<span class="p">},</span> <span class="kc">true</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">&#182;</a> </div> <p>Constructor for the Defer, takes a function onject and stores it
on itself.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">function</span> <span class="nx">Deferred</span><span class="p">(</span><span class="nx">fn</span><span class="p">){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">fn</span> <span class="o">=</span> <span class="nx">fn</span><span class="p">;</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">&#182;</a> </div> <p>The defer method runs the function and stores the result. Uppon
finishing, it looks for a finishedFunction, that if exists, is
called and passed the result.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Deferred</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">defer</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">resultValue</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">fn</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="s1">&#39;finishedFunction&#39;</span><span class="p">)){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">finishedFunction</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">resultValue</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">&#182;</a> </div> <p>Return if the defer has finished. THis is determined by the
existance of the resultValue on the object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Deferred</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">hasFinished</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="s1">&#39;resultValue&#39;</span><span class="p">);</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">&#182;</a> </div> <p>The finished function takes another function and assigns that to
be called when the deferred function has finished.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">Deferred</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">finished</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fn</span><span class="p">){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">finishedFunction</span> <span class="o">=</span> <span class="nx">fn</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">&#182;</a> </div> <p>Check to see if the deferred function has finished, this can
happen if its very quick or the finished function is assigned
late. If it is, call it straight away.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">hasFinished</span><span class="p">()){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">finishedFunction</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">resultValue</span><span class="p">);</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">&#182;</a> </div> <p>Make this object chainable.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="k">this</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-28"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-28">&#182;</a> </div> <p>Wrapper utility function that provies access to the Deffered
implementation and makes it very simple to use.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">function</span> <span class="nx">defer</span><span class="p">(</span><span class="nx">fn</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-29"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-29">&#182;</a> </div> <p>Create the defer instance that wraps the function</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">d</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Deferred</span><span class="p">(</span><span class="nx">fn</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-30"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-30">&#182;</a> </div> <p>Add the defer method on the Deffered object, with the instance
bound to the queue.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">timeouts</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">d</span><span class="p">.</span><span class="nx">defer</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="nx">d</span><span class="p">));</span></pre></div> </td> </tr> <tr id="section-31"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-31">&#182;</a> </div> <p>post a message to the window that can be recieved by the
message handler.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">root</span><span class="p">.</span><span class="nx">postMessage</span><span class="p">(</span><span class="nx">messageName</span><span class="p">,</span> <span class="s2">&quot;*&quot;</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-32"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-32">&#182;</a> </div> <p>Finally return the deffered object instance.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">d</span><span class="p">;</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-33"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-33">&#182;</a> </div> <p>Only return the defer function, this is all we want to be publicly
accessible.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">defer</span><span class="p">;</span>
<span class="p">})();</span></pre></div> </td> </tr> <tr id="section-34"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-34">&#182;</a> </div> <p>Two cache prefixes. When storing values, all keys are prefixed
to avoid collisions with other usage of the storage backend.
If the stored value is given an expire time then a second key
is set with a different prefix to store this time.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">cachePrefix</span> <span class="o">=</span> <span class="s1">&#39;___locache___&#39;</span><span class="p">;</span>
<span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">expirePrefix</span> <span class="o">=</span> <span class="s1">&#39;___locacheExpire___&#39;</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-35"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-35">&#182;</a> </div> <p>Built in locache backends. These are simple wrappers around the actual
storage mechanism to allow for them to be easily exchanged.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">backends</span> <span class="o">=</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-36"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-36">&#182;</a> </div> <p>Wrapper around localStorage - persistent local storage in the
browser.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">local</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">set</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">setItem</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">get</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">getItem</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">remove</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">removeItem</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">length</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
<span class="p">},</span>
<span class="nx">key</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">index</span><span class="p">){</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">index</span> <span class="o">&lt;</span> <span class="mi">0</span> <span class="o">||</span> <span class="nx">index</span> <span class="o">&gt;=</span> <span class="k">this</span><span class="p">.</span><span class="nx">length</span><span class="p">()){</span>
<span class="k">return</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">localStorage</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">index</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">enabled</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="nx">supportsLocalStorage</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-37"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-37">&#182;</a> </div> <p>Wrapper around sessionStorage - storage in the browser that is
cleared each time a new session is started - new browser window etc.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">session</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">set</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">setItem</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">get</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">getItem</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">remove</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">removeItem</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">length</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
<span class="p">},</span>
<span class="nx">key</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">index</span><span class="p">){</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">index</span> <span class="o">&lt;</span> <span class="mi">0</span> <span class="o">||</span> <span class="nx">index</span> <span class="o">&gt;=</span> <span class="k">this</span><span class="p">.</span><span class="nx">length</span><span class="p">()){</span>
<span class="k">return</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">root</span><span class="p">.</span><span class="nx">sessionStorage</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">index</span><span class="p">);</span>
<span class="p">},</span>
<span class="nx">enabled</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="nx">supportsSessionStorage</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">};</span>
<span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">storage</span> <span class="o">=</span> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">backends</span><span class="p">.</span><span class="nx">local</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-38"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-38">&#182;</a> </div> <p>Utility method to get the number of milliseconds since the Epoch. This
is used when comparing keys to see if they have expired.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">_currentTime</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="k">new</span> <span class="nb">Date</span><span class="p">().</span><span class="nx">getTime</span><span class="p">();</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-39"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-39">&#182;</a> </div> <p>Given a key, return the key used internally for storing values without
the risk of collisions over usage of the storage backend.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">key</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">cachePrefix</span> <span class="o">+</span> <span class="nx">key</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-40"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-40">&#182;</a> </div> <p>Given a key, return the key to be used internally for expiry time.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">expirekey</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">expirePrefix</span> <span class="o">+</span> <span class="nx">key</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-41"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-41">&#182;</a> </div> <p>Given a key, look up its expire time and determine if its in the past
or not. Returns a Boolean.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">hasExpired</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="kd">var</span> <span class="nx">expireKey</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">expirekey</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">expireValue</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">expireKey</span><span class="p">),</span> <span class="mi">10</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-42"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-42">&#182;</a> </div> <p>If we have non-zero integer perform the comparison.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">expireValue</span> <span class="o">&amp;&amp;</span> <span class="nx">expireValue</span> <span class="o">&lt;</span> <span class="nx">_currentTime</span><span class="p">()){</span>
<span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-43"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-43">&#182;</a> </div> <h2>Main public API functions.</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-44"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-44">&#182;</a> </div> <p>Given a key, a value and an optional number of seconds store the value
in the storage backend.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">set</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">,</span> <span class="nx">seconds</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-45"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-45">&#182;</a> </div> <p>If the storage backend isn't supported or the key passed in is
falsy, perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">()</span> <span class="o">||</span> <span class="o">!</span><span class="nx">key</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">expireKey</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">expirekey</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">valueKey</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="k">if</span><span class="p">(</span><span class="nx">seconds</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-46"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-46">&#182;</a> </div> <p>The time stored is in milliseconds, but this function expects
seconds, so multiply by 1000.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">ms</span> <span class="o">=</span> <span class="nx">seconds</span> <span class="o">*</span> <span class="mi">1000</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">expireKey</span><span class="p">,</span> <span class="nx">_currentTime</span><span class="p">()</span> <span class="o">+</span> <span class="nx">ms</span><span class="p">);</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-47"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-47">&#182;</a> </div> <p>For the value, always convert it into a JSON object. THis means
that we can safely store many types of objects. They still need to
be serialisable so it still rules out some, such as functions.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">value</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">valueKey</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-48"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-48">&#182;</a> </div> <p>Fetch a value from the cache. Either returns the value, or if it
doesn't exist (or has expired) return null.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">get</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-49"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-49">&#182;</a> </div> <p>If the storage backend isn't supported or the key passed in is
falsy, perform a no-op and return null.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">()</span> <span class="o">||</span> <span class="o">!</span><span class="nx">key</span><span class="p">)</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-50"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-50">&#182;</a> </div> <p>If the value has expired, before returning null remove the key
from the storage backend to free up the space.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">hasExpired</span><span class="p">(</span><span class="nx">key</span><span class="p">)){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">key</span><span class="p">));</span>
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="p">}</span>
<span class="kd">var</span> <span class="nx">valueKey</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">valueKey</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-51"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-51">&#182;</a> </div> <p>After we have the value back, check its truthy and then attempt to
parse the JSON. If the JSON parsing fails, return null. This could
be handled better but its hard to know what to do here? We only
set JSON and thus we expect JSON but we don't want to delete
values that must have come from another source.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">value</span><span class="p">){</span>
<span class="k">try</span><span class="p">{</span>
<span class="k">return</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">parse</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
<span class="p">}</span> <span class="k">catch</span><span class="p">(</span><span class="nx">err</span><span class="p">){</span>
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-52"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-52">&#182;</a> </div> <p>If value isn't truthy, it must be an empty string or similar, so
just return that.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">value</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-53"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-53">&#182;</a> </div> <p>The async object, provides an extra level to the namespace that
contains all of the sync calls supports within locache</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">async</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">set</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">,</span> <span class="nx">seconds</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">defer</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">,</span> <span class="nx">seconds</span><span class="p">);</span>
<span class="p">}.</span><span class="nx">bind</span><span class="p">(</span><span class="k">this</span><span class="p">));</span>
<span class="p">},</span>
<span class="nx">get</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span>
<span class="k">return</span> <span class="nx">defer</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="p">}.</span><span class="nx">bind</span><span class="p">(</span><span class="k">this</span><span class="p">));</span>
<span class="p">}</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-54"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-54">&#182;</a> </div> <p>When removing a key - delete from the storage both the value key/value
pair and the expiration time key/value pair.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">remove</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-55"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-55">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">expireKey</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">expirekey</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">valueKey</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">expireKey</span><span class="p">);</span>
<span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">valueKey</span><span class="p">);</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-56"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-56">&#182;</a> </div> <p>Given a key name, fetch it, increment the value and store it again. If
the counter hasn't be initialised yet, set it to zero and then perform
the increment. The fetched value is always parsed as an int to make
sure the increment will work - this means if a non-int was stored, it
will be converted first and thus reset the counter to zero.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">incr</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-57"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-57">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">current</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">key</span><span class="p">),</span> <span class="mi">10</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">current</span><span class="p">){</span>
<span class="nx">current</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
<span class="p">}</span>
<span class="nx">current</span> <span class="o">++</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">current</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">current</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-58"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-58">&#182;</a> </div> <p>Exactly the same as the incr function, but with a decrementing value.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">decr</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-59"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-59">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">current</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">key</span><span class="p">),</span> <span class="mi">10</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">current</span><span class="p">){</span>
<span class="nx">current</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
<span class="p">}</span>
<span class="nx">current</span> <span class="o">--</span><span class="p">;</span>
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">current</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">current</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-60"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-60">&#182;</a> </div> <p>Given a properties object, in the form of {key: value, key:value} set
multiple keys.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">setMany</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">properties</span><span class="p">,</span> <span class="nx">seconds</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-61"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-61">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-62"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-62">&#182;</a> </div> <p>Iterate through all the object properties.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">key</span> <span class="k">in</span> <span class="nx">properties</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-63"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-63">&#182;</a> </div> <p>Ignore any inherited properties, by making sure they are in
the given objecct.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">properties</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="nx">key</span><span class="p">))</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">properties</span><span class="p">[</span><span class="nx">key</span><span class="p">],</span> <span class="nx">seconds</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-64"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-64">&#182;</a> </div> <p>Given an array of keys, return an array of values. If values don't
exist, null will be in their place.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">getMany</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">keys</span><span class="p">){</span>
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="p">{};</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">keys</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-65"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-65">&#182;</a> </div> <p>To ensure that the correct structure is returned, if
the storage backend isn't enabled return an array of null
values with the correct length.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">()){</span>
<span class="nx">results</span><span class="p">[</span><span class="nx">keys</span><span class="p">[</span><span class="nx">i</span><span class="p">]]</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">keys</span><span class="p">[</span><span class="nx">i</span><span class="p">]);</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">results</span><span class="p">[</span><span class="nx">keys</span><span class="p">[</span><span class="nx">i</span><span class="p">]]</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-66"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-66">&#182;</a> </div> <p>Given an array of keys, return an array of values. If values don't
exist, null will be in their place.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">getManyValues</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">keys</span><span class="p">){</span>
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="p">[];</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">keys</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-67"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-67">&#182;</a> </div> <p>To ensure that the correct structure is returned, if
the storage backend isn't enabled return an array of null
values with the correct length.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">()){</span>
<span class="nx">results</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">keys</span><span class="p">[</span><span class="nx">i</span><span class="p">]));</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">results</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="kc">null</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-68"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-68">&#182;</a> </div> <p>Given an array of keys, remove all of them from the cache.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">removeMany</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">keys</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-69"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-69">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">keys</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">keys</span><span class="p">[</span><span class="nx">i</span><span class="p">]);</span>
<span class="p">}</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-70"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-70">&#182;</a> </div> <p>Delete all stored values from the cache. This method will only remove
values added to the storage backend with the locache prefix in the key.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">flush</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-71"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-71">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">length</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">length</span><span class="p">();</span>
<span class="kd">var</span> <span class="nx">prefix</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">cachePrefix</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-72"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-72">&#182;</a> </div> <p>Iteratate through all the keys stored in the storage backend - if
the key tarts with the prefix cache prefix, then remove that key.
backwards to make sure removing items does not mess up the index</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="nx">length</span><span class="o">-</span><span class="mi">1</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&gt;=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span><span class="o">--</span> <span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">key</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">i</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">key</span> <span class="o">&amp;&amp;</span> <span class="nx">key</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="nx">prefix</span><span class="p">)</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">key</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-73"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-73">&#182;</a> </div> <p>Return the number of cache values stored in the storage backend. This
only calculates the values stored by locache</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">length</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-74"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-74">&#182;</a> </div> <p>If the storage backend isn't supported perform a no-op and return
zero.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span> <span class="mi">0</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">length</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">length</span><span class="p">();</span>
<span class="kd">var</span> <span class="nx">prefix</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">cachePrefix</span><span class="p">;</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">i</span><span class="p">).</span><span class="nx">indexOf</span><span class="p">(</span><span class="nx">prefix</span><span class="p">)</span> <span class="o">===</span> <span class="mi">0</span><span class="p">)</span> <span class="nx">c</span><span class="o">++</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">c</span><span class="p">;</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-75"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-75">&#182;</a> </div> <p>A cleanup utility method to remove expired keys. Iterate through all
the keys stored in the storage backend. If they key is a locache key
(it has the prefix) then check to see if the key has expired. If it
has, remove the key from the cache.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">cleanup</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-76"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-76">&#182;</a> </div> <p>If the storage backend isn't enabled perform a no-op.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">enabled</span><span class="p">())</span> <span class="k">return</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">length</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">length</span><span class="p">();</span>
<span class="kd">var</span> <span class="nx">prefix</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">cachePrefix</span><span class="p">;</span>
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">key</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">storage</span><span class="p">.</span><span class="nx">key</span><span class="p">(</span><span class="nx">i</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-77"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-77">&#182;</a> </div> <p>If the key matches, remove the prefix to get the original key
and then make use of the normal remove method that will clean
up the cache value key pair and the cache epiration time key
pair.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">key</span> <span class="o">&amp;&amp;</span> <span class="nx">key</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="nx">prefix</span><span class="p">)</span> <span class="o">===</span> <span class="mi">0</span><span class="p">){</span>
<span class="kd">var</span> <span class="nx">actualKey</span> <span class="o">=</span> <span class="nx">key</span><span class="p">.</span><span class="nx">substring</span><span class="p">(</span><span class="nx">prefix</span><span class="p">.</span><span class="nx">length</span><span class="p">,</span> <span class="nx">key</span><span class="p">.</span><span class="nx">length</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">hasExpired</span><span class="p">(</span><span class="nx">actualKey</span><span class="p">)){</span>
<span class="k">this</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">actualKey</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-78"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-78">&#182;</a> </div> <p>A factory method added to the LocacheCache constructor to create
instances of itself. Rather than placing the class publicly, wrap
it up in a method and keep it for internal usage.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">LocacheCache</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">createCache</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">){</span>
<span class="k">return</span> <span class="k">new</span> <span class="nx">LocacheCache</span><span class="p">(</span><span class="nx">options</span><span class="p">);</span>
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-79"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-79">&#182;</a> </div> <p>The top-level instance. All public locache objects will be
attached to this object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">locache</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">LocacheCache</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-80"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-80">&#182;</a> </div> <p>To provide easy access to session caching, attack another instance of
locache to the main object. This means we can now use the full API
against sessionStorage simply by doing: <code>locache.session.set(...)</code> and
<code>locache.session.get(...)</code></p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">locache</span><span class="p">.</span><span class="nx">session</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">LocacheCache</span><span class="p">({</span>
<span class="nx">storage</span><span class="o">:</span> <span class="nx">locache</span><span class="p">.</span><span class="nx">backends</span><span class="p">.</span><span class="nx">session</span>
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-81"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-81">&#182;</a> </div> <p>Attach the locache namespace to the global window object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">root</span><span class="p">.</span><span class="nx">locache</span> <span class="o">=</span> <span class="nx">locache</span><span class="p">;</span>
<span class="p">}).</span><span class="nx">call</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
Jump to Line
Something went wrong with that request. Please try again.