• Stars
    star
    530
  • Rank 80,831 (Top 2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 10 years ago
  • Updated over 10 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Problem: You need to store a large amount of key-value based data in IE, Chrome, Safari, AND Firefox

LargeLocalStorage

Problem: You need a large key-value store in the browser.

To make things worse:

  • DOMStorage only gives you 5mb
  • Chrome doesn't let you store blobs in IndexedDB
  • Safari doesn't support IndexedDB,
  • IE and Firefox both support IndexedDB but not the FilesystemAPI.

LargeLocalStorage bridges all of that to give you a large capacity (up to several GB when authorized by the user) key-value store in the browser (IE 10, Chrome, Safari 6+, Firefox, Opera).

Basic Rundown / Examples

Creating a database

// Specify desired capacity in bytes
var desiredCapacity = 125 * 1024 * 1024;

// Create a 125MB key-value store
var storage = new LargeLocalStorage({size: desiredCapacity, name: 'myDb'});

// Await initialization of the storage area
storage.initialized.then(function(grantedCapacity) {
  // Check to see how much space the user authorized us to actually use.
  // Some browsers don't indicate how much space was granted in which case
  // grantedCapacity will be 1.
  if (grantedCapacity != -1 && grantedCapacity != desiredCapacity) {
  }
});

Setting data

// You can set the contents of "documents" which are identified by a key.
// Documents can only contains strings for their values but binary
// data can be added as attachments.
// All operations are asynchronous and return Q promises
storage.setContents('docKey', "the contents...").then(function() {
  alert('doc created/updated');
});
  
// Attachments can be added to documents.
// Attachments are Blobs or any subclass of Blob (e.g, File).
// Attachments can be added whether or not a corresponding document exists.
// setAttachment returns a promise so you know when the set has completed.
storage.setAttachment('myDoc', 'titleImage', blob).then(function() {
    alert('finished setting the titleImage attachment');
});

Retrieving Data

// get the contents of a document
storage.getContents('myDoc').then(function(content) {
});

// Call getAttachment with the docKey and attachmentKey
storage.getAttachment('myDoc', 'titleImage').then(function(titleImage) {
    // Create an image element with the retrieved attachment
    // (or video or sound or whatever you decide to attach and use)
    var img = new Image();
    img.src = URL.createObjectURL(titleImage);
    document.body.appendChild(img);
    URL.revokeObjectURL(titleImage);
});


// If you just need a URL to your attachment you can get
// the attachment URL instead of the attachment itself
storge.getAttachmentURL('somePreviouslySavedDoc', 'someAttachment').then(function(url) {
  // do something with the attachment URL
  // ...
    
  // revoke the URL
  storage.revokeAttachmentURL(url);
});

Listing

// You can do an ls to get all of the keys in your data store
storage.ls().then(function(listing) {
  // listing is a list of all of the document keys
  alert(listing);
});
  
// Or get a listing of a document's attachments
storage.ls('somePreviouslySavedDoc').then(function(listing) {
  // listing is a list of all attachments belonging to `somePreviouslySavedDoc`
  alert(listing);
});

Removing

// you can remove a document with rm
// removing a document also removes all of that document's
// attachments.
storage.rm('somePreviouslySavedDoc');
  
// you can also rm an attachment
storage.rmAttachment('someOtherDocKey', 'attachmentKey');

// removals return promises as well so you know when the removal completes (or fails).
storage.rm('docKey').then(function() {
  alert('Removed!');
}, function(err) {
  console.error('Failed removal');
  console.error(err);
});

// clear the entire database
storage.clear();

More:

##Including

Include it on your page with a script tag:

<script src="path/to/LargeLocalStorage.js"></script>

Or load it as an amd module:

define(['components/lls/dist/LargeLocalStorage'], function(lls) {
  var storage = new lls({size: 100 * 1024 * 1024});
});

LLS depends on Q so you'll have to make sure you have that dependency.

##Getting downlad it directly

Or bower install lls

More Repositories

1

strut

Strut - An Impress.js and Bespoke.js Presentation Editor
TypeScript
1,749
star
2

jquery-gradient-picker

A gradient picker widget for jQuery.
JavaScript
44
star
3

commons

Common classes, mostly pertaining to concurrency.
Java
40
star
4

lexed.js

A simple lexer for javascript
JavaScript
31
star
5

TreeSQL

TypeScript
28
star
6

Runners.js

WebWorker task management
JavaScript
16
star
7

yabbe

Yet Another Backbone Binding Extension
CSS
13
star
8

vanilla-fetch

relay with the relay. apollo without the apollo. suspense without the... suspense. fetch then render via async generators.
JavaScript
13
star
9

fk-your-frameworks-todomvc

Fk your bloated code
CSS
10
star
10

d3-polymer-experiments

d3.js + polymer = data driven UIs
JavaScript
8
star
11

bash-snippets

so I won't lose all of those one liners that I find myself needing every few months
Shell
6
star
12

jsonDoclet

Generate JSON from Javadoc comments
Clojure
6
star
13

paperjs-video-clipping

WebRTC and HTML5 video clipping via PaperJS
JavaScript
5
star
14

sqlite-rust-wasm

rust extensions loaded into a sqlite wasm build
JavaScript
4
star
15

4clojure-solutions

http://4clojure.com solutions. Currently just my solutions. Contributors welcome to add fancy or alternate solutions.
Clojure
3
star
16

mocha-script

another f*cking language that compiles to javascript. fml.
JavaScript
3
star
17

aphrodite-p2p

Local-first reimagining of Aphrodite. Based on `mono/model` and `strut` local first concepts.
TypeScript
2
star
18

aphrodite-graphql-starter

Starter project for Aphrodite + Node + GraphQL
TypeScript
2
star
19

misc

Mono-repo of various frameworks I've developed for use in my projects
TypeScript
2
star
20

toerr.js

JavaScript
2
star
21

sqlite-wasm-bench

JavaScript
2
star
22

AMD-Refactor

Basic tools for working with AMD modules
JavaScript
1
star
23

ARMI

asynchronous RMI for Java
Java
1
star
24

fresh_observables

Bringing the best of Javascript event handling to Java
Java
1
star
25

drawstring.js

Draw font formatted string to an HTML5 canvas
JavaScript
1
star
26

overload.js

Method overloading based on parameter types for JS
JavaScript
1
star
27

DATS-DAP

A Javascript parser and evaluator for LDAP style filters
JavaScript
1
star
28

JZombie

Because Java rich clients aren't quite dead...
Java
1
star
29

react-better

There are a lot of things I don't like about React. These are experimental solutions to those things.
JavaScript
1
star
30

EATs

Enlightened Annotations and Tools
Java
1
star
31

wrap.js

No more (typeof define !== 'undefined' && defined.amd ? define(definition) : (typeof module !== 'undefined' && module.exports ? module.exports = definition() : window.module = definition()))
JavaScript
1
star
32

redis-in-browser

JavaScript
1
star
33

blog2

HTML
1
star
34

spoons

hammerspoon config
Lua
1
star
35

aphrodite-node-starter

Scaffold for a nodejs project that uses Aphrodite
TypeScript
1
star
36

strut-workspace

Puts all `vlcn` related initiatives into a single tree
Makefile
1
star
37

note

1
star
38

flashcards

JavaScript
1
star
39

procedural-functional

JavaScript
1
star
40

tantaman

1
star
41

vite-worker-repro

CSS
1
star
42

xcode-starter

Swift
1
star
43

tantaman.github.io

JavaScript
1
star
44

pixel-practice

JavaScript
1
star
45

in-query

1
star
46

vulcan-video-series

TypeScript
1
star
47

aphrodite-crank

Using Aphrodite in a CrankJS app
HTML
1
star