function start_slide(e){
    var url = e.href;
    $('<div>').css({
        height: '200%',
        width: '200%',
        position: 'absolute',
        top: 0,
        left: 0,
        opacity: 0,
        backgroundColor: "#000000",
        zIndex: 1000
    }).appendTo(document.body)
      .animate({opacity: 1 }, 500, function(){
            location.href = url;
        })
    return false;
}

function album_path(){
    if (!this._album_path) {
        this._album_path = $('h2 a').attr('href');
    }
    return this._album_path;
}
function toggle_mode(mode){
  var desc_divs = $('div.description');
  var current_mode = $('div.photo_wrapper')[0].className.match("thumb") ? "thumb" : "detail";
  if (mode == current_mode) {
    return;
  }

  $('img.user_img').each(function(){
    var img = this;
    var size = $(img).parent().parent().find('span.size')[0].innerHTML.split("x");
    var width = Number(size[0]);
    var height = Number(size[1]);

    img.width = mode=='thumb' ? 80 : calc_size(width, height, 240)[0];
    img.height = mode=='thumb' ? 80 : calc_size(width, height, 240)[1];

    var query = img.src.match(/(\?\d+)$/) ? RegExp.$1 : "?"+new Date().getTime();
    var permalink = $(img).parent().attr('href');
    img.src = '/img' + permalink.replace(/\/user\/[^\/]+/,'').replace(/photo\/(\d+)$/, '$1_'+mode+'.jpg') + query;

    img.className = 'user_img user_img_'+mode;
  });

  $('#mode2'+current_mode).attr('className', 'inactive');
  $('#mode2'+mode).attr('className', 'active');
  $('div.photo_wrapper').attr("className", 'photo_wrapper mode_'+mode);

  set_height(mode);

  $.cookie('mode', mode, {path: '/'});
}

function calc_size(width,height,max){
  var w = (width > height ? max : max*width/height);
  var h = (height > width ? max : max*height/width);
  return [w,h]
}

function set_height(mode){
  if (mode == 'detail') {
    $('div.timeline_photo').each(function(){
      var div = this;
      var tmp = [];
      var max = 0;
      $(div).find('img.user_img').each(function(){
        if (max < this.height) {
          max = this.height;
        }
        tmp.push(this.parentNode.parentNode);
        if (tmp.length == 3) {
          var height = (max+99)+'px';
          var wraps = tmp;
            $.each(wraps, function(){
              //this.className = 'photo_wrapper mode_detail';
              this.style.height = height;
            });
          tmp = [];
          max  = 0;
        }
      });
      $(tmp).each(function(){
        //this.className = 'photo_wrapper mode_detail';
        this.style.height = (max+79)+'px';
      });
    });
  } else {
    $('div.photo_wrapper').each(function(){
      //this.className = 'photo_wrapper mode_thumb';//).attr('className','photo_wrapper mode_thumb')
      $(this).css('height', '97px');
    });
  }
}

