var UserTags = {
  article_id: 0,
  config:{
    endpoint:'/api/article'
  },
  initialize: function () {
    if ( $('user_tags') ) {
      this.setupUserTagsField();
    }
    if ( $('add_user_tags') ) {
      this.setupAddUserTagsField();
    }
  },
  setupUserTagsField: function () {
    var user_tags = $('user_tags');
    var tags = this.deleteLineFeed(user_tags.innerHTML);
    user_tags.innerHTML = '';
    tags = this.parseTags(tags);
    for ( var i = 0; i < tags.length; i++ ) {
      if ( ! tags[i] ) { break; }
      user_tags.appendChild( this.setupTag( tags[i] ) );
      user_tags.appendChild( document.createTextNode('\n') );
    }
  },
  parseTags: function (tags) {
    return tags.replace(/(\s)/g, ' ').replace(/^(.*)\s+$/, "$1").split(' ');
  },
  setupTag: function (tag) {
    var ele = document.createElement('span');
    ele.id = 'user-tag-' + tag;
    ele.innerHTML = '<a href="javascript:void(0)" onclick="postUsertagForSearch(this); return false;">' + tag + '</a><a href="javascript:UserTags.destroy(\'' + this.htmlEscape(tag) + '\');"><img src="/images/icons/icon_del_tag.gif" alt="" width="12" height="12" /></a>';
    return ele;
  },
  setupAddUserTagsField: function () {
    $('add_user_tags').innerHTML = '<form id="add_user_form" onsubmit="UserTags.add(this); return false;"><input type="text" name="tag" id="add_user_tag_text" class="addTxt" /><input type="submit" value="追加" class="addTag" /></form>';
  },
  getTagsToHash: function () {
    $('user_tags').innerHTML = this.deleteLineFeed($('user_tags').innerHTML);
    var tags = $('user_tags').childNodes;
    var hash = {};
    for ( var i = 0; i < tags.length; i++ ) {
      var tag_name = tags[i].id.replace(/user-tag-/,'');
      hash[tag_name] = 1;
    }
    return hash;
  },
  addUserTag: function (tag) {
    var user_tags = $('user_tags');
    var tags = this.parseTags(tag);
    var exists_tags = this.getTagsToHash();
    for ( var i = 0; i < tags.length; i++ ) {
      if ( ! exists_tags[tags[i]] ) {
        user_tags.appendChild( this.setupTag( tags[i] ) );
      }
    }
    user_tags.innerHTML = user_tags.innerHTML.replace(/<\/span>/g,'</span>\n');
  },
  deleteUserTag: function (tag) {
    var exists_tags = this.getTagsToHash();
    $('user_tags').innerHTML = $('user_tags').innerHTML.replace(/<\/span>/g,'</span>\n');
    if ( exists_tags[tag] ) {
      $('user-tag-' + tag).remove();
    }
  },
  buildEndPoint: function (type) {
    return this.config.endpoint + '/' + this.article_id + '/' + type + '_user_tags';
  },
  add: function (form) {
    var ut_obj = this;
    var endpoint = this.buildEndPoint('create');
    var add_tag = $('add_user_tag_text').value;
    $('add_user_tag_text').value='';
    new Ajax.Request(endpoint, {
      method: 'post',
      parameters: 'tag=' + add_tag,
      onComplete: function (res) {
        var status = res.responseText;
        if ( status ) {
          ut_obj.addUserTag( add_tag );
        }
      }
    });
  },
  destroy: function (tag) {
    var ut_obj = this;
    var endpoint = this.buildEndPoint('delete');
    new Ajax.Request(endpoint, {
      method: 'post',
      parameters: 'tag=' + this.htmlUnEscape(tag),
      onComplete: function (res) {
        var status = res.responseText;
        if ( status ) {
          ut_obj.deleteUserTag( tag );
        }
      }
    });
  },
  htmlEscape: function (str) {
    var map = {"<":"&lt;", ">":"&gt;", "&":"&amp;", "'":"&#39;", "\"":"&quot;", " ":"&nbsp;"};
    var replaceStr = function(s){ return map[s]; };
    return str.replace(/<|>|&|'|"|\s/g, replaceStr);
  },
  htmlUnEscape: function (str) {
    var map = {"&lt;":"<", "&gt;":">", "&#39;":"'", "&quot;":"\"", "&nbsp;":" "};
    var replaceStr = function(s){ return map[s]; };
    str = str.replace(/&lt;|&gt;|&#39;|&quot;|&nbsp;/g,replaceStr);
    return str.replace(/&amp;/g, "&");
  },

  deleteLineFeed: function (myLen) {
     var newLen = '';
     for(var i=0; i<myLen.length; i++){
         text = escape(myLen.substring(i, i+1));
         if(text != "%0D" && text != "%0A"){
             newLen += myLen.substring(i, i+1);
         }
     }
     return(newLen);
  }

};

var onloadfunc = function(){
  UserTags.initialize();
};

if (window.addEventListener) {
  window.addEventListener('load', onloadfunc, false );
} else {
  window.attachEvent('onload', onloadfunc);
}