goog.provide('okamoto.HoverCard');
goog.provide('okamoto.Dialog');
goog.provide('okamoto.KeywordEditor');
goog.require('goog.ui.LabelInput');

/*
*********************************************
  HoverCard制御
*********************************************
*/
okamoto.getEAN = function(id){
  return id.replace(/^.*?_/, '');
}

okamoto.getTitle = function(ean){
  return $$('#product_' + ean + '>div>.details>.product_title>a')[0].innerHTML;
}

okamoto.HoverCard = {
  tweet: function(ean){
    var title = okamoto.getTitle(ean);
    var countdown = '';
    if($('countdown_' + ean) != null){
      countdown = ' 発売まで' + $('countdown_' + ean).innerHTML;
    }
    
    window.open(
      'http://twitter.com/share?url=' + 
      encodeURIComponent('http://dokusho.yumenosora.net/products/' + ean) +
      '&via=yumenosoranet' + 
      '&text=' + encodeURIComponent(title) + countdown +
      '&lang=ja'
    )
  },
  
  addIgnore: function(ean){
    var title = okamoto.getTitle(ean);
    if(confirm('「' + title + '」を非表示にしてよろしいですか？')){
      new Ajax.Request('/products/ignore', {
        method: 'POST',
        parameters: 'invisible=true&ean=' + ean + 
          '&_csrf=' + okamoto.CsrfToken,
        onSuccess: okamoto.HoverCard.ignoreSuccess,
        onFailure: okamoto.HoverCard.ignoreFailure
      });
      
      $('product_' + ean).fade({duration: 0.2, to: 0.5});
    }
  },
  
  ignoreSuccess: function(xhr){
    var ean = xhr.responseText;
    $('product_' + ean).fade({duration: 0.2});
    $('product_' + ean).slideUp({duration: 0.2});
  },
  
  ignoreFailure: function(xhr){
    alert('非表示設定に失敗しました。');
  },
  
  remove: function(ean, id){
    var title = okamoto.getTitle(ean);
    if(confirm('「' + title + '」を棚から削除してよろしいですか？')){
      new Ajax.Request('/shelfs/remove', {
        method: 'POST',
        parameters: 'id=' + id+ '&_csrf=' + okamoto.CsrfToken,
        onSuccess: okamoto.HoverCard.ignoreSuccess,
        onFailure: okamoto.HoverCard.removeFailure
      });
      
      $('product_' + ean).fade({duration: 0.2, to: 0.5});
    }
  }
}

/*
*********************************************
  タグ編集ダイアログ
*********************************************
*/
okamoto.Dialog = {
  show: function(ean){
    //位置設定
    var scrollPos = document.viewport.getScrollOffsets()[1];
    var screenWidth = document.viewport.getWidth();
    if(screenWidth == 0){
      screenWidth = document.body.clientWidth;
    }
    var screenHeight = document.viewport.getHeight();
    if(screenHeight == 0){
      screenHeight = document.body.clientHeight;
    }
    var top = scrollPos + screenHeight/2 - 40;
    var left = screenWidth/2 - 250;
    $('dialogBody').style.top = top + 'px';
    $('dialogBody').style.left = left + 'px';
    var height = screenHeight;
    if(height < $('doc2').getHeight()){
      height = $('doc2').getHeight();
    }
    $('dialogBackground').style.height = height + 'px';
    
    //ダイアログ内容の設定
    $('dialog_title').update(okamoto.getTitle(ean));
    $('dialog_image').src = 
      $$('#product_' + ean + '>div>.thumbnail>a>img')[0].src;
    var tagElements = 
      $$('#product_' + ean + '>div>.details>.shelf_tags>ul>li>a');
    var tags = [];
    for(var i = 0; i < tagElements.length; i++){
      tags.push(tagElements[i].innerHTML);
    }
    tags = ShelfUI.joinTags(tags);
    $('shelf_ui_tag_text').value = tags;
    ShelfUI.updateTagInsertUI(tags);
    $('shelf_update_ean').value = ean;
    $('dShelfButton').value = $('hcShelfButton_' + ean).value;
    
    $('dialogBackground').appear({
      duration: 0.2,
      to: 0.5,
      afterFinish: function(){
        $('dialogBody').appear({duration: 0.2});
      }
    });
  },
  
  hide: function(){
    $('dialogBody').fade({
      duration: 0.2,
      afterFinish: function(){$('dialogBackground').fade({duration: 0.2})}
    });
  },
  
  submit: function(){
    new Ajax.Request('/shelfs/add', {
      method: 'POST',
      parameters: Form.serialize('shelf_update_form'),
      onSuccess: okamoto.Dialog.success,
      onFailure: okamoto.Dialog.failure
    });
    
    $('dialogBody').fade({duration: 0.2, to: 0.5});
  },
  
  success: function(xhr){
    var ret = xhr.responseText.evalJSON();
    okamoto.Dialog.newTagList = ret;
    $('hcShelfButton_' + ret.ean).value = 'タグ編集';
    $('shelf_tags_' + ret.ean).fade({
      duration: 0.2,
      to: 0.1,
      afterFinish: function(){
        $('shelf_tags_' + ret.ean).update(okamoto.Dialog.newTagList.html);
        $('shelf_tags_' + ret.ean).appear({duration: 0.2});
        okamoto.Dialog.hide();
      }
    });
  },
  
  failure: function(){
    alert('タグの更新に失敗しました。');
    okamoto.Dialog.hide();
  }
}

