var createNotifyBlocks = function()
{
  var notifyblocks = $$('.notifyblock');

  notifyblocks.each(function(item)
  {
    
    var padding = 4;
    var middlewidth = item.getWidth() - 46;
    var middleheight = item.getHeight() - 44;
    var contentwidth = middlewidth - 2*padding;
    var contentheight = middleheight - 2*padding;

    // store original content in new div
    var contentdiv = new Element('div');
    contentdiv.setStyle({
      'float': 'left',
      'width': contentwidth+'px',
      'height': contentheight+'px',
      overflow: 'hidden',
      'padding' : padding+'px'
    });
    var contentdiv2 = new Element('div').update(item.innerHTML);
    contentdiv.insert({ bottom: contentdiv2} );

    // remove content from originaldiv
    item.update('');

    // left top corner
    var div = new Element('div').update(" ");
    div.setStyle({
      'background': "url('/images/blokje/links.gif')",
      backgroundRepeat: 'no-repeat',
      'float': 'left',
      'width' : '23px',
      'height' : '22px'
     });
    item.insert({ bottom: div} );

    // middle top 
    var div = new Element('div').update(" ");
    div.setStyle({
      background: "url('/images/blokje/boven.gif')",
      backgroundRepeat: 'repeat-x',
      'float': 'left',
      'width': middlewidth+'px',
      'height' : '22px'
     });
    item.insert({ bottom: div} );

    // right top corner
    var div = new Element('div').update(" ");
    div.setStyle({
      'background': "url('/images/blokje/rechts.gif')",
      backgroundRepeat: 'no-repeat',
      'float': 'right',
      'width' : '23px',
      'height' : '22px'
     });
    item.insert({ bottom: div} );

    // left 
    var div = new Element('div', { 'id' : 'notifyleft'}).update(" ");
    div.setStyle({
      clear: 'both',
      'background': "url('/images/blokje/boven.gif')",
      backgroundRepeat: 'repeat-y',
      backgroundPosition: '0px -22px', 
      'float': 'left',
      'width' : '23px'
     });
    item.insert({ bottom: div} );
    
    // add the originial content
    item.insert({ bottom: contentdiv} );
    
    // right 
    var div = new Element('div', { 'id' : 'notifyright'} ).update(" ");
    div.setStyle({
      'background': "url('/images/blokje/boven.gif')",
      backgroundRepeat: 'repeat-y',
      backgroundPosition: 'right -22px', 
      'float': 'right',
      'width' : '23px'
     });
    item.insert({ bottom: div} );    
    
    // left bottom corner
    var div = new Element('div').update(" ");
    div.setStyle({
      clear: 'both',
      'background': "url('/images/blokje/links.gif')",
      backgroundRepeat: 'no-repeat',
      backgroundPosition: 'bottom left',
      'float': 'left',
      'width' : '23px',
      'height' : '22px'
     });
    item.insert({ bottom: div} );

    // middle bottom 
    var div = new Element('div').update(" ");
    div.setStyle({
      backgroundImage: "url('/images/blokje/boven.gif')",
      backgroundRepeat: 'repeat-x',
      backgroundPosition: 'bottom left',
      'float': 'left',
      'width': middlewidth+'px',
      'height' : '22px'
     });
    item.insert({ bottom: div} );

    // right bottom corner
    var div = new Element('div').update(" ");
    div.setStyle({
      'background': "url('/images/blokje/rechts.gif')",
      backgroundRepeat: 'no-repeat',
      backgroundPosition: 'bottom right',
      'float': 'right',
      'width' : '23px',
      'height' : '22px'
     });
    item.insert({ bottom: div} );    
    
    //var middleheight = $('notifycontent').getHeight();
    $('notifyleft').setStyle({
      'height': middleheight+'px'
    });
    $('notifyright').setStyle({
      'background': "url('/images/blokje/boven.gif')",
      backgroundRepeat: 'repeat-y',
      backgroundPosition: 'right -22px', 
      'float': 'right',
      'width' : '23px',
      'height': middleheight+'px'
    });
    
    // clear id's for content, left and right
    $('notifyleft').id = undefined;
    $('notifyright').id = undefined;

  });
}

Event.observe(document,'dom:loaded',createNotifyBlocks);