jslous.noConflict();
var js = jslous;
js(function(){
 var prv = false;
 js('a.photozoom').click(function(evt){
   if(document.getElementById('photoframe')){ document.getElementById('photoframe').parentNode.removeChild(document.getElementById('photoframe')); }
   var trg = jslous.Event.target(evt);
   while(trg.tagName.toLowerCase() != 'a'){ trg = trg.parentNode; }
   var source = trg.getAttribute('href');
   var frame =  document.createElement('div');
   frame['id'] = 'photoframe';
   var zoom = document.createElement('img');
   zoom['src'] = source;
   jslous.css.setstyle(frame,'position','absolute');
   jslous.css.opacity(frame,0);
   frame.appendChild(zoom);
   document.body.appendChild(frame);
   var starttop = jslous.Event.clientY(evt);
   var startleft = jslous.Event.clientX(evt);
   var photozoom = function(evt){   
    var height = parseInt(jslous.css.current(frame,'height')),width = parseInt(jslous.css.current(frame,'width'));
    var totop = (jslous.size.scrollTop() > 0 ? ((jslous.size.clientHeight()-height)/2)+jslous.size.scrollTop():((jslous.size.clientHeight()-height)/2)+50);
    var toleft = (jslous.size.scrollLeft() > 0 ? ((jslous.size.clientWidth()-width)/2)+jslous.size.scrollLeft():((jslous.size.clientWidth()-width)/2)+50);
    jslous.css.setstyles(frame,{left:startleft+'px',top:starttop+'px',height:0+'px',width:0+'px'});
    jslous.func.motion.Listener(frame.style,{
     time:0.3,
     effect:'circin',
     top:{from:starttop,to:totop,unit:'px'},
     height:{from:0,to:height,unit:'px'},
     left:{from:startleft,to:toleft,unit:'px'},
     width:{from:0,to:width,unit:'px'},
     opacity:{from:0,to:100,unit:''},
     'border-width':{from:0,to:4,unit:'px'},
     comp:function(){
      var styles = {top:totop+'px',height:height+'px',left:toleft+'px',width:width+'px','border-width':4+'px'}
      jslous.css.setstyles(frame,styles);
      
      jslous.Event.Listener(frame,'mousedown',function(evt){
       jslous.func.motion.Listener(frame.style,{
       
        time:0.3,
        effect:'circout',
        top:{from:totop,to:starttop,unit:'px'},
        height:{from:height,to:0,unit:'px'},
        left:{from:toleft,to:startleft,unit:'px'},
        width:{from:width,to:0,unit:'px'},
        opacity:{from:100,to:0,unit:''},
        'border-width':{from:4,to:0,unit:'px'},
        comp:function(){
         var styles = {top:starttop+'px',height:0+'px',left:startleft+'px',width:0+'px','border-width':0+'px'}
         jslous.css.setstyles(frame,styles);
         jslous.css.opacity(frame,0);
         if(document.getElementById('photoframe')){ document.getElementById('photoframe').parentNode.removeChild(document.getElementById('photoframe')); }
        }
       });
      });  
     }
    });
   
   }
   jslous.Event.preventDefault(evt);
   if(!jslous.Agents.ie){
    jslous.Event.Listener(zoom,'load',photozoom);
   }else{
    if(zoom.readyState == 'complete'){ return photozoom(); }
    zoom.onreadystatechange = function(){ if(zoom.readyState == 'complete'){ return photozoom(); } }
   }
   
   
  }).query('img.thumbnail').click(function(evt){
  if(document.getElementById('float')){ document.body.removeChild(document.getElementById('float')); }
  var trg = jslous.Event.target(evt);
  while(trg.tagName.toLowerCase() != 'img'){ trg = trg.parentNode; }
  var targetbox = document.createElement('div');
  targetbox['id'] = 'float';
  jslous.css.setstyles(targetbox,{'display':'block','background-color':'#CCCCCC'});
  jslous.css.opacity(targetbox,100);
  var close = document.createElement('span');
  close['id'] = 'btn';
  close.innerHTML = '閉じる';
  targetbox.appendChild(close);
  var image = document.createElement('img');
  image['id'] = 'display';
  image.src = trg.src;
  jslous.css.opacity(image,0);
  targetbox.appendChild(image);
  var comments = document.createElement('p');
  comments['id'] = 'comments';
  comments.innerHTML = trg.parentNode.getElementsByTagName('p')[0].innerHTML;
  targetbox.appendChild(comments);
  document.body.appendChild(targetbox);
  var height = targetbox.offsetHeight;
  var width = 600;
  jslous.css.setstyles(targetbox,{width:0+'px',height:0+'px','border-width':0+'px'});
  var starttop = jslous.Event.clientY(evt);
  var startleft = jslous.Event.clientX(evt);
  var totop = (jslous.size.scrollTop() > 0 ? ((jslous.size.clientHeight()-height)/2)+jslous.size.scrollTop():((jslous.size.clientHeight()-height)/2)+50);
  var toleft = (jslous.size.scrollLeft() > 0 ? ((jslous.size.clientWidth()-width)/2)+jslous.size.scrollLeft():((jslous.size.clientWidth()-width)/2)+50);
  jslous.css.setstyles(targetbox,{left:startleft+'px',top:starttop+'px'});
  jslous.func.motion.Listener(targetbox.style,{
   time:0.25,
   effect:'liner',
   top:{from:starttop,to:totop,unit:'px'},
   height:{from:0,to:height,unit:'px'},
   left:{from:startleft,to:toleft,unit:'px'},
   width:{from:0,to:width,unit:'px'},
 //  opacity:{from:0,to:100,unit:''},
   'border-width':{from:0,to:4,unit:'px'},
   comp:function(){
    jslous.css.setstyles(targetbox,{top:totop+'px',height:height+'px',left:toleft+'px',width:width+'px','border-width':4+'px'});
    jslous.css.opacity(targetbox,100);
    jslous.func.motion.Listener(targetbox.style,{
     time:0.15,
     effect:'circin',
     'background-color':{from:'#CCCCCC',to:'#FFFFFF',unit:''},
     a:{from:0,to:100,unit:''},
     upd:function(){ jslous.css.opacity(image,parseInt(this.target.a)); },
     comp:function(){
      jslous.css.opacity(image,100);
      jslous.css.setstyle(targetbox,'background-color','#FFFFFF');
     }
    });
    jslous.Event.Listener(close,'mousedown',function(evt){
     jslous.css.opacity(image,0);
     jslous.func.motion.Listener(targetbox.style,{
      time:0.2,
      effect:'circout',
      top:{from:totop,to:starttop,unit:'px'},
      height:{from:height,to:0,unit:'px'},
      left:{from:toleft,to:startleft,unit:'px'},
      width:{from:width,to:0,unit:'px'},
    //  opacity:{from:100,to:0,unit:''},
      'border-width':{from:4,to:0,unit:'px'},
      comp:function(){
       jslous.css.setstyles(targetbox,{top:starttop+'px',height:0+'px',left:startleft+'px',width:0+'px','border-width':0+'px'});
      // jslous.css.opacity(targetbox,0);
       if(document.getElementById('float')){ document.body.removeChild(document.getElementById('float')); }
      }
     });
    });
    
   }
  });
 }).query('img.screenthumb').over(function(evt){
  var trg = jslous.Event.target(evt);
  while(trg.tagName.toLowerCase() != 'img'){ trg = trg.parentNode; }
  if(document.getElementById('screen')){ document.getElementById('screen').src = trg.src; }
 }).query('a.print').click(function(evt){
  var trg = jslous.Event.target(evt);
  while(trg.tagName.toLowerCase() != 'a'){ trg = trg.parentNode; }
  jslous.popup.open(trg.href,{width:650,height:700});
  jslous.Event.preventDefault(evt);
 });
});