/*
*********************************************
  貼り付けコード表示ダイアログ
*********************************************
*/
okamoto.GadgetDialog = {
  show: function(src){
    //位置設定
    var scrollPos = document.viewport.getScrollOffsets()[1];
    var screenWidth = document.viewport.getWidth();
    if(screenWidth == 0){
      screenWidth = document.body.clientWidth;
    }
    var screenHeight = document.viewport.getHeight();
    if(screenHeight == 0){
      screenHeight = document.body.clientHeight;
    }
    var top = scrollPos + screenHeight/2 - 40;
    var left = screenWidth/2 - 250;
    $('gadgetDialog').style.top = top + 'px';
    $('gadgetDialog').style.left = left + 'px';
    var height = screenHeight;
    if(height < $('doc2').getHeight()){
      height = $('doc2').getHeight();
    }
    $('dialogBackground').style.height = height + 'px';
    
    //ダイアログ内容の設定
    $('gadgetCode').value = $(src).value;
    
    $('dialogBackground').appear({
      duration: 0.2,
      to: 0.5,
      afterFinish: function(){
        $('gadgetDialog').appear({duration: 0.2});
      }
    });
  },
  
  hide: function(){
    $('gadgetDialog').fade({
      duration: 0.2,
      afterFinish: function(){$('dialogBackground').fade({duration: 0.2})}
    });
  }
}

