Wrap request review UI in div and label

(closes #4354)
openstreetmap · Sep 18, 2017 · 5950536 · 5950536
1 parent 5b9b6bb
commit 5950536
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 11 deletions.
diff --git a/css/80_app.css b/css/80_app.css
@@ -3530,6 +3530,10 @@ img.tile-removing {
     margin-bottom: 10px;
 }
 
+.mode-save .request-review label {
+    cursor: pointer;
+}
+
 .mode-save .changeset-list {
     border: 1px solid #ccc;
     border-radius: 4px;

diff --git a/modules/ui/commit.js b/modules/ui/commit.js
@@ -157,24 +157,33 @@ export function uiCommit(context) {
         });
 
 
+        // Request Review
         var requestReview = saveSection.selectAll('.request-review')
             .data([0]);
 
-        requestReview = requestReview.enter()
-            .append('p')
-            .attr('class', 'request-review')
-            .text(t('commit.request_review'))
-            .merge(requestReview);
+        // Enter
+        var requestReviewEnter = requestReview.enter()
+            .append('div')
+            .attr('class', 'request-review');
 
-        var requestReviewField = requestReview.selectAll('input')
-            .data([0]);
+        var labelEnter = requestReviewEnter
+            .append('label')
+            .attr('for', 'commit-input-request-review');
 
-        requestReviewField = requestReviewField.enter()
+        labelEnter
             .append('input')
             .attr('type', 'checkbox')
-            .merge(requestReviewField);
+            .attr('id', 'commit-input-request-review');
+
+        labelEnter
+            .append('span')
+            .text(t('commit.request_review'));
+
+        // Update
+        requestReview = requestReview
+            .merge(requestReviewEnter);
 
-        requestReviewField
+        var requestReviewInput = requestReview.selectAll('input')
             .property('checked', isReviewRequested(changeset.tags))
             .on('change', toggleRequestReview);
 
@@ -244,7 +253,7 @@ export function uiCommit(context) {
 
 
         function toggleRequestReview() {
-            var rr = requestReviewField.property('checked');
+            var rr = requestReviewInput.property('checked');
             updateChangeset({ review_requested: (rr ? 'yes' : undefined) });
 
             var expanded = !tagSection.selectAll('a.hide-toggle.expanded').empty();