push/res/imp/pushselection.html

<!-- The <push-selection-sk> custom element declaration.

  Presents a dialog of package choices and generates an event when the user has
  made a selection. It is a custom element used by <push-server-sk>.

  Attributes:
    'choices'
        The list of packages that are available.
    'choice'
        The selected package.
  Events:
    'change-package'
        A 'change-package' event is generated when the user selects a package to push.
        The change event has the following attributes:

          event.detail.name   - The full name of the package selected.
  Methods:
    toggle()
        Toggles the visibility of the selection dialog.
-->

<dom-module id="push-selection-sk">
  <style>
    .pushSelection {
      font-family: monospace;
      padding: 0.5em;
      cursor: pointer;
    }
    .pushSelection:hover {
      background: #eee;
    }
    .built {
      color: #D95F02;
      display:inline;
    }
    .userid {
      color: #7570B3;
      display:inline;
    }
    paper-dialog div {
      padding: 5px 24px;
    }
    #scrollable {
      height: 80vh;
      overflow-y: auto;
    }
  </style>
  <template>
    <paper-dialog id=chooser>
      <h2>Choose a release package to push</h2>
      <div id=scrollable>
        <iron-selector id=newChoice>
          <template is="dom-repeat" items$="{{choices}}">
            <div class=pushSelection data-name$="{{item.Name}}">
              <iron-icon icon$="{{checkIfInstalled(choice, item.Name)}}" title="Currently installed"></iron-icon>
              <a target=_blank href="{{linkToCommit(item.Hash)}}">{{short(item.Hash)}}</a>
              <a target=_blank href="{{linkToDiff(item.Hash)}}">log</a>
              <pre class=built>{{humanDiffDate(item.Built)}}</pre>
              <pre class=userid title$="{{item.UserID}}">{{short(item.UserID)}}</pre>
              <span>{{item.Note}}</span>
              <iron-icon icon$="{{warnIfDirty(item.Dirty)}}" title="Uncommited changes when the package was built."></iron-icon>
            </div>
          </template>
        </iron-selector>
      </div>
      <div class="buttons">
        <paper-button dialog-dismiss>Cancel</paper-button>
      </div>
    </paper-dialog>
  </template>
</dom-module>

<script>
  Polymer({
    is: "push-selection-sk",

    ready: function() {
      var that = this;
      this.$.newChoice.addEventListener('click', function(e) {
        if (e.target.nodeName == 'A') {
          return;
        }
        that.toggle();
        var div = sk.findParent(e.target, "DIV");
        if (div == null) {
          return
        }
        var detail = { name: div.dataset.name };
        that.dispatchEvent(new CustomEvent('change-package', {detail: detail}));
      });
    },

    properties: {
      choices: {
        type: Array,
        value: function() { return []; },
      },
      choice: {
        type: String,
        value: '',
      },
      installedHash: {
        type: String,
        computed: 'findInstalledHash(choice, choices)',
      }
    },

    toggle: function() {
      this.$.chooser.toggle();
    },

    // short is a utility function used in templates to truncate strings.
    short: function(s) {
      return s.slice(0, 8);
    },

    humanDiffDate: sk.human.diffDate,

    checkIfInstalled: function(id, name) {
      if (id == name) {
        return 'check';
      }
      return ' '; // Don't return an empty string here. Fixes skia:5153.
    },

    warnIfDirty: function(dirty) {
      return dirty ? 'warning' : ' ';  // Don't return an empty string here, to force the icon to change.
    },

    linkToCommit: function(hash) {
      return 'https://skia.googlesource.com/buildbot/+/' + hash;
    },

    findInstalledHash: function(choice, choices) {
      ret = '';
      choices.forEach(function(e) {
        if (e.Name == choice) {
          ret = e.Hash;
        }
      });
      return ret;
    },

    linkToDiff: function(hash) {
      if (this.installedHash == '' || this.installedHash == hash) {
        return this.linkToCommit(hash);
      } else {
        // This link only works if the installed package is older than
        // the package you are inspecting, which is normally the case.
        // To get the link 100% right would require looking up the hashes
        // in the Git repo.
        return 'https://skia.googlesource.com/buildbot/+log/' + this.installedHash + '..' + hash;
      }
    },

  });
</script>