Skip to content

Commit 09613eb

Browse files
raxelgstephenfin
raxelg
authored and
stephenfin
committed
views: Clean up patch-list page
Add ids to table cells, and rename selectors using hyphen delimited strings to clean up and improve readability of patch-list.html. Also, create a partial template errors.html for errors that render with form submission.These changes make the code healthier, ready for change, and overall more readable. No user-visible change should be noticed. Signed-off-by: Raxel Gutierrez <raxel@google.com> Signed-off-by: Stephen Finucane <stephen@that.guru> [stephenfin: Addressed merge conflicts and renamed some Python variables in snake_case also]
1 parent 6203264 commit 09613eb

File tree

9 files changed

+112
-112
lines changed

9 files changed

+112
-112
lines changed

‎htdocs/css/style.css‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -162,25 +162,25 @@ table.pw-list > thead {
162162
background-color: white;
163163
}
164164

165-
a.colinactive, a.colactive {
165+
a.col-inactive, a.col-active {
166166
color: black;
167167
text-decoration: none;
168168
}
169169

170-
a.colinactive:hover {
170+
a.col-inactive:hover {
171171
color: red;
172172
}
173173

174174
div.filters {
175175
}
176176

177-
div.patchforms {
177+
div.patch-forms {
178178
margin-top: 1em;
179179
}
180180

181181
/* list order manipulation */
182182

183-
table.patchlist tr.draghover {
183+
table.patch-list tr.draghover {
184184
background: #e8e8e8 !important;
185185
}
186186

@@ -256,7 +256,7 @@ table.patch-meta tr th, table.patch-meta tr td {
256256
}
257257

258258
/* checks forms */
259-
/* TODO(stephenfin): Merge this with 'div.patchform' rules */
259+
/* TODO(stephenfin): Merge this with 'div.patch-form' rules */
260260
.checks {
261261
border: 1px solid gray;
262262
margin: 0.5em 1em;
@@ -434,15 +434,15 @@ table.bundlelist td
434434
}
435435

436436
/* forms that appear for a patch */
437-
div.patchform {
437+
div.patch-form {
438438
border: thin solid #080808;
439439
padding-left: 0.6em;
440440
padding-right: 0.6em;
441441
float: left;
442442
margin: 0.5em 5em 0.5em 10px;
443443
}
444444

445-
div.patchform h3 {
445+
div.patch-form h3 {
446446
margin-top: 0em;
447447
margin-left: -0.6em;
448448
margin-right: -0.6em;
@@ -452,7 +452,7 @@ div.patchform h3 {
452452
font-size: 100%;
453453
}
454454

455-
div.patchform ul {
455+
div.patch-form ul {
456456
list-style-type: none;
457457
padding-left: 0.2em;
458458
margin-top: 0em;

‎htdocs/js/bundle.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ function order_button_click(node)
66
{
77
var rows, form;
88

9-
form = $("#reorderform");
10-
rows = $("#patchlist").get(0).tBodies[0].rows;
9+
form = $("#reorder-form");
10+
rows = $("#patch-list").get(0).tBodies[0].rows;
1111

1212
if (rows.length < 1)
1313
return;
@@ -35,18 +35,18 @@ function order_button_click(node)
3535
$("#reorder\\-cancel").css("display", "inline");
3636

3737
/* show help text */
38-
$("#reorderhelp").text('Drag & drop rows to reorder');
38+
$("#reorder-help").text('Drag & drop rows to reorder');
3939

4040
/* enable drag & drop on the patches list */
41-
$("#patchlist").tableDnD({
41+
$("#patch-list").tableDnD({
4242
onDragClass: 'dragging',
4343
onDragStart: function() { dragging = true; },
4444
onDrop: function() { dragging = false; }
4545
});
4646

4747
/* replace zebra striping with hover */
48-
$("#patchlist tbody tr").css("background", "inherit");
49-
$("#patchlist tbody tr").hover(drag_hover_in, drag_hover_out);
48+
$("#patch-list tbody tr").css("background", "inherit");
49+
$("#patch-list tbody tr").hover(drag_hover_in, drag_hover_out);
5050
}
5151

5252
editing_order = !editing_order;

‎patchwork/templates/patchwork/partials/patch-list.html‎

Lines changed: 54 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@
88
{% include "patchwork/partials/pagination.html" %}
99

1010
{% if order.editable %}
11-
<table class="patchlist">
11+
<table class="patch-list">
1212
<tr>
13-
<td class="patchlistreorder">
14-
<form method="post" id="reorderform">
13+
<td class="patch-list-reorder">
14+
<form method="post" id="reorder-form">
1515
{% csrf_token %}
16-
<input type="hidden" name="form" value="reorderform"/>
16+
<input type="hidden" name="form" value="reorder-form"/>
1717
<input type="hidden" name="order_start" value="0"/>
18-
<span id="reorderhelp"></span>
18+
<span id="reorder-help"></span>
1919
<input id="reorder-cancel" type="button" value="Cancel" onClick="order_cancel_click(this)"/>
2020
<input id="reorder-change" type="button" value="Change order" onClick="order_button_click(this)"/>
2121
</form>
@@ -26,23 +26,23 @@
2626

2727
{% if page.paginator.long_page and user.is_authenticated %}
2828
<div class="floaty">
29-
<a title="jump to form" href="#patchforms">
29+
<a title="jump to form" href="#patch-forms">
3030
<span style="font-size: 120%">&#9662;</span>
3131
</a>
3232
</div>
3333
{% endif %}
3434

3535
<script type="text/javascript">
3636
$(document).ready(function() {
37-
$('#patchlist').stickyTableHeaders();
37+
$('#patch-list').stickyTableHeaders();
3838

39-
$('#patchlist').checkboxes('range', true);
39+
$('#patch-list').checkboxes('range', true);
4040

4141
$('#check-all').change(function(e) {
4242
if(this.checked) {
43-
$('#patchlist > tbody').checkboxes('check');
43+
$('#patch-list > tbody').checkboxes('check');
4444
} else {
45-
$('#patchlist > tbody').checkboxes('uncheck');
45+
$('#patch-list > tbody').checkboxes('uncheck');
4646
}
4747
e.preventDefault();
4848
});
@@ -51,9 +51,9 @@
5151

5252
<form method="post">
5353
{% csrf_token %}
54-
<input type="hidden" name="form" value="patchlistform"/>
54+
<input type="hidden" name="form" value="patch-list-form"/>
5555
<input type="hidden" name="project" value="{{project.id}}"/>
56-
<table id="patchlist" class="table table-hover table-extra-condensed table-striped pw-list" data-toggle="checkboxes" data-range="true">
56+
<table id="patch-list" class="table table-hover table-extra-condensed table-striped pw-list" data-toggle="checkboxes" data-range="true">
5757
<thead>
5858
<tr>
5959
{% if user.is_authenticated %}
@@ -71,22 +71,22 @@
7171
<th>
7272
{% if not order.editable %}
7373
{% if order.name == "name" %}
74-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
74+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
7575
<span class="glyphicon glyphicon-chevron-{{ order.updown }}"></span>
7676
</a>
77-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
77+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
7878
Patch
7979
</a>
8080
{% else %}
81-
<a class="colinactive" href="{% listurl order="name" %}">Patch</a>
81+
<a class="col-inactive" href="{% listurl order="name" %}">Patch</a>
8282
{% endif %}
8383
{% else %}
84-
<span class="colinactive">Patch</span>
84+
<span class="col-inactive">Patch</span>
8585
{% endif %}
8686
</th>
8787

8888
<th>
89-
<span class="colinactive">Series</span>
89+
<span class="col-inactive">Series</span>
9090
</th>
9191

9292
<th>
@@ -100,70 +100,70 @@
100100
<th>
101101
{% if not order.editable %}
102102
{% if order.name == "date" %}
103-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
103+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
104104
<span class="glyphicon glyphicon-chevron-{{ order.updown }}"></span>
105105
</a>
106-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
106+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
107107
Date
108108
</a>
109109
{% else %}
110-
<a class="colinactive" href="{% listurl order="date" %}">Date</a>
110+
<a class="col-inactive" href="{% listurl order="date" %}">Date</a>
111111
{% endif %}
112112
{% else %}
113-
<span class="colinactive">Date</span>
113+
<span class="col-inactive">Date</span>
114114
{% endif %}
115115
</th>
116116

117117
<th>
118118
{% if not order.editable %}
119119
{% if order.name == "submitter" %}
120-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
120+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
121121
<span class="glyphicon glyphicon-chevron-{{ order.updown }}"></span>
122122
</a>
123-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
123+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
124124
Submitter
125125
</a>
126126
{% else %}
127-
<a class="colinactive" href="{% listurl order="submitter" %}">
127+
<a class="col-inactive" href="{% listurl order="submitter" %}">
128128
Submitter
129129
</a>
130130
{% endif %}
131131
{% else %}
132-
<span class="colinactive">Submitter</span>
132+
<span class="col-inactive">Submitter</span>
133133
{% endif %}
134134
</th>
135135

136136
<th>
137137
{% if not order.editable %}
138138
{% if order.name == "delegate" %}
139-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
139+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
140140
<span class="glyphicon glyphicon-chevron-{{ order.updown }}"></span>
141141
</a>
142-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
142+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
143143
Delegate
144144
</a>
145145
{% else %}
146-
<a class="colinactive" href="{% listurl order="delegate" %}">Delegate</a>
146+
<a class="col-inactive" href="{% listurl order="delegate" %}">Delegate</a>
147147
{% endif %}
148148
{% else %}
149-
<span class="colinactive">Delegate</span>
149+
<span class="col-inactive">Delegate</span>
150150
{% endif %}
151151
</th>
152152

153153
<th>
154154
{% if not order.editable %}
155155
{% if order.name == "state" %}
156-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
156+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
157157
<span class="glyphicon glyphicon-chevron-{{ order.updown }}"></span>
158158
</a>
159-
<a class="colactive" href="{% listurl order=order.reversed_name %}">
159+
<a class="col-active" href="{% listurl order=order.reversed_name %}">
160160
State
161161
</a>
162162
{% else %}
163-
<a class="colinactive" href="{% listurl order="state" %}">State</a>
163+
<a class="col-inactive" href="{% listurl order="state" %}">State</a>
164164
{% endif %}
165165
{% else %}
166-
<span class="colinactive">State</span>
166+
<span class="col-inactive">State</span>
167167
{% endif %}
168168
</th>
169169

@@ -172,9 +172,9 @@
172172

173173
<tbody>
174174
{% for patch in page.object_list %}
175-
<tr id="patch_row:{{patch.id}}">
175+
<tr id="patch-row:{{patch.id}}">
176176
{% if user.is_authenticated %}
177-
<td style="text-align: center;">
177+
<td id="select-patch:{{patch.id}}" style="text-align: center;">
178178
<input type="checkbox" name="patch_id:{{patch.id}}"/>
179179
</td>
180180
{% endif %}
@@ -185,24 +185,24 @@
185185
</button>
186186
</td>
187187
{% endif %}
188-
<td>
188+
<td id="patch-name:{{patch.id}}">
189189
<a href="{% url 'patch-detail' project_id=project.linkname msgid=patch.encoded_msgid %}">
190190
{{ patch.name|default:"[no subject]"|truncatechars:100 }}
191191
</a>
192192
</td>
193-
<td>
193+
<td id="patch-series:{{patch.id}}">
194194
{% if patch.series %}
195195
<a href="?series={{patch.series.id}}">
196196
{{ patch.series|truncatechars:100 }}
197197
</a>
198198
{% endif %}
199199
</td>
200-
<td class="text-nowrap">{{ patch|patch_tags }}</td>
201-
<td class="text-nowrap">{{ patch|patch_checks }}</td>
202-
<td class="text-nowrap">{{ patch.date|date:"Y-m-d" }}</td>
203-
<td>{{ patch.submitter|personify:project }}</td>
204-
<td>{{ patch.delegate.username }}</td>
205-
<td>{{ patch.state }}</td>
200+
<td id="patch-tags:{{patch.id}}" class="text-nowrap">{{ patch|patch_tags }}</td>
201+
<td id="patch-checks:{{patch.id}}" class="text-nowrap">{{ patch|patch_checks }}</td>
202+
<td id="patch-date:{{patch.id}}" class="text-nowrap">{{ patch.date|date:"Y-m-d" }}</td>
203+
<td id="patch-submitter:{{patch.id}}">{{ patch.submitter|personify:project }}</td>
204+
<td id="patch-delegate:{{patch.id}}">{{ patch.delegate.username }}</td>
205+
<td id="patch-state:{{patch.id}}">{{ patch.state }}</td>
206206
</tr>
207207
{% empty %}
208208
<tr>
@@ -215,45 +215,45 @@
215215
{% if page.paginator.count %}
216216
{% include "patchwork/partials/pagination.html" %}
217217

218-
<div class="patchforms" id="patchforms">
218+
<div class="patch-forms" id="patch-forms">
219219

220-
{% if patchform %}
221-
<div class="patchform patchform-properties">
220+
{% if patch_form %}
221+
<div class="patch-form patch-form-properties">
222222
<h3>Properties</h3>
223223
<table class="form">
224224
<tr>
225225
<th>Change state:</th>
226226
<td>
227-
{{ patchform.state }}
228-
{{ patchform.state.errors }}
227+
{{ patch_form.state }}
228+
{{ patch_form.state.errors }}
229229
</td>
230230
</tr>
231231
<tr>
232232
<th>Delegate to:</th>
233233
<td>
234-
{{ patchform.delegate }}
235-
{{ patchform.delegate.errors }}
234+
{{ patch_form.delegate }}
235+
{{ patch_form.delegate.errors }}
236236
</td>
237237
</tr>
238238
<tr>
239239
<th>Archive:</th>
240240
<td>
241-
{{ patchform.archived }}
242-
{{ patchform.archived.errors }}
241+
{{ patch_form.archived }}
242+
{{ patch_form.archived.errors }}
243243
</td>
244244
</tr>
245245
<tr>
246246
<td></td>
247247
<td>
248-
<input type="submit" name="action" value="{{patchform.action}}"/>
248+
<input type="submit" name="action" value="{{patch_form.action}}"/>
249249
</td>
250250
</tr>
251251
</table>
252252
</div>
253253
{% endif %}
254254

255255
{% if user.is_authenticated %}
256-
<div class="patchform patchform-bundle">
256+
<div class="patch-form patch-form-bundle">
257257
<h3>Bundling</h3>
258258
<table class="form">
259259
<tr>

0 commit comments

Comments
 (0)