Add task-list summary

appengine/swarming/ui/res/imp/tasklist/task-list.html

 <!--
   Copyright 2016 The LUCI Authors. All rights reserved.
   Use of this source code is governed under the Apache License, Version 2.0
   that can be found in the LICENSE file.
 
   This in an HTML Import-able file that contains the definition
   of the following elements:
 
     <task-list>
 
@@ skipping 20 matching lines @@
 
 <link rel="import" href="/res/imp/common/dynamic-table-behavior.html">
 <link rel="import" href="/res/imp/common/pageable-data.html">
 <link rel="import" href="/res/imp/common/sort-toggle.html">
 <link rel="import" href="/res/imp/common/swarming-app.html">
 <link rel="import" href="/res/imp/common/task-behavior.html">
 <link rel="import" href="/res/imp/common/url-param.html">
 
 <link rel="import" href="task-filters.html">
 <link rel="import" href="task-list-data.html">
+<link rel="import" href="task-list-summary.html">
 <link rel="import" href="task-mass-cancel.html">
 
 <dom-module id="task-list">
   <template>
     <style include="iron-flex iron-flex-alignment iron-positioning swarming-app-style dynamic-table-style task-style">
-      task-filters {
+      task-filters, task-list-summary {
         margin-bottom: 8px;
         margin-right: 10px;
       }
       .task-list th > span {
         /* Leave space for sort-toggle*/
         padding-right: 30px;
       }
     </style>
 
     <url-param name="s"
       value="{{_sortstr}}"
       default_value="created_ts:desc">
     </url-param>
 
     <swarming-app
       client_id="[[client_id]]"
       auth_headers="{{_auth_headers}}"
       permissions="{{_permissions}}"
       signed_in="{{_signed_in}}"
-      busy="[[_or(_busy1,_busy2)]]"
+      busy="[[_or(_busy1,_busy2,_busy3)]]"
       name="Swarming Task List">
 
       <h2 hidden$="[[_signed_in]]">You must sign in to see anything useful.</h2>
 
       <div hidden$="[[_not(_signed_in)]]">
         <task-list-data
           id="data"
           auth_headers="[[_auth_headers]]"
           query_params="[[_query_params]]"
           tasks="[[_items]]"
@@ skipping 10 matching lines @@
             primary_map="[[_primary_map]]"
             primary_arr="[[_primary_arr]]"
             special_columns="[[_specialColumns]]"
 
             columns="{{_columns}}"
             query_params="{{_query_params}}"
             filter="{{_filter}}"
 
             on-cancel-all="_promptCancelAll">
           </task-filters>
+
+           <task-list-summary
+            auth_headers="[[_auth_headers]]"
+            busy="{{_busy3}}"
+            columns="[[_columns]]"
+            count_params="[[_query_params]]"
+            num_tasks="[[_filteredSortedItems.length]]"
+            sort="[[_sortstr]]">
+          </task-list-summary>
         </div>
 
         <table class="task-list">
           <thead on-sort_change="_sortChange">
           <!-- To allow for dynamic columns without having a lot of copy-pasted
           code, we break columns up into "special" and "plain" columns. Special
           columns require some sort of HTML output (e.g. anchor tags) and plain
           columns just output text.  The plain columns use Polymer functions to
           insert their text [_header(), _column(), _deviceColumn()].  Polymer
           functions do not allow HTML (to avoid XSS), so special columns, like id
@@ skipping 369 matching lines @@
         return task.tagMap[col];
       },
 
       _taskClass: function(task) {
         return this.stateClass(this._column("state", task));
       }
     });
   })();
   </script>
 </dom-module>