Ajout cases à cocher pour réaliser une sélection sur les photos. Implémentation du...
[Portfolio.git] / skins / photo_lightbox_viewer.js
1 /*
2 * 2008-2014 Benoit Pin - MINES ParisTech
3 * http://plinn.org
4 * Licence Creative Commons http://creativecommons.org/licenses/by-nc/2.0/
5 */
6
7
8 var Lightbox;
9
10 (function(){
11
12 var reSelected = /.*selected.*/;
13
14 Lightbox = function(grid) {
15 this.grid = grid;
16 this.lastCBChecked = undefined;
17 thisLightbox = this;
18 addListener(this.grid, 'click', function(evt){thisLightbox.mouseClickHandler(evt);});
19 if (!browser.isGecko){
20 addListener(this.grid, 'mouseover', function(evt){thisLightbox.mouseOverHandler(evt);});
21 addListener(this.grid, 'mouseout', function(evt){thisLightbox.mouseOutHandler(evt);});
22 }
23 };
24
25 Lightbox.prototype.mouseClickHandler = function(evt) {
26 var target = getTargetedObject(evt);
27 if (target.tagName === 'IMG') {
28 var img = target;
29 var link = target.parentNode;
30 var button = link.parentNode;
31 var slide = button.parentNode;
32 var req, url;
33 if (link.tagName === 'A') {
34 switch(link.getAttribute('name')) {
35 case 'add_to_selection':
36 disableDefault(evt);
37 link.blur();
38 req = new XMLHttpRequest();
39 url = link.href;
40 req.open("POST", url, true);
41 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
42 req.send("ajax=1");
43
44 slide.className = 'selected';
45
46 link.setAttribute('name', 'remove_to_selection');
47 link.href = url.replace(/(.*\/)add_to_selection$/, '$1remove_to_selection');
48 link.title = img.alt = 'Retirer de la sélection';
49 button.className = "button slide-deselect";
50 break;
51
52 case 'remove_to_selection':
53 disableDefault(evt);
54 link.blur();
55 req = new XMLHttpRequest();
56 url = link.href;
57 req.open("POST", url, true);
58 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
59 req.send("ajax=1");
60 slide.className = null;
61 link.setAttribute('name', 'add_to_selection');
62 link.href = url.replace(/(.*\/)remove_to_selection$/, '$1add_to_selection');
63 link.title = img.alt = 'Ajouter à la sélection';
64 button.className = "button slide-select";
65 break;
66
67 case 'add_to_cart' :
68 disableDefault(evt);
69 slide.widget = new CartWidget(slide, link.href);
70 break;
71
72 case 'hide_for_anonymous':
73 disableDefault(evt);
74 link.blur();
75 req = new XMLHttpRequest();
76 url = link.href;
77 req.open("POST", url, true);
78 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
79 req.send(null);
80 slide.className = 'hidden-slide';
81 link.setAttribute('name', 'show_for_anonymous');
82 link.href = url.replace(/(.*\/)hideForAnonymous$/, '$1resetHide');
83 link.title = img.alt = 'Montrer au anonymes';
84 button.className = "button slide-show";
85 break;
86
87 case 'show_for_anonymous':
88 disableDefault(evt);
89 link.blur();
90 req = new XMLHttpRequest();
91 url = link.href;
92 req.open("POST", url, true);
93 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
94 req.send(null);
95 slide.className = null;
96 link.setAttribute('name', 'hide_for_anonymous');
97 link.href = url.replace(/(.*\/)resetHide$/, '$1hideForAnonymous');
98 link.title = img.alt = 'Masquer pour les anonymes';
99 button.className = "button slide-hide";
100 break;
101 }
102 }
103 } else if(target.tagName === 'INPUT' && target.type === 'checkbox') {
104 var cb = target;
105 if (cb.checked) {
106 cb.setAttribute('checked', 'checked');
107 }
108 else {
109 cb.removeAttribute('checked');
110 }
111 this.selectCBRange(evt);
112 }
113 };
114
115 Lightbox.prototype.mouseOverHandler = function(evt) {
116 var target = getTargetedObject(evt);
117 if (target.tagName==='AREA') {
118 var slide = target.parentNode.parentNode;
119 if(reSelected.test(slide.className)) {
120 slide.className = 'slide_over_selected';}
121 else {
122 slide.className = 'slide_over';}
123 }
124 };
125
126 Lightbox.prototype.mouseOutHandler = function(evt) {
127 var target = getTargetedObject(evt);
128 if (target.tagName==='AREA') {
129 var slide = target.parentNode.parentNode;
130 if(reSelected.test(slide.className)) {
131 slide.className = 'selected';}
132 else {
133 slide.className = undefined;}
134 }
135 };
136
137 Lightbox.prototype.getCBIndex = function(cb) {
138 if (!this.cbIndex) {
139 // build checkbox index
140 this.cbIndex = [];
141 var i, node, c;
142 var nodes = this.grid.childNodes;
143 for (i=0 ; i<nodes.length ; i++) {
144 node = nodes[i];
145 if (node.nodeName === 'SPAN') {
146 c = node.getElementsByTagName('input')[0];
147 c.index = this.cbIndex.length;
148 this.cbIndex[this.cbIndex.length] = c;
149 }
150 }
151 }
152 return cb.index;
153 };
154
155 Lightbox.prototype.selectCBRange = function(evt) {
156 var target = getTargetedObject(evt);
157 evt = getEventObject(evt);
158 var shift = evt.shiftKey;
159 if (shift && this.lastCBChecked) {
160 var from = this.getCBIndex(this.lastCBChecked);
161 var to = this.getCBIndex(target);
162 var start = Math.min(from, to);
163 var stop = Math.max(from, to);
164 var i;
165 for (i=start ; i<stop ; i++ ) {
166 this.cbIndex[i].setAttribute('checked', 'checked');
167 }
168 }
169 else if (target.checked) {
170 this.lastCBChecked = target;
171 }
172 else {
173 this.lastCBChecked = undefined;
174 }
175 };
176
177
178 var _outlineSelectedSlide;
179 if (browser.isGecko) {
180 _outlineSelectedSlide = function(slide) {
181 slide.className = 'selected';
182 };
183 }
184 else {
185 _outlineSelectedSlide = function(slide) {
186 if (slide.className &&
187 !reSelected.test(slide.className)) {
188 slide.className = slide.className + ' selected';
189 }
190 };
191 }
192
193 }());