/*
*********************************************
  キーワード登録画面
*********************************************
*/
okamoto.KeywordEditor = {
  States: {},
  previews: {},
  
  draw: function(){
    var self = okamoto.KeywordEditor;
    self.keywords.each(function(keyword){
      var e = self.createKeywordElement(keyword.value);
      $('keyword_list').appendChild(e);
    });
  },
  
  //キーワード編集ボックスを生成
  createKeywordElement: function(keyword){
    var self = okamoto.KeywordEditor;
    var li = new Element('li', {id: 'keyword_' + keyword.id});
    li.className = 'keyword_line';
    $('temporary').appendChild(li);
    
    //プレビュー用イベントハンドラ生成
    li.observe('mouseenter', self.preview);
    
    var form = new Element('form', {
      action: 'javascript:void(0)', 
      method: 'post',
      id: 'form_' + keyword.id});
    form.observe('onsubmit', okamoto.KeywordEditor.update);
    li.appendChild(form);
    var div = new Element('div');
    form.appendChild(div);
    
    var token = new Element('input', {
      type: 'hidden', 
      value: okamoto.CsrfToken,
      name: '_csrf'
    });
    div.appendChild(token);
    
    var input = new Element('input', {
      type: 'hidden', 
      value: keyword.id,
      name: 'id'
    });
    div.appendChild(input);
    
    var input = new Element('input', {
      id: 'keywordinput_' + keyword.id,
      type: 'text', 
      value: keyword.value,
      name: 'keyword'
    });
    input.className = 'keyword_input';
    div.appendChild(input);
    input.observe('focus', self.preview);
    input.observe('keyup', self.changeState);
    
    //カテゴリセレクタ
    var select = new Element('select', {
      id: 'keywordcategory_' + keyword.id,
      name: 'category'
    });
    div.appendChild(select);
    select.observe('focus', self.preview);
    select.observe('change', self.preview);
    select.observe('change', self.changeState);
    
    $H({
      'books': '書籍',
      'music': 'ポピュラー音楽',
      'classical': 'クラシック音楽',
      'vhs': 'ビデオ',
      'dvd': 'DVD',
      'software': 'ソフトウェア',
      'videogames': 'ゲーム'
    }).each(function(e){
      var option = new Element('option', {value: e.key}).update(e.value);
      if(keyword.category == e.key){
        option.selected = 'selected';
      }
      select.appendChild(option);
    });
    
    //ボタン類
    var buttons = new Element('div');
    buttons.className = 'button';
    div.appendChild(buttons);
    
    var button = 
      self.createButton('delete_' + keyword.id, '削除', self.remove);
    buttons.appendChild(button);
    button.observe('focus', self.preview);
    
    var button = 
      self.createButton('preview_' + keyword.id, 'プレビュー', self.preview);
    buttons.appendChild(button);
    button.observe('focus', self.preview);
    button.style.display = 'none';
    
    var button = self.createButton('update_' + keyword.id, '更新', 
      self.update, 'submit');
    buttons.appendChild(button);
    button.observe('focus', self.preview);
    button.style.display = 'none';
    
    return li;
  },
  
  //ボタン生成
  createButton: function(id, label, onclick, buttonType){
    if(buttonType == null){
      buttonType = 'button';
    }
    var c = new Element('div', {id: 'c-' + id});
    c.className = 'cute-button';
    var i = new Element('input', {value: label, type: buttonType, id: id});
    i.className = 'button';
    i.observe('click', onclick);
    c.appendChild(i);
    
    return c;
  },
  
  
  /*
    キーワードのプレビュー実行
    プレビュー用データから引き、存在しなければXHRで取得する
  */
  preview: function(){
    var id = this.id.replace(/^.+?_/, '');
    var keyword = $('keywordinput_' + id).value;
    var category = $('keywordcategory_' + id).value;
    var self = okamoto.KeywordEditor;
    var key = keyword + '_' + category;
    
    if(self.nowKeyOfPreview != key){
      self.nowKeyOfPreview = key;
      //選択中のキーワードを示すためのクラス名を付け替え
      var selected = $$('.keyword_line.selected')[0]
      if(selected != null){
        selected.className = 'keyword_line';
      }
      $('keyword_' + id).className = 'keyword_line selected';
      //プレビューの位置調整
      var keywordPos = $('keyword_' + id).positionedOffset();
      var previewTop = $($('preview').parentNode).positionedOffset();
      var offset = document.viewport.getScrollOffsets()[1] - previewTop.top;
      if(offset < 0){
        offset = 0;
      }
      $('preview').style.marginTop = offset + 'px';
      
      var preview = self.previews[key];
      if(preview == null){
        $('preview_wait').appear({duration: 0.2});
        //プレビュー用データが存在しないので取得する
        new Ajax.Request('/keywords/preview', {
          method: 'post',
          parameters: 'keyword=' + keyword + '&category=' + category + 
            '&_csrf=' + okamoto.CsrfToken,
          onSuccess: self.previewRetrieved,
          onFailure: self.addKeywordFailure
        });
        
      }else{
        self.displayPreview(preview);
      }
    }
  },
  
  changeState: function(){
    var id = this.id.replace(/^.+?_/, '');
    var self = okamoto.KeywordEditor;
    var orig = self.keywords.get(id);
    var keyword = $('keywordinput_' + id).value;
    var category = $('keywordcategory_' + id).value;
    if(orig.value != keyword || orig.category != category){
    
      self.States[id] = true;
      
      $('c-preview_' + id).appear({duration: 0.2});
      $('c-update_' + id).appear({duration: 0.2});
    }else{
      self.States[id] = null;
      
      $('c-preview_' + id).fade({duration: 0.2});
      $('c-update_' + id).fade({duration: 0.2});
    }
  },
  
  //プレビューデータの取得完了
  previewRetrieved: function(xhr){
    var response = xhr.responseText.evalJSON();
    var self = okamoto.KeywordEditor;
    self.previews[response.keyword + '_' + response.category] = 
      response.html;
    self.displayPreview(response.html);
  },
  
  //キーワード更新
  update: function(){
    var id = this.id.replace(/^.+?_/, '');
    var self = okamoto.KeywordEditor;
    $('keyword_' + id).fade({duration: 0.2, to: 0.1});
    
    new Ajax.Request('/keywords/update', {
      method: 'post',
      parameters: Form.serialize('form_' + id),
      onSuccess: self.updateKeywordSuccess,
      onFailure: self.addKeywordFailure
    });
    
    return false;
  },
  
  //キーワード削除
  remove: function(){
    var id = this.id.replace(/^.+?_/, '');
    var self = okamoto.KeywordEditor;
    
    new Ajax.Request('/keywords/delete', {
      method: 'post',
      parameters: Form.serialize('form_' + id),
      onSuccess: self.deleteKeywordSuccess,
      onFailure: self.deleteKeywordFailure
    });
    
    return false;
  },
  
  deleteKeywordSuccess: function(xhr){
    var id = xhr.responseText;
    $('keyword_' + id).fade(
      {afterFinish: function(){$('keyword_' + id).remove();}}
    );
    self.States[id] = null;
    self.keywords.unset(id);
  },
  
  deleteKeywordFailure: function(xhr){
  
  },
  
  displayPreview: function(src){
    $('preview_wait').fade({duration: 0.2});
    $('preview_body').fade({
      to: 0.1,
      duration: 0.2,
      afterFinish: function(){
        $('preview_body').innerHTML = src;
        $('preview_body').appear({duration: 0.2});
      }
    });
  },
  
  //キーワード追加の通信
  addKeyword: function(){
    var self = okamoto.KeywordEditor;
    new Ajax.Request('/keywords/create', {
      method: 'post',
      parameters: Form.serialize($("add_keyword_form")),
      onSuccess: self.addKeywordSuccess,
      onFailure: self.addKeywordFailure
    });
    
    $('keyword_new').fade({to: 0.2, duration: 0.2});
  },
  
  
  addKeywordSuccess: function(xhr){
    var self = okamoto.KeywordEditor;
    var response = xhr.responseText.evalJSON();
    
    //キーワード編集フォームを追加
    var e = self.createKeywordElement(response);
    $('keyword_list').insert({top: e});
    
    //プレビュー用データを追加
    var key = response.keyword + '_' + response.category;
    self.previews[key] = response.html;
    self.displayPreview(response.html);
    
    self.keywords.set(response.id, response);
    
    //追加フォームのクリア、再表示
    $('keywordinput_new').value = '';
    $('keyword_new').appear({duration: 0.2});
    $('keywordinput_new').focus();
  },
  
  addKeywordFailure: function(){
  
  },
  
  //登録していないキーワードのプレビュー
  newKeywordPreview: function(){
    var self = okamoto.KeywordEditor;
    new Ajax.Updater('preview_body', '/keywords/preview', {
      method: 'post',
      parameters: Form.serialize($("add_keyword_form")),
      onSuccess: self.newKeywordPreviewSuccess,
      onFailure: self.newKeywordPreviewFailure
    });
  },
  
  updateKeywordSuccess: function(xhr){
    var self = okamoto.KeywordEditor;
    var response = xhr.responseText.evalJSON();
    
    //プレビュー用データを追加
    var key = response.value + '_' + response.category;
    self.previews[key] = response.html;
    if(self.nowKeyOfPreview != key){
      self.displayPreview(response.html);
    }
    
    self.keywords.set(response.id, response);
    
    self.States[response.id] = null;
    
    $('c-preview_' + response.id).fade({duration: 0.2});
    $('c-update_' + response.id).fade({duration: 0.2});
    $('keyword_' + response.id).appear({duration: 0.2});
  },
  
  updateKeywordFailure: function(xhr){
  
  }
}