X-Git-Url: https://scm.cri.minesparis.psl.eu/git/Portfolio.git/blobdiff_plain/7ac0ca74ce1435919f21b6a0e5b28ba40cf00780..e73353500c67453ef9663d67eaeee7dd46c358ee:/skins/photo_film_viewer.js diff --git a/skins/photo_film_viewer.js b/skins/photo_film_viewer.js deleted file mode 100644 index edf2069..0000000 --- a/skins/photo_film_viewer.js +++ /dev/null @@ -1,675 +0,0 @@ -/* -* © 2008-2014 Benoît Pin – Centre de recherche en informatique – MINES ParisTech -* http://plinn.org -* Licence Creative Commons http://creativecommons.org/licenses/by-nc/2.0/ -* -* -*/ - -var FilmSlider; - -(function(){ - -var keyLeft = 37, keyRight = 39; -var isTextMime = /^text\/.+/i; -var isAddToSelection = /.*\/add_to_selection$/; -var imgRequestedSize = /size=(\d+)/; -var DEFAULT_IMAGE_SIZES = [500, 600, 800]; - -FilmSlider = function(filmBar, slider, ctxInfos, image, toolbar, breadcrumbs) { - var thisSlider = this; - this.filmBar = filmBar; - var film = filmBar.firstChild; - if (film.nodeType === 3) { film = film.nextSibling; } - this.film = film; - this.slider = slider; - this.rail = slider.parentNode; - this.sliderSpeedRatio = undefined; - this.sliderRatio = undefined; - this.selectedSlide = undefined; - this.selectedSlideInSelection = undefined; - this.cartSlide = document.getElementById('cart_slide'); - this.image = image; - this.stretchable = image.parentNode; - this.viewMode = 'medium'; - - this.buttons = []; - this.toolbar = toolbar; - if (breadcrumbs) { - var bcElements = breadcrumbs.getElementsByTagName('a'); - this.lastBCElement = bcElements[bcElements.length-1]; - var imgSrcParts = image.src.split('/'); - this.lastBCElement.innerHTML = imgSrcParts[imgSrcParts.length-2]; - this.hasBreadcrumbs = true; - } - else { - this.hasBreadcrumbs = false; - } - - var buttons = toolbar.getElementsByTagName('img'); - var b, name, i; - for (i=0 ; i this.winSize['width'] || - y < 0 || - y > this.winSize['height'] - ) { - this.mouseUpHandler(evt); - } -}; - -FilmSlider.prototype.thumbnailClickHandler = function(evt) { - var target = getTargetedObject(evt); - while (target.tagName !== 'A' && target !== this.filmBar) - target = target.parentNode; - if (target.tagName !== 'A') { return; } - else { - if (this.viewMode === 'full') { - this.mosaique.unload(); - this.mosaique = null; - this.viewMode = 'medium'; - } - disableDefault(evt); - disablePropagation(evt); - target.blur(); - history.pushState(target.href, '', target.href); - - var imgBaseUrl = target.href; - var canonicalImgUrl; - if (this.ctxUrlTranslation[0]) { - canonicalImgUrl = imgBaseUrl.replace(this.ctxUrlTranslation[0], - this.ctxUrlTranslation[1]); - } - else { canonicalImgUrl = imgBaseUrl; } - - var ajaxUrl = imgBaseUrl + '/photo_view_ajax'; - var thisFS = this; - - //this.pendingImage.src = canonicalImgUrl + '/getResizedImage?size=600'; - var thumbnail = target.getElementsByTagName('IMG')[0]; - var bestFitSize = this.getBestFitSize(thumbnail.height/thumbnail.width); - this.pendingImage.src = canonicalImgUrl + '/getResizedImage?size=' + bestFitSize; - - // update buttons - var fullScreenLink = this.buttons['full_screen'].parentNode; - fullScreenLink.href = canonicalImgUrl + '/zoom_view'; - - var toggleSelectionBtn = this.buttons['toggle_selection']; - var toggleSelectionLink = toggleSelectionBtn.parentNode; - this.selectedSlideInSelection = (target.className==='selected'); - if (this.selectedSlideInSelection) { - toggleSelectionBtn.src = portal_url() + '/unselect_flag_btn.gif'; - toggleSelectionBtn.alt = toggleSelectionLink.title = 'Retirer de la sélection'; - toggleSelectionLink.href = canonicalImgUrl + '/remove_to_selection'; - } - else { - toggleSelectionBtn.src = portal_url() + '/select_flag_btn.gif'; - toggleSelectionBtn.alt = toggleSelectionLink.title = 'Ajouter à la sélection'; - toggleSelectionLink.href = canonicalImgUrl + '/add_to_selection'; - } - - var showBuyableButtonLink = this.buttons['show_buyable'].parentNode; - showBuyableButtonLink.href = canonicalImgUrl + '/get_slide_buyable_items'; - this.cartSlide.innerHTML = ''; - this.cartSlide.style.visibility='hidden'; - - - var metadataButton = this.buttons['edit_metadata'] - if (metadataButton) { - var metadataEditLink = metadataButton.parentNode; - metadataEditLink.href = canonicalImgUrl + '/photo_edit_form' - } - - - var req = new XMLHttpRequest(); - req.onreadystatechange = function() { - switch (req.readyState) { - case 1 : - showProgressImage(); - break; - case 2 : - try { - if (! isTextMime.exec(req.getResponseHeader('Content-Type'))) { - req.onreadystatechange = null; - req.abort(); - hideProgressImage(); - window.location.href = thisFS._fallBackUrl; - } - } - catch(e){} - break; - case 4 : - hideProgressImage(); - if (req.status === '200') { thisFS.populateViewer(req); } - // else - // //window.location.href = target.href; - // console.error(ajaxUrl); - - }; - }; - - req.open("GET", ajaxUrl, true); - req.send(null); - - // update old displayed slide className - var className = this.selectedSlide.className; - var classes = className.split(' '); - var newClasses = []; - var name, i; - - for (i in classes) { - name = classes[i]; - if (name === 'displayed') { continue; } - else { newClasses.push(name); } - } - - this.selectedSlide.className = newClasses.join(' ') - - // hightlight new displayed slide - this.selectedSlide = target; - className = this.selectedSlide.className; - classes = className.split(' '); - classes.push('displayed'); - this.selectedSlide.className = classes.join(' '); - } -}; - -FilmSlider.prototype.toolbarClickHandler = function(evt) { - var target = getTargetedObject(evt); - if(target.tagName === 'IMG' && target.getAttribute('name')) { - switch(target.getAttribute('name')) { - case 'previous' : - disableDefault(evt); - disablePropagation(evt); - var button = target; - var link = button.parentNode; - link.blur(); - this.loadSibling(true); - break; - case 'next' : - disableDefault(evt); - disablePropagation(evt); - var button = target; - var link = button.parentNode; - link.blur(); - this.loadSibling(false); - break; - case 'full_screen': - disableDefault(evt); - disablePropagation(evt); - target.parentNode.blur(); - if (this.viewMode === 'full') { - this.mosaique.unload(); - this.mosaique = null; - this.viewMode = 'medium'; - return; - } - var main = document.getElementById('photo_viewer'); - var url = target.parentNode.href; - url = url.substring(0, url.length - '/zoom_view'.length); - var margins = {'top':0, 'right':-1, 'bottom':0, 'left':0}; - this.mosaique = new Mosaique(main, url, margins); - this.viewMode = 'full'; - break; - - case 'toggle_selection': - disableDefault(evt); - disablePropagation(evt); - var button = target; - var link = button.parentNode; - link.blur(); - - var req = new XMLHttpRequest(); - var url = link.href; - req.open("POST", url, true); - req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8"); - req.send("ajax=1"); - - // toggle button - var parts = url.split('/'); - var canonicalImgUrl = parts.slice(0, parts.length-1).join('/'); - - if (isAddToSelection.test(url)) { - button.src = portal_url() + '/unselect_flag_btn.gif'; - button.alt = link.title = 'Retirer de la sélection'; - link.href = canonicalImgUrl + '/remove_to_selection'; - this.selectedSlide.className = 'selected displayed'; - this.image.parentNode.className = 'selected'; - this.selectedSlideInSelection = true; - } - else { - button.src = portal_url() + '/select_flag_btn.gif'; - button.alt = link.title = 'Ajouter à la sélection'; - link.href = canonicalImgUrl + '/add_to_selection'; - this.selectedSlide.className = 'displayed'; - this.image.parentNode.className = ''; - this.selectedSlideInSelection = false; - } - break; - - case 'show_buyable': - disableDefault(evt); - disablePropagation(evt); - var button = target; - var link = button.parentNode; - link.blur(); - var slide = this.cartSlide; - slide.innerHTML = ''; - slide.style.visibility = 'visible'; - var cw = new CartWidget(slide, link.href); - cw.onCancel = function() { - CartWidget.prototype.onCancel.apply(this); - slide.style.visibility = 'hidden'; - }; - cw.onAfterConfirm = function() { - slide.style.visibility = 'hidden'; - }; - break; - - - - - /* - case 'edit_metadata' : - disableDefault(evt); - disablePropagation(evt); - target.blur(); - if (this.viewMode === 'full') { - this.mosaique.unload(); - this.mosaique = null; - this.viewMode = 'medium'; - return; - } - var fi = new FragmentImporter(absolute_url()); - fi.useMacro('metadata_edit_form_macros', 'iptc', 'image_metadata'); - break; - */ - } - } -}; - - -if(browser.isDOM2Event) { - if (browser.isAppleWebKit) { - FilmSlider.prototype.mouseWheelHandler = function(evt) { - disableDefault(evt); - var pos = this.getSliderPosition(); - pos.x -= evt.wheelDelta / 40; - this.setSliderPosition(pos); - }; - } - else { - FilmSlider.prototype.mouseWheelHandler = function(evt) { - disableDefault(evt); - var pos = this.getSliderPosition(); - pos.x += evt.detail * 3; - this.setSliderPosition(pos); - }; - } -} -else if (browser.isIE6up) { - FilmSlider.prototype.mouseWheelHandler = function() { - var evt = window.event; - evt.returnValue = false; - var pos = this.getSliderPosition(); - pos.x -= evt.wheelDelta / 40; - this.setSliderPosition(pos); - }; -} - -FilmSlider.prototype.keyDownHandler = function(evt) { - var evt = getEventObject(evt); - switch (evt.keyCode) { - case keyLeft : - this.loadSibling(true); - break; - case keyRight : - this.loadSibling(false); - break; - default: - return; - } -}; - - -FilmSlider.prototype.keyPressHandler = function(evt) { - var target = getTargetedObject(evt); - if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA') { return; } - var evt = getEventObject(evt); - var charPress = String.fromCharCode((evt.keyCode) ? evt.keyCode : evt.which); - switch(charPress) { - case 'f': - case 'F': - raiseMouseEvent(this.buttons['full_screen'], 'click'); - break; - } -}; - -FilmSlider.prototype.populateViewer = function(req) { - var elements = req.responseXML.documentElement.childNodes; - for(var i=0 ; i < elements.length ; i++ ) { - element = elements[i]; - switch (element.nodeName) { - case 'fragment' : - var dest = document.getElementById(element.getAttribute('id')); - if (dest) { dest.innerHTML = element.firstChild.nodeValue; } - break; - case 'imageattributes' : - var link = this.buttons['back_to_portfolio'].parentNode; - link.href = element.getAttribute('backToContextUrl'); - link = this.buttons['show_buyable'].parentNode; - var buyable = element.getAttribute('buyable'); - if(buyable === 'True') { link.className = null; } - else if(buyable === 'False') { link.className = 'hidden'; } - this.image.alt = element.getAttribute('alt'); - this.updateBreadcrumbs(element.getAttribute('lastBcUrl'), - element.getAttribute('img_id')); - break; - } - } -}; - -FilmSlider.prototype.refreshImage = function() { - this.image.style.visibility = 'hidden'; - this.image.src = this.pendingImage.src; - this.image.width = this.pendingImage.width; - this.image.height = this.pendingImage.height; - this.image.style.visibility = 'visible'; - if (this.selectedSlideInSelection) { this.image.parentNode.className = 'selected'; } - else { this.image.parentNode.className = ''; } -}; - -FilmSlider.prototype.updateBreadcrumbs = function(url, title) { - if (this.hasBreadcrumbs) { - this.lastBCElement.href = element.getAttribute('lastBcUrl'); - this.lastBCElement.innerHTML = element.getAttribute('img_id'); - } -}; - -FilmSlider.prototype.startSlideShow = function() { - this.slideShowSlide = this.pendingSlideShowSlide = this.selectedSlide; - return this.slideShowSlide.href; -}; - -FilmSlider.prototype.slideShowNext = function() { - var nextSlide = this.slideShowSlide.parentNode.nextSibling; - if (nextSlide && nextSlide.nodeType===3) { nextSlide = nextSlide.nextSibling; } - - if (nextSlide) { - nextSlide = nextSlide.getElementsByTagName('a')[0]; - this.pendingSlideShowSlide = nextSlide; - return this.pendingSlideShowSlide.href; - } - else { - var row = this.slideShowSlide.parentNode.parentNode; - var first = row.firstChild; - if (first.nodeType===3) - first = first.nextSibling; - this.pendingSlideShowSlide = first.getElementsByTagName('a')[0]; - return this.pendingSlideShowSlide.href; - } -}; - -FilmSlider.prototype.slideShowPrevious = function() { - var previousSlide = this.slideShowSlide.parentNode.previousSibling; - if (previousSlide && previousSlide.nodeType===3) { previousSlide = previousSlide.previousSibling; } - - if (previousSlide) { - previousSlide = previousSlide.getElementsByTagName('a')[0]; - this.pendingSlideShowSlide = previousSlide; - return this.pendingSlideShowSlide.href; - } - else { - var row = this.slideShowSlide.parentNode.parentNode; - var last = row.lastChild; - if (last.nodeType===3) { last = last.previousSibling; } - this.pendingSlideShowSlide = last.getElementsByTagName('a')[0]; - return this.pendingSlideShowSlide.href; - } -}; - -FilmSlider.prototype.slideShowImageLoaded = function() { - this.slideShowSlide = this.pendingSlideShowSlide; -}; - -FilmSlider.prototype.stopSlideShow = function() { - raiseMouseEvent(this.slideShowSlide, 'click'); - var index = parseInt(this.selectedSlide.getAttribute('portfolio:position')); - this.centerSlide(index); -}; - - -/* UTILS */ -function Point(x, y) { - this.x = Math.round(x); - this.y = Math.round(y); -} -Point.prototype.diff = function(point) { return new Point(this.x - point.x, this.y - point.y); }; -Point.prototype.add = function(point) { return new Point(this.x + point.x, this.y + point.y); }; -Point.prototype.mul = function(k) { return new Point(this.x * k, this.y *k)}; -Point.prototype.toString = function() { return "(" + String(this.x) + ", " + String(this.y) + ")"; }; - -})();