| OLD | NEW |
|---|
| 1 <!DOCTYPE html><html><head><!-- | 1 <!DOCTYPE html><html><head><!-- |
| 2 @license | 2 @license |
| 3 Copyright (c) 2016 The Polymer Project Authors. All rights reserved. | 3 Copyright (c) 2016 The Polymer Project Authors. All rights reserved. |
| 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
| 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
| 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
| 7 Code distributed by Google as part of the polymer project is also | 7 Code distributed by Google as part of the polymer project is also |
| 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
| 9 --><!-- | 9 --><!-- |
| 10 @license | 10 @license |
| (...skipping 14628 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 14639 (function(){ | 14639 (function(){ |
| 14640 // This behavior wraps up all the shared swarming functionality. | 14640 // This behavior wraps up all the shared swarming functionality. |
| 14641 SwarmingBehaviors.SwarmingBehavior = { | 14641 SwarmingBehaviors.SwarmingBehavior = { |
| 14642 | 14642 |
| 14643 _not: function(a) { | 14643 _not: function(a) { |
| 14644 return !a; | 14644 return !a; |
| 14645 }, | 14645 }, |
| 14646 | 14646 |
| 14647 _or: function() { | 14647 _or: function() { |
| 14648 var result = false; | 14648 var result = false; |
| 14649 // can't use .foreach, as arguments isn't really a function. | 14649 // can't use .foreach, as arguments isn't really an Array. |
| 14650 for (var i = 0; i < arguments.length; i++) { | 14650 for (var i = 0; i < arguments.length; i++) { |
| 14651 result = result || arguments[i]; | 14651 result = result || arguments[i]; |
| 14652 } | 14652 } |
| 14653 return result; | 14653 return result; |
| 14654 }, | 14654 }, |
| 14655 }; | 14655 }; |
| 14656 })(); | 14656 })(); |
| 14657 </script> | 14657 </script> |
| 14658 <dom-module id="swarming-index" assetpath="/res/imp/index/"> | 14658 <dom-module id="swarming-index" assetpath="/res/imp/index/"> |
| 14659 <template> | 14659 <template> |
| (...skipping 176 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 14836 } | 14836 } |
| 14837 }, | 14837 }, |
| 14838 | 14838 |
| 14839 _sortChange: function(e) { | 14839 _sortChange: function(e) { |
| 14840 // The event we get from sort-toggle tells us the name of what needs | 14840 // The event we get from sort-toggle tells us the name of what needs |
| 14841 // to be sorting and how to sort it. | 14841 // to be sorting and how to sort it. |
| 14842 if (!(e && e.detail && e.detail.name)) { | 14842 if (!(e && e.detail && e.detail.name)) { |
| 14843 return; | 14843 return; |
| 14844 } | 14844 } |
| 14845 // should trigger the computation of _sort and __filterAndSort | 14845 // should trigger the computation of _sort and __filterAndSort |
| 14846 this.set("_sortstr", e.detail.name +":"+e.detail.direction); | 14846 this.set("_sortstr", e.detail.name + ":" + e.detail.direction); |
| 14847 }, | 14847 }, |
| 14848 // _stripSpecial removes the special columns and sorts the remaining | 14848 // _stripSpecial removes the special columns and sorts the remaining |
| 14849 // columns so they always appear in the same order, regardless of | 14849 // columns so they always appear in the same order, regardless of |
| 14850 // the order they are added. | 14850 // the order they are added. |
| 14851 _stripSpecial: function(){ | 14851 _stripSpecial: function(){ |
| 14852 return this._columns.filter(function(c){ | 14852 return this._columns.filter(function(c) { |
| 14853 return this._specialColumns.indexOf(c) === -1; | 14853 return this._specialColumns.indexOf(c) === -1; |
| 14854 }.bind(this)).sort(); | 14854 }.bind(this)).sort(); |
| 14855 }, | 14855 }, |
| 14856 | 14856 |
| 14857 }; | 14857 }; |
| 14858 })(); | 14858 })(); |
| 14859 </script> | 14859 </script> |
| 14860 | 14860 |
| 14861 <script> | 14861 <script> |
| 14862 | 14862 |
| (...skipping 8781 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 23644 }, | 23644 }, |
| 23645 | 23645 |
| 23646 _bots: function(){ | 23646 _bots: function(){ |
| 23647 if (!this._list || !this._list.items) { | 23647 if (!this._list || !this._list.items) { |
| 23648 return []; | 23648 return []; |
| 23649 } | 23649 } |
| 23650 // Do any preprocessing here | 23650 // Do any preprocessing here |
| 23651 this._list.items.forEach(function(bot){ | 23651 this._list.items.forEach(function(bot){ |
| 23652 // Parse the state, which is a JSON string. This contains a lot of | 23652 // Parse the state, which is a JSON string. This contains a lot of |
| 23653 // interesting information like details about the devices attached. | 23653 // interesting information like details about the devices attached. |
| 23654 bot.state = bot.state || "{}"; |
| 23654 bot.state = JSON.parse(bot.state); | 23655 bot.state = JSON.parse(bot.state); |
| 23655 // get the disks in an easier to deal with format, sorted by size. | 23656 // get the disks in an easier to deal with format, sorted by size. |
| 23656 var disks = bot.state["disks"]; | 23657 var disks = bot.state.disks || {}; |
| 23657 var keys = Object.keys(disks); | 23658 var keys = Object.keys(disks); |
| 23658 if (!keys || !keys.length) { | 23659 if (!keys.length) { |
| 23659 bot.disks = [{"id": "unknown", "mb": 0}]; | 23660 bot.disks = [{"id": "unknown", "mb": 0}]; |
| 23660 } else { | 23661 } else { |
| 23661 bot.disks = []; | 23662 bot.disks = []; |
| 23662 for (var i = 0; i < keys.length; i++) { | 23663 for (var i = 0; i < keys.length; i++) { |
| 23663 bot.disks.push({"id":keys[i], "mb":disks[keys[i]].free_mb}); | 23664 bot.disks.push({"id":keys[i], "mb":disks[keys[i]].free_mb}); |
| 23664 } | 23665 } |
| 23665 // Sort these so the biggest disk comes first. | 23666 // Sort these so the biggest disk comes first. |
| 23666 bot.disks.sort(function(a, b) { | 23667 bot.disks.sort(function(a, b) { |
| 23667 return b.mb - a.mb; | 23668 return b.mb - a.mb; |
| 23668 }); | 23669 }); |
| (...skipping 554 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 24223 | 24224 |
| 24224 properties: { | 24225 properties: { |
| 24225 | 24226 |
| 24226 client_id: { | 24227 client_id: { |
| 24227 type: String, | 24228 type: String, |
| 24228 }, | 24229 }, |
| 24229 | 24230 |
| 24230 // for dynamic table | 24231 // for dynamic table |
| 24231 _columnMap: { | 24232 _columnMap: { |
| 24232 type: Object, | 24233 type: Object, |
| 24233 value: function() { | 24234 value: columnMap, |
| 24234 return columnMap; | |
| 24235 } | |
| 24236 }, | 24235 }, |
| 24237 _headerMap: { | 24236 _headerMap: { |
| 24238 type: Object, | 24237 type: Object, |
| 24239 value: function() { | 24238 value: headerMap, |
| 24240 return headerMap; | |
| 24241 }, | |
| 24242 }, | 24239 }, |
| 24243 // special columns contain html. non-special (i.e. normal colunns) just | |
| 24244 // contain text. | |
| 24245 _specialColumns: { | 24240 _specialColumns: { |
| 24246 type: Array, | 24241 type: Array, |
| 24247 value: function() { | 24242 value: specialColumns, |
| 24248 return specialColumns; | |
| 24249 } | |
| 24250 }, | 24243 }, |
| 24251 _specialSort: { | 24244 _specialSort: { |
| 24252 type: Object, | 24245 type: Object, |
| 24253 value: function() { | 24246 value: specialSort, |
| 24254 return specialSort; | |
| 24255 } | |
| 24256 }, | 24247 }, |
| 24257 | 24248 |
| 24258 }, | 24249 }, |
| 24259 | 24250 |
| 24260 _botClass: function(bot) { | 24251 _botClass: function(bot) { |
| 24261 if (bot.is_dead) { | 24252 if (bot.is_dead) { |
| 24262 return "dead"; | 24253 return "dead"; |
| 24263 } | 24254 } |
| 24264 if (bot.quarantined) { | 24255 if (bot.quarantined) { |
| 24265 return "quarantined"; | 24256 return "quarantined"; |
| (...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 24298 _taskLink: function(data) { | 24289 _taskLink: function(data) { |
| 24299 if (data && data.task_id) { | 24290 if (data && data.task_id) { |
| 24300 return "/user/task/" + data.task_id; | 24291 return "/user/task/" + data.task_id; |
| 24301 } | 24292 } |
| 24302 return undefined; | 24293 return undefined; |
| 24303 } | 24294 } |
| 24304 | 24295 |
| 24305 }); | 24296 }); |
| 24306 })(); | 24297 })(); |
| 24307 </script> | 24298 </script> |
| 24299 </dom-module><dom-module id="task-filters" assetpath="/res/imp/tasklist/"> |
| 24300 <template> |
| 24301 <style> |
| 24302 :host { |
| 24303 display: block; |
| 24304 } |
| 24305 </style> |
| 24306 |
| 24307 </template> |
| 24308 <script> |
| 24309 (function(){ |
| 24310 Polymer({ |
| 24311 is: 'task-filters', |
| 24312 |
| 24313 properties: { |
| 24314 // output |
| 24315 columns: { |
| 24316 type: Array, |
| 24317 value: function() { |
| 24318 return ["name", "state", "user"]; |
| 24319 }, |
| 24320 notify: true, |
| 24321 }, |
| 24322 filter: { |
| 24323 type: Function, |
| 24324 value: function() { |
| 24325 return function(){ |
| 24326 return true; |
| 24327 }; |
| 24328 }, |
| 24329 notify: true, |
| 24330 }, |
| 24331 query_params: { |
| 24332 type: Object, |
| 24333 notify: true, |
| 24334 }, |
| 24335 verbose: { |
| 24336 type: Boolean, |
| 24337 value: true, |
| 24338 notify: true, |
| 24339 }, |
| 24340 } |
| 24341 }); |
| 24342 })(); |
| 24343 </script> |
| 24344 </dom-module><dom-module id="task-list-data" assetpath="/res/imp/tasklist/"> |
| 24345 <template> |
| 24346 <iron-ajax id="tasklist" url="/_ah/api/swarming/v1/tasks/list" headers="[[au
th_headers]]" params="[[query_params]]" handle-as="json" last-response="{{_list}
}" loading="{{_busy1}}"> |
| 24347 </iron-ajax> |
| 24348 |
| 24349 </template> |
| 24350 <script> |
| 24351 (function(){ |
| 24352 Polymer({ |
| 24353 is: 'task-list-data', |
| 24354 |
| 24355 properties: { |
| 24356 // inputs |
| 24357 auth_headers: { |
| 24358 type: Object, |
| 24359 observer: "signIn", |
| 24360 }, |
| 24361 query_params: { |
| 24362 type: Object, |
| 24363 }, |
| 24364 |
| 24365 //outputs |
| 24366 tasks: { |
| 24367 type: Array, |
| 24368 computed: "_tasks(_list)", |
| 24369 notify: true, |
| 24370 } |
| 24371 }, |
| 24372 signIn: function(){ |
| 24373 // Auto on iron-ajax means to automatically re-make the request if |
| 24374 // the url or the query params change. Auto does not trigger if the |
| 24375 // [auth] headers change, so we wait until the user is signed in |
| 24376 // before making any requests. |
| 24377 this.$.tasklist.auto = true; |
| 24378 }, |
| 24379 |
| 24380 _tasks: function() { |
| 24381 if (!this._list || !this._list.items) { |
| 24382 return []; |
| 24383 } |
| 24384 // Do any preprocessing here |
| 24385 return this._list.items; |
| 24386 } |
| 24387 }); |
| 24388 })(); |
| 24389 </script> |
| 24390 </dom-module> |
| 24391 <dom-module id="task-list" assetpath="/res/imp/tasklist/"> |
| 24392 <template> |
| 24393 <style include="iron-flex iron-flex-alignment iron-positioning swarming-app-
style dynamic-table-style"> |
| 24394 |
| 24395 .task-list th > span { |
| 24396 /* Leave space for sort-toggle*/ |
| 24397 padding-right: 30px; |
| 24398 } |
| 24399 </style> |
| 24400 |
| 24401 <url-param name="sort" value="{{_sortstr}}" default_value="id:asc"> |
| 24402 </url-param> |
| 24403 |
| 24404 <swarming-app client_id="[[client_id]]" auth_headers="{{_auth_headers}}" sig
ned_in="{{_signed_in}}" busy="[[_busy]]" name="Swarming Task List"> |
| 24405 |
| 24406 <h2 hidden$="[[_signed_in]]">You must sign in to see anything useful.</h2> |
| 24407 |
| 24408 <div hidden$="[[_not(_signed_in)]]"> |
| 24409 <task-list-data auth_headers="[[_auth_headers]]" query_params="[[_query_
params]]" tasks="{{_items}}" busy="{{_busy}}"> |
| 24410 </task-list-data> |
| 24411 |
| 24412 <div class="horizontal layout"> |
| 24413 |
| 24414 <task-filters columns="{{_columns}}" query_params="{{_query_params}}"
filter="{{_filter}}" verbose="{{_verbose}}"> |
| 24415 </task-filters> |
| 24416 |
| 24417 </div> |
| 24418 |
| 24419 <table class="task-list"> |
| 24420 <thead on-sort_change="_sortChange"> |
| 24421 |
| 24422 <tr> |
| 24423 <th> |
| 24424 <span>Task Name</span> |
| 24425 <sort-toggle name="name" current="[[_sort]]"> |
| 24426 </sort-toggle> |
| 24427 </th> |
| 24428 |
| 24429 <th hidden$="[[_hide('state', _columns.*)]]"> |
| 24430 <span>Status</span> |
| 24431 <sort-toggle name="state" current="[[_sort]]"> |
| 24432 </sort-toggle> |
| 24433 </th> |
| 24434 |
| 24435 <template is="dom-repeat" items="[[_plainColumns]]" as="c"> |
| 24436 <th hidden$="[[_hide(c)]]"> |
| 24437 <span>[[_header(c)]]</span> |
| 24438 <sort-toggle name="[[c]]" current="[[_sort]]"> |
| 24439 </sort-toggle> |
| 24440 </th> |
| 24441 </template> |
| 24442 </tr> |
| 24443 </thead> |
| 24444 <tbody> |
| 24445 <template id="tasks_table" is="dom-repeat" items="[[_filteredSortedI
tems]]" as="task" initial-count="50"> |
| 24446 |
| 24447 <tr class$="[[_taskClass(task)]]"> |
| 24448 <td> |
| 24449 <a class="center" href$="[[_taskLink(task)]]" target="_blank"> |
| 24450 [[task.name]] |
| 24451 </a> |
| 24452 </td> |
| 24453 <td hidden$="[[_hide('state', _columns.*)]]"> |
| 24454 [[_column('state', task, _verbose)]] |
| 24455 |
| 24456 </td> |
| 24457 |
| 24458 <template is="dom-repeat" items="[[_plainColumns]]" as="c"> |
| 24459 <td hidden$="[[_hide(c)]]"> |
| 24460 [[_column(c, task, _verbose)]] |
| 24461 </td> |
| 24462 </template> |
| 24463 |
| 24464 </tr> |
| 24465 </template> |
| 24466 </tbody> |
| 24467 </table> |
| 24468 </div> |
| 24469 |
| 24470 </swarming-app> |
| 24471 |
| 24472 </template> |
| 24473 <script> |
| 24474 (function(){ |
| 24475 var specialColumns = ["name", "state"]; |
| 24476 var columnMap = {}; |
| 24477 var headerMap = { |
| 24478 "user": "Requesting User", |
| 24479 }; |
| 24480 var specialSort = {}; |
| 24481 |
| 24482 Polymer({ |
| 24483 is: 'task-list', |
| 24484 behaviors: [SwarmingBehaviors.SwarmingBehavior, |
| 24485 SwarmingBehaviors.DynamicTableBehavior], |
| 24486 |
| 24487 properties: { |
| 24488 // input |
| 24489 client_id: { |
| 24490 type: String, |
| 24491 }, |
| 24492 |
| 24493 // for dynamic table |
| 24494 _columnMap: { |
| 24495 type: Object, |
| 24496 value: columnMap, |
| 24497 }, |
| 24498 _headerMap: { |
| 24499 type: Object, |
| 24500 value: headerMap, |
| 24501 }, |
| 24502 _specialColumns: { |
| 24503 type: Array, |
| 24504 value: specialColumns, |
| 24505 }, |
| 24506 _specialSort: { |
| 24507 type: Object, |
| 24508 value: specialSort, |
| 24509 }, |
| 24510 |
| 24511 }, |
| 24512 |
| 24513 _attribute: function(task, col, def) { |
| 24514 var retVal = task[col] || [def]; |
| 24515 if (!Array.isArray(retVal)) { |
| 24516 return [retVal]; |
| 24517 } |
| 24518 return retVal; |
| 24519 }, |
| 24520 |
| 24521 _taskLink: function(task) { |
| 24522 // TODO(kjlubick) Make this point to /newui/ when appropriate. |
| 24523 return "/restricted/task/"+task.task_id; |
| 24524 }, |
| 24525 |
| 24526 _taskClass: function(task) { |
| 24527 // TODO(kjlubick): Color tasks? |
| 24528 return ""; |
| 24529 } |
| 24530 |
| 24531 }); |
| 24532 })(); |
| 24533 </script> |
| 24308 </dom-module></div></body></html> | 24534 </dom-module></div></body></html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2249143002:
Make TaskList use Dynamic List (Closed)
Base URL: https://chromium.googlesource.com/external/github.com/luci/luci-py@master