atotic / lazy-pages Goto Github PK

lazy-pages placed inside a paper-header-panel element will render with a height of 0 unless given an explicit height. Even with a page that is not lazy loaded the height still remains at 0 when set to auto or a % value.

I have an issue where I need to refresh a lazy-page with new content, but I also want the page transition as if it were a new page. Currently there is code to prevent this which I have not been able to get around without forking.

I don't want to have new elements for every page since they all share the same type of element and the pages are dynamic and I am using routing.

My current work around is to set the page to a 'blank' element, then quickly set the page back to the original page (inside a timeout). This mostly works, but it isn't great. I'd be grateful you could tell me a better way or if you could add support for this. Thanks.

We are experiencing the following behavior:

When "navigating" through two transitions of templates (either by clicking / tapping, or by pushing browser history) and navigating then back, the transition mechanism fails.

I am not 100% sure of the following, but this is our hypothesis what is going on.

Let us assume that transitions are from template A to template B and teamplate B to template C and back from teamplate C to template B.

B and C are not instanced templates yet.

The first transition starts, sets B template 'if' property to true. No instance is 'materialized' yet.
The second transition immediatelly cancels the first transition. Wants to start from B, but still hasn't instance of template B. B does not get handled correctly somehow in the cleanup, C is displayed though. But navigating (any time later) back from C to B fails.

This is the current entry page activation.

    // start entryPage activation
    this.lazy._setSelectedItem(this.entryPage);
    if (this.isTemplate(this.entryPage)) {
      this.entryPage.addEventListener('dom-change', this._boundDomChange);
      if (this.entryPage.if)
        console.warn('transitioning to already showing template');
      this.entryPage.if = true; // generate the dom
    }
    ...

On transitioning back from C to B, the entryPage (template B) has the "if" property stil set to true, the 'dom-change' is not fired, the _boundDomChange() method is not called.

We would suggest this change as an 'optimistic' approach to always fire the transition:

    // start entryPage activation
    this.lazy._setSelectedItem(this.entryPage);
    if (this.isTemplate(this.entryPage)) {
      if (this.entryPage.if) {
        console.warn('transitioning to already showing template');
        this._boundDomChange();
      }
      else {
        this.entryPage.addEventListener('dom-change', this._boundDomChange);
        this.entryPage.if = true; // generate the dom
      }
    }

This works for us.

Might need correct handling of stopped transition "not yet materialized" pages though.

<lazy-pages
   animate-initial-selection
        attr-for-selected="route"
        selected="{{chapterIndex}}"
        rescue-selection="0">

          <template is="dom-repeat" items="[[activity.chapters]]">

            <template is="dom-if" route="[[index]]">

It always returns lazy-pages.html:354 rescueSelection page not found

I no longer code in Polymer, so I can't maintain this repo. Pull requests still accepted.

bower.json mention MIT license for library. is it correct?

It would be great to have the ability to manually preload a page (when you know the user will most likely transition to it soon) without actually switching to it yet.

I want the height of the lazy-pages element adjust to the height of the it's children automatically.

Is it doing it right now? Am I doing something wrong?