function store_edit_data() {
  var obj = null
  var forms = $('#layout-field').find("input[type=text], textarea");
  $.each( forms, function(i, v) {
    if(!obj) obj = {};
    obj[v.name] = v.value;
  });
  if(obj) edit_data = obj;
}

function change_style(no, layout, no_preview) {
    layout = layout || 0;
    var lists = pop_style[no].script_style;
    str = "";
    for(var i=0, len=lists.length ; i < len ; i++) {
      var selected;
//      if(edit_data) selected = (i== parseInt(edit_data.style_id) )? 'selected="selected" ' : '';
//      else selected = (i==layout)? 'selected="selected" ' : '';
//      str += '<option '+selected+'value="'+i+'">'+lists[i]+'</option>';
      if(edit_data) selected = (i== layout )? 'checked="checked" ' : '';
      else selected = (i==layout)? 'checked="checked"' : '';
      str += [
        '<li>',
          '<div class="pop-sample"><label for="layout'+i+'"><img alt="" src="/pop_templates/'+lists[i].icon+'" width="120" /></label></div>',
          '<div class="pop-select">',
            '<span><input type="radio" name="layout" value="'+i+'" id="layout'+i+'" class="radio" '+selected+' onchange="$(\'#layout-field\').html(render_layout('+i+')); return false"/></span>',
            '<label for="layout'+i+'">'+lists[i].title+'</label>',
          '</div>',
        '</li>'
      ].join("");
    }
//    $('#layout-type').html('<select name="layout" onchange="$(\'#layout-field\').html(render_layout(this.value)); return false">'+str+'</select>');
    $('#layout-type').html('<h3>'+pop_style[no].name+'</h3><ul class="pop-sample-list">'+str+'</ul>');
    $('#layout-field').html(render_layout(layout, no_preview));
    $('#layout-field input[type=text]').keypress(
      function(e) {
        if(e.keyCode == 13) return false;
      }
    );
}

function render_layout(no, no_preview) {
    if(modified) store_edit_data();
    style_no = $('select[name=style]').val() || 0;
    if(!no_preview) {
      $('#preview-image').attr("src", "http://data.pop-it.jp"+title_layout[style_no][no].sample.large);
      $('#preview-image-thumb').attr("src", "http://data.pop-it.jp"+title_layout[style_no][no].sample.medium);
    }
    var objs = title_layout[style_no][no].layout;
    var str = "";
    var use_id = {};
    for(var i=0, len=objs.length ; i < len ; i++) {
        var obj = objs[i];
        var value = obj.def;
        if(edit_data) {
          value = "";
          if( edit_data[obj.id] ) {
            use_id[obj.id] = 1;
            value = edit_data[obj.id] + "\n";
          }
          if(i == len-1) {
            $.each(edit_data, function(k, v) { if(!use_id[k]) value += v + "\n"});
          }
        }
        if(typeof obj == 'object') {
          if(obj.type == 'multiline') {
            str += '<div class="section"><h3>'+obj.label+'</h3><div><textarea id="'+obj.id+'" name="'+obj.id+'" cols="40" rows="4" onchange="modified=true;">'+value+'</textarea></div></div>';
          } else {
            value = value.replace(/(\r|\n)/g, "");
            str += '<div class="section"><h3>'+obj.label+'</h3><div>'+(obj.prefix || '')+'<input type="text" id="'+obj.id+'" name="'+obj.id+'" value="'+value+'" size="40" class="text" onchange="modified=true;" />'+(obj.sufix || '')+'</div></div>';
          }
        } else {
            str += obj;
        }
    }
    return '<dl>'+str+'</dl>';
}

function preview() {
  $('div.pop-preview-l, div.pop-preview-s').block({
    message:null,
    overlayCSS: { background: '#000 url(/images/onload_bg.gif) no-repeat center center'}
  });
  var params = $('#edit-area').serialize();
  $.post('/pops/update_image', (params),
    function(data) {
      $('div.pop-preview-l, div.pop-preview-s').unblock();
      var date = new Date();
      $('#preview-image').attr("src", data.src + "?" + date.getTime());
      $('#preview-image-thumb').attr("src", data.thumb + "?" + date.getTime());
      $('#publish').show();
    }
  , "json");
}

function create() {
  if(!$(this).data('onsubmit')) {
    $.blockUI({
      message:"POPを作成中です<br/>（twitterへの通知に時間がかかる場合があります）",
      css: { background : "transparent", border: 'none', color:"#fff"},
      overlayCSS: { background: '#000 url(/images/onload_bg.gif) no-repeat center center'}
    });
    $(this).data('onsubmit', true);
    $('#publish').prepend("<img src='/images/onload.gif' />");
    $('#edit-area').submit();
  }
}