/** * @description Select multiple albums or photos. */ const isSelectKeyPressed = function(e) { return e.metaKey || e.ctrlKey } multiselect = { ids : [], albumsSelected : 0, photosSelected : 0 } multiselect.position = { top : null, right : null, bottom : null, left : null } multiselect.bind = function() { $('.content').on('mousedown', (e) => { if (e.which===1) multiselect.show(e) }) return true } multiselect.isSelected = function(id) { let pos = $.inArray(id, multiselect.ids) return { selected : (pos===-1 ? false : true), position : pos } } multiselect.toggleItem = function(object, id) { let selected = multiselect.isSelected(id).selected if (selected===false) multiselect.addItem(object, id) else multiselect.removeItem(object, id) } multiselect.addItem = function(object, id) { if (album.isSmartID(id)) return if (multiselect.isSelected(id).selected===true) return let isAlbum = object.hasClass('album') if ((isAlbum && multiselect.photosSelected > 0) || (!isAlbum && multiselect.albumsSelected > 0)) { lychee.error('Please select either albums or photos!') return } multiselect.ids.push(id) multiselect.select(object) if (isAlbum) multiselect.albumsSelected++ else multiselect.photosSelected++ } multiselect.removeItem = function(object, id) { let { selected, pos } = multiselect.isSelected(id) if (selected===false) return multiselect.ids.splice(pos, 1) multiselect.deselect(object) let isAlbum = object.hasClass('album') if (isAlbum) multiselect.albumsSelected-- else multiselect.photosSelected-- } multiselect.albumClick = function(e, albumObj) { let id = albumObj.attr('data-id') if (isSelectKeyPressed(e)) multiselect.toggleItem(albumObj, id) else lychee.goto(id) } multiselect.photoClick = function(e, photoObj) { let id = photoObj.attr('data-id') if (isSelectKeyPressed(e)) multiselect.toggleItem(photoObj, id) else lychee.goto(album.getID() + '/' + id) } multiselect.albumContextMenu = function(e, albumObj) { let id = albumObj.attr('data-id') let selected = multiselect.isSelected(id).selected if (selected!==false) { contextMenu.albumMulti(multiselect.ids, e) multiselect.clearSelection(false) } else { multiselect.clearSelection() contextMenu.album(album.getID(), e) } } multiselect.photoContextMenu = function(e, photoObj) { let id = photoObj.attr('data-id') let selected = multiselect.isSelected(id).selected if (selected!==false) { contextMenu.photoMulti(multiselect.ids, e) multiselect.clearSelection(false) } else { multiselect.clearSelection() contextMenu.photo(photo.getID(), e) } } multiselect.clearSelection = function(deselect = true) { if (deselect) multiselect.deselect('.photo.active, .album.active') multiselect.ids = [] multiselect.albumsSelected = 0 multiselect.photosSelected = 0 } multiselect.show = function(e) { if (lychee.publicMode) return false if (!visible.albums() && !visible.album()) return false if ($('.album:hover, .photo:hover').length!==0) return false if (visible.search()) return false if (visible.multiselect()) $('#multiselect').remove() sidebar.setSelectable(false) multiselect.position.top = e.pageY multiselect.position.right = -1 * (e.pageX - $(document).width()) multiselect.position.bottom = -1 * (multiselect.position.top - $(window).height()) multiselect.position.left = e.pageX $('body').append(build.multiselect(multiselect.position.top, multiselect.position.left)) $(document) .on('mousemove', multiselect.resize) .on('mouseup', (e) => { if (e.which===1) multiselect.getSelection(e) }) } multiselect.resize = function(e) { if (multiselect.position.top === null || multiselect.position.right === null || multiselect.position.bottom === null || multiselect.position.left === null) return false let newSize = {} let documentSize = {} // Get the position of the mouse let mousePos = { x : e.pageX, y : e.pageY } // Default CSS let newCSS = { top : null, bottom : null, height : null, left : null, right : null, width : null } if (mousePos.y>=multiselect.position.top) { documentSize.height = $(document).height() // Do not leave the screen newSize.height = mousePos.y - multiselect.position.top if ((multiselect.position.top + newSize.height)>=documentSize.height) { newSize.height -= (multiselect.position.top + newSize.height) - documentSize.height + 2 } newCSS.top = multiselect.position.top newCSS.bottom = 'inherit' newCSS.height = newSize.height } else { newCSS.top = 'inherit' newCSS.bottom = multiselect.position.bottom newCSS.height = multiselect.position.top - e.pageY } if (mousePos.x>=multiselect.position.left) { documentSize.width = $(document).width() // Do not leave the screen newSize.width = mousePos.x - multiselect.position.left if ((multiselect.position.left + newSize.width)>=documentSize.width) { newSize.width -= (multiselect.position.left + newSize.width) - documentSize.width + 2 } newCSS.right = 'inherit' newCSS.left = multiselect.position.left newCSS.width = newSize.width } else { newCSS.right = multiselect.position.right newCSS.left = 'inherit' newCSS.width = multiselect.position.left - e.pageX } // Updated all CSS properties at once $('#multiselect').css(newCSS) } multiselect.stopResize = function() { if (multiselect.position.top!==null) $(document).off('mousemove mouseup') } multiselect.getSize = function() { if (!visible.multiselect()) return false let $elem = $('#multiselect') let offset = $elem.offset() return { top : offset.top, left : offset.left, width : parseInt($elem.css('width').replace('px', '')), height : parseInt($elem.css('height').replace('px', '')) } } multiselect.getSelection = function(e) { let tolerance = 150 let ids = [] let size = multiselect.getSize() if (visible.contextMenu()) return false if (!visible.multiselect()) return false if (!isSelectKeyPressed(e) && (size.width==0 || size.height==0)) { multiselect.close() return false } $('.photo, .album').each(function() { let offset = $(this).offset() if (offset.top>=(size.top - tolerance) && offset.left>=(size.left - tolerance) && (offset.top + 206)<=(size.top + size.height + tolerance) && (offset.left + 206)<=(size.left + size.width + tolerance)) { let id = $(this).attr('data-id') multiselect.addItem($(this), id) } }) multiselect.hide() } multiselect.select = function(id) { let el = $(id) el.addClass('selected') el.addClass('active') } multiselect.deselect = function(id) { let el = $(id) el.removeClass('selected') el.removeClass('active') } multiselect.hide = function() { sidebar.setSelectable(true) multiselect.stopResize() multiselect.position.top = null multiselect.position.right = null multiselect.position.bottom = null multiselect.position.left = null lychee.animate('#multiselect', 'fadeOut') setTimeout(() => $('#multiselect').remove(), 300) } multiselect.close = function() { multiselect.clearSelection() multiselect.hide() }