X-Git-Url: https://svn.cri.ensmp.fr/git/Portfolio.git/blobdiff_plain/b0c1ded6394ded5256536121116e5968996dd7c7..cae5c6e0cfbb0fcb3181a95f83c839e8a30f146e:/skins/photo_lightbox_viewer.js diff --git a/skins/photo_lightbox_viewer.js b/skins/photo_lightbox_viewer.js index dc2547e..7361a4f 100644 --- a/skins/photo_lightbox_viewer.js +++ b/skins/photo_lightbox_viewer.js @@ -13,11 +13,25 @@ var reSelected = /.*selected.*/; Lightbox = function(grid) { this.grid = grid; + this.lastCBChecked = undefined; + this.form = undefined; + var parent = this.grid.parentNode; + while(parent) { + parent = parent.parentNode; + if (parent.tagName === 'FORM') { + this.form = parent; + break; + } + else if (parent.tagName === 'BODY') { + break; + } + } thisLightbox = this; addListener(this.grid, 'click', function(evt){thisLightbox.mouseClickHandler(evt);}); - if (!browser.isGecko){ - addListener(this.grid, 'mouseover', function(evt){thisLightbox.mouseOverHandler(evt);}); - addListener(this.grid, 'mouseout', function(evt){thisLightbox.mouseOutHandler(evt);}); + if (this.form) { + var fm = new FormManager(this.form); + fm.onBeforeSubmit = function(fm_, evt) {return thisLightbox.onBeforeSubmit(fm_, evt);}; + fm.onResponseLoad = function(req) {return thisLightbox.onResponseLoad(req);}; } }; @@ -99,31 +113,132 @@ Lightbox.prototype.mouseClickHandler = function(evt) { break; } } + } else if(target.tagName === 'INPUT' && target.type === 'checkbox') { + var cb = target; + if (cb.checked) { + cb.setAttribute('checked', 'checked'); + } + else { + cb.removeAttribute('checked'); + } + this.selectCBRange(evt); } }; -Lightbox.prototype.mouseOverHandler = function(evt) { - var target = getTargetedObject(evt); - if (target.tagName==='AREA') { - var slide = target.parentNode.parentNode; - if(reSelected.test(slide.className)) { - slide.className = 'slide_over_selected';} - else { - slide.className = 'slide_over';} +Lightbox.prototype.onBeforeSubmit = function(fm, evt) { + switch(fm.submitButton.name) { + case 'delete' : + this.hideSelection(); + break; + } +}; + +Lightbox.prototype.onResponseLoad = function(req) { + switch(req.responseXML.documentElement.nodeName) { + case 'deleted' : + this.deleteSelection(); + break; + case 'error' : + this.showSelection(); + break; + } +}; + +Lightbox.prototype.hideSelection = function() { + var i, e, slide; + for (i=0 ; i<this.form.elements.length ; i++) { + e = this.form.elements[i]; + if (e.type === 'checkbox' && e.checked) { + slide = e.parentNode.parentNode; + slide.classList.add('zero_opacity'); + } + } +}; + +Lightbox.prototype.showSelection = function() { + var i, e, slide; + for (i=0 ; i<this.form.elements.length ; i++) { + e = this.form.elements[i]; + if (e.type === 'checkbox' && e.checked) { + slide = e.parentNode.parentNode; + slide.classList.remove('zero_opacity'); + } } }; -Lightbox.prototype.mouseOutHandler = function(evt) { +Lightbox.prototype.deleteSelection = function() { + var i, e, slide; + for (i=0 ; i<this.form.elements.length ; i++) { + e = this.form.elements[i]; + if (e.type === 'checkbox' && e.checked) { + slide = e.parentNode.parentNode; + slide.classList.add('zero_width'); + } + } + var self = this; + // if you change this, delay you should also change this css ruleĆ : + // .lightbox span { transition: width 1s + setTimeout(function(){self._removeSelection();}, 1000); +}; + +Lightbox.prototype._removeSelection = function() { + console.info('_removeSelection'); + var i, e, slide; + var toRemove = []; + for (i=0 ; i<this.form.elements.length ; i++) { + e = this.form.elements[i]; + if (e.type === 'checkbox' && e.checked) { + toRemove.push(e.parentNode.parentNode); + } + } + for (i=0 ; i<toRemove.length ; i++) { + slide = toRemove[i]; + slide.parentNode.removeChild(slide); + } + this.cbIndex = undefined; +}; + +Lightbox.prototype.getCBIndex = function(cb) { + if (!this.cbIndex) { + // build checkbox index + this.cbIndex = []; + var i, node, c; + var nodes = this.grid.childNodes; + for (i=0 ; i<nodes.length ; i++) { + node = nodes[i]; + if (node.nodeName === 'SPAN') { + c = node.getElementsByTagName('input')[0]; + c.index = this.cbIndex.length; + this.cbIndex[this.cbIndex.length] = c; + } + } + } + return cb.index; +}; + +Lightbox.prototype.selectCBRange = function(evt) { var target = getTargetedObject(evt); - if (target.tagName==='AREA') { - var slide = target.parentNode.parentNode; - if(reSelected.test(slide.className)) { - slide.className = 'selected';} - else { - slide.className = undefined;} + evt = getEventObject(evt); + var shift = evt.shiftKey; + if (shift && this.lastCBChecked) { + var from = this.getCBIndex(this.lastCBChecked); + var to = this.getCBIndex(target); + var start = Math.min(from, to); + var stop = Math.max(from, to); + var i; + for (i=start ; i<stop ; i++ ) { + this.cbIndex[i].setAttribute('checked', 'checked'); + } + } + else if (target.checked) { + this.lastCBChecked = target; + } + else { + this.lastCBChecked = undefined; } }; + var _outlineSelectedSlide; if (browser.isGecko) { _outlineSelectedSlide = function(slide) { @@ -139,4 +254,4 @@ else { }; } -})(); \ No newline at end of file +}()); \ No newline at end of file