feat(ons-splitter): Implemented page lifecycle events propagation on …

…ons-splitter, ons-splitter-content, ons-splitter-side elements.
OnsenUI · Sep 10, 2015 · 9e2543e · 9e2543e
1 parent 4b22ae2
commit 9e2543e
Show file tree

Hide file tree

Showing 6 changed files with 119 additions and 0 deletions.
diff --git a/core/elements/ons-splitter-content.es6 b/core/elements/ons-splitter-content.es6
@@ -44,7 +44,20 @@ limitations under the License.
       options.callback = options.callback instanceof Function ? options.callback : () => {};
       ons._internal.getPageHTMLAsync(page).then((html) => {
         window.OnsSplitterContentElement.rewritables.link(this, util.createFragment(html), (fragment) => {
+          while (this.childNodes[0]) {
+            if (this.childNodes[0]._hide instanceof Function) {
+              this.childNodes[0]._hide();
+            }
+            this.removeChild(this.childNodes[0]);
+          }
+
           this.appendChild(fragment);
+          util.arrayOf(fragment.children).forEach(child => {
+            if (child._show instanceof Function) {
+              child._show();
+            }
+          });
+
           options.callback();
         });
       });
@@ -61,6 +74,31 @@ limitations under the License.
     detachedCallback() {
     }
 
+    _show() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._show instanceof Function) {
+          child._show();
+        }
+      });
+    }
+
+    _hide() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._hide instanceof Function) {
+          child._hide();
+        }
+      });
+    }
+
+    _destroy() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._destroy instanceof Function) {
+          child._destroy();
+        }
+      });
+      this.remove();
+    }
+
     _assertParent() {
       const parentElementName = this.parentElement.nodeName.toLowerCase();
       if (parentElementName !== 'ons-splitter') {

diff --git a/core/elements/ons-splitter-content.spec.es6 b/core/elements/ons-splitter-content.spec.es6
@@ -25,6 +25,12 @@ describe('ons-splitter-content', () => {
     expect(window.OnsSplitterContentElement).to.be.ok;
   });
 
+  it('provides _hide(), _show(), _destroy() methods', () => {
+    expect(content._hide instanceof Function).to.be.ok;
+    expect(content._show instanceof Function).to.be.ok;
+    expect(content._destroy instanceof Function).to.be.ok;
+  });
+
   describe('child elements', ()=> {
     it('should pass though child nodes', () => {
       expect(content.innerHTML).to.be.equal('content');

diff --git a/core/elements/ons-splitter-side.es6 b/core/elements/ons-splitter-side.es6
@@ -684,7 +684,20 @@ limitations under the License.
       options.callback = options.callback instanceof Function ? options.callback : () => {};
       ons._internal.getPageHTMLAsync(page).then((html) => {
         window.OnsSplitterSideElement.rewritables.link(this, util.createFragment(html), (fragment) => {
+          while (this.childNodes[0]) {
+            if (this.childNodes[0]._hide instanceof Function) {
+              this.childNodes[0]._hide();
+            }
+            this.removeChild(this.childNodes[0]);
+          }
+
           this.appendChild(fragment);
+          util.arrayOf(fragment.childNodes).forEach(node => {
+            if (node._show instanceof Function) {
+              node._show();
+            }
+          });
+
           options.callback();
         });
       });
@@ -773,6 +786,31 @@ limitations under the License.
       return this._getModeStrategy().handleGesture(event);
     }
 
+    _show() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._show instanceof Function) {
+          child._show();
+        }
+      });
+    }
+
+    _hide() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._hide instanceof Function) {
+          child._hide();
+        }
+      });
+    }
+
+    _destroy() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._destroy instanceof Function) {
+          child._destroy();
+        }
+      });
+      this.remove();
+    }
+
     _createAnimator() {
       const animatorName = this.hasAttribute('animation') ? this.getAttribute('animation') : 'default';
       const animatorDict = window.OnsSplitterElement._animatorDict;

diff --git a/core/elements/ons-splitter-side.spec.es6 b/core/elements/ons-splitter-side.spec.es6
@@ -24,6 +24,12 @@ describe('ons-splitter-side', () => {
     splitter = left = right = null;
   });
 
+  it('provides _hide(), _show(), _destroy() methods', () => {
+    expect(left._hide instanceof Function).to.be.ok;
+    expect(left._show instanceof Function).to.be.ok;
+    expect(left._destroy instanceof Function).to.be.ok;
+  });
+
   describe('#open()', () => {
     it('should open ons-splitter-side', () => {
       expect(right.open()).to.be.equal(true);

diff --git a/core/elements/ons-splitter.es6 b/core/elements/ons-splitter.es6
@@ -278,6 +278,31 @@ limitations under the License.
 
       this.removeEventListener('modechange', this._boundOnModeChange, false);
     }
+
+    _show() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._show instanceof Function) {
+          child._show();
+        }
+      });
+    }
+
+    _hide() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._hide instanceof Function) {
+          child._hide();
+        }
+      });
+    }
+
+    _destroy() {
+      util.arrayOf(this.children).forEach(child => {
+        if (child._destroy instanceof Function) {
+          child._destroy();
+        }
+      });
+      this.remove();
+    }
   }
 
   if (!window.OnsSplitterElement) {

diff --git a/core/elements/ons-splitter.spec.es6 b/core/elements/ons-splitter.spec.es6
@@ -21,6 +21,12 @@ describe('ons-splitter', () => {
     splitter = null;
   });
 
+  it('provides _hide(), _show(), _destroy() methods', () => {
+    expect(splitter._hide instanceof Function).to.be.ok;
+    expect(splitter._show instanceof Function).to.be.ok;
+    expect(splitter._destroy instanceof Function).to.be.ok;
+  });
+
   describe('#openRight()', () => {
     it('should open right ons-splitter-side', () => {
       expect(splitter.openRight()).to.be.equal(true);