/*
photoeffect.js v1.2 by martin $ 2007/10/07 17:54:00
Copyright (c) 2007, martin. http://p2b.jp
Usage:
 main-className: photo-effect
  sub-className: photo-frame (default)
                 stamp-frame
                 photo-angle[from -360 to 360]
  e.g. <img src="foo.jpg" alt="photo-effect" class="photo-effect photo-angle5" />
  ** Recommended `photo-angle` is -5 to 5.
*/

if(document.namespaces){
 if(!document.namespaces['v']){
//  document.namespaces.add('v', 'urn:schemas-microsoft-com:vml'); 
//  document.createStyleSheet().addRule('v\\:*', 'behavior: url(#default#VML);');
    document.namespaces.add("v", "urn:schemas-microsoft-com:vml", "#default#VML");  
 }
}

photoEffect = {
 reload : 0,
 framed : false,
 imgs : [],
 init : function(){
  var d = document, nodes = [], item;
  try {
   var xp = d.evaluate(
    './/img[contains(concat(" ", @class, " "), " photo-effect ")]',
    d, null, 0, null
   );
   for (item = xp.iterateNext(); item; item = xp.iterateNext()){
    nodes.push(item);
   }
  } catch(e){
   var node, cls, items = d.getElementsByTagName('IMG');
   for(var i = 0, l = items.length; i < l; i++){
    item = items[i];
    if(item.className){
     cls = item.className.split(/\s+/);
     for(var j = 0, k = cls.length; j < k; j++){
      if(cls[j]=='photo-effect'){
       nodes[nodes.length] = item; break;
      }
     }
    }
   }
  }
  if(nodes.length){
   if(!photoEffect.photoframe){
    photoEffect.photoframe = new Image();
    photoEffect.photoframe.src = 'Images/photoeffect/photoframe.png'; 
   }
   for(var i = 0, l = nodes.length; i < l; i++){
    node = nodes[i];
    if(node.className.indexOf('stamp-frame') >= 0){
     if(!photoEffect.stampframe){
      photoEffect.stampframe = new Image();
      photoEffect.stampframe.src = 'Images/photoeffect/stampframe.png';
     }
    }
    try {
     photoEffect.imgs.push(node);
    } catch (e) {};
   }
  } else return;
  photoEffect.check(1000);
 },
 check : function(limit){ 
  var _timer_photoEffect = setInterval(function(){
   if(photoEffect.stampframe){
    if(photoEffect.stampframe.width && photoEffect.photoframe.width) photoEffect.framed = true;
   } else {
    if(photoEffect.photoframe.width) photoEffect.framed = true;
   }
   if(photoEffect.framed){
    clearInterval(_timer_photoEffect);
    photoEffect.fire();
   }
   if(photoEffect.reload >= limit){
    clearInterval(_timer_photoEffect);
   }
   photoEffect.reload++;
  }, 10);
 },
 fire : function(){
  var d = document, img, iw, ih, rot, arot, ar, ab, bx, by, fw, fh, w, h, frame, canvas, cntxt;
  for (var i = 0, len = photoEffect.imgs.length; i < len; i++){
   img = photoEffect.imgs[i];
   iw = img.width; ih = img.height;
   rot = img.className.match(/photo-angle(\-?\d+)/);
   rot = rot ? Math.PI*rot[1]/180 : 0;
   arot = Math.abs(rot);
   frame = d.namespaces ? d.createElement('v:image') : new Image();
   if(img.className.indexOf('stamp-frame') != -1){
    ar = 1.02; ab = 0.85;
    frame.src = photoEffect.stampframe.src
   } else {
    ar = 1.07; ab = 0.7;
    frame.src = photoEffect.photoframe.src;
   }
   bx = parseInt(Math.sqrt(iw) * ab); by = parseInt(Math.sqrt(ih) * ab);
   fw = iw + 2 * bx; fh = Math.round((ih + by) * ar) + by;
   w = fw * Math.cos(arot) + fh * Math.sin(arot);
   h = fw * Math.sin(arot) + fh * Math.cos(arot);
   
   if(d.namespaces){
    var dx = dy = 0;
    canvas = d.createElement('<v:* style="width:'+w+'px; height:'+h+'px;">');
    if(rot > 0){ dx = fh * Math.sin(rot); dy = 0;}
    if(rot < 0){ dx = 0; dy = fw * Math.sin(arot);}
    canvas.innerHTML = '<v:group style="display:inline-block; position:relative; width:'+w+'px; height:'+h+'px; rotation:'+(180*rot/Math.PI)+';" coordsize="'+w+','+h+'"><v:image src="'+frame.src+'" style="position:absolute; left:'+dx+'px; top:'+dy+'px; width:'+fw+'px; height:'+fh+';"></v:image><v:image src="'+img.src+'" style="position:absolute; left:'+(bx+dx)+'px; top:'+(by+dy)+'px; width:'+iw+'px; height:'+ih+';"></v:image></v:group>';
    canvas.style.cssText = img.style.cssText;
    canvas.title = img.title;
    img.parentNode.replaceChild(canvas, img);
   } else {
    canvas = d.createElement('canvas');
    canvas.style.cssText = img.style.cssText;
    canvas.title = img.title;
    canvas.height = h; canvas.style.height = h + 'px';
    canvas.width = w; canvas.style.width = w + 'px';
    cntxt = canvas.getContext('2d');
    if(rot > 0) cntxt.translate(fh * Math.sin(rot), 0);
    if(rot < 0) cntxt.translate(0, fw * Math.sin(arot));
    if(rot != 0) cntxt.rotate(rot);
    img.parentNode.replaceChild(canvas, img);
    cntxt.drawImage(frame, 0, 0, fw, fh);
    cntxt.drawImage(img, bx, by, iw, ih);
   }
   if(img.getAttribute('onclick') != ''){
    canvas.setAttribute('onclick', img.getAttribute('onclick'));
   }
  }
 }
}

