[Summary view] [Print] [Text view]

   1  /**
   2   * Peeker controls the visibility of an element based on the value of an input
   3   *
   4   * Examples:
   5   * new Peeker($('#myController'), $('#myDomain'), 1, false);
   6   * new Peeker($('.myControllerNode'), $('#myDomain, #myDomain2'), 1, true);
   7   * new Peeker($('#myController'), $('#nestedPeeker'), /works/, false);
   8   * new Peeker($('#nestedPeeker'), $('#nestedPeekerChild'), /\d+/, false);
   9   */
  10  
  11  var Peeker = (function() {
  12      /**
  13       * Constructor
  14       *
  15       * @param string ID of the controlling select menu
  16       * @param string ID of the thing to show/hide
  17       * @param regexp If this regexp matches value of the select menu, then the 'thing' will be shown
  18       * @param boolean Should be set to true for radio/checkboxes
  19       */
  20  	function Peeker(controller, domain, match, isNodelist) {
  21          var fn;
  22  
  23          // verify input
  24          if (!controller ||
  25              (isNodelist && controller.length <= 0) ||
  26              !domain) {
  27              return;
  28          }
  29          this.controller = controller;
  30          this.domain = domain;
  31          this.match = match;
  32          this.isNodelist = isNodelist;
  33  
  34          // create a context-bound copy of the function
  35          fn = $.proxy(this.check, this);
  36  
  37          if (isNodelist) {
  38              // attach event handlers to the inputs in the node list
  39              this.controller.each(function(i, el) {
  40                  el = $(el);
  41                  el.on('click change', fn);
  42              });
  43          } else {
  44              this.controller.on('change', fn);
  45          }
  46          this.check();
  47      }
  48  
  49      /**
  50       * Checks the controller and shows/hide
  51       *
  52       * @return void
  53       */
  54  	function check() {
  55          var type = '', show = false, regex = this.match;
  56  
  57          if (this.isNodelist) {
  58              this.controller.each(function(i, el) {
  59                  if ($(el).is(':visible') && el.checked &&
  60                      el.value.match(regex)) {
  61                      show = true;
  62                      return false;
  63                  }
  64              });
  65              this.domain[show ? 'show' : 'hide']();
  66          } else {
  67              type = this.controller.val() || '';
  68              this.domain[(type.match(regex) && this.controller.is(':visible')) ? 'show' : 'hide']();
  69          }
  70          
  71          $(this.domain).each(function() {
  72              $(this).find('input, textarea, select').each(function() {
  73                  $(this).trigger('change');
  74              });
  75          });
  76      }
  77  
  78      Peeker.prototype = {
  79          controller: null,
  80          domain: null,
  81          match: null,
  82          isNodelist: null,
  83          check: check,
  84      };
  85  
  86      return Peeker;
  87  })();
  88  
  89  /**
  90   * Add a "required" asterisk to a FormContainer row
  91   * @param string ID of the row
  92   */
  93  function add_star(id) {
  94      if (!$('#' + id).length) {
  95          return;
  96      }
  97  
  98      cell = $('#' + id).children('td')[0];
  99      label = $(cell).children('label')[0];
 100      star = $(document.createElement('em'));
 101      starText = $(document.createTextNode(' *'));
 102      star.append(starText);
 103      $(label).append(star);
 104  }