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
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove list-style: none;
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove #log { margin-top: 1em; }
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove height: 200px;
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove margin-top: 1em;
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove #photos img {
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove margin-right: 10px;
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove max-height: 200px;
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove _height: 200px;
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove _width: auto;
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove <li><label><input type="checkbox" id="asparagus">Asparagus</label></li>
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove <li><label><input type="checkbox" id="bluebird">Bluebird</label></li>
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove <li><label><input type="checkbox" id="coffee">Coffee</label></li>
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove <label><input type="radio" name="mode" id="add" checked>addValue</label>
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove <label><input type="radio" name="mode" id="replace">replaceValue</label>
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grovevar Y = YUI({
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove filter: 'raw',
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove history: 'debug',
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove 'history-hash-ie': 'debug'
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove useBrowserConsole: false
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove}).use('console', 'event-delegate', 'history-hash-ie', 'json-stringify', function (Y) {
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove new Y.Console().render('#log');
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove var history = new Y.History(),
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove bookmarked = history.get(),
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove asparagus: 'http://farm5.static.flickr.com/4005/4686935131_253e921bf7_m.jpg', // http://www.flickr.com/photos/allenr/4686935131/
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove bluebird : 'http://farm1.static.flickr.com/26/66307916_811efccdfc_m.jpg', // http://www.flickr.com/photos/allenr/66307916/
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove coffee : 'http://farm4.static.flickr.com/3336/4638474362_093edb7565_m.jpg' // http://www.flickr.com/photos/allenr/4638474362/
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove menuNode = Y.one('#menu'),
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove photosNode = Y.one('#photos');
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove function refresh(state) {
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove menuNode.all('input[type="checkbox"]').set('checked', false);
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove Y.Object.each(state, function (value, key) {
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove if (Y.Object.owns(images, key)) {
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove var img = new Image();
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove img.src = images[key];
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove menuNode.one('#' + key).set('checked', true);
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove Y.on('history:change', function (e) {
5d6692f9027ead248cdde240c3322a5c6693fb57Ryan Grove Y.log('history:change');
d7da83936765176d7b96362d930f5ee3577ff4a2Ryan Grove menuNode.delegate('click', function (e) {
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove add = Y.one('#add');
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove history[add.get('checked') ? 'addValue' : 'replaceValue'](
4f3d595b5be429e660aff77c04f66411e896eef7Ryan Grove node.get('id'), node.get('checked') ? '1' : null);
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove }, 'input');
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove Y.log("Not using the IE iframe hack since this isn't IE 6/7.")
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove // Refresh with the bookmarked state, if any.
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove Y.log('Bookmarked state: ' + Y.JSON.stringify(bookmarked));
7171ee92f007bcaf39a1944e715d2514dd446c10Ryan Grove refresh(bookmarked);