fix top menu issue on ipad

Birendra
1 parent adb7d98d
Showing 8 changed files with 71 additions and 24 deletions
400-SOURCECODE/AIAHTML5.Web/app/controllers/CurrBuildController.js
400-SOURCECODE/AIAHTML5.Web/app/views/CBuild/CBuild-view.html
400-SOURCECODE/AIAHTML5.Web/app/views/CBuild/curriculum-builder-detail.html
400-SOURCECODE/AIAHTML5.Web/app/widget/MainMenu.html
400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
400-SOURCECODE/AIAHTML5.Web/index.aspx
400-SOURCECODE/AIAHTML5.Web/themes/default/css/bootstrap/3.3.6/bootstrap.css
400-SOURCECODE/AIAHTML5.Web/themes/default/css/bootstrap/3.3.6/main.css
@@ -33,12 +33,12 @@ function ($scope, $rootScope, pages, log, Modules, $http, $compile, $location, $
         var $ua = navigator.userAgent;
             if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
                 $("#treecontent").css('height',screen.height-140);
-                $("#cbdivarea").css('height',screen.height-60);
+                $("#cbdivarea").css('height',screen.height-70);
             }
             else
             {
              $("#treecontent").css('height',screen.height-250);
-             $("#cbdivarea").css('height',screen.height-170);
+             $("#cbdivarea").css('height',screen.height-180);
             }
  
         $('#sidebar-wrapper').unbind('click');
@@ -259,6 +259,11 @@ function ($scope, $rootScope, pages, log, Modules, $http, $compile, $location, $
         $rootScope.FileTitle=fileTitle;
  
         $scope.fileName = fileName;
+        var $ua = navigator.userAgent;
+            if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+                if(screen.width<=768)
+                $('#modal-CurBuilder').css("left", "10%");
+            }
         $('#modal-CurBuilder').css("display", "block");
         $("#CurBuilderbackground").css("display", "block");
  
@@ -389,6 +394,11 @@ function ($scope, $rootScope, pages, log, Modules, $http, $compile, $location, $
         $rootScope.FileTitle = $rootScope.cbTreeFirstLabel;
  
         $timeout(function () {
+            var $ua = navigator.userAgent;
+            if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
+                if(screen.width<=768)
+                $('#modal-CurBuilder').css("left", "10%");
+            }
             $('#modal-CurBuilder').css("display", "block");
             $("#CurBuilderbackground").css("display", "block");
         }, 200);
@@ -515,9 +525,9 @@ function ($scope, $rootScope, pages, log, Modules, $http, $compile, $location, $
             window.navigator.msSaveOrOpenBlob(blob, myfileName);
         }
         else 
