$(function() {
   var activeVerse = '', myVerse = [];
   
   function hideVerse() {
      $('#verseBox').hide();
      activeVerse = '';
   }
   
   //Create node for displaying verses
   $("<div id='verseBox'>" +
      "<div class='ref'></div>" +
      "<div class='close'><span>Close</span></div>" +
      "<div class='text'></div>" +
     "</div>").appendTo('body');
   $('#verseBox .close span').click(hideVerse);

   $('#verse').show();   //Unhide 'Search the Scriptures' for js users
   
   //Toggle expand/contract for 'Search the Scriptures'
   $('#verse span').toggle(function() {
      $('#verse').attr('className', 'show');
      $('#verseRef').focus();
   }, function() {
      $('#verse').attr('className', 'hide');
   });
   
   //Enter key in scripture textbox
   $('#verseRef').keydown(function(event, extra) {
      if (this.value && (event.which == 13 || extra === true))
         showVerse(this.value, this);
   });
   
   //Click scripture 'Go' button
   $('#verseBtn').click(function() {
      $('#verseRef').trigger('keydown', true);
   });
   
   //Make verses on page look clickable
   $('span[verse]').attr('className', 'verse');
   
   //Make verses on page clickable
   $('span[verse]').click(function() {
      var verseAttr = $(this).attr('verse');
      if (verseAttr && verseAttr.length > 1)
         showVerse(verseAttr, this);
      else
         showVerse($(this).text(), this);
   });
   
   function showVerse(ref, obj) {
      if (activeVerse == ref)
         return;
      else if (activeVerse)
         hideVerse();

      if (!myVerse[ref]) {
         myVerse[ref] = {ref:ref, text:'', status:0};
         $.post('http://www.wirapidschurchofchrist.com/data/verse',
                {'ref': ref},
                function(data, status, req) {
                  myVerse[ref].text = req.responseText;
                  myVerse[ref].status = 1;
                  if (ref == activeVerse)
                     $('#verseBox .text').html(req.responseText);
                });
      }
      
      //Show status message or verse text
      if (myVerse[ref].status == 0)
         $('#verseBox .text').html('Loading...');
      else if (myVerse[ref].status == -1)
         $('#verseBox .text').html('There was a problem finding the verse');
      else
         $('#verseBox .text').html(myVerse[ref].text);

      $('#verseBox .ref').html(ref);                  //Verse reference
      $('#verseBox').css('top', $(obj).offset().top); //Move verse pop-up just below object
      $('#verseBox').show('slow');                    //Show the verse pop-up
      
      activeVerse = ref;
   }
});