-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathStorage.html
159 lines (122 loc) · 3.88 KB
/
Storage.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>$.store jQuery plugin</title>
<meta name="title" content="$.store() jQuery plugin" />
<meta name="description" content="Persistently storing data on the client side" />
<script type="text/javascript" src="js/jquery1.91.min.js"></script>
<script type="text/javascript" src="js/asdui.js"></script>
<script type="text/javascript">
(function($,undefined){
// initialize storage API
$.storage = new ZUI.Storage();
var obj = "aaa";
// build some demo interface
var $buttons;
var log = function( m )
{
$('<p>'+ m +'</p>').insertAfter( $buttons );
}
var poll = function()
{
var j = $.storage.get('event');
log(j);
}
var push = function()
{
$.storage.set('event', obj, 0.0001);
}
var clear = function()
{
$.storage.del('event');
}
$(function(){
$buttons = $( '<div></div>' ).prependTo( $( document.body ) );
$( '<button type="button">start writing</button>' ).appendTo( $buttons ).bind( 'click', function()
{
push()
});
$( '<button type="button">start reading</button>' ).appendTo( $buttons ).bind( 'click', function()
{
poll();
});
$( '<button type="button">clear</button>' ).appendTo( $buttons ).bind( 'click', function()
{
clear();
});
console.log(86400000);
console.log(new Date().getTime());
});
})(jQuery);
</script>
</head>
<body>
<script type="text/javascript">
document.write( '<p>Initialized $.storage with driver ' + $.storage.driver.ident + '</p>' );
</script>
<h1>$.store</h1>
<p>
<code>$.store</code> is a simple, yet easily extensible, plugin to persistently store data on the client side of things.
It uses <code>window.localStore</code> where available. Older Internet Explorers will use <code>userData</code>.
If all fails <code>$.store</code> will save your data to <code>window.name</code>.
</p>
<p>
Note: The <code>windowName</code> will only do JSON serialization. <code>windowName</code>
is not persistent in the sense of making it accross a closed browser window. If you need
that ability you should check <code>$.storage.driver.scope == "browser"</code>.
</p>
<h2>Usage</h2>
<pre>//initialize
$.storage = new $.store();
// save a value
$.storage.set( key, value );
// read a value
$.storage.get( key );
// deletes a value
$.storage.del( key );
// delete all values
$.storage.flush();</pre>
<h2>Adding Serializers</h2>
<p>
You can easily add your own serializers to the stack.
Make sure to add them before initializing the <code>$.store</code>.
Note: Serializers do not apply to the <code>windowName</code> storage driver.
</p>
<pre>$.store.serializers.yaddayadda = {
ident: "$.store.serializers.yaddayadda",
init: function( encoders, decoders )
{
// register your serializer with en/decoder stack
encoders.unshift( "yaddayadda" );
decoders.push( "yaddayadda" );
},
isYaddaYadda: function( value )
{
// determine if value should be processed by this serializer
return true;
},
encode: function( value )
{
// check if the value can be encoded
if( !value || value._serialized || !this.isYaddaYadda( value ) )
return value;
// prepare serialized-data-wrapper
var _value = { _serialized: this.ident, value: value };
// work your magic
_value.value = "serializedVersionOf data";
return value;
},
decode: function( value )
{
// check if the value can be decoded
if( !value || !value._serialized || value._serialized != this.ident )
return value;
// work your magic
value.value = "unserializedVersionOf data";
return this.isYaddaYadda( value.value ) ? value.value : undefined;
}
};</pre>
</body>
</html>