if (!$defined(console)) {
    var console = {
        log: function(text) {
            // Nothing
        }
    }
};

var tipWaiter = '';                                     // declare tooltip timer as a global variable
var currTtip  = '';                                     // currently moused-over element needing tooltip
var prevTtip  = 'initial value';                        // just to be different (from currTtip)
var picWaiter = '';
var thmFunc   = '';                                     // function to be executed on mousing over a flyout gallery thumbnail
var flyDirs   = ['rightup','rightdown','leftup','leftdown']; // array of the direction classes used by flyouts
var imgCtrX   = imgCtrY  = 0;
var flyBuild  = false;
var currFly   = '';                                     // id of current fly-out (gallery or text)
var prevFly   = 'x';                                    // id of previous fly-out
var ttipTxt   = ''                                      // content of toolTipContent
var imgRef    = [];                                     // array of image IDs
var imgHxW    = [];                                     // array of enlargement heights and widths
var imgSrc    = [];                                     // array of thumbnail URIs
var imgIx     = 0;                                      // index used in the above arrays
var loadIx    = 0;
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function initFlyouts()                                     // called from HTML on load
{
  context     = '';                                     // assign a filepath to global variable named "context"
  imgIx       = 0;                                         // declare and assign constants, global variables, data structures, etc.
                                       
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function oneUp(ID)                                      // called from addFlyAlbums, addEvents
{
//console.log(ID);
  var ix  = ID.lastIndexOf('_') + 1;
  var id  = ID.substring(0,ix);
      id +=(ID.substring(ix)-0) + 1;
  return id;
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function oneDn(ID)                                      // called from addEvents
{
  var ix  = ID.lastIndexOf('_') + 1;
  var id  = ID.substring(0,ix);
      id +=(ID.substring(ix)-0) - 1;
  return id;
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~         THUMBNAIL FUNCTIONS           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function buildImgArrays()                                // called from initPage
{
  var i     = 0;
  imgRef.length = imgHxW.length = imgSrc.length = 0;
  $$($('albumWrap').getElements('img')).each(          // collect all images within albumWrap
    function(IMG)
    {
      if (($(IMG).getProperty('id'))                   // if img has an Id AND id begins "tn"
      &&  ($(IMG).getProperty('id').substring(0,2) == 'tn'))
      {
        imgRef[i] = $(IMG).getProperty('id').substring(2);
        imgHxW[i] = $(IMG).className;
        imgSrc[i] = $(IMG).getProperty('src');
        i++;
      }
    });
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~           FLY-OUT FUNCTIONS           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function clickFly(lnk)                                 // called on click of fly-out link
{
  var fly = currFly;
  if (currFly != '')
  {
    zipFly();
    if (prevFly != oneUp($(lnk).id))
    {
      showFly(lnk);
    }
  }
  else
  {
    showFly(lnk);
  }
}  

// Click outside flyout will zip it.
var flyout_click_tester = function(event) {
    if(event.target.hasClass('flyout-button') || event.target.hasClass('mceText') || event.target.hasAttribute('mce_color') ||event.target.get('tag') == 'input' || event.target.hasClass('clicker') || event.target.getParents().some(function(item, index){return item.hasClass('flyout-button')})) return;      
 
    console.log("inside flyout_click_tester");
    console.log(event.target);
    console.log("inside flyout?");
        
    if (currFly!='' && !event.target.getParents().some(function(item, index){
        return item.hasClass('flyout-gallery')||item.get('id') == 'virtualBox'
        })) {
        zipFly();
    };               
}

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function showFly(lnk)                                    // called on click of fly-out link
{
  currFly = oneUp($(lnk).id);
  if ($(currFly).hasClass('flyout-gallery'))
  {
    showGlry(lnk);
    $(lnk).fireEvent("flyout_show");
  }
  else if ($(currFly).hasClass('flyout-text'))
  {
    showQuote(lnk);
  }
  prevFly = currFly;
  $$("body").addEvent("click", flyout_click_tester);
  // $(currFly).addEvent('click', zipFly);
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function zipFly()                                       // called on click of a fly-out link (gallery or pull-quote)
{
	// alert(currFly);
	// alert(currFly != '');
  if ($defined(currFly) && currFly != '')
  {
    $(currFly).setStyle('left',-3000);                  // ...to hide flyout, and...
    flyBtn  = oneDn(currFly);
    if (flyBtn & $(oneDn(currFly)).hasClass('hover-lock'))
    {
      $(oneDn(currFly)).removeClass('hover-lock');      // ...release the pull-quote from "activated" state
    }
    prevFly = currFly;
    currFly = '';
    $$("body").removeEvent('click', flyout_click_tester);
  } else {''};
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function showGlry(g0)                                   // called on click of gallery link (g0)
{
//console.log('showGlry : ',g0);
  var headerH = $('header').getSize().y;
  var mbH = 25;                                         // height of menu bar
  var daH = vPortSizes()[1] - mbH - headerH;                      // height of display area (viewport height - menu bar)
  var daM = mbH + (daH / 2);                            // vertical mid-point of display area
  var g1  = oneUp($(g0).id);                            // ID of gallery(g1)
  var g0T = posInVP(g0)[1] + 10;                        // gallery link (g0) b
  var g0H = $(g0).getSize().y;//.size.y;                     // gallery link (g0) height
  var g0B = g0T + g0H;                                  // gallery link (g0) bottom (top +  height)
// console.log(g0T,g0B,g0H);
  var g1H = Math.min(
              ($(g1).getElement('div[class^="g1-inner"]').getSize().y + 20), //size.y + 20), // needs 20px fudge
              maxFlyH);                                 // full-quote height, max 550px
  var g1T = Math.round(daM - (g1H/2)) - 62;             // default position: centered on display area (needs 62px fudge - why?)
  if ((g1T > g0B))                                      // if g1 top would be below bottom of g0...
  {
    g1T = g0T - 60;                                     // ...align g1 top w/ g0 top
  }
  else if  (((g1T + g1H) < g0T))                        // if g1 bottom would be above top of g0...
  {
    g1T = g0B - g1H - 95;                               // ...align g1 bottom w/ g0 bottom
  }
	if (g1T < 10) {
		g1T = 10;
	};
  $(g1).setStyles(
    {
      'top'     : g1T,                                  // align gallery vertically
      'left'    : 0                                    // reveal gallery...
   //   'z-index' : (linkZ + 100)                       // ...above link  removing setting of Z-index 
  });
  prevFly   = g1;                                       // store id of current fly-out
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function showQuote(q0)                                  // called on click of "pull quote" (q0)
{
console.log('showQuote1 : ',q0);
  var mbH = 25;                                         // height of menu bar
  var vpH = vPortSizes()[1];                            // height of viewport
  var daH = vPortSizes()[1] - mbH;                      // height of display area (viewport height - menu bar)
  var q1  = oneUp($(q0).id);                            // ID of full quote(q1)
  var q0T = posInVP(q0)[1];                             // q0 top
  var q0H = $(q0).offsetHeight;                         // height of pull quote(q0)
  var q0M = q0T + Math.round(q0H/2);                    // q0 top + half q0 height = y value of q0 mid-point
  var q1H = Math.min(
              $(q1).getElement('div[class^="q1-inner"]').getSize().y, //size.y,
              maxFlyH);                                 // full-quote height, max 550px
  var q1T = Math.round(mbH + ((daH - q1H)/2)) - 65;     // default position: centered on display area (needs 65px fudge - why?)

  $(q0).addClass('hover-lock');                         // hold the pull-quote in the "activated" state

  if ((q1T > q0M))                                      // if q1 top would be below mid-line of q0...
  {
    q1T = q0M - 50;                                     // ...aliqn q1 top w/ q0 mid-line
  }
  else if  (((q1T + q1H) < q0M))                        // if q1 bottom would be above q0 mid-line...
  {
console.log('(',q1T,'+',q1H,') < ',q0T);
    q1T = q0M - q1H - 95;                               // ...aliqn q1 bottom w/ q0 mid-line (needs 95px fudge - why?)
  }
  $(q1).setStyles(                                      // reveal full-quote
    {
      'top'    : q1T,
      'left'    : 0,                                    // aligns w/ horizontal mid-point of pull-quote
      'z-index' : ($('bigPicture').getStyle('z-index')+10)// ensure quote is always above enlargement
    });
console.log('showQuote2 : ',$(q1));
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function addDropShadows()                               // called from initPage
{
  $$('.apply-shadows, .rightside, .optionpane').each(               // collect all drop-shadow divs
    function(DS){
      if (!DS.hasClass('shadow-one')) {
        DS.innerHTML = "<div class='shadow-two'><div class='shadow-three'><div class='shadow-four'><div class='shadow-five'>" + DS.innerHTML + "</div></div></div></div>";
        DS.addClass('shadow-one');}
  
      if (DS.hasClass('.apply-shadows')) {DS.removeClass('apply-shadows');}
  });
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function addDropShadows2()                               // called from sizeThumb
{
  var content   = '';
  $$('#albumWrap div[class$="apply-shadows"]').each(               // collect all drop-shadow divs
  function(DS)
  {
    content         = $(DS).innerHTML;
    $(DS).innerHTML = '';
    $('shadowGroup').clone().injectInside($(DS));
    $(DS).getElement('div[class="shadow-five"]').innerHTML  = content;
    $(DS).addClass('shadow-one');
    $(DS).removeClass('apply-shadows');
  });
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function dropIt()                                   // called from initPage
{
  var content = '';
  var shadows = '<div class="shadow-one">\n'
              + '  <div class="shadow-two">\n'
              + '    <div class="shadow-three">\n'
              + '      <div class="shadow-four">\n'
              + '        <div class="shadow-five">\n'
              + '        </div>\n'
              + '      </div>\n'
              + '    </div>\n'
              + '  </div>\n'
              + '</div>\n';
  $$('#albumWrap div[class$="drop-shadows"]').each(               // collect all drop-shadow divs
  function(DS)
  {
//console.log(DS);
    $(DS).removeClass('apply-shadows');
    $('shadowGroup').clone().injectInside($(DS));
    $(shadows).setHTML  = $(DS);
    $(DS).removeClass('apply-shadows');
  });
}

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function wait4Pix()                                     // called from initPage
{
  if($defined(picWaiter))
  {
    $clear(picWaiter);                                  // cancel timer
  }

  $$($('albumWrap').getElements('img')).each(           // collect all image references in DOM
    function(pic)
    {
      if (!imgLoaded(pic))                              // if any of the images has not yet loaded...
      {
        picWaiter = wait4Pix.delay(200);                // ...try again after a 0.2sec wait
        return;
      }
    });
  getTheBigPicture.delay(100, null, 0);                 // show first large image after a short pause
}

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~          BUTTON FUNCTIONS        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function clickModal(o)                                   // called from HTML on click of modal button
{
  var label = $(o).getElement('span').getText();
  if (label == 'block' || label == 'blocked')
  {
    $(o).getElement('span').setText(((label=='block')?'blocked':'block'));
  }
  if ($(o).hasClass('one-way'))
  {
    hideTooltip();
    $(o).removeEvents();                                // NOT WORKING - WHY NOT?
    $(o).removeClass('one-way');
    $(o).removeClass('inactive');
    $(o).addClass('locked-active');
    $(o).addClass('active');
//console.log('clickModal() 1  o = ',$(o),$(o).innerHTML);
  }
  $(o).addClass('clicked');                             // flag div as 'clicked'; button will react on roll-off
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function resetBtn(o)                                    // called from HTML on mouse-off
{
  if ($(o).hasClass('clicked'))
  {
    $(o).removeClass('clicked');
    switchMode($(o));
//    $(o).removeClass('rel-position');                    // could degrade scroll efficiency if left
  }
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function switchMode(btn)                                // called from HTML on mouseout of modal button
{
  $(btn).toggleClass('inactive');                       // if <div> has 'inactive' class, remove it; else add it
  $(btn).toggleClass('active');                         // if <div> has 'active' class, remove it; else add it
  var div1 = $(btn).getElement('div[class="tooltip-text"]');
  var div2 = $(btn).getElement('div[class="tooltip-txt2"]');
  var txt1        = div1.innerHTML;
  div1.innerHTML  = div2.innerHTML;
  div2.innerHTML  = txt1;
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function moreOrLess(a)                                 // called from HTML on click
{
  var expandDiv = 'expansion' + a;
  var buttonDiv = 'btnAlbum'  + a;
  var buttonImg = $(buttonDiv).getElement('img').src;
// console.log(expandDiv);
  if (buttonImg.indexOf('minus_base.png') > -1 || buttonImg.indexOf('minus_rollover.png') > -1)
  {
    if (buttonImg.indexOf('minus_base.png') > -1)
    {
      $(buttonDiv).getElement('img').src  = buttonImg.replace('minus_base.png','plus_base.png');
    }
    else
    {
      $(buttonDiv).getElement('img').src  = buttonImg.replace('minus_rollover.png','plus_base.png');
    }
    $(expandDiv).setStyle('display','none');
  }
  else
  {
    if (buttonImg.indexOf('plus_base.png') > -1)
    {
      $(buttonDiv).getElement('img').src  = buttonImg.replace('plus_base.png','minus_base.png');
    }
    else
    {
      $(buttonDiv).getElement('img').src  = buttonImg.replace('plus_rollover.png','minus_base.png');
    }
    $(expandDiv).setStyle('display','block');
  }
  buildImgArrays();                                       // build (or re-build) array of thumbnail references
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function hiBtn(obj)                                       // called from (generated) HTML on rollover of album button
{
  if ($(obj).src.substr(-13) == 'plus_base.png') {$(obj).setProperty('src','images/buttons/plus_rollover.png'); }
  if ($(obj).src.substr(-14) == 'minus_base.png'){$(obj).setProperty('src','images/buttons/minus_rollover.png');}
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function loBtn(obj)                                       // called from (generated) HTML on rolloff of album button
{
  if ($(obj).src.substr(-17) == 'plus_rollover.png') {$(obj).setProperty('src','images/buttons/plus_base.png'); }
  if ($(obj).src.substr(-18) == 'minus_rollover.png'){$(obj).setProperty('src','images/buttons/minus_base.png');}
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function toggleCaptions()                                    // called from HTML on click
{
  $('captionBtn').innerHTML = ($('albumWrap').hasClass('hide-captions'))?'show captions?':'hide captions?';
  $('albumWrap').toggleClass('hide-captions');
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function toggleBigCaption()                                 // called from HTML on click
{
  $('bigCaptionBtn').innerHTML = ($('bigPicture').hasClass('hide-bigcaption'))?'hide caption?':'show caption?';
  $('bigPicture').toggleClass('hide-bigcaption');
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function highlight(obj)                                    // called from HTML on rollover
{
  $(obj).setProperty('style', 'color:#932');
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function unHighlight(obj)                                  // called from HTML on rollover
{
  $(obj).setProperty('style', 'color:teal');
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//              ====================================================================================================
//              ======================================   thumbnail functions   =====================================
//              ====================================================================================================
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function sizeThumb(id, format)
{
	var fetch_album = new Request.HTML({url:'/member_profile/'+id+'/'+format, method: 'get', update: 'albumWrap'}).send();
	fetch_album.request();
	thumbSmall = (format=='small_album')? true: false;
	fetch_album.addEvent('onComplete', function()
  {
    addThumbClix();
		addDropShadows2();
  });
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//              ====================================================================================================
//              ==================================      large photo functions      =================================
//              ====================================================================================================
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function getTheBigPicture(imgIx)                                 // called from pageInit; thumbClick; showSlide
{
  fadePic();                                                    // fades out old; fades in new
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function fadePic()                                              // called from getTheBigPicture
{
  var bpFade = new Fx.Style($('bigPicture'),'opacity',
    {
      duration  : 50,
      transition: Fx.Transitions.Quart.easeOut,
      onComplete: function ()
        {
          $('bigPhoto').setProperty('src','images/general/bg.png');
          $('bigPicture').setStyle('top',-3000);                // shift (invisible) image from viewport
          toggleSat('albumWrap');
          loadPic.delay(20);
        }
    });
  bpFade.start(1,0);                                            // increase opacity slowly, revealing enlargement
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function loadPic()                                              // called from fadePic
{
  $('bigPhoto').setProperty('src',thumb2Big(imgIx));
  loadTimer = wait4Pic.periodical(50);
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function wait4Pic()                                              // called from loadPic
{
  /*
  if (!imgLoaded(document.images.bigPhoto))                      // if photo not finished loading...
  {
    wait4Pic.delay(50);                                          // ...try again in 50 millisecs
  }
  else                                                           // otherwise, everything's OK so reveal the image...
  {
    showBigPic();
  }
  */
  if (imgLoaded(document.images.bigPhoto))                      // if photo has finished loading...
  {
    loadTimer = $clear(loadTimer);                              // halt periodical execution of this function
    showBigPic();
  }
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function showBigPic()                                           // called from wait4Pic
{
  fitBigPic();
  var bpFadeIn = new Fx.Tween($('bigPicture'),'opacity',
  {
    duration  : 250,
    transition: Fx.Transitions.Quart.easeOut
  });
  bpFadeIn.start(0,1);                                          // increase opacity slowly, revealing enlargement
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function hideBigPic()                                           // called from HTML
{
  if (slideState !== '') {pauseSlides();}                       // if slideshow is running, then... interrupt slideshow
  toggleSat('albumWrap');                                       // remove desaturation
  $('bigPicture').setStyle('top',-3000);                        // shift currently visible image from viewport
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function toggleSat(container)                                   // invoked from fadePic, hideBigPic
{
  $$($(container).getElements('div')).each(                     // for each div within container...
    function(DIV)
    {
      if ($(DIV).hasClass('desaturate-mask'))
      {
        $(DIV).getParent().toggleClass('desaturate');           // if it's got it, remove it, otherwise add it.
      }
    });
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function thumbClick(thm)                                        // invoked from generated HTML
{
  var imgId = $(thm).getElement('img').getProperty('id').substring(2);
  imgIx = imgRef.indexOf(imgId);
  getTheBigPicture(imgIx);
  $('bigPicture').setStyle('z-index',400);                    // enlargement floats above everything else in the viewport
  $(thm).setStyle('z-index',0);                                 // ensure that thumbnail lies below enlargement
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function fitBigPic()                                           // called on window.resize event and from pageInit()
{
// console.log('fitBigPic: imgIx = ',imgIx);
  if (!imgHxW[imgIx]){ return; }

  var hw  = imgHxW[imgIx].split('x');                          // array of [height, width]
  var h	  = Math.round(hw[0] * scaleFactor);                   // adjusted width
	var w  	= Math.round(hw[1] * scaleFactor);                   // adjusted height
  var top = boxT  + Math.round((boxS - h)/2);                  // adjusted top
	var lft = boxL  + Math.round((boxS - w)/2);                  // adjusted left
  $('bigPhoto').setProperties({width: w, height: h});          // set img size
  $('bigPicture').setStyles({'left': lft, 'top': top});        // position enlargement in center of "image zone"
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function defineImgBox()                                        // called from initPage, adjustPage
{
/*
  "Image Zone" = square of side boxS px
  boxS         = the lesser of (viewport width - (X+50)) and ((viewport height - 95),750)
  Top edge of viewport to top edge of Image Zone is always 60.
  If (viewport width is < (1070 + boxS)) then
    right edge of viewport to right side of Image Zone is 35
  else
    left edge of viewport to left side of Image Zone is 1035
*/

  var minL  = 450;
  var maxL  = 1025;
  var vpWH  = vPortSizes();
    vpWH[1] = vpWH[1] - 25;                                     // center on viewport height minus the menu bar (25px)
  var lim0  = 750;                                              // possible limit to "frame" size
  var lim1  = vpWH[0]-(minL+50);                                // another possible limit to "frame" size
  var lim2  = vpWH[1]-95;                                       // yet another possible limit to "frame" size
// NOTE the following are global variables...
      boxS  = (lim0<lim1)?
             ((lim0<lim2)?lim0:lim2):
             ((lim1<lim2)?lim1:lim2);                           // boxS (box size) = smallest of {lim0, lim1, lim2}
      //boxT  = Math.round((vpWH[1] - 25 - boxS)/2);            // top of the "frame"
      boxT  = 35;                                               // top of the "frame"
      boxL  = vpWH[0] - 150  - boxS;                            // default value for left edge of the "frame"
  if (vpWH[0] > (boxS+1070))                                    // but...
  {
    boxL  = 1035;                                               // left edge of the "frame"
  }
  scaleFactor = boxS/maxPicXY;
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function adjustPage()                                           // invoked from HTML only
{
  if ((vPortWide > (oldVPWide * 1.05) || vPortWide < (oldVPWide * 0.95))
  ||  (vPortHigh > (oldVPHigh * 1.05) || vPortHigh < (oldVPHigh * 0.95)))
  {
    defineImgBox();                                             // set image-zone dimensions as global vars
    if ($('bigPicture') && $('bigPicture').getStyle('top') != '-3000px')           // if the enlargement is displayed...
    {
      showBigPic();                                             // ...re-position
    }
  }
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//              ====================================================================================================
//              ==================================      mini-profile functions     =================================
//              ====================================================================================================
function mouseoverThumb(o)                                      // invoked from generated HTML
{
//  console.log('mouseoverThumb() 1  o = ',o);
  profileOwner  = o;
//  console.log('mouseoverThumb() 2  profileOwner = ',profileOwner);
//  window.miniprofTimer = setTimeout('miniProfile()', profWait);
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//              ====================================================================================================
function giveDirection(o)
{
// to avoid left side clipping, only position right when less than 400px from right edge
//  console.log('giveDirection');
  var xy    = centerCoords($(o));
  var xMid  = vPortSizes()[0]/2;
  var yMid  = vPortSizes()[1]/2;
  // var flyDir= (((xy[0])<xMid)? 'right' : 'left') + (((xy[1])<yMid)? 'down' : 'up');
  var flyDir= (((xy[0]) < (vPortSizes()[0] - 400))? 'right' : 'left') + (((xy[1])<yMid)? 'down' : 'up');

  // unless element already has this, remove any other direction class and replace
  if (!$(o).hasClass(flyDir))
    {
      clearDirection(o);
      $(o).addClass(flyDir);                                     // position miniProfile by applying flyout direction class
    }
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function clearDirection(o)                                    // invoked from shutProfile
{
  var i;
  for (i=0; i < flyDirs.length; i++)
  {
    if ($(o).hasClass(flyDirs[i]))
    {
      $(o).removeClass(flyDirs[i]);
      return;
    }
  }
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function hideMiniProfile(o)                                   // invoked on mouse-leave of mini-profile parent
{                
  $('miniProfile').setStyle('visibility','hidden');           // make miniProfile invisible until positioned
//   clearTimeout(window.profHideTimer);
//   clearTimeout(window.miniprofTimer);
  if (!$('batCave').getElement('miniProfile'))
  {
    $('miniProfile').injectInside('batCave');                 // 1st, back to the cave, then initialize related vars...
  }
  $(o).removeClass('rel-position');                           // could degrade scroll efficiency if left
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
//
//              ====================================================================================================
//              ==================================     miscellaneous functions     =================================
//              ====================================================================================================
function storeBigPix()
{
//  console.log('storeBigPix 1: Ix = ',loadIx,'; id = ',imgRef[loadIx]);
  var loadImg = 'en' + imgRef[loadIx];
  if ($(loadImg))                                                 // if enlargement exists...
  {
    if (!imgLoaded($(loadImg)))                                   // ...but has not finished loading...
    {
//    console.log('storeBigPix 3: not loaded ',loadIx);
      storeBigPix.delay(25,null);                                 // ...try again after a short pause
      return;
    }
  }
// the enlargement loadImg exists (hidden in batCave) and has finished loading, so let's load another...
  loadIx++;                                                      // ...point to next entry in imgRef[]
  if (loadIx<imgRef.length)                                          // if more images to load
  {
    $('en0-0').clone().setProperties({id:('en'+imgRef[loadIx]),src:thumb2Big(loadIx)}).injectBefore($('caveBottom'));
    storeBigPix.delay(50,null);                                  // and repeat
  }
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function thumb2Big(imgIx)
{
  return $('tn'+imgRef[imgIx]).getProperty('src').replace(((thumbSmall)? '/small_thumb': '/large_thumb'),'');
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function dieDotsDie()
{
  $$(document.getElements('a')).each(  //
    function(A)
    {
      $(A).addEvent('click',function()
      {
        onfocus = A.blur();
      });
    });
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

var ContactCard = {
	save: function() {
		$('edit_contact_card_form').onsubmit();
		// new Request.HTML({url:$('edit_contact_card_form').action}).post($('edit_contact_card_form'));
		// $("edit_contact_card_form").send({evalScripts:true, url:$('edit_contact_card_form').action});
	},
	cancel: function() {
		if($('EditContactCardFlyout')) {
			EditContactCardForm.hide();
		}
		if($('AddContactCardFlyout')){
			AddContactCardForm.hide();
		}
		zipFly();
	}
}

// use this function to add new location to select list, called by AJAX remote_form_for in events/new
function addLocationToSelect(name, id) {
  index = $('event_location_id').options.length;
  $('event_location_id').options[index]=new Option(name, id);
	$('event_location_id').selectedIndex = index;
	$('venue_thumb').set('html', '');
}

function reloadVenueThumb(id) {
	new Request.HTML({url: '/venues/thumb/'+id, method: 'get', update: 'venue_thumb'}).send();
}

var AddAttendeeForm = {
	unsaved: false,
	first_time: true,
	show: function() {
		$('add_attendee_form').reset();
		$('refresh_tag_form').reset();
		$('attendee_tags').selectedIndex = 0;
		AddAttendeeForm.unsaved = false;
		
		$('AddAttendeeForm_1').setStyles({top:10,left:0});
    currFly = 'AddAttendeeForm_1';
    
		if (!AddAttendeeForm.first_time) {
			$('refresh_tag_form').onsubmit();
		} else {
			AddAttendeeForm.first_time = false;
		}
		

	},
	bind_check_boxs: function() {
		$$('.contact_card_check_box').each(function(check_box){
			check_box.addEvent("click", function(event){
				if (event.target.checked) {
					AddAttendeeForm.unsaved = true;
				};
			})
		});
	},
	check_unsaved: function() {
		if (AddAttendeeForm.unsaved) {
			ok = window.confirm("You have selected one or more contacts. Are you sure you wish to refresh and cancel selections?");
			if (ok) {
				AddAttendeeForm.unsaved = false;
				return true;
			} else {
				return false;
			}
		} else {
			return true;
		}
	},
	init: function() {
		AddAttendeeForm.bind_check_boxs();
	}
}

var EditContactCardForm = {
	contact_card_id: 0,
	show: function(contact_card_id, this_cycle) {
		AddContactCardForm.hide();
		EditContactCardForm.contact_card_id = contact_card_id;
		$("EditFormContent").set("html", "Loading...");
		$('EditContactCardFlyout').setStyle('display', 'block');
		new Request.HTML({url: "/contact_cards/"+contact_card_id+"/edit?this_cycle="+this_cycle, method: 'get', update: 'EditFormContent'}).send();
	},
	hide: function() {
		if($('EditContactCardFlyout')) {
			EditContactCardForm.contact_card_id = 0;
			$('EditContactCardFlyout').setStyle('display', 'none');
		}
	}
}

var AddContactCardForm = {
	show: function() {
		EditContactCardForm.hide();
		$("AddFormContent").set("html", "Loading...");
		$('AddContactCardFlyout').setStyle('display', 'block');
		new Request.HTML({url: "/contact_cards/new", method: 'get', update: 'AddFormContent'}).send();
	},
	hide: function() {
		if($('AddContactCardFlyout')) {
			$('AddContactCardFlyout').setStyle('display', 'none');
		}
	}
}

function add_tag_to_contact_card_form (tag) {
	tag = tag.trim();
	var old_tags = $('contact_card_tag_list').value.split(",").map(function(item, index){return item.trim();}).erase("");
	if (old_tags.contains(tag)) {
		old_tags.erase(tag);
	} else {
		old_tags.combine([tag]);
	};
	
	old_tags = old_tags.map(function(item, index){return item.trim();});
	$('contact_card_tag_list').value = old_tags.join(", ")
}
function check_contact_cards_selected () {
	var selected = 0;
	$$(".contact_card_check").each(function(elem){
		// alert(elem.checked);
		if (elem.checked) { selected = selected + 1 };
	});
	if (selected > 0) {
		return selected;
	} else {
		alert("Please select at least one contact.");
		return false;
	}
	
}
function release_selected_contact_cards () {
	$$(".contact_card_check").each(function(elem){
		// alert(elem.checked);
		if (elem.checked) { elem.checked = false };
	});
  if ($('select_all_check_box')){
    $('select_all_check_box').checked = false;
  }
}

var MessageBody = {
	message_id: 0,
	member_id: 0,
	show: function(member_id, message_id) {
		MessageBody.member_id = member_id;
		MessageBody.message_id = message_id;
		$("MessageBodyContent").set("html", "Loading...")
		$('MessageBodyFlyout').setStyle('display', 'block');
		new Request.HTML({url: "/messages/"+message_id+"", method: 'get', update: 'MessageBodyContent'}).send();
	},
	hide: function() {
		MessageBody.member_id = 0;
		MessageBody.message_id = 0;
		$('MessageBodyFlyout').setStyle('display', 'none');
	}
}
var MailingForm = {
	show: function() {
		$('mailing_form').reset();
	}
}
var InvitationForm = {
	show: function() {
		$('invitation_form').reset();
	}
}
var MailingForm = {
	show: function() {
		$('mailing_form').reset();
	}
}
  
function close_flyout_me() {
    if ($('virtualBox')) {
        $('virtualBox').fireEvent('close');
    };
}             
var flyout_me_box = false;
function bind_flyout_me() {
    $$('.flyout_me').each(function(item, index){   
        // console.log(item);      
        if (item.flyout_me_binded) { return };
        flyout_me_box = new Virtual.Ajax.single(item, {
            style: true,             
            overlayLight: 'lighten',
            enable: {
    			arrows: false,
    			closeButton: false,
    			arrowsKeyboard: false,
    			closeKeyboard: false,
    			caption: false
    		},
            zones: {
                wrapper: 'update',
                main: 'blackglow-25 update'
            },
            onShow: function() {   
                $$("body").addEvent("click", flyout_click_tester);
                
                this.overlay.setStyle('opacity', '0.3');                                       
                this.main.setStyle('width', this.main.getStyle('width').toInt()+50);
                this.main.setStyle('left', this.main.getStyle('left').toInt()-25);
                
                if(!$defined(this.shadows_created)) {
                    this.main.setStyle("padding", "0px");
                    this.main.setStyle("background-color", "transparent");                    
                    ['shadow-one', 'shadow-two', 'shadow-three', 'shadow-four', 'shadow-five', 'g1-inner'].each(function(addClassName){
                        var shadows = new Element("div", {'class': addClassName});
                        shadows.wraps(this.wrapper);
                    }, this);                   
                    var inner = new Element('div', {'class': 'inner'})
                    inner.wraps(this.wrapper.getFirst());
                    
                    this.wrapper.addEvent('close', function(){   
    					        this.remove(); 
    					        $$("body").removeEvent("click", flyout_click_tester);
                    }.bind(this));
                    this.shadows_created = true;
                    // bind_flyout_me();                    
                }        
            },
            effect: 'fix',
            requestOptions: {            
                method: 'get',                          
                onSuccess: function() { 
                    
               
                },
                onRequest: function() {
                    
                }
            }
        });         
        item.flyout_me_binded = true;
        // console.log("Virtual bind!");
    });
}

function show_event_register_flyout() {
	window.addEvent("domready", function(event){
		$('register_form').reset();showFly('registerForm_0');
	})
} 
// message functions moved to ULcommon.js


window.addEvent("domready", function(event){
    if ($('AddAttendeeForm_1')) {
        AddAttendeeForm.init();
    };

    if ($$('.contact_card_check')) {
        release_selected_contact_cards();
    };                                                       

    if ($$('.flyout_me')) {
        // give browser some time to setup
        setTimeout("bind_flyout_me()", 100);
    };                     

})

// set badges to show primary and secondary profile photos
function setPSBadges(main_id, secondary_id) {
  primary = $('ps_badge' + main_id);
  if (primary)
  { primary.set('text','1');
  primary.setStyle('display', 'block'); }
  
  
  secondary = $('ps_badge' + secondary_id);
  if (secondary)
  { secondary.set('text','2');
  secondary.setStyle('display', 'block'); }
}
  
function removePSBadge(id) {
  if($('ps_badge' + id)) {
     $('ps_badge' + id).setStyle('display', 'none');
     $('ps_badge' + id).set('text','');
     }
}

// to play audio file	
function playThis(path) {
	document.getElementById('myPlayer').SetVariable('player:jsStop', '');
	document.getElementById('myPlayer').SetVariable('player:jsUrl', path);
	document.getElementById("myPlayer").SetVariable("player:jsPlay", "");
}

function to_editor_view() {
	$('Preview').setStyle('display', 'none');
	$('Editor').setStyle('display', 'block');
	$('Editor').setAttribute('class','selected');
	$('Preview').setAttribute('class', '');
	$('Preview').inner_html='';
}

function otl(){
  $$('.contact_card_check_box').each(function(elem){elem.checked = $('select_all').checked}); 
  if($('draft_schedule').getStyle('display')=='none' && $('select_all').checked){
    $('draft_schedule').setStyle('display','block'); 
    alert($('draft').value+' and '+$('schedule').value +' option enabled again');}
  }

function itl(){
  if($('draft_schedule').getStyle('display')!='none' && !this.checked){
    $('draft_schedule').setStyle('display','none'); 
    $('select_all').checked=false; 
    alert($('draft').value+' and '+$('schedule').value + ' options disabled. Select all again to enable them.');
    }
  }

function enable_all_contact_lists()
{
  if ($('select_all_c')) {
	  $('select_all_c').disabled=false;
	  $$('.contact_lists_check_box').each(function(e){e.disabled=false;});
	  $$('.contact_lists_ignore_check_box').each(function(e){e.disabled=false;}); }
	if ($('role_ids[]')) {$('role_ids[]').disabled=false;}
	$('contact_cards_table').innerHTML = '';
	$('draft_schedule').setStyle('display','block'); 
	$('display_button').setStyle('display', 'inline');
	$('back_to_lists').setStyle('display', 'none');
}
function disable_all_contact_lists()
{
  processing();
  if ($('select_all_c')) {
	  $('select_all_c').disabled=true;
	  $$('.contact_lists_check_box').each(function(e){e.disabled=true;});
	  $$('.contact_lists_ignore_check_box').each(function(e){e.disabled=true;});}
	else {$('role_ids[]').disabled=true;}
	$('draft_schedule').setStyle('display','none'); 
	$('display_button').setStyle('display', 'none');
	$('back_to_lists').setStyle('display', 'inline');
}

function showHideSplits(index) {
  if (index != -1) {
    $('work_item_participant_split_percent').setStyle('display', 'block');
    $('split_percent_label').setStyle('display', 'block'); 
    $('work_item_participant_split_paid_amount').setStyle('display', 'block');
    $('split_paid_amount_label').setStyle('display', 'block');  }
  else {
    $('work_item_participant_split_percent').setStyle('display', 'none');
    $('split_percent_label').setStyle('display', 'none');
    $('work_item_participant_split_paid_amount').setStyle('display', 'none');
    $('split_paid_amount_label').setStyle('display', 'none');    $('work_item_participant_split_paid_amount').parentNode.parentNode.setStyle('display', 'none');
    }
}

function processAutocompleteChoice(element, selected, value, input) {
  if (element.getAttribute('path_for_autocomplete').substring(1,14) == 'contact_cards') {
    if (value.split('<span name=').length > 1) {
      $('contact_name_autocomplete').value = value.split(' | ')[0];
      $('contact_email_autocomplete').value = value.split(' | ')[1];
      $('member_name_autocomplete').value = value.split(' | ')[2].split('<span')[0];
      if ($('work_item_participant_contact_card_id')) $('work_item_participant_contact_card_id').value = value.split('<span name=')[1].split('|')[0];
      if ($('edit_contact_link')) $('edit_contact_link').setStyle('display','inline');
      if ($('work_item_participant_member_id')) $('work_item_participant_member_id').value = value.split('<span name=')[1].split('|')[1].split('/>')[0];
    }
  }
}

function ulSubmit(form_id) {
 if ($(form_id).onsubmit() == false) {return false};
 $(form_id).submit(); 
 processing();
}

function processing() {
  $('bodyClass').addClass('processing');
  $($('spinner_image').parentNode).setStyle('display','block');
}

function problem() {
  var subject = 'PROBLEM:';
  var body = 'Severity (please erase all but one): Urgent / High / Medium / Low<br/><br/>Problem Details:<br/><br/><hr/>' + navigator.userAgent + '<br/>' + document.location;
  quick_mail('support@katanadevelopment.com', null, subject, body, null);
}

function copyTemplate(id) {
  tinyMCE.get('compose_body').setContent($('template_' + id + '_body').innerHTML);
  if ($('template_' + id + '_subject')) { $('compose_subject').value = $('template_' + id + '_subject').get('text');}
  $('templates').setStyle('display','none');
}

function markRequired(field) {
  label = $$('label[for=' + field + ']')[0];
  label.parentNode.innerHTML = "<span class='required'>*</span>" + label.parentNode.innerHTML;
}