-        {
+        {            
             document.execCommand("SaveAs", true, myfileName);
-            
+        
             var event = document.createEvent('MouseEvents'),
             saveElement = document.createElement('a');
             saveElement.download = myfileName;
@@ -1773,9 +1783,10 @@ function ($scope, $rootScope, pages, log, Modules, $http, $compile, $location, $
          if (window.navigator && window.navigator.msSaveOrOpenBlob) {
              window.navigator.msSaveOrOpenBlob(blob, filename);
          }
-         else {
+         else
+          {
             document.execCommand("SaveAs", true, filename);
-             
+            
             var event = document.createEvent('MouseEvents'),
             saveElement = document.createElement('a');
             saveElement.download = filename;
@@ -1783,7 +1794,7 @@ function ($scope, $rootScope, pages, log, Modules, $http, $compile, $location, $
             saveElement.dataset.downloadurl = ['text/json', saveElement.download, saveElement.href].join(':');
             event.initEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
             saveElement.dispatchEvent(event);
-             
+                       
          }
         $scope.SectionContentForExportCB=[];
         $rootScope.dynamicUpdatedJsonForExportCB = "";
@@ -16,7 +16,7 @@
     <!-- this is summary-->
  
     <div id="CurBuilderbackground" style="background-color: black; bottom: 0; display: none; height: 100%; left: 0; opacity: 0.5; position: fixed; right: 0; top: 0; width: 100%; z-index: 12000000;"></div>
-    <div id="modal-CurBuilder" style="display:none;z-index: 1000000000;height:auto;width: 300px;position:absolute;left:30%;right:0;top:70px;">
+    <div id="modal-CurBuilder" style="display:none;z-index: 1000000000;height:auto;width: 600px;position:absolute;left:30%;right:0;top:70px;">
         <div class="modal-dialog">
             <div class="modal-content">
                 <div class="modal-header">
@@ -114,7 +114,7 @@
         </div>
  
         <div class="CB-JS-Panel">
-            <div id="cbdivarea" class="col-sm-12 stickey-area" style="overflow:scroll;margin-top:10px;background-color: #afacac;">
+            <div id="cbdivarea" class="col-sm-12 stickey-area" style="overflow:scroll;margin-top:20px;background-color: #afacac;">
                 <div ng-init="openCBJsPanel()" id="CBPanelDiv" class="CBBodyView"></div>
                 <div id="cbparentcustomDiv"></div>                  
                 <div id="cbModelDeleteBackground"></div>
@@ -2,7 +2,7 @@
 <div class="bodyWrap row container-fluid" >
     <div class="col-sm-12 col-md-12 pageHeading">
         <!--<button type="button" class="btn btn-success pull-left toggleBar btn-sm" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-bars"></i> </button>-->
-        <div class=" pull-left toggleBar toggleHeadingButton tooltip-sidebar" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar" style="padding-left: 15px; "> <i class="fa fa-bars"></i> </div>
+        <div class=" pull-left toggleBar toggleHeadingButton tooltip-sidebar" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-bars"></i> </div>
         <h4 class="pull-left" data-ng-bind="currentActiveModuleTitle"><!--{{currentActiveModuleTitle}}--></h4>
         <div class="pull-right paddTop4 ">
             <!--<div class="pull-right paddTop4 ">-->
-<div class="collapse navbar-collapse" id="topMenuBar">
-    <ul class="nav navbar-nav toperMenu-spaceleft" style="float:left">
+<div class="collapse navbar-collapse" id="topMenuBar" style="height:50px !important;margin-left:-15px;width:103%">
+    <ul class="nav navbar-nav" style="float:left" id="topul1">
         <li class="dropdown navbarDropdownItem disableFileMenu" id="fileMenuAnchor" style="float:left">
             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">File<span class="caret"></span></a>
             <ul class="dropdown-menu">
@@ -47,11 +47,11 @@
         </li>
         <!--redirecting to Admin-->
         <li class="navbarItem" style="float:left"><a ng-click="reDirectURLToAdmin()" ng-show="haveRoleAdmin" style="cursor: pointer;">Admin</a></li>
-        <li class="navbarItem" style="float:left" title="Click here to access Legacy Curriculum Builder">
-            <a href="anatomy-test" ng-click="LegacyLoginClick()" title="Click here to access Legacy Curriculum Builder"  style="cursor: pointer;">Legacy Curriculum Builder <em style="color:red">(This version will be discontinued 12/31/20)</em></a>
+        <li id="legacymenu" class="navbarItem" style="float:left" title="This version will be discontinued 12/31/20">
+            <a href="anatomy-test" ng-click="LegacyLoginClick()" title="This version will be discontinued 12/31/20"  style="cursor: pointer;">Legacy Curriculum Builder </a>
         </li>
     </ul>
-    <ul class="nav navbar-nav navbar-right" style="float: right;">
+    <ul class="nav navbar-nav navbar-right" style="float: right;" id="topul2">
         <li id="userNameoption" class="navbarItem" style="pointer-events:none ;"><a href="#">{{userName}}</a></li>
         <li data-toggle="tooltip" data-placement="top" title="Logout"><a href="" ng-click="LogoutUser()"><i class="fa fa-power-off"></i></a></li>
     </ul>
@@ -11,8 +11,8 @@
     <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
     <meta http-equiv="Pragma" content="no-cache" />
     <meta http-equiv="Expires" content="0" />
-    <!--<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">-->
-    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0 maximum-scale=1.0" />
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <!-- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0 maximum-scale=1.0" /> -->
     <title>A.D.A.M. Interactive Anatomy</title>
     <link rel="icon" type="image/x-icon" href="/content/images/favicon.ico">
  
@@ -310,8 +310,8 @@
             <div class="container-fluid " id="HomeContainerDiv">
                 <!--Header-->
  
-                <nav class="navbar navbar-inverse navbar-fixed-top">
-                    <div class="container-fluid">
+                <nav class="navbar navbar-inverse navbar-fixed-top" style="height:55px">
+                    <div class="container-fluid" style="height:50px">
                         <!-- Brand and toggle get grouped for better mobile display -->
                         <div class="navbar-header">
                             <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#topMenuBar" aria-expanded="false">
@@ -3775,18 +3775,31 @@ select[multiple].input-group-sm &gt; .input-group-btn &gt; .btn {
     margin-right: 15px;
   }
 }
-@media (min-width: 768px) {
+@media (min-width: 768px) and (max-width: 1024px) {
   .navbar-left {
     float: left !important;
   }
   .navbar-right {
     float: right !important;
-    margin-right: -15px;
+    margin-right: -10px;
   }
   .navbar-right ~ .navbar-right {
     margin-right: 0;
   }
 }
+@media (min-width: 1025px) and (max-width: 2048px) {
+  .navbar-left {
+    float: left !important;
+  }
+  .navbar-right {
+    float: right !important;
+    margin-right: 25px !important;
+  }
+  .navbar-right ~ .navbar-right {
+    margin-right: 0;
+  }
+}
+
 .navbar-default {
   background-color: #f8f8f8;
   border-color: #e7e7e7;
@@ -6047,12 +6060,12 @@ button.close {
   }
 }
 /* update css for top menu for devices */
-@media (min-width: 300px) and (max-width: 800px) {
+@media (min-width: 300px) and (max-width: 980px) {
   #userNameoption {
     display: none !important;
   }
 }
-@media (min-width: 901px) {
+@media (min-width: 981px) {
   #userNameoption {
     display: block !important;
   }
@@ -107,6 +107,13 @@ footer.dark {
 	top: 0;
 	z-index: 1029;
 }
+/* update css for top menu for devices */
+@media (min-width: 300px) and (max-width: 800px) {
+	.sidebar {	
+		padding-top: 120px !important;
+	}
+  }
+
 .navbar {
 	border-bottom: none!important;
 }
@@ -253,10 +260,26 @@ pointer-events: auto;
 .border-Btm1 {
 	border-bottom: 1px solid #D8D8D8;
 }
+
+/* remove after lecay version expired */
+
+@media (min-width: 300px) and (max-width: 900px) {
+	#legacymenu {	
+		display:none !important;
+	}
+  }
+
+/* update css for top menu for devices */
+/* @media (min-width: 300px) and (max-width: 800px) {
+	.pageHeading {	
+		margin-top: 80px !important;
+	}
+  } */
+
 .pageHeading {
 	background: #818d43 none repeat scroll 0 0;
 	padding: 0px 15px;
-	margin-top: 60px;
+	margin-top: 50px;
 	z-index: 1030;
 	position: fixed;
 	width: 100%;