Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-18687

Ability to collapse site navigation

    XMLWordPrintable

    Details

    • Type: Feature Request
    • Status: CLOSED
    • Priority: Major
    • Resolution: Fixed
    • Affects Version/s: None
    • Fix Version/s: 2.8.0
    • Component/s: Portal
    • Labels:
      None
    • Property addition/change required:
      Yes

      Description

      This came up on list, the ability to collapse the side menu. I remarked that it would be nice to be able to collapse the side navigation so only the icons are visible.

      Heres one possible solution from Gonzalo:

      --------
      In your tool add the following:

      <script type="text/javascript" src="/library/js/jquery.js"></script>
      <script type="text/javascript">
      $(document).ready(function() {
      $('#toggleToolMenu').toggle(function(e){
      e.preventDefault();
      $('#toolMenuWrap', window.parent.document).css(

      {'width':'2px','overflow':'hidden'}

      );
      $('#content', window.parent.document).css(

      {'margin-left':'1em'}

      );
      }, function(e) {
      e.preventDefault();
      $('#toolMenuWrap', window.parent.document).css(

      {'width':'11em'}

      );
      $('#content', window.parent.document).css(

      {'margin-left':'12.3em'}

      );

      });
      });
      </script>

      <a id="toggleToolMenu" href="#">Toggle full width</a>

      This should work in 2.6 - the above measurements assume the default Sakai skin - you will need to adjust for your case.
      --------

      However, for those that do adjust the skin, this requires some work to get right, for instance we have our icons on the left, not the right.
      So I propose that a separate div be created at render time that contains only the icons from the toolmenu and when the 'collapse' function is required, it replaces the full navigation div with the smaller one. This should cater for all cases where people adjust the toolmenu.

        Gliffy Diagrams

          Zeplin

            Attachments

            1. default.png
              default.png
              19 kB
            2. left-icons.png
              left-icons.png
              22 kB
            3. collapsed-menu.jpg
              collapsed-menu.jpg
              13 kB
            4. expand-menu.jpg
              expand-menu.jpg
              21 kB
            5. nav-collapse-menu-pane.gif
              nav-collapse-menu-pane.gif
              6 kB
            6. blackboard-collapsed.png
              blackboard-collapsed.png
              11 kB
            7. sakai-nav-max.png
              sakai-nav-max.png
              47 kB
            8. sakai-nav-min.png
              sakai-nav-min.png
              43 kB
            9. style regression.png
              style regression.png
              10 kB
            10. safari-oops.png
              safari-oops.png
              17 kB
            11. Collapsed_navigation_SAK-18687_2-7-1.rar
              11 kB
            12. HomeLinkMissing.png
              HomeLinkMissing.png
              87 kB

              Issue Links

                Activity

                  People

                  Assignee:
                  csev Charles Severance
                  Reporter:
                  steve.swinsburg Steve Swinsburg
                  Votes:
                  1 Vote for this issue
                  Watchers:
                  8 Start watching this issue

                    Dates

                    Created:
                    Updated:
                    Resolved:

                      Git Integration