/*
 * CssBakery.com Captions v0.2
 *
 * Copyright (c) 2009 Cssbakery.com
 * http://www.cssbakery.com
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */
$(window).load(function(){	

     var cssbakery_colors = { medblue: '#4084e1', tealblue: '#3fbff4', marineblue: '#3f3ff4', twig: '#855434', 
                              eggplant: '#5d2f4d', violet: '#c261e2', darkpink: '#e261a4' };
     
     $("img.cssbakery_caption").each(function() {
       var theid = $(this).attr('id');     
       var saveclass = $(this).attr('class').replace('cssbakery_caption','');
       var theclass = ' '+saveclass+' ';
       theclass = theclass.replace(' cc ','');
       theclass = theclass.replace(/ /g,''); // note use of global replace
       if (theclass === '') theclass='black';
       if (!(typeof cssbakery_colors[theclass]=="undefined")) {
           theclass = cssbakery_colors[theclass];
       } 
       // alert('theclass: '+theclass);
       var src = $(this).attr('src');
       var caption = $(this).attr('alt');
       var idx = caption.indexOf(':');
       if (idx >= 0) {
           caption = "<strong>"+caption.substr(0,idx+1)+"</strong>"+caption.substr(idx+1);
       }  
       var w = $(this).width();
       var pb = $(this).css('padding-bottom');
       var pl = $(this).css('padding-left');
       if (theid !== '') {
           theid = "id='"+theid+"' ";
       }
       var markup = "<div "+theid+" class='cssbakery_image_wrapper "+saveclass+"' style='width:"+w+"px'>\n<img src='"+src+"' />\n<div class='cssbakery_transbox' style='background-color: "+theclass+"; left:"+pl+"; bottom:"+pb+";'></div><p style='left:"+pl+"; bottom:"+pb+";'>"+caption+"</p></div>";
       // alert("Markup: \n"+markup); 
       $(this).before(markup).remove();
       // The following is not very efficient because it goes through every image_wrapper on the page
       // even those that we've already setup up before.  To avoid this, we would need a way to access
       // the new element that we just added.  This could be done by giving the new element a
       // unique temporary class name (in addition to cssbakery_image_wrapper), and using that class to address it.  After
       // it's height is set, then we'd remove that temporary class name.
       $('.cssbakery_image_wrapper').children('p').each( function() {
           var h = $(this).height();
           $(this).siblings('div').height(h+20);
       });
    }); 
});