function CoverImage(el, img){
  var self = this;
  self.target = typeof el === 'string' ? $('#'+el)[0] : el;

  self.canvas = document.createElement('canvas');
  $(self.canvas).attr({width: 135, height: 132});
  $(self.target).find('.canvas').append(self.canvas);

  self.img =  img;
  self.base = new Image();
  self.base.onload = function(){ self.init() };
  var timestamp = new Date().getTime();
  self.base.src = '/images/album/album_thumb_base.jpg?'+ timestamp;
};
CoverImage.prototype = {
  init: function(){
    try{
        var self = this;
        if (document.uniqueID) {
            self.canvas = G_vmlCanvasManager.initElement(self.canvas);
        }

        if ($('#save_cover').size()) {
            $('#save_cover').click(function(){self.save()});
        }

        self.ctx = self.canvas.getContext('2d');
        self.ctx.translate(self.canvas.width/2, self.canvas.height/2);
        self.ctx.drawImage(self.base, -self.base.width/2, -self.base.height/2);
        self.drawImg();
    } catch(e) {
        //alert(e);
    }
  },
  drawImg: function(){
    var self = this;
    var offset_top = -38;
    var offset_left = -32;
    var cover_width = 69;
    for (var i=0;i<cover_width;i++){
      self.ctx.drawImage(self.img, i*80/cover_width, 0, 80/cover_width, 80, offset_left+i, offset_top-i*0.12, 1, 75);
    }
  },
  save: function(){
    var self = this;
    if (self.img.src.match(new RegExp("^https?://[^/]+/img(/[^/]+/\\d+)(/\\d+)_thumb\\.jpg"))) {
      var url = RegExp.$1+'/photo'+RegExp.$2+'/to_cover';
    } else {
      return;
    }
    var loading = new Image();
    loading.src = '/images/common/loading.gif';
    $('#util').html('').append(loading);
    $.post(url, {authenticity_token: auth_token()}, function(data){
      if (data == 'failed') {
        alert('表紙生成に失敗しました。');
      } else {
        location.href = '/manage/albums/';
      }
    });
  }
};

