forked from phcode-dev/staging.phcode.dev
-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathResizer.js
More file actions
1 lines (1 loc) · 10.7 KB
/
Resizer.js
File metadata and controls
1 lines (1 loc) · 10.7 KB
1
define(function(require,exports,module){var DEFAULT_MIN_SIZE=100,DIRECTION_VERTICAL="vert",DIRECTION_HORIZONTAL="horz",POSITION_TOP="top",POSITION_BOTTOM="bottom",POSITION_LEFT="left",POSITION_RIGHT="right",PREFS_PURE_CODE="noDistractions";const EVENT_PANEL_COLLAPSED="panelCollapsed",EVENT_PANEL_EXPANDED="panelExpanded",EVENT_PANEL_RESIZE_START="panelResizeStart",EVENT_PANEL_RESIZE_UPDATE="panelResizeUpdate",EVENT_PANEL_RESIZE_END="panelResizeEnd";var AppInit=require("utils/AppInit"),EventDispatcher=require("utils/EventDispatcher"),ViewUtils=require("utils/ViewUtils"),PreferencesManager=require("preferences/PreferencesManager"),$mainView,$sideBar,isResizing=!1,isWindowResizing=!1;function show(element){var showFunc=$(element).data("show");showFunc&&showFunc.apply(element)}function hide(element){var hideFunc=$(element).data("hide");hideFunc&&hideFunc.apply(element)}function toggle(element){$(element).is(":visible")?hide(element):show(element)}function removeSizable(element){var removeSizableFunc=$(element).data("removeSizable");removeSizableFunc&&removeSizableFunc.apply(element)}function resyncSizer(element){var resyncSizerFunc=$(element).data("resyncSizer");resyncSizerFunc&&resyncSizerFunc.apply(element)}function isVisible(element){return $(element).is(":visible")}function _isPercentage(value){return!$.isNumeric(value)&&value.indexOf("%")>-1}function _percentageToPixels(value,total){return parseFloat(value.replace("%",""))*(total/100)}function _sideBarMaxSize(){var siblingsWidth=0;return $sideBar.siblings().not(".content").each(function(i,elem){var $elem=$(elem);"none"!==$elem.css("display")&&(siblingsWidth+=$elem.outerWidth())}),$(".main-view").width()-siblingsWidth-1}function makeResizable(element,direction,position,minSize,collapsible,forceLeft,createdByWorkspaceManager,usePercentages,forceRight,_attachToParent,initialSize){var $resizer=$('<div class="'+direction+'-resizer"></div>'),$element=$(element),$parent=$element.parent(),$resizableElement=$($element.find(".resizable-content:first")[0]),$body=$(window.document.body),elementID=$element.attr("id"),elementPrefs=PreferencesManager.getViewState(elementID)||{},animationRequest=null,directionProperty=direction===DIRECTION_HORIZONTAL?"clientX":"clientY",directionIncrement=position===POSITION_TOP||position===POSITION_LEFT?1:-1,parentSizeFunction=direction===DIRECTION_HORIZONTAL?$parent.innerWidth:$parent.innerHeight,elementSizeFunction=function(newSize){if(!newSize)return direction===DIRECTION_HORIZONTAL?this.width():this.height();if(!usePercentages)return direction===DIRECTION_HORIZONTAL?this.width(newSize):this.height(newSize);var parentSize=parentSizeFunction.apply($parent),percentage,prop;return prop=direction===DIRECTION_HORIZONTAL?"width":"height",percentage=newSize/parentSize,this.css(prop,100*percentage+"%"),this},resizerCSSPosition=direction===DIRECTION_HORIZONTAL?"left":"top",contentSizeFunction=direction===DIRECTION_HORIZONTAL?$resizableElement.width:$resizableElement.height;function adjustSibling(size){void 0!==forceLeft?$(forceLeft,$parent).css("left",size):void 0!==forceRight&&$(forceRight,$parent).css("right",size)}function resizeElement(elementSize,contentSize){elementSizeFunction.apply($element,[elementSize]),$resizableElement.length&&contentSizeFunction.apply($resizableElement,[contentSize])}function repositionResizer(elementSize){var resizerPosition=elementSize||1;position!==POSITION_RIGHT&&position!==POSITION_BOTTOM||$resizer.css(resizerCSSPosition,resizerPosition)}PreferencesManager.get(PREFS_PURE_CODE)&&($element.hasClass("bottom-panel")||$element.hasClass("sidebar"))&&(elementPrefs.visible=!1),elementID?$parent[0]&&$parent.is(".content")&&!createdByWorkspaceManager?console.error("Resizable panels within the editor area should be created via WorkspaceManager.createBottomPanel(). \nElement:",element):(void 0===minSize&&(minSize=DEFAULT_MIN_SIZE),collapsible=collapsible||!1,_attachToParent?$parent.prepend($resizer):$element.prepend($resizer),$element.css("box-sizing","border-box"),$element.data("removeSizable",function(){$resizer.off(".resizer"),$element.removeData("show"),$element.removeData("hide"),$element.removeData("resyncSizer"),$element.removeData("removeSizable"),$resizer.remove()}),$element.data("resyncSizer",function(){repositionResizer(elementSizeFunction.apply($element))}),$element.data("show",function(){var elementOffset=$element.offset(),elementSize=elementSizeFunction.apply($element)||elementPrefs.size,contentSize=contentSizeFunction.apply($resizableElement)||elementPrefs.contentSize;initialSize&&(elementSize=elementPrefs.size||initialSize),elementSize<minSize&&(elementSize=minSize),contentSize<elementSize&&(contentSize=elementSize),resizeElement(elementSize,contentSize),$element.show(),elementPrefs.visible=!0,collapsible&&(_attachToParent?$parent.prepend($resizer):$element.prepend($resizer),position===POSITION_TOP?$resizer.css(resizerCSSPosition,""):position===POSITION_RIGHT&&$resizer.css(resizerCSSPosition,elementOffset[resizerCSSPosition]+elementSize)),adjustSibling(elementSize),$element.trigger(EVENT_PANEL_EXPANDED,[elementSize]),elementPrefs.size=elementSize,elementPrefs.contentSize=contentSize,PreferencesManager.setViewState(elementID,elementPrefs)}),$element.data("hide",function(){var elementOffset=$element.offset(),elementSize=elementSizeFunction.apply($element),resizerSize=elementSizeFunction.apply($resizer);$element.hide(),elementPrefs.visible=!1,collapsible&&($resizer.insertBefore($element),position===POSITION_RIGHT?$resizer.css(resizerCSSPosition,""):position===POSITION_TOP&&$resizer.css(resizerCSSPosition,elementOffset[resizerCSSPosition]+elementSize-resizerSize)),adjustSibling(0),$element.trigger(EVENT_PANEL_COLLAPSED,[elementSize]),PreferencesManager.setViewState(elementID,elementPrefs)}),$resizer.on("mousedown.resizer",function(e){var $resizeShield=$("<div class='resizing-container "+direction+"-resizing' />"),startPosition=e[directionProperty],startSize=$element.is(":visible")?elementSizeFunction.apply($element):0,newSize=startSize,previousSize=startSize,baseSize=0,resizeStarted=!1;function doRedraw(){isResizing&&(newSize!==previousSize&&(previousSize=newSize,$element.is(":visible")?newSize<10?(toggle($element),elementSizeFunction.apply($element,[0])):(resizeStarted||(resizeStarted=!0,$element.trigger(EVENT_PANEL_RESIZE_START,newSize)),resizeElement(newSize,newSize-baseSize),adjustSibling(newSize),$element.trigger(EVENT_PANEL_RESIZE_UPDATE,[newSize])):newSize>10&&(elementSizeFunction.apply($element,[newSize]),toggle($element),resizeStarted||(resizeStarted=!0,$element.trigger(EVENT_PANEL_RESIZE_START,newSize)))),animationRequest=window.requestAnimationFrame(doRedraw))}function onMouseMove(e){newSize=Math.max(startSize+directionIncrement*(startPosition-e[directionProperty]),minSize);var maxSize=$element.data("maxsize");void 0!==maxSize&&(_isPercentage(maxSize)&&(maxSize=_percentageToPixels(maxSize,_sideBarMaxSize())),newSize=Math.min(newSize,maxSize)),e.preventDefault(),null===animationRequest&&(animationRequest=window.requestAnimationFrame(doRedraw))}function endResize(e){if(isResizing){var elementSize=elementSizeFunction.apply($element);$element.is(":visible")&&(elementPrefs.size=elementSize,$resizableElement.length&&(elementPrefs.contentSize=contentSizeFunction.apply($resizableElement)),PreferencesManager.setViewState(elementID,elementPrefs),repositionResizer(elementSize)),isResizing=!1,resizeStarted&&$element.trigger(EVENT_PANEL_RESIZE_END,[elementSize]),window.setTimeout(function(){$(window.document).off("mousemove",onMouseMove),$resizeShield.off("mousedown"),$resizeShield.remove(),animationRequest=null},300)}}isResizing=!0,$body.append($resizeShield),$resizableElement.length&&$element.children().not(".horz-resizer, .vert-resizer, .resizable-content").each(function(index,child){baseSize+=direction===DIRECTION_HORIZONTAL?$(child).outerWidth():$(child).outerHeight()}),$(window.document).on("mousemove",onMouseMove),collapsible&&$resizeShield.on("mousedown",function(e){$(window.document).off("mousemove",onMouseMove),$resizeShield.off("mousedown"),$resizeShield.remove(),animationRequest=null,toggle($element)}),$(window.document).one("mouseup",endResize),e.preventDefault()}),elementPrefs&&(void 0!==elementPrefs.size&&elementSizeFunction.apply($element,[elementPrefs.size]),void 0!==elementPrefs.contentSize&&contentSizeFunction.apply($resizableElement,[elementPrefs.contentSize]),void 0===elementPrefs.visible||elementPrefs.visible?(adjustSibling(elementSizeFunction.apply($element)),repositionResizer(elementSizeFunction.apply($element))):hide($element))):console.error("Resizable panels must have a DOM id to use as a preferences key:",element)}function updateResizeLimits(){var sideBarMaxSize=_sideBarMaxSize(),maxSize=$sideBar.data("maxsize"),width=!1;void 0!==maxSize&&_isPercentage(maxSize)&&(sideBarMaxSize=_percentageToPixels(maxSize,sideBarMaxSize)),$sideBar.width()>sideBarMaxSize&&($sideBar.width(sideBarMaxSize),resyncSizer($sideBar),$(".content").css("left",$sideBar.width()),$sideBar.trigger(EVENT_PANEL_RESIZE_START,$sideBar.width()),$sideBar.trigger(EVENT_PANEL_RESIZE_UPDATE,[$sideBar.width()]),$sideBar.trigger(EVENT_PANEL_RESIZE_END,[$sideBar.width()]))}function onWindowResize(e){"none"!==$sideBar.css("display")&&(isWindowResizing||(isWindowResizing=!0,$(window.document).one("mousemove",function(){isWindowResizing=!1,updateResizeLimits()})))}window.addEventListener("resize",onWindowResize,!0),AppInit.htmlReady(function(){var minSize=DEFAULT_MIN_SIZE;$mainView=$(".main-view"),$sideBar=$("#sidebar"),$(".vert-resizable").each(function(index,element){void 0!==$(element).data().minsize&&(minSize=$(element).data().minsize),$(element).hasClass("top-resizer")&&makeResizable(element,"vert",POSITION_TOP,minSize,$(element).hasClass("collapsible"))}),$(".horz-resizable").each(function(index,element){void 0!==$(element).data().minsize&&(minSize=$(element).data().minsize),$(element).hasClass("right-resizer")&&makeResizable(element,DIRECTION_HORIZONTAL,POSITION_RIGHT,minSize,$(element).hasClass("collapsible"),$(element).data().forceleft)}),$("#main-toolbar").hasClass("collapsible")&&PreferencesManager.get(PREFS_PURE_CODE)&&ViewUtils.hideMainToolBar()}),EventDispatcher.makeEventDispatcher(exports),exports.makeResizable=makeResizable,exports.removeSizable=removeSizable,exports.resyncSizer=resyncSizer,exports.toggle=toggle,exports.show=show,exports.hide=hide,exports.isVisible=isVisible,exports.DIRECTION_VERTICAL="vert",exports.DIRECTION_HORIZONTAL=DIRECTION_HORIZONTAL,exports.POSITION_TOP=POSITION_TOP,exports.POSITION_RIGHT=POSITION_RIGHT,exports.POSITION_BOTTOM=POSITION_BOTTOM,exports.POSITION_LEFT=POSITION_LEFT,exports.EVENT_PANEL_COLLAPSED=EVENT_PANEL_COLLAPSED,exports.EVENT_PANEL_EXPANDED=EVENT_PANEL_EXPANDED,exports.EVENT_PANEL_RESIZE_START=EVENT_PANEL_RESIZE_START,exports.EVENT_PANEL_RESIZE_UPDATE=EVENT_PANEL_RESIZE_UPDATE,exports.EVENT_PANEL_RESIZE_END=EVENT_PANEL_RESIZE_END});