Copybara | 854996b | 2021-09-07 19:36:02 +0000 | [diff] [blame] | 1 | [# Table header popup menus ] |
| 2 | |
| 3 | [for column_values] |
| 4 | [is column_values.column_name "id"] |
| 5 | <div id="pop_[column_values.col_index]" class="popup"> |
| 6 | <table cellspacing="0" cellpadding="0" border="0"> |
| 7 | <tr id="pop_up_[column_values.col_index]"><td>Sort Up</td></tr> |
| 8 | <tr id="pop_down_[column_values.col_index]"><td>Sort Down</td></tr> |
| 9 | <tr id="pop_hide_[column_values.col_index]"><td>Hide Column</td></tr> |
| 10 | </table> |
| 11 | </div> |
| 12 | [else] |
| 13 | [is column_values.column_name "summary"] |
| 14 | <div id="pop_[column_values.col_index]" class="popup"> |
| 15 | <table cellspacing="0" cellpadding="0" border="0"> |
| 16 | <tr id="pop_up_[column_values.col_index]"><td>Sort Up</td></tr> |
| 17 | <tr id="pop_down_[column_values.col_index]"><td>Sort Down</td></tr> |
| 18 | [if-any is_hotlist][else] |
| 19 | [if-any column_values.filter_values] |
| 20 | <tr id="pop_show_only_[column_values.col_index]"><td>Show only |
| 21 | <span class="indicator">►</span></td></tr> |
| 22 | [end][end] |
| 23 | <tr id="pop_hide_[column_values.col_index]"><td>Hide Column</td></tr> |
| 24 | </table> |
| 25 | </div> |
| 26 | [else] |
| 27 | <div id="pop_[column_values.col_index]" class="popup"> |
| 28 | <table cellspacing="0" cellpadding="0" border="0"> |
| 29 | <tr id="pop_up_[column_values.col_index]"><td>Sort Up</td></tr> |
| 30 | <tr id="pop_down_[column_values.col_index]"><td>Sort Down</td></tr> |
| 31 | [if-any is_hotlist][else] |
| 32 | [if-any column_values.filter_values] |
| 33 | <tr id="pop_show_only_[column_values.col_index]"><td>Show only |
| 34 | <span class="indicator">►</span></td></tr> |
| 35 | [end][end] |
| 36 | <tr id="pop_hide_[column_values.col_index]"><td>Hide Column</td></tr> |
| 37 | <tr id="pop_groupby_[column_values.col_index]"><td>Group Rows</td></tr> |
| 38 | </table> |
| 39 | </div> |
| 40 | [end] |
| 41 | [end] |
| 42 | [end] |
| 43 | |
| 44 | [# Table header popup submenus for autofiltering of values ] |
| 45 | |
| 46 | [for column_values] |
| 47 | <div id="filter_[column_values.col_index]" class="popup subpopup"> |
| 48 | <table cellspacing="0" cellpadding="0" border="0"> |
| 49 | [for column_values.filter_values] |
| 50 | <tr data-filter-column="[is column_values.column_name "Summary"]label[else][column_values.column_name][end]" |
| 51 | data-filter-value="[column_values.filter_values]"> |
| 52 | <td>[column_values.filter_values]</td></tr> |
| 53 | [end] |
| 54 | </table> |
| 55 | </div> |
| 56 | [end] |
| 57 | |
| 58 | [# Popup menu showing the list of available columns allowing show/hide ] |
| 59 | |
| 60 | <div id="pop_dot" class="popup"> |
| 61 | <table cellspacing="0" cellpadding="0" border="0"> |
| 62 | <tr><th>Show columns:</th></tr> |
| 63 | [for panels.ordered_columns] |
| 64 | <tr data-toggle-column-index="[panels.ordered_columns.col_index]"><td> <span |
| 65 | class="col_[panels.ordered_columns.col_index]">♦</span> [panels.ordered_columns.name]</td></tr> |
| 66 | [end] |
| 67 | [for unshown_columns] |
| 68 | <tr data-add-column-name="[unshown_columns]" |
| 69 | ><td> [unshown_columns]</td></tr> |
| 70 | [end] |
| 71 | <tr id="pop_dot_edit" |
| 72 | ><td> Edit column spec...</td></tr> |
| 73 | </table> |
| 74 | </div> |
| 75 | |
| 76 | |
| 77 | <script type="text/javascript" nonce="[nonce]"> |
| 78 | runOnLoad(function() { |
| 79 | function registerPopHandlers(colIndex, colName) { |
| 80 | var sortUpEl = $("pop_up_" + colIndex); |
| 81 | if (sortUpEl) { |
| 82 | sortUpEl.addEventListener("click", function () { |
| 83 | _closeAllPopups(sortUpEl); |
| 84 | _sortUp(colName); |
| 85 | }); |
| 86 | sortUpEl.addEventListener("mouseover", function () { |
| 87 | _closeSubmenus(); |
| 88 | }); |
| 89 | } |
| 90 | |
| 91 | var sortDownEl = $("pop_down_" + colIndex); |
| 92 | if (sortDownEl) { |
| 93 | sortDownEl.addEventListener("click", function () { |
| 94 | _closeAllPopups(sortDownEl); |
| 95 | _sortDown(colName); |
| 96 | }); |
| 97 | sortDownEl.addEventListener("mouseover", function () { |
| 98 | _closeSubmenus(); |
| 99 | }); |
| 100 | } |
| 101 | |
| 102 | var hideEl = $("pop_hide_" + colIndex); |
| 103 | if (hideEl) { |
| 104 | hideEl.addEventListener("click", function () { |
| 105 | _closeAllPopups(hideEl); |
| 106 | _toggleColumnUpdate(colIndex); |
| 107 | }); |
| 108 | hideEl.addEventListener("mouseover", function () { |
| 109 | _closeSubmenus(); |
| 110 | }); |
| 111 | } |
| 112 | |
| 113 | var showOnlyEl = $("pop_show_only_" + colIndex); |
| 114 | if (showOnlyEl) { |
| 115 | showOnlyEl.addEventListener("mouseover", function () { |
| 116 | _showRight("filter_" + colIndex, showOnlyEl); |
| 117 | }); |
| 118 | } |
| 119 | |
| 120 | var groupByEl = $("pop_groupby_" + colIndex); |
| 121 | if (groupByEl) { |
| 122 | groupByEl.addEventListener("click", function () { |
| 123 | _closeAllPopups(groupByEl); |
| 124 | _addGroupBy(colIndex); |
| 125 | }); |
| 126 | groupByEl.addEventListener("mouseover", function () { |
| 127 | _closeSubmenus(); |
| 128 | }); |
| 129 | } |
| 130 | } |
| 131 | |
| 132 | [for column_values] |
| 133 | registerPopHandlers([column_values.col_index], "[column_values.column_name]"); |
| 134 | [end] |
| 135 | |
| 136 | function handleFilterValueClick(event) { |
| 137 | var target = event.target; |
| 138 | if (target.tagName != "TR") target = target.parentNode; |
| 139 | _closeAllPopups(target); |
| 140 | var filterColumn = target.getAttribute("data-filter-column"); |
| 141 | var filterValue = target.getAttribute("data-filter-value"); |
| 142 | _filterTo(filterColumn, filterValue); |
| 143 | } |
| 144 | |
| 145 | [for column_values] |
| 146 | $("filter_" + [column_values.col_index]).addEventListener( |
| 147 | "click", handleFilterValueClick); |
| 148 | [end] |
| 149 | |
| 150 | function handleDotDotDotClick(event) { |
| 151 | var target = event.target; |
| 152 | if (target.tagName != "TR") target = target.parentNode; |
| 153 | _closeAllPopups(target); |
| 154 | var colIndex = target.getAttribute("data-toggle-column-index"); |
| 155 | if (colIndex != null) |
| 156 | _toggleColumnUpdate(colIndex); |
| 157 | var colName = target.getAttribute("data-add-column-name"); |
| 158 | if (colName != null) |
| 159 | _addcol(colName); |
| 160 | } |
| 161 | |
| 162 | $("pop_dot").addEventListener("click", handleDotDotDotClick); |
| 163 | |
| 164 | $("pop_dot_edit").addEventListener("click", function() { |
| 165 | var target = $("pop_dot_edit"); |
| 166 | _closeAllPopups(target); |
| 167 | $("columnspec").style.display = ""; |
| 168 | }); |
| 169 | }); |
| 170 | </script> |