ViewUtils.js

define(function(require,exports,module){const _=require("thirdparty/lodash"),ProjectManager=require("project/ProjectManager"),LanguageManager=require("language/LanguageManager");var SCROLL_SHADOW_HEIGHT=5,_resizeHandlers=[];function _updateScrollerShadow($displayElement,$scrollElement,$shadowTop,$shadowBottom,isPositionFixed){var offsetTop=0,scrollElement=$scrollElement.get(0),scrollTop=scrollElement.scrollTop,topShadowOffset=Math.min(scrollTop-SCROLL_SHADOW_HEIGHT,0),displayElementWidth=$displayElement.width();if($shadowTop&&($shadowTop.css("background-position","0px "+topShadowOffset+"px"),isPositionFixed&&(offsetTop=$displayElement.offset().top,$shadowTop.css("top",offsetTop)),isPositionFixed&&$shadowTop.css("width",displayElementWidth)),$shadowBottom){var clientHeight=scrollElement.clientHeight,outerHeight=$displayElement.outerHeight(),scrollHeight=scrollElement.scrollHeight,bottomShadowOffset=SCROLL_SHADOW_HEIGHT;scrollHeight>clientHeight&&(bottomShadowOffset-=Math.min(SCROLL_SHADOW_HEIGHT,scrollHeight-(scrollTop+clientHeight))),$shadowBottom.css("background-position","0px "+bottomShadowOffset+"px"),$shadowBottom.css("top",offsetTop+outerHeight-SCROLL_SHADOW_HEIGHT),$shadowBottom.css("width",displayElementWidth)}}function getOrCreateShadow($displayElement,position,isPositionFixed){var $findShadow=$displayElement.find(".scroller-shadow."+position);return 0===$findShadow.length&&($findShadow=$(window.document.createElement("div")).addClass("scroller-shadow "+position),$displayElement.append($findShadow)),isPositionFixed||($findShadow.css("position","absolute"),$findShadow.css(position,"0")),$findShadow}function addScrollerShadow(displayElement,scrollElement,showBottom){var isPositionFixed=!1;scrollElement||(scrollElement=displayElement,isPositionFixed=!0);var $displayElement=$(displayElement),$scrollElement=$(scrollElement),$shadowTop=getOrCreateShadow($displayElement,"top",isPositionFixed),$shadowBottom=showBottom?getOrCreateShadow($displayElement,"bottom",isPositionFixed):null,doUpdate=function(){_updateScrollerShadow($displayElement,$scrollElement,$shadowTop,$shadowBottom,isPositionFixed)};$scrollElement.off("scroll.scroller-shadow"),$displayElement.off("contentChanged.scroller-shadow"),$scrollElement.on("scroll.scroller-shadow",doUpdate),$displayElement.on("contentChanged.scroller-shadow",doUpdate),doUpdate()}function removeScrollerShadow(displayElement,scrollElement){scrollElement||(scrollElement=displayElement);var $displayElement=$(displayElement),$scrollElement=$(scrollElement);$displayElement.find(".scroller-shadow.top").remove(),$displayElement.find(".scroller-shadow.bottom").remove(),$scrollElement.off("scroll.scroller-shadow"),$displayElement.off("contentChanged.scroller-shadow")}function toggleClass($domElement,className,addClass){addClass?$domElement.addClass(className):$domElement.removeClass(className)}function sidebarList($scrollerElement,selectedClassName,leafClassName){var $listElement=$scrollerElement.find("ul"),$selectionMarker,$selectionExtension,$sidebar=$("#sidebar"),showExtension=!0;$selectionMarker=$(window.document.createElement("div")).addClass("sidebar-selection"),$scrollerElement.prepend($selectionMarker),$scrollerElement.css("overflow","auto"),$scrollerElement.css("position","relative"),$selectionExtension=$(window.document.createElement("div")).addClass("sidebar-selection-extension"),$scrollerElement.append($selectionExtension),selectedClassName="."+(selectedClassName||"selected");var updateSelectionExtension=function(){var selectionMarkerHeight=$selectionMarker.height(),selectionMarkerOffset=$selectionMarker.offset(),scrollerOffset=$scrollerElement.offset(),selectionExtensionHeight=$selectionExtension.outerHeight(),scrollerTop=scrollerOffset.top,scrollerBottom=scrollerTop+$scrollerElement.outerHeight(),selectionExtensionTop=selectionMarkerOffset.top;$selectionExtension.css("top",selectionExtensionTop),$selectionExtension.css("left",$sidebar.width()-$selectionExtension.outerWidth()),toggleClass($selectionExtension,"selectionExtension-visible",showExtension);var selectionExtensionClipOffsetYBy=Math.floor((selectionMarkerHeight-selectionExtensionHeight)/2),selectionExtensionBottom=selectionExtensionTop+selectionExtensionHeight+selectionExtensionClipOffsetYBy;selectionExtensionTop<scrollerTop||selectionExtensionBottom>scrollerBottom?$selectionExtension.css("clip","rect("+Math.max(scrollerTop-selectionExtensionTop-selectionExtensionClipOffsetYBy,0)+"px, auto, "+(selectionExtensionHeight-Math.max(selectionExtensionBottom-scrollerBottom,0))+"px, auto)"):$selectionExtension.css("clip","")},hideSelectionMarker=function(event){$selectionExtension.addClass("forced-hidden"),$selectionMarker.addClass("forced-hidden")},updateSelectionMarker=function(event,reveal){var $listItem=$listElement.find(selectedClassName).closest("li");if(leafClassName&&(showExtension=$listItem.hasClass(leafClassName)),$selectionExtension.removeClass("forced-hidden"),$selectionMarker.removeClass("forced-hidden"),$selectionExtension.hide(),$selectionMarker.hide(),1===$listItem.length){var selectionMarkerTop=$listItem.offset().top-$scrollerElement.offset().top+$scrollerElement.get(0).scrollTop;$selectionMarker.css("top",selectionMarkerTop),$selectionMarker.show(),updateSelectionExtension(),$selectionExtension.show();var scrollerElement=$scrollerElement.get(0),scrollerHeight=scrollerElement.clientHeight,selectionMarkerHeight,selectionMarkerBottom=selectionMarkerTop+$selectionMarker.height(),currentScrollBottom=scrollerElement.scrollTop+scrollerHeight;reveal&&(selectionMarkerTop>=currentScrollBottom?$listItem.get(0).scrollIntoView(!1):selectionMarkerBottom<=scrollerElement.scrollTop&&$listItem.get(0).scrollIntoView(!0))}};$listElement.on("selectionChanged",updateSelectionMarker),$scrollerElement.on("scroll",updateSelectionExtension),$scrollerElement.on("selectionRedraw",updateSelectionExtension),$scrollerElement.on("selectionHide",hideSelectionMarker),updateSelectionMarker(),_resizeHandlers.push(updateSelectionExtension)}function _handleResize(){_resizeHandlers.forEach(function(f){f.apply()})}function getElementClipSize($view,elementRect){var delta,clip={top:0,right:0,bottom:0,left:0},viewOffset=$view.offset()||{top:0,left:0};return(delta=elementRect.top+elementRect.height-(viewOffset.top+$view.height()))>0&&(clip.bottom=delta),(delta=viewOffset.top-elementRect.top)>0&&(clip.top=delta),(delta=viewOffset.left-elementRect.left)>0&&(clip.left=delta),(delta=elementRect.left+elementRect.width-(viewOffset.left+$view.width()))>0&&(clip.right=delta),clip}function scrollElementIntoView($view,$element,scrollHorizontal){var elementOffset=$element.offset(),elementRect,clip=getElementClipSize($view,{top:elementOffset.top,left:elementOffset.left,height:$element.height(),width:$element.width()});clip.bottom>0?$view.scrollTop($view.scrollTop()+clip.bottom):clip.top>0&&$view.scrollTop($view.scrollTop()-clip.top),scrollHorizontal&&(clip.left>0?$view.scrollLeft($view.scrollLeft()-clip.left):clip.right>0&&$view.scrollLeft($view.scrollLeft()+clip.right))}function getFileEntryDisplay(entry){var name=entry.name,ext=LanguageManager.getCompoundFileExtension(name),i=name.lastIndexOf("."+ext);let hoverPath=ProjectManager.makeProjectRelativeIfPossible(entry.fullPath);if(Phoenix.isNativeApp&&(hoverPath=Phoenix.app.getDisplayPath(entry.fullPath)),hoverPath=hoverPath||"",i>0){const baseName=_.escape(name.substring(0,i)),extension=_.escape(name.substring(i));name=`<span title='${hoverPath}' class='baseName'>${baseName}</span><span title='${hoverPath}' class='extension'>${extension}</span>`}else name=`<span title='${hoverPath}' class='baseName'>${_.escape(name)}</span>`;return name}function getDirNamesForDuplicateFiles(files){if(files.length<=1)return[];var map={},filePaths=[],displayPaths=[];files.forEach(function(file,index){var fp=file.fullPath.split("/");fp.pop(),displayPaths[index]=fp.pop(),filePaths[index]=fp,map[displayPaths[index]]?map[displayPaths[index]].push(index):map[displayPaths[index]]=[index]});var processMap=function(map){var didSomething=!1;return _.forEach(map,function(arr,key){arr.length>1&&arr.forEach(function(index){0!==filePaths[index].length&&(displayPaths[index]=filePaths[index].pop()+"/"+displayPaths[index],didSomething=!0,map[displayPaths[index]]?map[displayPaths[index]].push(index):map[displayPaths[index]]=[index])}),delete map[key]}),didSomething},repeat;do{repeat=processMap(map)}while(repeat);return displayPaths}function traverseViewArray(viewArray,startIndex,direction){if(1!==Math.abs(direction))return console.error("traverseViewArray called with unsupported direction: "+direction.toString()),null;if(-1===startIndex){if(viewArray.length>0)return viewArray[0]}else if(viewArray.length>1)return(startIndex+=direction)>=viewArray.length?startIndex=0:startIndex<0&&(startIndex=viewArray.length-1),viewArray[startIndex];return null}function hideMainToolBar(){$("#main-toolbar").addClass("forced-hidden"),$(".main-view .content").each(function(index,element){$(element).addClass("force-right-zero")})}function showMainToolBar(){$("#main-toolbar").removeClass("forced-hidden"),$(".main-view .content").each(function(index,element){$(element).removeClass("force-right-zero")})}$(window).resize(_handleResize),exports.SCROLL_SHADOW_HEIGHT=SCROLL_SHADOW_HEIGHT,exports.addScrollerShadow=addScrollerShadow,exports.removeScrollerShadow=removeScrollerShadow,exports.sidebarList=sidebarList,exports.showMainToolBar=showMainToolBar,exports.hideMainToolBar=hideMainToolBar,exports.scrollElementIntoView=scrollElementIntoView,exports.getElementClipSize=getElementClipSize,exports.getFileEntryDisplay=getFileEntryDisplay,exports.toggleClass=toggleClass,exports.getDirNamesForDuplicateFiles=getDirNamesForDuplicateFiles,exports.traverseViewArray=traverseViewArray});