Print Preview Componentization: Add invitation store

Bug: 812098
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: I40e3697db7b250e0952b0a0242b320730ad06a03
Reviewed-on: https://chromium-review.googlesource.com/985911
Commit-Queue: Rebekah Potter <rbpotter@chromium.org>
Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#547708}

chrome/browser/resources/print_preview/data/compiled_resources2.gyp

@@ -20,6 +20,17 @@
       ],
       'includes': ['../../../../../third_party/closure_compiler/compile_js2.gypi'],
     },
+    {
+      'target_name': 'invitation_store',
+      'dependencies': [
+        'invitation',
+        'user_info',
+        '../compiled_resources2.gyp:cloud_print_interface',
+        '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:event_tracker',
+        '<(DEPTH)/ui/webui/resources/js/cr/compiled_resources2.gyp:event_target',
+      ],
+      'includes': ['../../../../../third_party/closure_compiler/compile_js2.gypi'],
+    },
     {
       'target_name': 'local_parsers',
       'dependencies': [

chrome/browser/resources/print_preview/data/invitation_store.html

+<link rel="import" href="chrome://resources/html/cr/event_target.html">
+<link rel="import" href="chrome://resources/html/event_tracker.html">
+<link rel="import" href="invitation.html">
+<link rel="import" href="user_info.html">
+<link rel="import" href="../cloud_print_interface.html">
+
+<script src="invitation_store.js"></script>

chrome/browser/resources/print_preview/new/app.html

@@ -6,6 +6,7 @@
 <link rel="import" href="../native_layer.html">
 <link rel="import" href="../data/destination.html">
 <link rel="import" href="../data/destination_store.html">
+<link rel="import" href="../data/invitation_store.html">
 <link rel="import" href="../data/document_info.html">
 <link rel="import" href="../data/measurement_system.html">
 <link rel="import" href="../data/user_info.html">
@@ -75,6 +76,7 @@
         <print-preview-destination-settings id="destinationSettings"
             destination="[[destination_]]"
             destination-store="[[destinationStore_]]"
+            invitation-store="[[invitationStore_]]"
             disabled="[[controlsDisabled_]]" state="[[state]]"
             recent-destinations="[[recentDestinations_]]"
             user-info="{{userInfo_}}">

chrome/browser/resources/print_preview/new/app.js

@@ -36,6 +36,13 @@ Polymer({
       notify: true,
     },
 
+    /** @private {?print_preview.InvitationStore} */
+    invitationStore_: {
+      type: Object,
+      notify: true,
+      value: null,
+    },
+
     /** @private {!Array<print_preview.RecentDestination>} */
     recentDestinations_: {
       type: Array,
@@ -115,6 +122,7 @@ Polymer({
         'use-cloud-print', this.onCloudPrintEnable_.bind(this));
     this.destinationStore_ = new print_preview.DestinationStore(
         this.userInfo_, this.listenerTracker_);
+    this.invitationStore_ = new print_preview.InvitationStore(this.userInfo_);
     this.tracker_.add(
         this.destinationStore_,
         print_preview.DestinationStore.EventType.DESTINATION_SELECT,
@@ -194,8 +202,11 @@ Polymer({
     });
 
     this.destinationStore_.setCloudPrintInterface(this.cloudPrintInterface_);
-    if (this.$.destinationSettings.isDialogOpen())
+    this.invitationStore_.setCloudPrintInterface(this.cloudPrintInterface_);
+    if (this.$.destinationSettings.isDialogOpen()) {
       this.destinationStore_.startLoadCloudDestinations();
+      this.invitationStore_.startLoadingInvitations();
+    }
   },
 
   /** @private */

chrome/browser/resources/print_preview/new/compiled_resources2.gyp

@@ -26,6 +26,7 @@
         '../compiled_resources2.gyp:native_layer',
         '../data/compiled_resources2.gyp:destination',
         '../data/compiled_resources2.gyp:destination_store',
+        '../data/compiled_resources2.gyp:invitation_store',
         '../data/compiled_resources2.gyp:document_info',
         '../data/compiled_resources2.gyp:measurement_system',
         '../data/compiled_resources2.gyp:user_info',
@@ -51,6 +52,7 @@
       'dependencies': [
         '../data/compiled_resources2.gyp:destination',
         '../data/compiled_resources2.gyp:destination_store',
+        '../data/compiled_resources2.gyp:invitation_store',
         '../data/compiled_resources2.gyp:user_info',
         'destination_dialog',
         'state',
@@ -230,9 +232,11 @@
       'target_name': 'destination_dialog',
       'dependencies': [
         '<(DEPTH)/ui/webui/resources/cr_elements/cr_dialog/compiled_resources2.gyp:cr_dialog',
-        '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:load_time_data',
+        '<(DEPTH)/ui/webui/resources/js/compiled_resources2.gyp:i18n_behavior',
         '../data/compiled_resources2.gyp:destination',
         '../data/compiled_resources2.gyp:destination_store',
+        '../data/compiled_resources2.gyp:invitation',
+        '../data/compiled_resources2.gyp:invitation_store',
         '../data/compiled_resources2.gyp:user_info',
         'destination_list',
         'print_preview_search_box',

chrome/browser/resources/print_preview/new/destination_dialog.html

@@ -4,19 +4,21 @@
 <link rel="import" href="chrome://resources/cr_elements/hidden_style_css.html">
 <link rel="import" href="chrome://resources/html/action_link_css.html">
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
-<link rel="import" href="chrome://resources/html/load_time_data.html">
 <link rel="import" href="../data/destination.html">
 <link rel="import" href="../data/destination_store.html">
+<link rel="import" href="../data/invitation.html">
+<link rel="import" href="../data/invitation_store.html">
 <link rel="import" href="button_css.html">
 <link rel="import" href="destination_list.html">
 <link rel="import" href="print_preview_search_box.html">
 <link rel="import" href="print_preview_shared_css.html">
 <link rel="import" href="search_dialog_css.html">
 <link rel="import" href="select_css.html">
+<link rel="import" href="throbber_css.html">
 
 <dom-module id="print-preview-destination-dialog">
   <template>
-    <style include="print-preview-shared button action-link select cr-hidden-style search-dialog">
+    <style include="print-preview-shared button action-link select cr-hidden-style search-dialog throbber">
       :host #dialog {
         width: 640px;
       }
@@ -34,29 +36,31 @@
         width: auto
       }
 
-      :host #dialog .cloudprint-promo {
+      :host #dialog #promos {
+        padding: 0;
+      }
+
+      :host #dialog .promo {
         align-items: center;
         background-color: #f5f5f5;
-        border-color: #e7e7e7;
-        border-top-style: solid;
-        border-width: 1px;
+        border-top: 1px solid #e7e7e7;
         color: #888;
         display: flex;
         padding: 14px 17px;
       }
 
-      :host .cloudprint-promo .promo-text {
+      :host #cloudprintPromo .promo-text {
         flex: 1;
       }
 
-      :host .cloudprint-promo .icon {
+      :host #cloudprintPromo .icon {
         -webkit-margin-end: 12px;
         display: block;
         height: 24px;
         width: 24px;
       }
 
-      :host .cloudprint-promo .close-button {
+      :host #cloudprintPromo .close-button {
         -webkit-margin-start: 12px;
         background-image: -webkit-image-set(
           url(chrome://theme/IDR_CLOSE_DIALOG) 1x,
@@ -67,17 +71,29 @@
         width: 14px;
       }
 
-      :host .cloudprint-promo .close-button:hover {
+      :host #cloudprintPromo .close-button:hover {
         background-image: -webkit-image-set(
           url(chrome://theme/IDR_CLOSE_DIALOG_H) 1x,
           url(chrome://theme/IDR_CLOSE_DIALOG_H@2x) 2x);
       }
 
-      :host .cloudprint-promo .close-button:active {
+      :host #cloudprintPromo .close-button:active {
         background-image: -webkit-image-set(
           url(chrome://theme/IDR_CLOSE_DIALOG_P) 1x,
           url(chrome://theme/IDR_CLOSE_DIALOG_P@2x) 2x);
       }
+
+      :host #invitationPromo {
+        flex-direction: column;
+      }
+
+      :host #invitationPromo .invitation-text {
+        padding-bottom: 12px;
+      }
+
+      :host #invitationPromo .invitation-reject-button {
+        -webkit-margin-start: 10px;
+      }
     </style>
     <dialog is="cr-dialog" id="dialog" on-close="onCloseOrCancel_">
       <div slot="title">
@@ -120,11 +136,29 @@
           $i18n{cancel}
         </button>
       </div>
-      <div class="cloudprint-promo" slot="footer"
-          hidden$="[[!showCloudPrintPromo]]">
-        <img src="../images/cloud.png" class="icon" alt="">
-        <div class="promo-text"></div>
-        <div class="close-button"></div>
+      <div id="promos" slot="footer">
+        <div class="promo" id="cloudprintPromo"
+            hidden$="[[!showCloudPrintPromo]]">
+          <img src="../images/cloud.png" class="icon" alt="">
+          <div class="promo-text"></div>
+          <div class="close-button"></div>
+        </div>
+        <div class="promo" id="invitationPromo" hidden="[[!invitation_]]">
+          <div class="invitation-text"
+              inner-h-t-m-l="[[getInvitationText_(invitation_)]]">
+          </div>
+          <div class="invitation-buttons">
+            <button class="invitation-accept-button"
+                on-click="onInvitationAcceptClick_">
+              [[getAcceptButtonText_(invitation_)]]
+            </button>
+            <button class="invitation-reject-button"
+                on-click="onInvitationRejectClick_">
+              $i18n{reject}
+            </button>
+            <div id="invitation-process-throbber" class="throbber" hidden></div>
+          </div>
+        </div>
       </div>
     </dialog>
   </template>

chrome/browser/resources/print_preview/new/destination_dialog.js

@@ -14,6 +14,18 @@ Polymer({
       observer: 'onDestinationStoreSet_',
     },
 
+    /** @type {?print_preview.InvitationStore} */
+    invitationStore: {
+      type: Object,
+      observer: 'onInvitationStoreSet_',
+    },
+
+    /** @private {?print_preview.Invitation} */
+    invitation_: {
+      type: Object,
+      value: null,
+    },
+
     /** @type {!print_preview.UserInfo} */
     userInfo: {
       type: Object,
@@ -78,7 +90,7 @@ Polymer({
     this.tracker_.add(
         assert(this.$$('.sign-in')), 'click', this.onSignInClick_.bind(this));
     this.tracker_.add(
-        assert(this.$$('.cloudprint-promo > .close-button')), 'click',
+        assert(this.$$('#cloudprintPromo > .close-button')), 'click',
         this.onCloudPrintPromoDismissed_.bind(this));
   },
 
@@ -93,7 +105,26 @@ Polymer({
     this.tracker_.add(
         destinationStore,
         print_preview.DestinationStore.EventType.DESTINATION_SEARCH_DONE,
-        this.updateDestinations_.bind(this));
+        this.onDestinationSearchDone_.bind(this));
+  },
+
+  /** @private */
+  onInvitationStoreSet_: function() {
+    const invitationStore = assert(this.invitationStore);
+    this.tracker_.add(
+        invitationStore,
+        print_preview.InvitationStore.EventType.INVITATION_SEARCH_DONE,
+        this.updateInvitations_.bind(this));
+    this.tracker_.add(
+        invitationStore,
+        print_preview.InvitationStore.EventType.INVITATION_PROCESSED,
+        this.updateInvitations_.bind(this));
+  },
+
+  /** @private */
+  onDestinationSearchDone_: function() {
+    this.updateDestinations_();
+    this.invitationStore.startLoadingInvitations();
   },
 
   /** @private */
@@ -179,6 +210,66 @@ Polymer({
     this.showCloudPrintPromo = false;
   },
 
+  /**
+   * Updates printer sharing invitations UI.
+   * @private
+   */
+  updateInvitations_: function() {
+    const invitations = this.userInfo.activeUser ?
+        this.invitationStore.invitations(this.userInfo.activeUser) :
+        [];
+    this.invitation_ = invitations.length > 0 ? invitations[0] : null;
+  },
+
+  /**
+   * @return {string} The text show show on the "accept" button in the
+   *     invitation promo. 'Accept', 'Accept for group', or empty if there is no
+   *     invitation.
+   * @private
+   */
+  getAcceptButtonText_: function() {
+    if (!this.invitation_)
+      return '';
+
+    return this.invitation_.asGroupManager ? this.i18n('acceptForGroup') :
+                                             this.i18n('accept');
+  },
+
+  /**
+   * @return {string} The formatted text to show for the invitation promo.
+   * @private
+   */
+  getInvitationText_: function() {
+    if (!this.invitation_)
+      return '';
+
+    if (this.invitation_.asGroupManager) {
+      return this.i18nAdvanced('groupPrinterSharingInviteText', {
+        substitutions: [
+          this.invitation_.sender, this.invitation_.destination.displayName,
+          this.invitation_.receiver
+        ]
+      });
+    }
+
+    return this.i18nAdvanced('printerSharingInviteText', {
+      substitutions:
+          [this.invitation_.sender, this.invitation_.destination.displayName]
+    });
+  },
+
+  /** @private */
+  onInvitationAcceptClick_: function() {
+    this.invitationStore.processInvitation(assert(this.invitation_), true);
+    this.updateInvitations_();
+  },
+
+  /** @private */
+  onInvitationRejectClick_: function() {
+    this.invitationStore.processInvitation(assert(this.invitation_), false);
+    this.updateInvitations_();
+  },
+
   /** @private */
   onUserChange_: function() {
     const select = this.$$('select');
@@ -189,6 +280,7 @@ Polymer({
       this.notifyPath('userInfo.activeUser');
       this.notifyPath('userInfo.loggedIn');
       this.destinationStore.reloadUserCookieBasedDestinations();
+      this.invitationStore.startLoadingInvitations();
     } else {
       print_preview.NativeLayer.getInstance().signIn(true).then(
           this.destinationStore.onDestinationsReload.bind(

chrome/browser/resources/print_preview/new/destination_settings.html

@@ -5,6 +5,7 @@
 <link rel="import" href="chrome://resources/html/event_tracker.html">
 <link rel="import" href="../data/destination.html">
 <link rel="import" href="../data/destination_store.html">
+<link rel="import" href="../data/invitation_store.html">
 <link rel="import" href="../data/user_info.html">
 <link rel="import" href="button_css.html">
 <link rel="import" href="destination_dialog.html">
@@ -92,6 +93,7 @@
       <template>
         <print-preview-destination-dialog
             destination-store="[[destinationStore]]"
+            invitation-store="[[invitationStore]]"
             recent-destinations="[[recentDestinations]]"
             user-info="{{userInfo}}"
             show-cloud-print-promo="{{showCloudPrintPromo_}}">

chrome/browser/resources/print_preview/new/destination_settings.js

@@ -12,6 +12,9 @@ Polymer({
     /** @type {?print_preview.DestinationStore} */
     destinationStore: Object,
 
+    /** @type {?print_preview.InvitationStore} */
+    invitationStore: Object,
+
     /** @type {!Array<!print_preview.RecentDestination>} */
     recentDestinations: Array,
 
@@ -60,6 +63,7 @@ Polymer({
   /** @private */
   onChangeButtonClick_: function() {
     this.destinationStore.startLoadAllDestinations();
+    this.invitationStore.startLoadingInvitations();
     const dialog = this.$.destinationDialog.get();
     // This async() call is a workaround to prevent a DCHECK - see
     // https://crbug.com/804047.

chrome/browser/resources/print_preview/print_preview_resources.grd

@@ -78,6 +78,12 @@
       <structure name="IDR_PRINT_PREVIEW_DATA_INVITATION_JS"
                  file="data/invitation.js"
                  type="chrome_html" />
+      <structure name="IDR_PRINT_PREVIEW_DATA_INVITATION_STORE_HTML"
+                 file="data/invitation_store.html"
+                 type="chrome_html" />
+      <structure name="IDR_PRINT_PREVIEW_DATA_INVITATION_STORE_JS"
+                 file="data/invitation_store.js"
+                 type="chrome_html" />
       <structure name="IDR_PRINT_PREVIEW_DATA_MARGINS_HTML"
                  file="data/margins.html"
                  type="chrome_html" />