From 1fe1c1e291b8633dbaf34f4409b5b22bde19b109 Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandyscarney@gmail.com>
Date: Thu, 30 Jun 2016 16:32:30 -0400
Subject: [PATCH] feat(content): add a resize function to recalculate the
 content size

this should be called when dynamically displaying/hiding headers,
footers, or tabs.

references #7131
---
 src/components/content/content.ts           | 39 +++++++++++++++++++++
 src/components/content/test/basic/index.ts  | 11 ++++--
 src/components/content/test/basic/main.html |  5 +++
 3 files changed, 53 insertions(+), 2 deletions(-)

diff --git a/src/components/content/content.ts b/src/components/content/content.ts
index 761910d04c9..7e0f9cc7a46 100644
--- a/src/components/content/content.ts
+++ b/src/components/content/content.ts
@@ -442,6 +442,45 @@ export class Content extends Ion {
     }
   }
 
+  /**
+   * Tell the content to recalculate its dimensions. This should be called
+   * after dynamically adding headers, footers, or tabs.
+   *
+   * ```ts
+   * @Component({
+   *   template: `
+   *     <ion-header>
+   *       <ion-navbar>
+   *         <ion-title>Main Navbar</ion-title>
+   *       </ion-navbar>
+   *       <ion-toolbar *ngIf="showToolbar">
+   *         <ion-title>Dynamic Toolbar</ion-title>
+   *       </ion-toolbar>
+   *     </ion-header>
+   *     <ion-content>
+   *       <button (click)="toggleToolbar()">Toggle Toolbar</button>
+   *     </ion-content>
+   * `})
+   *
+   * class E2EPage {
+   *   @ViewChild(Content) content: Content;
+   *   showToolbar: boolean = false;
+   *
+   *   toggleToolbar() {
+   *     this.showToolbar = !this.showToolbar;
+   *     this.content.resize();
+   *   }
+   * }
+   * ```
+   *
+   */
+  resize() {
+    nativeRaf(() => {
+      this.readDimensions();
+      this.writeDimensions();
+    });
+  }
+
   /**
    * @private
    * DOM READ
diff --git a/src/components/content/test/basic/index.ts b/src/components/content/test/basic/index.ts
index 55ac8bb4f44..1686469c159 100644
--- a/src/components/content/test/basic/index.ts
+++ b/src/components/content/test/basic/index.ts
@@ -1,5 +1,5 @@
-import {Component} from '@angular/core';
-import {ionicBootstrap} from '../../../../../src';
+import { Component, ViewChild } from '@angular/core';
+import { Content, ionicBootstrap } from '../../../../../src';
 
 
 @Component({
@@ -50,7 +50,14 @@ class Page1 {
   templateUrl: 'main.html'
 })
 class E2EPage {
+  @ViewChild(Content) content: Content;
   page1 = Page1;
+  showToolbar: boolean = false;
+
+  toggleToolbar() {
+    this.showToolbar = !this.showToolbar;
+    this.content.resize();
+  }
 }
 
 
diff --git a/src/components/content/test/basic/main.html b/src/components/content/test/basic/main.html
index 3525d4673e1..20d0efeb9f1 100644
--- a/src/components/content/test/basic/main.html
+++ b/src/components/content/test/basic/main.html
@@ -8,11 +8,16 @@
       </button>
     </ion-buttons>
   </ion-navbar>
+  <ion-toolbar *ngIf="showToolbar">
+    <ion-title>Dynamic Toolbar</ion-title>
+  </ion-toolbar>
 </ion-header>
 
 <ion-content>
   <b>This page has a header and content but no footer or tabs.</b>
 
+  <button (click)="toggleToolbar()">Toggle Toolbar</button>
+
   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.
 
   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.