May 2016: wsurveyResizer.js: a javascript function for resizing adjacent blocks (uses jQuery)

 A function to make it easy to create resizable containers that are adjacent -- so that when one element shrinks, the other grows.

 The typical user action is supported:  "click mouse button down and hold down, move mouse, and then release the button"

 In addition, a rmb click on the "mover bar" will cause the sizes to toggle between all top (or left) and 60% top (or 60% left).

 To use this, include this library along with jQuery); for example:

    <script type="text/javascript" src="/wsurvey/publicLib/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="/wsurvey/jsLib/wsurveyResizer.js"></script>

Aafter the document is loaded (i.e.; with document.ready()); call the resizer_init functions using:

      resizer_init(blocka,blockb,mover,dire,minsize)

  where the first three are required:

     blocka : string containing id of one (or more, in space delimited list) blocks (typically <divs>) that will be resized. This is either the "left" or "top"
     blockb : string containing id of one (or more, in space delimited list) blocks (typically <divs>) that will be resized. This is either the "right" or "bottom"
      mover : string containing id of one (just one!) block (a <div> or <span>) that when clicked and moved will resize blocka and blockb.
      dire  : H for "horizontal resizing" (left and right adjacency), V for "vertical resizing" (top and bottom adjacency). Default is V
    minsize : minimum size after resizing. Default is 50.

 The mover box should be "adjacent" to blocka and blockb. Thus,

  H:  for "horizontal resizing" mover should be to the right of blocka and to the left of blockb. i.e.; column resizing
  V:  for "vertical resizing" mover should be below blocka and above blockb.       i.e.; row resizing

 If you specify more than one ids in either blocka or blockb, all of them will be resized together. They should all start with the
 same SIZE. More specifically,

   for H resizing:  all blocks (in both blocka and blockb) should have the same width. They do NOT have to be the same height.
   for V resizing:  all blocks (in both blocka and blockb) should have the same height. They do NOT have to be the same width.

 In any case, the resizing uses the max height (or width) of the elements (i.e.; a <div>) in each block. So if the relevant
 sizes start out different, they will be forced to be the same after the first "resizing".

 Notes:
   * The total width of two blocks that will be "horizontally" resized should be less than 97%.
     Otherwise, repositioning of blocks seems to happen when they are resized.
   * all blocks (in blocka and blockb) should have the same parent! If not, unpredictable results!
   * if you have two "mover" bars (in different resizers), you might need to include them in each other's "block")
     (if you don't, they fail to be resized when the other resizer is being used)

 The min is used to prevent excessive undersizing or oversizing of any block. Once a size (of the smallest block) is less than min, resizing is ignored
 (the resizing doesn't happen). If the total size of both blocks is within min of its container (the browser window, or some parent div), resizing
 is ignored

 Example:
          resizer_init('mainBlock_1a  mainBlock_1b','mainBlock_2','mainBlock_rowSep','V',50);

See testResizser.htm, and testResizer2.htm, for examples.