diff --git a/web/gui/src/main/webapp/app/fw/util/fn.js b/web/gui/src/main/webapp/app/fw/util/fn.js index 6fee2bf188..defb84584c 100644 --- a/web/gui/src/main/webapp/app/fw/util/fn.js +++ b/web/gui/src/main/webapp/app/fw/util/fn.js @@ -122,6 +122,28 @@ return patt.test(ua); } + // Returns true if the current browser determined to be Chrome + function isChrome() { + var isChromium = $window.chrome, + vendorName = $window.navigator.vendor, + isOpera = $window.navigator.userAgent.indexOf("OPR") > -1; + return (isChromium !== null && + isChromium !== undefined && + vendorName === "Google Inc." && + isOpera == false); + } + + // Returns true if the current browser determined to be Safari + function isSafari() { + return ($window.navigator.userAgent.indexOf('Safari') !== -1 && + $window.navigator.userAgent.indexOf('Chrome') === -1); + } + + // Returns true if the current browser determined to be Firefox + function isFirefox() { + return typeof InstallTrigger !== 'undefined'; + } + // search through an array of objects, looking for the one with the // tagged property matching the given key. tag defaults to 'id'. // returns the index of the matching object, or -1 for no match. @@ -249,6 +271,9 @@ areFunctionsNonStrict: areFunctionsNonStrict, windowSize: windowSize, isMobile: isMobile, + isChrome: isChrome, + isSafari: isSafari, + isFirefox: isFirefox, debugOn: debugOn, find: find, inArray: inArray, diff --git a/web/gui/src/main/webapp/app/view/device/device.js b/web/gui/src/main/webapp/app/view/device/device.js index d376fe9643..7a2dc4f995 100644 --- a/web/gui/src/main/webapp/app/view/device/device.js +++ b/web/gui/src/main/webapp/app/view/device/device.js @@ -251,8 +251,9 @@ $log.log('OvDeviceCtrl has been created'); }]) - .directive('deviceDetailsPanel', ['$rootScope', '$window', 'KeyService', - function ($rootScope, $window, ks) { + .directive('deviceDetailsPanel', + ['$rootScope', '$window', '$timeout', 'KeyService', + function ($rootScope, $window, $timeout, ks) { return function (scope) { var unbindWatch; @@ -262,10 +263,19 @@ wSize = fs.windowSize(pStartY); pHeight = wSize.height; } - heightCalc(); - createDetailsPane(); + function initPanel() { + heightCalc(); + createDetailsPane(); + } + // Safari has a bug where it renders the fixed-layout table wrong + // if you ask for the window's size too early + if (scope.onos.browser === 'safari') { + $timeout(initPanel); + } else { + initPanel(); + } // create key bindings to handle panel ks.keyBindings({ esc: [closePanel, 'Close the details panel'], @@ -276,6 +286,7 @@ ['scroll down', 'See more devices'] ]); + // if the panelData changes scope.$watch('panelData', function () { if (!fs.isEmptyObject(scope.panelData)) { populateDetails(scope.panelData); @@ -283,6 +294,7 @@ } }); + // if the window size changes unbindWatch = $rootScope.$watchCollection( function () { return { diff --git a/web/gui/src/main/webapp/index.html b/web/gui/src/main/webapp/index.html index c571a0fefc..4138e835ed 100644 --- a/web/gui/src/main/webapp/index.html +++ b/web/gui/src/main/webapp/index.html @@ -145,7 +145,7 @@ -
+
diff --git a/web/gui/src/main/webapp/onos.js b/web/gui/src/main/webapp/onos.js index 8c7a557ea3..a0de495ba1 100644 --- a/web/gui/src/main/webapp/onos.js +++ b/web/gui/src/main/webapp/onos.js @@ -69,12 +69,12 @@ angular.module('onosApp', moduleDependencies) .controller('OnosCtrl', [ - '$log', '$route', '$routeParams', '$location', + '$log', '$scope', '$route', '$routeParams', '$location', 'KeyService', 'ThemeService', 'GlyphService', 'VeilService', 'PanelService', 'FlashService', 'QuickHelpService', 'WebSocketService', - function ($log, $route, $routeParams, $location, + function ($log, $scope, $route, $routeParams, $location, ks, ts, gs, vs, ps, flash, qhs, wss) { var self = this; @@ -83,6 +83,9 @@ self.$location = $location; self.version = '1.3.0'; + // shared object inherited by all views: + $scope.onos = {}; + // initialize services... ts.init(); ks.installOn(d3.select('body')); @@ -131,5 +134,29 @@ }); } }); + }]) + + .directive('detectBrowser', ['$log', 'FnService', + function ($log, fs) { + return function (scope) { + var body = d3.select('body'), + browser = ''; + if (fs.isChrome()) { + browser = 'chrome'; + } else if (fs.isSafari()) { + browser = 'safari'; + } else if (fs.isFirefox()) { + browser = 'firefox'; + } + body.classed(browser, true); + scope.onos.browser = browser; + + if (fs.isMobile()) { + body.classed('mobile', true); + scope.onos.mobile = true; + } + + $log.debug('Detected browser is', fs.cap(browser)); + }; }]); }());