SAK-29383 - Fix view for site tabs when user has multiple sites to di…

…splay
warpwire · Jun 11, 2015 · 04d30da · 04d30da
1 parent 1c66918
commit 04d30da
Show file tree

Hide file tree

Showing 7 changed files with 89 additions and 712 deletions.
diff --git a/portal/portal-render-engine-impl/pack/src/webapp/vm/morpheus/includeSitesNav.vm b/portal/portal-render-engine-impl/pack/src/webapp/vm/morpheus/includeSitesNav.vm
@@ -1,6 +1,6 @@
 <nav id="linkNav" role="navigation" aria-labelledby="sitetabs" class="Mrphs-sitesNav" data-max-tools-int="$maxToolsInt" data-max-tools-anchor="${rloader.sit_alltools}">
     <h1 class="skip" tabindex="-1" id="sitetabs">${rloader.sit_worksiteshead}</h1>
-
+    <div id="show-all-sites" tabindex="-1" aria-hidden="true"><div>+</div><span id="how-many-hidden"></span></div>
     <ul class="Mrphs-sitesNav__menu" id="topnav" role="menubar" aria-label="${rloader.sit_worksiteshead}">
 
         #foreach ( $site in $tabsSites.tabsSites )

diff --git a/portal/portal-render-engine-impl/pack/src/webapp/vm/morpheus/includeTabs.vm b/portal/portal-render-engine-impl/pack/src/webapp/vm/morpheus/includeTabs.vm
@@ -27,7 +27,7 @@
 #end ## END of FOREACH ( $site in $tabsSites.tabsSites )
 
 <!-- START VM includeTabs.vm -->
-    <div class="${tabsCssClass} Mrphs-container Mrphs-container--navs">
+    <div id="Mrphs-sites-nav" class="${tabsCssClass} Mrphs-container Mrphs-container--navs">
 
         #parse("/vm/morpheus/includeLoginNav.vm")
 

diff --git a/reference/library/src/morpheus-master/images/base-s4c0a63d6a1.png b/reference/library/src/morpheus-master/images/base-s4c0a63d6a1.png
diff --git a/reference/library/src/morpheus-master/js/src/sakai.linknav.sites.js b/reference/library/src/morpheus-master/js/src/sakai.linknav.sites.js
@@ -0,0 +1,31 @@
+/*
+	If there's too many sites on siteNav for sreen size we should organize them a little.
+*/
+var setupLinkNav = function(){
+	var linknav 				 = document.getElementById('Mrphs-sites-nav'); // need real DOM Node, not jQuery wrapper
+
+	var h = $PBJQ("#Mrphs-sites-nav ul").height();
+	var howManyHidden = 0;
+
+	$PBJQ(".Mrphs-sitesNav__menuitem", "#linkNav").each(function(){
+	    if ( $PBJQ(this).position().top > h){ howManyHidden++ }
+	});
+
+  if( howManyHidden !== 0 ){
+  	$PBJQ('#linkNav').addClass( 'scrolled-sites' );
+  	$PBJQ('#how-many-hidden').text( howManyHidden );
+  }else{
+  	$PBJQ('#linkNav').removeClass( 'scrolled-sites' );
+  }
+};
+
+$PBJQ(document).ready(function(){
+	setupLinkNav();
+	$PBJQ('#show-all-sites').on('click', function(){
+		$PBJQ('#linkNav').toggleClass('opened');
+		$PBJQ(this).toggleClass('opened');
+	});
+	$( window ).resize(function() {
+		setupLinkNav();
+	});
+});