Collapse commit list by default in sheriff-o-matic.

Tools/GardeningServer/ui/ct-commit-list.html

 <!--
 Copyright 2014 The Chromium Authors. All rights reserved.
 Use of this source code is governed by a BSD-style license that can be
 found in the LICENSE file.
 -->
 
 <link rel="import" href="ct-commit.html">
+<link rel="import" href="../bower_components/paper-button/paper-button.html">
 
-<polymer-element name="ct-commit-list" attributes="first last commits" noscript>
+<polymer-element name="ct-commit-list" attributes="commits" noscript>
   <template>
     <style>
       :host {
         display: block;
       }
+      paper-icon-button {
+        vertical-align: middle;
+      }
+      .repository-info {
+        display: block;
+      }
     </style>
-    <template repeat="{{ repository in commits.commits | _repositories }}">
-      <template repeat="{{ commit in repository | _commits }}">
-        <ct-commit data="{{ commit }}"></ct-commit>
-      </template>
+    <template repeat="{{ repository in commitList | _repositories }}">
+      <div class="repository-info">
+        {{ repository.name }} {{ repository.range }}
+        <paper-icon-button icon="more-vert"

[ojan, 2014/08/15 17:51:49]

Nit: use unfold-more instead of more-vert to be consistent with
https://codereview.chromium.org/475323002

[dsinclair, 2014/08/15 18:58:34]

Done.

+            on-click="{{ _expand }}" repositoryName="{{ repository.name }}" repositoryRange="{{ repository.range }}"></paper-icon-button>
+        <template if="{{ repository.expanded }}">
+          <template repeat="{{ commit in repository.commits }}">
+            <ct-commit data="{{ commit }}"></ct-commit>
+          </template>
+        </template>
+      </div>
     </template>
   </template>
   <script>
-    Polymer({
-      commits: null,
-      first: null,
-      last: null,
+  Polymer({
+    repositories: undefined,
 
-      _repositories: function(commits) {
-        if (!commits)
-          return [];
-        return Object.keys(commits).sort();
-      },
+    created: function() {
+      this.repositories = [];
+    },
 
-      _commits: function(repository) {
-        var commits = [];
-        if (!this.first || !this.last)
-          return commits;
+    _repositories: function() {
+      if (this.commitList)
+        this.repositories = this.commitList.repositories();
+      return this.repositories;
+    },
 
-        var first = Number(this.first[repository]);
-        var last = Number(this.last[repository]);
-        if (first == last)
-          return commits;
+    _expand: function(event, detail, sender, target) {

[ojan, 2014/08/15 17:51:50]

Maybe call this _toggle?

[dsinclair, 2014/08/15 18:58:34]

Done.

+      var repo = sender.getAttribute('repositoryName');
+      var range = sender.getAttribute('repositoryRange');

[ojan, 2014/08/15 17:51:49]

Do sender.repositoryName/sender.repositoryRange not work? This isn't very well
documented, but in general you should never have to use get/setAttribute with
polymer components. Properties are preferred because then you can pass rich
things like objects instead of needing to serialize/deserialize to a string.

[dsinclair, 2014/08/15 18:58:34]

That doesn't seem to work in this case? I can never seem to get the data back
off of sender? Only by doing getAttribute do I get a non-blank string.

I really wanted to just attach repository="{{ repository }}" when I created the
button, but that always gives me back [Object object].

 
-        if (first > last) {
-          console.warn('Revision range is backwards, which is invalid:', first, last);
-          return commits;
+      for(var i = 0; i < this.repositories.length; i++) {

[ojan, 2014/08/15 17:51:49]

Missing space after "for". Also, if you wanted you could use array's find
function.

var r = this.repositories.find(function(r) {
  return r.name === repo && r.range === range;
});
r.expected = !r.expanded;

Also, do you actually need to check that the ranges are equal? Isn't just
checking repository.name sufficient?

[dsinclair, 2014/08/15 18:58:34]

Done.

Don't need to check range, that was a hold-over from the global expanded hash
version.

+        var r = this.repositories[i];
+        if (r.name === repo && r.range === range) {
+          r.expanded = !r.expanded;
+          break;
         }
-
-        return this.commits.range(repository, first + 1, last);
-      },
-    });
+      }
+    }
+  });
   </script>
 </polymer-element>