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
| function ImagesStore (id) {
this.children = [];
this.element = document.createElement('div');
this.element.id = id;
this.element.className = 'imgs-store';
}
ImagesStore.prototype = {
constructor: ImagesStore,
add: function (child) {
this.children.push(child);
this.element.appendChild(child.getElement());
},
remove: function (child) {
for(var node, i = 0; node = this.getChild(i); i++) {
if(node === child) {
this.children.splice(i, 1);
break;
}
this.element.removeChild(child.getElement());
}
},
getChild: function (i) {
return this.children[i];
},
getElement: function () {
return this.element;
},
show: function () {
this.element.style.display = '';
for(var node, i = 0; node = this.getChild(i); i++) {
node.show();
}
},
hide: function () {
for(var node, i = 0; node = this.getChild(i); i++) {
node.hide();
}
this.element.style.display = 'none';
}
};
function ImageItem (src) {
this.element = document.createElement('img');
this.element.src = src;
this.element.className = 'img-item';
}
ImageItem.prototype = {
constructor: ImagesStore,
getElement: function () {
return this.element;
}
};
var store = new ImagesStore('imgs');
store.add(new ImageItem('1.jpg'));
store.add(new ImageItem('2.jpg'));
document.body.appendChild(store.element);
|