Merge pull request #4498 from gabrielbazan7/feat/supportWideScreen

support wide screens

config-templates/config.xml

@@ -27,7 +27,7 @@
     <preference name="StatusBarStyle" value="lightcontent" />
     <preference name="BackupWebStorage" value="none"/>
     <preference name="windows-target-version" value="8.1"/>
-    <preference name="Orientation" value="portrait" />
+    <preference name="Orientation" value="default" />
 
 
 
@@ -71,5 +71,3 @@
       <splash src="../ios/splash/Default-736h.png" width="1242" height="2208"/>
     </platform>
   </widget>
-
-  

cordova/build.sh

@@ -158,6 +158,9 @@ if [ ! -d $PROJECT ]; then
   cordova plugin add cordova-plugin-android-fingerprint-auth
   checkOK
 
+  cordova plugin add cordova-plugin-screen-orientation
+  checkOK
+
 fi
 
 if $DBGJS

cordova/config.xml

@@ -27,7 +27,7 @@
     <preference name="StatusBarStyle" value="lightcontent" />
     <preference name="BackupWebStorage" value="none"/>
     <preference name="windows-target-version" value="8.1"/>
-    <preference name="Orientation" value="portrait" />
+    <preference name="Orientation" value="default" />
 
 
 
@@ -71,5 +71,3 @@
       <splash src="../ios/splash/Default-736h.png" width="1242" height="2208"/>
     </platform>
   </widget>
-
-  

public/index.html

@@ -19,7 +19,7 @@
   <ion-side-menus class="page" ng-controller="indexController as index">
 
     <!-- Left menu -->
-    <ion-side-menu side="left">
+    <ion-side-menu side="left" expose-aside-when="large">
       <div ng-include="'views/includes/sidebar.html'" ng-if="index.hasProfile"></div>
     </ion-side-menu>
 

public/views/includes/topbar.html

@@ -1,7 +1,7 @@
 <nav ng-controller="topbarController as topbar"
   class="tab-bar" ng-style="{'background-color': noColor ? '#4B6178' : index.backgroundColor}">
   <section class="left-small">
-    <a id="hamburger" class="p10" ng-show="!goBackToState && !closeToHome  && !index.noFocusedWallet"
+    <a id="hamburger" class="p10" ng-show="!goBackToState && !closeToHome  && !index.noFocusedWallet && index.physicalScreenWidth < 768"
       on-tap="index.toggleLeftMenu()"><i class="fi-list size-24"></i>
     </a>
     <a ng-show="goBackToState" ng-click="$root.go(goBackToState); goBackToState = null"><i class="icon-arrow-left3 icon-back"></i>

src/js/controllers/index.js

@@ -18,6 +18,7 @@ angular.module('copayApp.controllers').controller('indexController', function($r
   ret.historyShowMoreLimit = 10;
   ret.isSearching = false;
   ret.prevState = 'walletHome';
+  ret.physicalScreenWidth = ((window.innerWidth > 0) ? window.innerWidth : screen.width);
 
   ret.menu = [{
     'title': gettext('Receive'),
@@ -1677,6 +1678,10 @@ angular.module('copayApp.controllers').controller('indexController', function($r
     self.setTab(tab, reset);
   });
 
+  $rootScope.$on('Local/WindowResize', function() {
+    self.physicalScreenWidth = ((window.innerWidth > 0) ? window.innerWidth : screen.width);
+  });
+
   $rootScope.$on('Local/NeedsConfirmation', function(event, txp, cb) {
 
     function openConfirmationPopup(txp, cb) {

src/js/routes.js

@@ -510,9 +510,34 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
   })
   .run(function($rootScope, $state, $location, $log, $timeout, $ionicPlatform, platformInfo, profileService, uxLanguage, go, gettextCatalog) {
 
+    if (platformInfo.isCordova) {
+      if (screen.width < 768) {
+        screen.lockOrientation('portrait');
+      } else {
+        window.addEventListener("orientationchange", function() {
+          var leftMenuWidth = document.querySelector("ion-side-menu[side='left']").clientWidth;
+          if (screen.orientation.includes('portrait')) {
+            // Portrait
+            document.querySelector("ion-side-menu-content").style.width = (screen.width - leftMenuWidth) + "px";
+          } else {
+            // Landscape
+            document.querySelector("ion-side-menu-content").style.width = (screen.height - leftMenuWidth) + "px";
+          }
+        });
+      }
+    } else {
+      if (screen.width >= 768) {
+        window.addEventListener('resize', function() {
+          $rootScope.$emit('Local/WindowResize');
+        });
+      }
+    }
+
     $ionicPlatform.ready(function() {
       if (platformInfo.isCordova) {
 
+        ionic.Platform.fullScreen(true, false);
+
         $ionicPlatform.registerBackButtonAction(function(event) {
           event.preventDefault();
         }, 100);