Merge pull request #25563 from cctuan/1050164

Bug 1050164 - Investigate to implement standalone shrinking library

apps/system/index.html

@@ -364,6 +364,10 @@
     <script defer src="js/emergency_callback_manager.js"></script>
     <link rel="stylesheet" type="text/css" href="style/emergency_callback_manager/emergency_callback_manager.css">
 
+    <!-- Shrinking UI -->
+    <link rel="stylesheet" type="text/css" href="shared/style/shrinking_ui.css">
+    <script defer src="shared/js/shrinking_ui.js"></script>
+
     <!-- Windows -->
     <!-- Any module that wants to intercept the Home button and prevent the -->
     <!-- homescreen from being displayed must come before this script. -->
@@ -381,8 +385,6 @@
     <script defer src="js/text_selection_dialog.js"></script>
     <script defer src="js/app_window.js"></script>
     <script defer src="js/popup_window.js"></script>
-    <script defer src="js/shrinking_ui.js"></script>
-    <link rel="stylesheet" type="text/css" href="style/shrinking_ui/shrinking_ui.css">
     <script defer src="js/browser_mixin.js"></script>
     <script defer src="js/wrapper_factory.js"></script>
     <script defer src="js/homescreen_window.js"></script>

apps/system/js/app_window.js

@@ -1836,6 +1836,7 @@
    * @memberOf AppWindow.prototype
    */
   AppWindow.prototype._handle__shrinkingstart = function aw_shrinkingstart() {
+    this.broadcast('blur');
     this.getScreenshot(() => {
       this._showScreenshotOverlay();
       this.setVisible(false);
@@ -1849,6 +1850,7 @@
    */
   AppWindow.prototype._handle__shrinkingstop = function aw_shrinkingstop() {
     this.setVisible(true);
+    this.broadcast('focus');
   };
 
   /**

apps/system/js/app_window_manager.js

@@ -1,5 +1,5 @@
 /* global SettingsListener, homescreenWindowManager, KeyboardManager,
-          layoutManager, System, NfcHandler, rocketbar */
+          layoutManager, System, NfcHandler, rocketbar, ShrinkingUI */
 'use strict';
 
 (function(exports) {
@@ -273,6 +273,8 @@
       window.addEventListener('appopened', this);
       window.addEventListener('apprequestopen', this);
       window.addEventListener('apprequestclose', this);
+      window.addEventListener('shrinking-start', this);
+      window.addEventListener('shrinking-stop', this);
       window.addEventListener('homescreenopened', this);
       window.addEventListener('reset-orientation', this);
       window.addEventListener('homescreencreated', this);
@@ -301,8 +303,6 @@
       window.addEventListener('permissiondialoghide', this);
       window.addEventListener('appopening', this);
       window.addEventListener('localized', this);
-      window.addEventListener('shrinking-start', this);
-      window.addEventListener('shrinking-stop', this);
 
       window.addEventListener('mozChromeEvent', this);
 
@@ -408,9 +408,21 @@
       var detail = evt.detail;
       switch (evt.type) {
         case 'shrinking-start':
-          activeApp && activeApp.broadcast('blur');
+          if (this.shrinkingUI && this.shrinkingUI.isActive()) {
+            return;
+          }
+          var bottomMost = this._activeApp.getBottomMostWindow();
+          this.shrinkingUI = new ShrinkingUI(bottomMost.element,
+            bottomMost.element.parentNode);
+          this.shrinkingUI.start();
+          activeApp && activeApp.broadcast('shrinkingstart');
           break;
         case 'shrinking-stop':
+          if (this.shrinkingUI && this.shrinkingUI.isActive()) {
+            activeApp && activeApp.broadcast('shrinkingstop');
+            this.shrinkingUI.stop();
+          }
+          break;
         case 'permissiondialoghide':
           activeApp && activeApp.broadcast('focus');
           break;
@@ -751,6 +763,9 @@
       // is the same as its current value.
       this._activeApp.resize();
       if (appHasChanged) {
+        if (this.shrinkingUI && this.shrinkingUI.isActive()) {
+          this.shrinkingUI.stop();
+        }
         this.publish('activeappchanged');
       }
 

apps/system/js/bootstrap.js

@@ -9,7 +9,7 @@
          TelephonySettings, SuspendingAppPriorityManager, TTLView,
          MediaRecording, AppWindowFactory, SystemDialogManager,
          applications, Rocketbar, LayoutManager, PermissionManager,
-         SoftwareButtonManager, Accessibility, NfcUtils, ShrinkingUI,
+         SoftwareButtonManager, Accessibility, NfcUtils,
          TextSelectionDialog, InternetSharing, SleepMenu, AppUsageMetrics,
          LockScreenPasscodeValidator, NfcManager,
          ExternalStorageMonitor,
@@ -177,8 +177,6 @@ window.addEventListener('load', function startup() {
   window.places.start();
   window.remoteDebugger = new RemoteDebugger();
   window.rocketbar = new Rocketbar();
-  window.shrinkingUI = new ShrinkingUI();
-  window.shrinkingUI.start();
   window.sleepMenu = new SleepMenu();
   window.sleepMenu.start();
   window.softwareButtonManager = new SoftwareButtonManager();

apps/system/js/nfc_manager.js

@@ -112,6 +112,7 @@
       window.navigator.mozSetMessageHandler('nfc-manager-tech-lost', null);
 
       window.removeEventListener('screenchange', this);
+      window.removeEventListener('activeappchanged', this);
       window.removeEventListener('lockscreen-appopened', this);
       window.removeEventListener('lockscreen-appclosed', this);
 
@@ -158,7 +159,7 @@
       switch (tech) {
         case 'P2P':
           if (!msg.records.length) {
-            this._triggerP2PUI();
+            this.checkP2PRegistration();
           } else {
             // if there are records in the msg we've got NDEF message shared
             // by other device via P2P, this should be handled as regular NDEF
@@ -218,8 +219,8 @@
         case 'shrinking-sent':
           window.removeEventListener('shrinking-sent', this);
           // Notify lower layers that User has acknowledged to send NDEF msg
-          window.dispatchEvent(new CustomEvent(
-            'dispatch-p2p-user-response-on-active-app', {detail: this}));
+          this.dispatchP2PUserResponse();
+
           // Stop the P2P UI
           window.dispatchEvent(new CustomEvent('shrinking-stop'));
           break;
@@ -330,11 +331,14 @@
      * @memberof NfcManager.prototype
      * @param {string} manifestURL - manifest url of app to check
      */
-    checkP2PRegistration: function nm_checkP2PRegistration(manifestURL) {
+    checkP2PRegistration: function nm_checkP2PRegistration() {
       var nfcdom = window.navigator.mozNfc;
       if (!nfcdom) {
         return;
       }
+      var activeApp = window.System.currentApp;
+      var manifestURL = activeApp.getTopMostWindow().manifestURL ||
+        window.System.manifestURL;
 
       var status = nfcdom.checkP2PRegistration(manifestURL);
       status.onsuccess = () => {
@@ -361,12 +365,14 @@
      * @memberof NfcManager.prototype
      * @param {string} manifestURL - manifest url of the sharing app
      */
-    dispatchP2PUserResponse: function nm_dispatchP2PUserResponse(manifestURL) {
+    dispatchP2PUserResponse: function nm_dispatchP2PUserResponse() {
       var nfcdom = window.navigator.mozNfc;
       if (!nfcdom) {
         return;
       }
-
+      var activeApp = window.System.currentApp;
+      var manifestURL = activeApp.getTopMostWindow().manifestURL ||
+        window.System.manifestURL;
       nfcdom.notifyUserAcceptedP2P(manifestURL);
     },
 

apps/system/test/unit/app_window_manager_test.js

@@ -1,4 +1,4 @@
-/* global appWindowManager, AppWindow, HomescreenWindowManager,
+/* global appWindowManager, AppWindow, HomescreenWindowManager, MockShrinkingUI,
           HomescreenWindow, MocksHelper, MockSettingsListener, System,
           MockRocketbar, rocketbar, homescreenWindowManager */
 'use strict';
@@ -18,10 +18,11 @@ requireApp('system/test/unit/mock_homescreen_window_manager.js');
 requireApp('system/test/unit/mock_nfc_handler.js');
 requireApp('system/test/unit/mock_rocketbar.js');
 requireApp('system/js/system.js');
+requireApp('system/shared/test/unit/mocks/mock_shrinking_ui.js');
 requireApp('system/shared/test/unit/mocks/mock_settings_listener.js');
 
 var mocksForAppWindowManager = new MocksHelper([
-  'OrientationManager', 'ActivityWindow',
+  'OrientationManager', 'ActivityWindow', 'ShrinkingUI',
   'Applications', 'SettingsListener', 'HomescreenWindowManager',
   'ManifestHelper', 'KeyboardManager', 'StatusBar', 'SoftwareButtonManager',
   'HomescreenWindow', 'AppWindow', 'LayoutManager', 'System', 'NfcHandler'
@@ -228,17 +229,24 @@ suite('system/AppWindowManager', function() {
         appWindowManager.handleEvent({
           type: 'shrinking-start'
         });
-        assert.isTrue(stubFocus.calledWith('blur'));
+        assert.deepEqual(appWindowManager.shrinkingUI.elements
+          .foregroundElement, app1.getBottomMostWindow().element);
+        assert.deepEqual(appWindowManager.shrinkingUI.elements
+          .backgroundElement, app1.getBottomMostWindow().element.parentNode);
+        assert.isTrue(appWindowManager.shrinkingUI.mStarted);
+        assert.isTrue(stubFocus.calledWith('shrinkingstart'));
       });
 
     test('When receiving shrinking-stop, we need to focus the active app',
       function() {
         var stubFocus = this.sinon.stub(app1, 'broadcast');
         appWindowManager._activeApp = app1;
+        appWindowManager.shrinkingUI = new MockShrinkingUI();
+        appWindowManager.shrinkingUI.mActive = true;
         appWindowManager.handleEvent({
           type: 'shrinking-stop'
         });
-        assert.isTrue(stubFocus.calledWith('focus'));
+        assert.isTrue(stubFocus.calledWith('shrinkingstop'));
       });
 
     test('When permission dialog is closed, we need to focus the active app',
@@ -622,10 +630,14 @@ suite('system/AppWindowManager', function() {
     test('update', function() {
       var spyPublish= this.sinon.spy(appWindowManager, 'publish');
       injectRunningApps(app1, app2, app3, app4);
+      appWindowManager.shrinkingUI = new MockShrinkingUI();
+      var stubStart = this.sinon.stub(appWindowManager.shrinkingUI, 'start');
+      appWindowManager.shrinkingUI.mActive = true;
       appWindowManager._activeApp = app2;
       appWindowManager._updateActiveApp(app1.instanceID);
       assert.equal(spyPublish.firstCall.args[0], 'activeappchanged');
       assert.deepEqual(appWindowManager._activeApp, app1);
+      assert.isFalse(stubStart.calledOnce);
     });
 
     test('should not publish activeappchanged if activeApp is the same',

apps/system/test/unit/app_window_test.js

@@ -20,7 +20,7 @@ var mocksForAppWindow = new MocksHelper([
   'ManifestHelper', 'LayoutManager', 'ScreenLayout', 'AppChrome',
   'AppTransitionController'
 ]).init();
-
+ 
 suite('system/AppWindow', function() {
   var realPermissionSettings;
   mocksForAppWindow.attachTestHelpers();
@@ -1906,11 +1906,13 @@ suite('system/AppWindow', function() {
       );
       var stubShowScreenshot = this.sinon.stub(app1, '_showScreenshotOverlay');
       var stubSetVisible = this.sinon.stub(app1, 'setVisible');
+      var stubBroadcast = this.sinon.stub(app1, 'broadcast');
 
       app1.handleEvent({
         type: '_shrinkingstart'
       });
 
+      assert.isTrue(stubBroadcast.calledWith('blur'));
       assert.isTrue(stubGetScreenshot.calledOnce, 'getScreenshot');
       assert.isTrue(stubShowScreenshot.calledOnce,
                     '_showScreenshotOverlay in callback');
@@ -1920,12 +1922,14 @@ suite('system/AppWindow', function() {
     test('Shrinking stop event', function() {
       var app1 = new AppWindow(fakeAppConfig1);
       var stubSetVisible = this.sinon.stub(app1, 'setVisible');
+      var stubBroadcast = this.sinon.stub(app1, 'broadcast');
 
       app1.handleEvent({
         type: '_shrinkingstop'
       });
 
       assert.isTrue(stubSetVisible.calledWith(true), 'setVisible');
+      assert.isTrue(stubBroadcast.calledWith('focus'));
     });
   });
 

apps/system/test/unit/bootstrap_test.js

@@ -56,7 +56,6 @@ requireApp('system/js/sleep_menu.js');
 requireApp('system/js/orientation_manager.js');
 requireApp('system/js/nfc_manager.js');
 requireApp('system/js/quick_settings.js');
-requireApp('system/js/shrinking_ui.js');
 requireApp('system/js/software_button_manager.js');
 requireApp('system/js/source_view.js');
 requireApp('system/js/usb_storage.js');

apps/system/test/unit/mock_orientation_manager.js

@@ -17,6 +17,7 @@ var MockOrientationManager = {
   },
 
   fetchCurrentOrientation: function sl_fetchDefaultOrientation() {
+    return this.mCurrentOrientation || this.defaultOrientation;
   },
 
   mTeardown: function mom_mTeardown() {