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 }());