Modules (181)

SidebarView

Description

The view that controls the showing and hiding of the sidebar.

Although the sidebar view doesn't dispatch any events directly, it is a resizable element (../utils/Resizer.js), which means it can dispatch Resizer events. For example, if you want to listen for the sidebar showing or hiding itself, set up listeners for the corresponding Resizer events, panelCollapsed and panelExpanded:

 $("#sidebar").on("panelCollapsed", ...);
 $("#sidebar").on("panelExpanded", ...);

Dependencies

Functions

Private

_handleSplitViewHorizontal

Handle Horizontal Split Command

    function _handleSplitViewHorizontal() {
        MainViewManager.setLayoutScheme(2, 1);
    }

    // Initialize items dependent on HTML DOM
    AppInit.htmlReady(function () {
        $sidebar                  = $("#sidebar");
        $gearMenu                 = $sidebar.find(".working-set-option-btn");
        $splitViewMenu            = $sidebar.find(".working-set-splitview-btn");
        $projectTitle             = $sidebar.find("#project-title");
        $projectFilesContainer    = $sidebar.find("#project-files-container");
        $workingSetViewsContainer = $sidebar.find("#working-set-list-container");

        // init
        $sidebar.on("panelResizeStart", function (evt, width) {
            $sidebar.find(".sidebar-selection-extension").css("display", "none");
            $sidebar.find(".scroller-shadow").css("display", "none");
        });

        $sidebar.on("panelResizeUpdate", function (evt, width) {
            ProjectManager._setFileTreeSelectionWidth(width);
        });

        $sidebar.on("panelResizeEnd", function (evt, width) {
            $sidebar.find(".sidebar-selection-extension").css("display", "block").css("left", width);
            $sidebar.find(".scroller-shadow").css("display", "block");
            $projectFilesContainer.triggerHandler("scroll");
            WorkingSetView.syncSelectionIndicator();
        });

        $sidebar.on("panelCollapsed", function (evt, width) {
            CommandManager.get(Commands.VIEW_HIDE_SIDEBAR).setName(Strings.CMD_SHOW_SIDEBAR);
        });

        $sidebar.on("panelExpanded", function (evt, width) {
            WorkingSetView.refresh();
            $sidebar.find(".scroller-shadow").css("display", "block");
            $sidebar.find(".sidebar-selection-extension").css("left", width);
            $projectFilesContainer.triggerHandler("scroll");
            WorkingSetView.syncSelectionIndicator();
            CommandManager.get(Commands.VIEW_HIDE_SIDEBAR).setName(Strings.CMD_HIDE_SIDEBAR);
        });

        // AppInit.htmlReady in utils/Resizer executes before, so it's possible that the sidebar
        // is collapsed before we add the event. Check here initially
        if (!$sidebar.is(":visible")) {
            $sidebar.trigger("panelCollapsed");
        }

        // wire up an event handler to monitor when panes are created
        MainViewManager.on("paneCreate", function (evt, paneId) {
            WorkingSetView.createWorkingSetViewForPane($workingSetViewsContainer, paneId);
        });

        MainViewManager.on("paneLayoutChange", function () {
            _updateUIStates();
        });

        MainViewManager.on("workingSetAdd workingSetAddList workingSetRemove workingSetRemoveList workingSetUpdate", function () {
            _updateWorkingSetState();
        });

        // create WorkingSetViews for each pane already created
        _.forEach(MainViewManager.getPaneIdList(), function (paneId) {
            WorkingSetView.createWorkingSetViewForPane($workingSetViewsContainer, paneId);
        });

        _updateUIStates();

        // Tooltips
        $gearMenu.attr("title", Strings.GEAR_MENU_TOOLTIP);
        $splitViewMenu.attr("title", Strings.SPLITVIEW_MENU_TOOLTIP);
    });

    ProjectManager.on("projectOpen", _updateProjectTitle);
Private

_handleSplitViewNone

Handle No Split Command

    function _handleSplitViewNone() {
        MainViewManager.setLayoutScheme(1, 1);
    }
Private

_handleSplitViewVertical

Handle Vertical Split Command

    function _handleSplitViewVertical() {
        MainViewManager.setLayoutScheme(1, 2);
    }
Private

_updateProjectTitle

    function _updateProjectTitle() {
        var displayName = ProjectManager.getProjectRoot().name;
        var fullPath = ProjectManager.getProjectRoot().fullPath;

        if (displayName === "" && fullPath === "/") {
            displayName = "/";
        }

        $projectTitle.html(_.escape(displayName));
        $projectTitle.attr("title", fullPath);

        // Trigger a scroll on the project files container to
        // reposition the scroller shadows and avoid issue #2255
        $projectFilesContainer.trigger("scroll");
    }
Private

_updateUIStates

Update state of splitview and option elements

    function _updateUIStates() {
        var spriteIndex,
            ICON_CLASSES = ["splitview-icon-none", "splitview-icon-vertical", "splitview-icon-horizontal"],
            layoutScheme = MainViewManager.getLayoutScheme();

        if (layoutScheme.columns > 1) {
            spriteIndex = 1;
        } else if (layoutScheme.rows > 1) {
            spriteIndex = 2;
        } else {
            spriteIndex = 0;
        }

        // SplitView Icon
        $splitViewMenu.removeClass(ICON_CLASSES.join(" "))
                      .addClass(ICON_CLASSES[spriteIndex]);

        // SplitView Menu
        _cmdSplitNone.setChecked(spriteIndex === 0);
        _cmdSplitVertical.setChecked(spriteIndex === 1);
        _cmdSplitHorizontal.setChecked(spriteIndex === 2);

        // Options icon
        _updateWorkingSetState();
    }
Private

_updateWorkingSetState

Update state of working set

    function _updateWorkingSetState() {
        if (MainViewManager.getPaneCount() === 1 &&
                MainViewManager.getWorkingSetSize(MainViewManager.ACTIVE_PANE) === 0) {
            $workingSetViewsContainer.hide();
            $gearMenu.hide();
        } else {
            $workingSetViewsContainer.show();
            $gearMenu.show();
        }
    }
Public API

hide

Hide the sidebar.

    function hide() {
        Resizer.hide($sidebar);
    }
Public API

isVisible

Returns the visibility state of the sidebar.

Returns:
boolean
true if element is visible, false if it is not visible
    function isVisible() {
        return Resizer.isVisible($sidebar);
    }
Public API

show

Show the sidebar.

    function show() {
        Resizer.show($sidebar);
    }
Public API

toggle

Toggle sidebar visibility.

    function toggle() {
        Resizer.toggle($sidebar);
    }