How to use the @polymer/polymer/lib/utils/render-status.js.afterNextRender function in @polymer/polymer

To help you get started, we’ve selected a few @polymer/polymer examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github elmsln / lrnwebcomponents / elements / haxcms-elements / lib / ui-components / blocks / site-children-block.js View on Github external
connectedCallback() {
    super.connectedCallback();
    autorun(reaction => {
      this.editMode = toJS(store.editMode);
      this.__disposer.push(reaction);
    });
    autorun(reaction => {
      this.manifest = toJS(store.manifest);
      this.__disposer.push(reaction);
    });
    afterNextRender(this, function() {
      // minor timing thing to ensure store has picked active
      // needed if routes set on first paint or lifecycles miss
      setTimeout(() => {
        autorun(reaction => {
          this.activeId = toJS(store.activeId);
          this.__disposer.push(reaction);
        });
      }, 250);
    });
  }
  disconnectedCallback() {
github elmsln / lrnwebcomponents / elements / paper-audio-player / paper-audio-player.js View on Github external
connectedCallback() {
    super.connectedCallback();
    afterNextRender(this, function() {
      this.shadowRoot
        .querySelector("#audio")
        .addEventListener("loadedmetadata", this._onCanPlay.bind(this));
      this.shadowRoot
        .querySelector("#audio")
        .addEventListener("playing", this._onPlaying.bind(this));
      this.shadowRoot
        .querySelector("#audio")
        .addEventListener("pause", this._onPause.bind(this));
      this.shadowRoot
        .querySelector("#audio")
        .addEventListener("ended", this._onEnd.bind(this));
      this.shadowRoot
        .querySelector("#audio")
        .addEventListener("error", this._onError.bind(this));
    });
github elmsln / lrnwebcomponents / elements / image-compare-slider / image-compare-slider.es6.js View on Github external
constructor() {
    super();
    import("@lrnwebcomponents/user-action/user-action.js");
    import("@polymer/iron-image/iron-image.js");
    import("@polymer/paper-slider/paper-slider.js");
    afterNextRender(this, function() {
      this.HAXWiring = new HAXWiring();
      this.HAXWiring.setup(
        ImageCompareSlider.haxProperties,
        ImageCompareSlider.tag,
        this
      );
    });
  }
  static get template() {
github elmsln / lrnwebcomponents / elements / simple-image / simple-image.es6.js View on Github external
constructor() {
    super();
    afterNextRender(this, function() {
      this.HAXWiring = new HAXWiring();
      this.HAXWiring.setup(SimpleImage.haxProperties, SimpleImage.tag, this);
    });
  }
  static get template() {
github elmsln / lrnwebcomponents / elements / eco-json-schema-form / lib / eco-json-schema-array.js View on Github external
_schemaChanged() {
    //make sure the content is there first
    afterNextRender(this, () => {
      let itemLabel = this.schema.items.itemLabel;
      if (this.schema && Array.isArray(this.schema.value)) {
        this.schema.value.forEach(val => {
          this.push("__headings", val[itemLabel]);
        });
      }
      this.shadowRoot.querySelectorAll(".item-fields").forEach(item => {
        let index = item.getAttribute("data-index"),
          propertyName = `${this.propertyPrefix}${this.propertyName}`,
          prefix = `${propertyName}.${index}`,
          //path = `${propertyName}.properties.${index}`,
          val = this.schema.value[index];
        //for each array item, request the fields frrom eco-json-schema-object
        this.dispatchEvent(
          new CustomEvent("build-fieldset", {
            bubbles: false,
github elmsln / lrnwebcomponents / elements / simple-icon-picker / simple-icon-picker.js View on Github external
ready() {
    super.ready();
    afterNextRender(this, function() {
      const iconSets = new IronMeta({ type: "iconset" });
      if (
        this.icons.length === 0 &&
        typeof iconSets !== typeof undefined &&
        iconSets.list &&
        iconSets.list.length
      ) {
        var iconList = [];
        iconSets.list.forEach(function(item) {
          item.getIconNames().forEach(icon => {
            iconList.push(icon);
          });
        });
        this.__iconList = iconList;
      }
    });
github elmsln / lrnwebcomponents / elements / simple-concept-network / simple-concept-network.es6.js View on Github external
constructor() {
    super();
    import("@lrnwebcomponents/simple-concept-network/lib/simple-concept-network-node.js");
    afterNextRender(this, function() {
      this.HAXWiring = new HAXWiring();
      this.HAXWiring.setup(
        SimpleConceptNetwork.haxProperties,
        SimpleConceptNetwork.tag,
        this
      );
    });
  }
  static get template() {
github elmsln / lrnwebcomponents / elements / lrnsys-button / lrnsys-button.es6.js View on Github external
ready() {
    super.ready();
    afterNextRender(this, function() {
      this.addEventListener("mousedown", this.tapEventOn.bind(this));
      this.addEventListener("mouseover", this.tapEventOn.bind(this));
      this.addEventListener("mouseout", this.tapEventOff.bind(this));
      this.$.button.addEventListener(
        "focused-changed",
        this.focusToggle.bind(this)
      );
    });
  }
  connectedCallback() {
github nuxeo / nuxeo-elements / ui / nuxeo-document-comments / nuxeo-document-comment.js View on Github external
_editComment() {
      this._setEditing(true);
      afterNextRender(this, function() {
        this.$$('#inputContainer').focus();
      });
    }

@polymer/polymer

The Polymer library makes it easy to create your own web components. Give your element some markup and properties, and then use it on a site. Polymer provides features like dynamic templates and data binding to reduce the amount of boilerplate you need to

BSD-3-Clause
Latest version published 3 months ago

Package Health Score

90 / 100
Full package analysis