function RotateImage(el, img){
  var self = this;
  self.target = typeof el === 'string' ? $('#'+el)[0] : el;
  self.canvas = document.createElement('canvas');
  $(self.canvas).attr({width: 340, height: 340});

  $(self.target).find('.canvas').append(self.canvas);
  self.img =  new Image();
  self.url = ($('#permalink')[0] ? $('#permalink').text().replace('http://30d.jp/','/') : $(img).parent()[0].href.replace(/user\/[^\/]+\//,'')) + '/rotate';
  self.angle = 0;
  self.rotating = false;
  self.img = img;
  self.init();
};
RotateImage.prototype = {
  rotate: function(angled){
    var self = this;

    if (self.rotating) {
      return;
    }

    var stop_angle = self.angle + angled;
    var delta = $.browser.msie ? angled : angled / 10;

    var d2r =  function(d){
      return Math.PI * d / 180;
    }

    self.rotating = true;
    var timer = setInterval(function(){
      self.clear();
      self.angle += delta;
      self.ctx.rotate(d2r(self.angle));
      self.drawImg();
      if (self.angle == stop_angle) {
        clearInterval(timer);
        self.clear();
        self.ctx.rotate(d2r(stop_angle));
        self.drawImg();
        self.rotating = false;
      }
    }, 1)
  },
  clear: function(){
    var self = this;
    self.ctx.restore();
    self.ctx.clearRect(0,0, self.canvas.width, self.canvas.height);
    self.ctx.save();
    self.ctx.translate(self.canvas.width/2, self.canvas.height/2);
  },
  init: function(){
    var self = this;
    if (document.uniqueID) {
      self.canvas = G_vmlCanvasManager.initElement(self.canvas);
    }
    self.ctx = self.canvas.getContext('2d');
    self.ctx.save();

    self.ctx.translate(self.canvas.width/2, self.canvas.height/2);
    self.drawImg();

    $('#rotate_left').click(function(){self.rotate(-90)});
    $('#rotate_right').click(function(){self.rotate(90)});
    $('#save_rotation').click(function(){self.save()});
  },
  drawImg: function(){
    var self = this;
    if (self.img.width > 240 || self.img.height > 240) {
      var size = calc_size(self.img.width, self.img.height, 240)
      self.ctx.drawImage(self.img, -size[0]/2, -size[1]/2, size[0], size[1]);
    } else {
      self.ctx.drawImage(self.img, -self.img.width/2, -self.img.height/2);
    }
  },
  save: function(){
    var self = this;
    var angle = self.angle % 360;
    if (angle == 0) {
      alert('角度が変わっていません');
      return;
    }

    var loading = new Image();
    loading.src = '/images/common/loading.gif';
    $('#util').html('').append(loading);

    $.post(self.url, { angle: angle, authenticity_token: auth_token() }, function(data){
      if (data == 'failed') {
        alert('画像の回転に失敗しました');
      } else {
        if (Math.abs(angle) != 180) {
          var tmp = self.img.width;
          self.img.width = self.img.height;
          self.img.height = tmp;
          $(self.img).parent().parent().find('span.size').html([self.img.width,self.img.height].join("x"));
        }
        self.img.src = self.img.src.replace(/(\?\d+)?$/, '?' + new Date().getTime());
        set_height('detail');
        $.facebox.close();

        if(typeof callback_for_album_show === "function"){
            callback_for_album_show(angle);
        }
      }
    });
  }
};

function start_edit_angle(el){
  var img = $('#center')[0] || $(el).parent().parent().parent().find('img.user_img')[0];

    if(img.src.match("deleted")){
        alert("既に削除された写真です");
        return;
    }
    if(typeof KObserver !== 'undefined'){
        KObserver.removekeybind();
    }

  var html = [
   '<div id="edit_area">',
      '<table cellspacing="0" cellpadding="0" border="0" class="canvas_table"><tr>',
      '<td style="padding-right:10px;">',
      '<img src="/images/album/rotate_left.gif" id="rotate_left" />',
      '</td>',
      '<td class="canvas" style="border:1px solid #CCC;">',
      '</td>',
      '<td style="padding-left:10px;">',
      '<img src="/images/album/rotate_right.gif" id="rotate_right" />',
      '</td>',
      '</tr></table>',
      '<div id="util">',
      '<input type="image" src="/images/album/btn_save.gif" id="save_rotation" />',
      ' <input type="image" src="/images/album/btn_cancel.gif" id="cancel_edit" />',
      '</div>',
      '<div class="edit_help"><strong>まとめて写真を回転するには一括編集機能が便利です。</strong><br />表示形式を一覧表示にして、ページ右上の「一括編集」タブから利用できます。</div>',
   '</div><!-- //edit_area -->'
   ].join("");
   $.facebox(html);
   $("#cancel_edit").click(function(){ $.facebox.close() });
   new RotateImage($('#edit_area')[0], img);
}

function start_edit_time(el){
  var img = $('#center')[0] || $(el).parent().parent().parent().find('img.user_img')[0];
  var url = ($('#permalink')[0] ? $('#permalink').text().replace('http://30d.jp/','/') : $(img).parent()[0].href).replace(/user\/[^\/]+\//,'') + '/set_datetime';

  if(img.src.match("deleted")){
    alert("既に削除された写真です");
    return;
  }
  if(typeof KObserver !== 'undefined'){
    KObserver.removekeybind();
  }

  var match;
  if (img.src.match('_detail')) {
      var d = new Date();
      d.setTime($(img).parent().parent().find('span.datetime').text())
      var datetime = [d.getFullYear(),d.getMonth()+1,d.getDate(),d.getHours(),d.getMinutes(),d.getSeconds()];
  } else if (match=$('#datetime')[0].nextSibling.nodeValue.match(/^\D+(\d+)\/(\d+)\/(\d+)\D+(\d+):(\d+):(\d+)$/)){
    match.shift();
    var datetime = match;
  }
  var src = img.src.replace(/_detail|_large/,'_thumb');
  var html = [
    '<div id="edit_area">',
      '<div id="facebox_edit">',
      '<div class="left"><img src="', src ,'" /></div>',
      '<div class="right">',
        '<p>この写真の撮影時間を修正します。<br />修正したい日付・時間を入力してください</p>',
        '<div class="input_area">',
          '<div class="input_sp" id="edit_date">',
          '<input id="year" name="year" type="text" class="input_s" value="', datetime[0], '" style="width:40px" tabindex="100" onclick="this.focus()" onfocus="this.select()" />',
          ' / <input id="month" name="month" type="text" value="', datetime[1], '" class="input_s" style="width:24px" tabindex="101" onclick="this.focus()" onfocus="this.select()" />',
          ' / <input id="day" name="day" type="text" value="', datetime[2], '" class="input_s" style="width:24px" tabindex="102" onclick="this.focus()" onfocus="this.select()" />',
          '&nbsp;&nbsp;<input id="hour" name="hour" type="text" value="', datetime[3], '" class="input_s" style="width:24px" tabindex="103" onclick="this.focus()" onfocus="this.select()" />',
          ' : <input id="minute" name="minute" type="text" value="', datetime[4], '" class="input_s" style="width:24px" tabindex="104" onclick="this.focus()" onfocus="this.select()" />',
          ' : <input id="second" name="second" type="text" value="', datetime[5], '" class="input_s" style="width:24px" tabindex="105" onclick="this.focus()" onfocus="this.select()" />',
          '</div>',
          '<input id="change_time" type="image" src="/images/album/btn_change.gif" tabindex="106" />',
        '</div>',
      '</div><!-- //right -->',
      '</div><!-- //facebox_edit -->',
      '<div class="edit_help"><strong>まとめて撮影時間を調整するには一括編集機能が便利です。</strong><br />表示形式を一覧表示にして、ページ右上の「一括編集」タブから利用できます。</div>',
    '</div><!-- //edit_area -->'
  ].join("");
  $.facebox(html);
  $('#change_time').click(function(){
    var params = $('div.input_sp input').map(function(){
      return this.value;
    }).get();
    if (!params.join("").match(/^[０-９\d]+$/)) {
      alert("数字で入力してください");
      return;
    }
    var params = {}
    $('div.input_sp input').each(function(){
      params[this.name] = this.value;
    });
    params['authenticity_token'] = auth_token();
    $.post(url, params, function(data){
      if (data == 'failed') {
        alert('時刻の変更に失敗しました。')
      } else {
        $.facebox.close()
        var ymd = [ params["year"] , params["month"]  , params["day"] ].join("/");
        var hms = [ params["hour"] , params["minute"] , params["second"] ].join(":");
        if(typeof callback_for_start_edit_time === "function"){
            var new_datetime = "　" + ymd + " " + hms;
            callback_for_start_edit_time(new_datetime);
        } else {
          $(img).parent().parent().find('span.datetime').text(new Date(params.year, params.month-1, params.day, params.hour, params.minute, params.second).getTime());
          $(img).parent().parent().find('div.description span.time').addClass('shifted').text(ymd+" "+hms);
          setTimeout(function(){$(img).parent().parent().find('div.description').highlight()}, 500)
        }
      }
    });
  });
}

function start_delete(el){
  var img = $('#center')[0] || $(el).parent().parent().parent().find('img.user_img')[0];
  var url = ($('#permalink')[0] ? $('#permalink').text().replace('http://30d.jp/','/') : $(img).parent()[0].href.replace(/user\/[^\/]+\//, '')) + '/delete';

  if(img.src.match("deleted")){
    alert("既に削除された写真です");
    return;
  }
    if(typeof KObserver !== 'undefined'){
        KObserver.removekeybind();
    }

  var src = img.src.replace(/_detail|_large/,'_thumb');
  var html = [
    '<div id="edit_area">',
      '<div id="facebox_edit">',
      '<div class="left"><img src="', src, '" /></div>',
      '<div class="right">'
      ].join("");
  if (album_owner) {
    html = [html,
          '<p><strong>この写真を削除しますか?</strong><br />アルバム管理者でログイン中ですので、削除用パスワード入力の必要はありません</p>',
          '<div class="input_area">',
            '<div class="input_sp">',
            '<input id="delete" type="image" src="/images/album/btn_delete.gif" tabindex="2" />',
            '</div>',
          '</div>'
    ].join("")
  } else {
    html = [html,
          '<p>この写真を削除するには、以下のどちらかのパスワードが必要です。</p>',
          '<ul>',
          '<li>この写真の削除パスワード（写真を追加した人）</li>',
          '<li>マイページのログインパスワード（このアルバムの管理者）</li>',
          '</ul>',
          '<div class="input_area">',
            'パスワードを入力',
            '<div class="input_sp">',
              '<input id="photo_password" type="text" class="input_s" tabindex="1" />',
            '</div>',
            '<input id="delete" type="image" src="/images/album/btn_delete.gif" tabindex="2" />',
          '</div>'
    ].join("")
  }
  html = [html,
      '</div><!-- //right -->',
      '</div><!-- //facebox_edit -->',
      '<div class="edit_help"><strong>まとめて写真を削除するには一括編集機能が便利です。</strong><br />表示形式を一覧表示にして、ページ右上の「一括編集」タブから利用できます。</div>',
    '</div><!-- //edit_area -->'
  ].join("");

  $.facebox(html);

  $('#delete').click(function(){
    var password = $('#photo_password').val();
    if (!album_owner && password.length < 1) {
      alert('パスワードを入力してください');
      return;
   }
    $.post(url, {password: password, authenticity_token: auth_token()}, function(data){
      if (data == 'failed') {
        alert('画像の削除に失敗しました。パスワードが間違っています。');
      } else {
        if (img.src.match('detail')) {

            $.facebox.close();

          var wrapper = $(img).parent().parent();
          if (wrapper.parent().parent().find('img').size() == 1) {
            wrapper.parent().parent().fadeOut('slow').remove();
          } else {
            wrapper.fadeOut('slow').remove();
          }
        } else {
            $.facebox.close();
            callback_for_start_delete();
        }
      }
    });
  });
}

function start_edit_cover(el){
  var img = $(el).parent().find('img')[0];

  var html = [
    '<div id="edit_area">',
      '<div class="page_center canvas">',
      '</div>',
      '<div id="util">',
      '<p style="margin-bottom:5px;">この画像をアルバムの表紙にする場合は<br />「変更する」ボタンをクリックしてください</p>',
      '<input type="image" src="/images/album/btn_change.gif" id="save_cover" />',
      ' <input type="image" src="/images/album/btn_cancel.gif" id="cancel_edit" />',
      '</div>',
    '</div><!-- //edit_area -->'
  ].join("");
  $.facebox(html);
  $("#cancel_edit").click(function(){$.facebox.close()})
  if ($.browser.msie && $.browser.version == 6) {
      setTimeout(function(){
          new CoverImage($('#facebox').find('#edit_area')[0], img);
      }, 1000)
  } else {
      new CoverImage($('#facebox').find('#edit_area')[0], img);
  }
}

function start_delete_comment(id){
    var url = $('#permalink').text().replace(/^http:\/\/[^\/]+\//,'/') + '/comments/' + id;

    if(typeof KObserver !== 'undefined'){
        KObserver.removekeybind();
    }


    if (album_owner) {
        var auth_html = 'このコメントを削除しますか？';
    } else {
        var auth_html = [
            'コメントの削除用パスワードを入力',
            '<div class="input_sp">',
            '<input type="password" class="input_s" tabindex="1" />',
            '</div>'
        ].join("")
    }

    var html = [
        '<div id="edit_area">',
        '<div id="facebox_edit">',
        '<div>',
        auth_html,
        '<div class="input_area">',
        '<input id="delete" type="image" src="/images/album/btn_delete.gif" tabindex="2" />',
        '</div>',
        '</div>',
        '</div>',
        '</div>'
    ].join("");

    $.facebox(html);

    $('#delete').click(function(){
        var password = $(this).parents('#facebox').find('input.input_s').val();
        if (!album_owner && password.length < 1) {
            alert('パスワードを入力してください');
            return;
        }
        $.post(url, {'_method': 'delete', password: password, authenticity_token: auth_token()}, function(data){
            if (data == 'failed') {
                alert('コメントの削除に失敗しました。パスワードが間違っています。');
            } else {
                $.facebox.close();
                $('#comment'+id).fadeOut('slow');
            }
        });
    });
}

function show_exif(el){
    $.facebox( $(el).parent().parent().find('.exif').html() );
}