Prevent select on labels

[Ryan J Ollos]

Double-click on the labels selects them. It would be good to prevent selection of the labels.

queryuiassistplugin/1.0/uiassist/htdocs/js/enabler.js

@@ -22 +22 @@
     var $filters = $("#filters");
     $filters.on('dblclick', 'label', flip);
     $filters.on('dblclick', ':checkbox, :checkbox + label', selectone);
+    $filters.find('label').css('user-select', 'none')
+                          .attr('unselectable', 'on')
+                          .on('selectstart', false);
   }
 
   $(document).ready(function() { binder() })

Solution is from ​SO:2700029/121694. I didn't spend a lot of time looking at all the various solutions, but the jQuery solution works for older versions of IE (confirmed using emulation mode in IE 11 with emulator set to Document Mode 5, 7, 8, 9) and is simple to add for this plugin. When I integrate the code into Trac I'll probably just add a class to each label and use CSS classes: ​SO:4407335/121694.

[anonymous]

The labels are selectable after a filter is added. I'll revise the patch.

[Ryan J Ollos]

This is the best I could come up with. I'll implement it more cleanly in ​trac:#11417 though, so the feature could just be deferred.

queryuiassistplugin/1.0/uiassist/htdocs/js/enabler.js

@@ -1 +1 @@
 (function($) {
   // flip checkboxes named same as event source's id
   function flip(event) {
+    disableLabelSelection();
     var $filters = $("#filters");
     var name = this.id.slice(6);
     $filters.find('input[name="' + name + '"]')
@@ -10 +11 @@
 
   // enable only clicked checkbox and clear others
   function selectone(event) {
+    disableLabelSelection();
     var $filters = $("#filters");
     var that = (this.tagName == 'LABEL' ) ? $('#' + $(this).attr('for'))[0] : t
     $('input[name="' + that.name + '"]', $filters).prop('checked', false);
     $(that).prop('checked', true);
   }
 
+  // disable selection of labels
+  function disableLabelSelection() {
+    $("#filters").find('label').css('user-select', 'none')
+                               .attr('unselectable', 'on')
+                               .on('selectstart', false);
+  }
+
   // bind "selectone" above to checkboxes in page,
   // bind "flip" above to labels in page.
   function binder() {

[Ryan J Ollos]

attachment:t12168.patch​ refactors the code to reduce the number of selectors and includes the patches from comment:2 and comment:7:ticket:12062.

[Ryan J Ollos]

A better solution was discussed in ​trac:comment:12:ticket:11417, so I'm going to go ahead and close this ticket.