	//////////////////////////////////////////////////////////////////////////////////////
	//  dialog "_changeRef"
	//////////////////////////////////////////////////////////////////////////////////////
	function _dialog_changeRef(i){
		$("#prm_chref").val(i);
		$("#dialog_chref").dialog({
			autoOpen: true,
			modal: true,
			width: 350,
			draggable: true,
			resizable: true
		});	
		var cr = document.getElementById("chref_ac");
		var o=new Object(JSON.parse(localStorage.getItem('_Lists')));
		var label = localStorage.getItem("_Name");
		if ( localStorage.getItem("_Ref") != o[i].db ) {
			if(label == "id"){
				cr.innerHTML = "Change the reference sequence to <br> <font color=\"red\">"+o[i].id+"<\/font>";
			} else{
				cr.innerHTML = "Change the reference sequence to <br> <font color=\"red\">"+o[i].name+"<\/font>";
			}
		} else {
			cr.innerHTML = "Reset reference sequence.";
		}	
	}
  
	function _dlg_chref_cancel() {
		$("#dialog_chref").dialog('close');
	}
   
   
   //////////////////////////////////////////////////////////////////////////////////////
  // Downloading FASTA
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_fa(){
    $("#dialog_fa").dialog({
      autoOpen: true,
      modal: true,
      width: 650,
      draggable: true,
      resizable: true
    });
    var s=parseInt(Objects.Pos-1)*_cvtZoom(Objects.Zoom)+1;
    $("#prm_fa_s").val(s);
	var blk=localStorage.getItem("_Block");
	var e=s+(blk*_cvtZoom(Objects.Zoom))-1;
	
	if((e-s) >= 9999){
		e=s+9999;
	} 
    $("#prm_fa_e").val(e);
    // Set chromosome
    var o=new Object(JSON.parse(localStorage.getItem("_Chrs")));
    var en=new Object(JSON.parse(localStorage.getItem("_Env")));
    var ld="";
    for (var i=0;i<o.length;i++)ld=ld+"<option value='"+o[i].id+"'>"+en.chromosome_name+o[i].id+"</option>";
    $('#prm_fa_chr').find('option').remove().end().append(ld);
    $("#prm_fa_chr").val(Objects.Chr);
    var q=localStorage.getItem("_QUAL");
    $("#prm_fa_qual").val(q);
    var dp=localStorage.getItem("_DP");
    $("#prm_fa_dp").val(dp);
    $("#prm_fa_list").val(_getList("db"));
	var name=localStorage.getItem("_Name");
	var nameS=localStorage.getItem("_NameSub");
	$("#prm_fa_name").val(name);
	$("#prm_fa_nameS").val(nameS);
	$("#prm_fa_ref").val(en.reference_name);
	
	var sl = document.getElementById("seq_len");
	var len = e-s+1
	if (len > 10000){
		len = 10000;
	}else if (len < 0){
		len = 0;
	}
	sl.innerHTML = "Sequence length : &nbsp;"+len+" bp";
	
  }

  ///////////////////////////////////////////////////////////////////////////////////
  // for exporting param 
  ///////////////////////////////////////////////////////////////////////////////////
  function _param_display(){
	var dp = document.getElementById("prm_fa_dp");
	var q = document.getElementById("prm_fa_qual");
	var w = document.getElementById("prm_fa_width");
	var vw = w.value;
	var vdp = dp.value;
	var vq = q.value;
	var sub = document.getElementById("fa_submit");
	
	if(dp.checkValidity() && q.checkValidity() && w.checkValidity() && vdp!=0 && vq!=0){
		sub.innerHTML = "<input id=\"fa_submit\" type=\"submit\" value=\"Export\" >";
	} else{
		sub.innerHTML = "<input id=\"fa_submit\" type=\"submit\" value=\"Export\" disabled=\"true\">";
	}
	if (vw ==0){
		$("#prm_fa_width_php").val(-1);
	} else{
		$("#prm_fa_width_php").val(vw);
	}
  }

   //////////////////////////////////////////////////////////////////////////////////////
  //  sequence length
  //////////////////////////////////////////////////////////////////////////////////////
	function _dialog_fa_len(){
		var s = document.getElementById("prm_fa_s");
		var e = document.getElementById("prm_fa_e");
		
		var len = e.value-s.value+1;
		var sub = document.getElementById("fa_submit");
		var sl = document.getElementById("seq_len");
		var sv =s.value;
		var ev =e.value;
		if(s.checkValidity() && e.checkValidity() && sv!=0 && ev!=0){
			sub.innerHTML = "<input id=\"fa_submit\" type=\"submit\" value=\"Export\" >";
			if (len > 10000){
				len = 10000;
				sl.innerHTML = "Sequence length : &nbsp;"+len+" bp";
			} else if (len <= 0){
				//len = 0;
				len="<font color=\"#FF0000\">Please check start-postion and end-postion.</font>";
				sl.innerHTML = len;
				sub.innerHTML = "<input id=\"fa_submit\" type=\"submit\" value=\"Export\" disabled=\"true\">";
			} else{
				sl.innerHTML = "Sequence length : &nbsp;"+len+" bp";
			}
		}else{
			len="<font color=\"#FF0000\">Please input postion!</font>";
			sl.innerHTML = len;
			sub.innerHTML = "<input id=\"fa_submit\" type=\"submit\" value=\"Export\" disabled=\"true\">";
		}
	}

  //////////////////////////////////////////////////////////////////////////////////////
  // Downloading CSV
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_csv(){
    $("#dialog_csv").dialog({
      autoOpen: true,
      modal: true,
      width: 500,
      draggable: true,
      resizable: true
    });
    var s=parseInt(Objects.Pos-1)*_cvtZoom(Objects.Zoom)+1;
    $("#prm_csv_s").val(s);
    var e=s+1999;
    $("#prm_csv_e").val(e);
    // Set chromosome
    var o=new Object(JSON.parse(localStorage.getItem("_Chrs")));
    var en=new Object(JSON.parse(localStorage.getItem("_Env")));
    var ld="";
    for (var i=0;i<o.length;i++)ld=ld+"<option value='"+o[i].id+"'>"+en.chromosome_name+o[i].id+"</option>";
    $('#prm_csv_chr').find('option').remove().end().append(ld);
    $("#prm_csv_chr").val(Objects.Chr);
    var q=localStorage.getItem("_QUAL");
    $("#prm_csv_qual").val(q);
    var dp=localStorage.getItem("_DP");
    $("#prm_csv_dp").val(dp);
    $("#prm_csv_list").val(_getList("db"));
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Managing of accession lists
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_list(){
    $("#dialog_list").dialog({
      autoOpen: true,
      modal: false,
      width: 620,
      draggable: true,
      resizable: true
    });
    _dlg_make_list();
  }

  function _dlg_make_list(){
      $('#prm_tw').val(localStorage.getItem('_TitleW'));
      $('#prm_switch_name').val(localStorage.getItem('_Name'));
      $('#prm_switch_sub').val(localStorage.getItem('_NameSub'));
      var l=new Object(JSON.parse(localStorage.getItem('_Lists')));
      var d=new Object(JSON.parse(localStorage.getItem('_ListsDeleted')));
      var ls="";
      var ld="";
      var ss="";
      for (var i=0;i<l.length;i++){
        if ( Objects.Name == "id" ) {
          ss=l[i].id
        } else {
          ss=l[i].name
        }
        var st = $.format("%1$-17s %2$-10s %3$-5s %4$-14s", ss.replace(/^\s+|\s+$/g, ""), l[i].variety.replace(/^\s+|\s+$/g, ""), l[i].grp.replace(/^\s+|\s+$/g, ""), l[i].origin.replace(/^\s+|\s+$/g, ""), l[i].type.replace(/^\s+|\s+$/g, "")).replace(/\s/g,"&nbsp;")
        ls=ls+"<option value='"+l[i].id+"'>"+st+"</option>"
      }
      for (var i=0;i<d.length;i++){
        if ( Objects.Name == "id" ) {
          ld=ld+"<option value='"+d[i].id+"'>"+d[i].id+"</option>";
        } else {
          ld=ld+"<option value='"+d[i].id+"'>"+d[i].name+"</option>";
        }
      }
      $('#lstBox1').find('option').remove().end().append(ls);
      $('#lstBox2').find('option').remove().end().append(ld);
  }

  $(document).ready(function() {

      $('#prm_list_init').click(function(e) {
        localStorage.setItem("_Lists",localStorage.getItem("_Lists-origin"));
        localStorage.setItem("_ListsDeleted","[]");
        _showLoading();
        _execCanvas();
        _dlg_make_list();
      });

      $('#prm_list_submit').click(function(e) {
        _reset_accession_lists();
        _showLoading();
        _execCanvas();
        _dlg_make_list();
      });

      $('#btnRight').click(function(e) {
          var selectedOpts = $('#lstBox1 option:selected');
          if (selectedOpts.length == 0) {
              alert("Nothing to move.");
              e.preventDefault();
          }
          $('#lstBox2').append($(selectedOpts).clone());
          $(selectedOpts).remove();
          e.preventDefault();

          var va=new Array();
          $("#lstBox2 option").each(function () {
              va.push($(this).val());
          }, null);
          var o=new Object(JSON.parse(localStorage.getItem('_Lists-origin')));
          var ld="";
          for (var j=0;j<va.length;j++){
            for (var i=0;i<o.length;i++){
              if ( va[j] == o[i].id ) {
                if ( Objects.Name == "id" ) {
                  ld=ld+"<option value='"+o[i].id+"'>"+o[i].id+"</option>";
                } else {
                  ld=ld+"<option value='"+o[i].id+"'>"+o[i].name+"</option>";
                }
              }
            }
          }
          $('#lstBox2').find('option').remove().end().append(ld);
      });

      $('#btnLeft').click(function(e) {
          var selectedOpts = $('#lstBox2 option:selected');
          if (selectedOpts.length == 0) {
              alert("Nothing to move.");
              e.preventDefault();
          }
          $('#lstBox1').append($(selectedOpts).clone());
          $(selectedOpts).remove();
          e.preventDefault();

          var va=new Array();
          $("#lstBox1 option").each(function () {
              va.push($(this).val());
          }, null);
          var o=new Object(JSON.parse(localStorage.getItem('_Lists-origin')));
          var ls="";
          var ss="";
          for (var j=0;j<va.length;j++){
            for (var i=0;i<o.length;i++){
              if ( va[j] == o[i].id ) {
                if ( Objects.Name == "id" ) {
                  ss=o[i].id
                } else {
                  ss=o[i].name
                }
                var st = $.format("%1$-17s %2$-10s %3$-5s %4$-14s", ss.replace(/^\s+|\s+$/g, ""), o[i].variety.replace(/^\s+|\s+$/g, ""), o[i].grp.replace(/^\s+|\s+$/g, ""), o[i].origin.replace(/^\s+|\s+$/g, ""), o[i].type.replace(/^\s+|\s+$/g, "")).replace(/\s/g,"&nbsp;")
                ls=ls+"<option value='"+o[i].id+"'>"+st+"</option>"
              }
            }
          }
          $('#lstBox1').find('option').remove().end().append(ls);
      });

      $.fn.reverse = [].reverse;
      $("#bUp,#bDown").click(function() {
          var $opt = $("#lstBox1 option:selected");
          if (!$opt.length) return;
          var bGoUp = (this.id == "bUp");
          if (!bGoUp) $opt.reverse();
          $opt.each(function(i) {
              var $src = $(this);
              var $dst = $src[bGoUp ? "prev" : "next"]();
              if ($dst.length && $dst[0].selected) return;
              $dst[bGoUp ? "before" : "after"]($src);
          });
      });

  });

  function _reset_accession_lists() {

      var o=new Object(JSON.parse(localStorage.getItem('_Lists-origin')));
      var value1=new Array();
          $("#lstBox1 option").each(function () {
              value1.push($(this).val());
          }, null);
          var strDel="[";
          for (var i=0;i<value1.length;i++) {
            for (var j=0;j<o.length;j++){
              if ( value1[i] == o[j].id ){
                strDel=strDel+"{";
                strDel=strDel+"\"id\":\""+o[j].id+"\",";
                strDel=strDel+"\"db\":\""+o[j].db+"\",";
                strDel=strDel+"\"name\":\""+o[j].name+"\",";
                strDel=strDel+"\"variety\":\""+o[j].variety+"\",";
                strDel=strDel+"\"grp\":\""+o[j].grp+"\",";
                strDel=strDel+"\"origin\":\""+o[j].origin+"\",";
                strDel=strDel+"\"origin_2\":\""+o[j].origin_2+"\",";
                strDel=strDel+"\"type\":\""+o[j].type+"\"";
                strDel=strDel+"}";
              }
            }
            if ( i < value1.length-1 ) {
            strDel=strDel+",";
            }
          }
          strDel=strDel+"]";
          localStorage.setItem("_Lists",(strDel));

          var value=new Array();
          $("#lstBox2 option").each(function () {
              value.push($(this).val());
          }, null);
          var strDel="[";
          for (var i=0;i<value.length;i++) {
            for (var j=0;j<o.length;j++){
              if ( value[i] == o[j].id ){
                strDel=strDel+"{";
                strDel=strDel+"\"id\":\""+o[j].id+"\",";
                strDel=strDel+"\"db\":\""+o[j].db+"\",";
                strDel=strDel+"\"name\":\""+o[j].name+"\",";
                strDel=strDel+"\"variety\":\""+o[j].variety+"\",";
                strDel=strDel+"\"grp\":\""+o[j].grp+"\",";
                strDel=strDel+"\"origin\":\""+o[j].origin+"\",";
                strDel=strDel+"\"origin_2\":\""+o[j].origin_2+"\",";
                strDel=strDel+"\"type\":\""+o[j].type+"\"";
                strDel=strDel+"}";
              }
            }
            if ( i < value.length-1 ) {
            strDel=strDel+",";
            }
          }
          strDel=strDel+"]";
          localStorage.setItem("_ListsDeleted",(strDel));
  }



  //////////////////////////////////////////////////////////////////////////////////////
  // Search keyword & jump position
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_go(){
    $("#dialog_go").dialog({
      autoOpen: true,
      modal: false,
	  width: 480,
      ONdraggable: true,
      resizable: true
    });

    // Set chromosome
    var o=new Object(JSON.parse(localStorage.getItem("_Chrs")));
    var en=new Object(JSON.parse(localStorage.getItem("_Env")));
    var cs="";
    for (var i=0;i<o.length;i++) cs=cs+"<option value='"+o[i].id+"'>"+en.chromosome_name+o[i].id+"</option>";
    $('#prm_position_chr').find('option').remove().end().append(cs);
    $('#prm_position_chr').val(Objects.Chr);
    $('#prm_position_zoom').val(localStorage.getItem('_Zoom'));
    _setComboHistory()  // Set history combobox
  }

  ////////////////////////////// Set options in combobox
  function _setComboHistory () {
    var h=JSON.parse(localStorage.getItem("_History"));
    var en=JSON.parse(localStorage.getItem("_Env"));
    var hs="<option value=''> - </option>";
    for (i=1;i<h.length;i++) {
      t=h[i].split(",");
      if(t[0]=="search") hs=hs+"<option value='"+i+"'>"+t[1]+"</option>";
      else if(t[0]=="position") {
		var spt3;
		var t2t3;
		if (t[3].match(/k/i)) {
			spt3=t[3].split("k");
			t2t3=(t[2]-1)*spt3[0]*1000+1;
		} else{
			spt3=t[3].split("b");
			t2t3=(t[2]-1)*spt3[0]+1;
		}
		hs=hs+"<option value='"+i+"'>"+en.chromosome_name+t[1]+" : "+t2t3+"&nbsp;&nbsp;&nbsp;("+t[3]+")</option>";
	  }
    }
    $('#prm_history_cmd').find('option').remove().end().append(hs);
  }

  ///////////////////////////// Convert length of chromosome as zoom
  function _setHistory(str){
    var a=JSON.parse(localStorage.getItem("_History"));
    if(a.length>20) a.pop();
    a.unshift(str);
    localStorage.setItem("_History",JSON.stringify(a));
    _setComboHistory();
  }

  // Execute history command
  function _historyCmd() {
    var history=parseInt($('#prm_history_cmd').val());
    var h=JSON.parse(localStorage.getItem("_History"));
    var t=h[history].split(",");
    if(t[0]=="search") {
      _execSearch(t[1]);
    }
    if(t[0]=="position") {
      _setHistory(h[history]);
      localStorage.setItem('_Chr', t[1]);
      localStorage.setItem('_Pos', t[2]);
      localStorage.setItem("_Zoom", t[3]);
	  
	  var spt3;
	  var t2t3;
	  if (t[3].match(/k/i)) {
		spt3=t[3].split("k");
		t2t3=(t[2]-1)*spt3[0]*1000+1;
	  } else{
	    spt3=t[3].split("b");
		t2t3=(t[2]-1)*spt3[0]+1;
	  }
	  
      _showLoading();
      _messageOnScreen("Loading position "+t2t3);
      _execCanvas();
    }
  }

  function _jumpPOS(e){
    //if(e.keyCode == 13){
      c=$('#prm_position_chr').val();
      z=$('#prm_position_zoom').val();
      i=$('#prm_position').val();
      if(!isNaN(i)&&i!=""){
        p=_checkPos_Chr(i,z,c);
        localStorage.setItem('_Pos', p);
        localStorage.setItem('_Chr', c);
        localStorage.setItem("_Zoom", z);
        _showLoading();
		
		var spzoom;
	    var pzoom;
	    if (z.match(/k/i)) {
		  spzoom=z.split("k");
		  pzoom=(p-1)*spzoom[0]*1000+1;
	    }else{
			spzoom=z.split("b");
			pzoom=(p-1)*spzoom[0]+1;
		}
		
        _messageOnScreen("Loading position "+pzoom+" ["+z+"]");
        _execCanvas();
        _setHistory("position,"+c+","+p+","+z);
      } else {
        _messageOnScreen("Input numeric code ["+i+"]");
      }
      $("#dialog_position").dialog('close');
    //}
  }

  function _searchID(e){
    //if(e.keyCode == 13){
      str=$('#prm_keyword').val();
      if(str.length>2) {
        _execSearch(str);
        $('#prm_keyword').blur();
      } else {
        _drawCanvas();
        _messageOnScreen("The keyword must has over 4 strings.");
      }
      $("#dialog_keyword").dialog('close');
    //}
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Track manager
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_track(){
    $("#dialog_track").dialog({
      autoOpen: true,
      modal: false,
      width: 620,
      draggable: true,
      resizable: true
    });
    $('#dialog_track').empty();
    $('#dialog_track').append(_html_track());
  }

  function _html_track(){
    var t=new Object(JSON.parse(localStorage.getItem('_Tracks')));

    if ( !t.length ) {
        $('#dialog_track').append("<br><br><font color='red'>Track is empty.</font>");
    } else {
      var str="<table width='100%'><tr height='40'><th width='31%' align='left'>Track name</th><th width='23%' align='left'>View</th><th width='13%' align='left'>Row</th><th width='13%' align='left'>Order</th><th width='20%' align='left'>Color <input type='submit' name='_track_c_' value='Apply' onClick='_changeColorTrack(this)' style='width: 50px;'></td></th></tr>";
      for (var i=0;i<t.length;i++){
        str=str+"<tr><td><label>"+(i+1)+". "+t[i].track+"</label></td>";
        str=str+"<td><select name='_track_v_"+i+"' onChange='_changeViewTrack(this)'>";
        if ( t[i].p == 1 ) { 
          str=str+"<option value='on' selected>ON</option>";
          str=str+"<option value='off'>OFF</option>";
        } else {
          str=str+"<option value='on'>ON</option>";
          str=str+"<option value='off' selected>OFF</option>";
        }
        str=str+"</select></td>";
        str=str+"<td><select name='_track_d_"+i+"' onChange='_changeDepthTrack(this)'>";
        if ( t[i].h == 1 ) {
          str=str+"<option value='1' selected>1</option>";
          str=str+"<option value='4'>4</option>";
        } else {
          str=str+"<option value='1'>1</option>";
          str=str+"<option value='4' selected>4</option>";
        }
        str=str+"</select></td>";
        str=str+"<td><select name='_track_s_"+i+"' onChange='_changeSortTrack(this)'>";

        for (var j=0; j<t.length; j++ ) {
          if ( i == j ) {
            str=str+"<option value='"+j+"' selected>"+(j+1)+"</option>";
          } else {
            str=str+"<option value='"+j+"'>"+(j+1)+"</option>";
          }
        }
        str=str+"</select></td>";
        str=str+"<td><input type='text' name='_track_c_"+i+"' value='"+t[i].c+"' style='width: 70px;'>";
      }
      str=str+"</table>";
      str=str+"<br>";
    }
    return str;
  }

  function _changeColorTrack(Obj) {
    var t=new Object(JSON.parse(localStorage.getItem('_Tracks')));
    var str="[";
    for ( var i=0; i<t.length; i++ ) {
      str=str+"{";
      str=str+"\"track\":\""+t[i].track+"\",";
      str=str+"\"p\":\""+t[i].p+"\",";
      str=str+"\"h\":\""+t[i].h+"\",";
      str=str+"\"c\":\""+$("input[name='_track_c_"+i+"']").val()+"\",";
      str=str+"\"s\":\""+i+"\"}";
      if ( i < t.length-1 ) {
        str=str+",";
      }
    }
    str=str+"]";
    localStorage.setItem("_Tracks",str);
    _drawCanvas();
  }

  function _changeViewTrack(Obj) {
    var n=Obj.name.split("_");
    var v=Obj.options[Obj.selectedIndex].value;
    var t=new Object(JSON.parse(localStorage.getItem('_Tracks')));

    var cmp = "1";
    if ( v == "off" ) {
      cmp = "0";
    }

    var str="[";
    for ( var i=0; i<t.length; i++ ) {
      str=str+"{";
      str=str+"\"track\":\""+t[i].track+"\",";
      if ( t[i].s == n[3] ){
        str=str+"\"p\":\""+cmp+"\",";
      } else {
        str=str+"\"p\":\""+t[i].p+"\",";
      }
      str=str+"\"h\":\""+t[i].h+"\",";
      str=str+"\"c\":\""+t[i].c+"\",";
      str=str+"\"s\":\""+i+"\"}";
      if ( i < t.length-1 ) {
        str=str+",";
      }
    }
    str=str+"]";
    localStorage.setItem("_Tracks",str);
    _drawCanvas();

  }


  function _changeDepthTrack(Obj) {
    var n=Obj.name.split("_");
    var v=parseInt(Obj.options[Obj.selectedIndex].value);
    var t=new Object(JSON.parse(localStorage.getItem('_Tracks')));

    var str="[";
    for ( var i=0; i<t.length; i++ ) {
      str=str+"{";
      str=str+"\"track\":\""+t[i].track+"\",";
      str=str+"\"p\":\""+t[i].p+"\",";
      if ( t[i].s == n[3] ){
          str=str+"\"h\":\""+v+"\",";
      } else {
          str=str+"\"h\":\""+t[i].h+"\",";
      }
      str=str+"\"c\":\""+t[i].c+"\",";
      str=str+"\"s\":\""+i+"\"}";
      if ( i < t.length-1 ) {
        str=str+",";
      }
    }
    str=str+"]";
    localStorage.setItem("_Tracks",str);
    _drawCanvas();
  }

  function _changeSortTrack(Obj) {
    var n=Obj.name.split("_");
    var v=parseInt(Obj.options[Obj.selectedIndex].value);
    var t=new Object(JSON.parse(localStorage.getItem('_Tracks')));
    var a=new Array();

    for ( var i=0; i<t.length; i++ ) {
      a[i] = i; 
    }
    a[n[3]]=v; 
    a[v]=n[3]; 

    var tmp = localStorage.getItem('_Track_'+n[3]);
    localStorage.setItem("_Track_"+n[3],localStorage.getItem('_Track_'+v));
    localStorage.setItem("_Track_"+v,tmp);

    var str="[";
    for ( var i=0; i<a.length; i++ ) {
      for (var j=0;j<t.length;j++) {
        if ( a[i] == t[j].s ){
          str=str+"{";
          str=str+"\"track\":\""+t[j].track+"\",";
          str=str+"\"p\":\""+t[j].p+"\",";
          str=str+"\"h\":\""+t[j].h+"\",";
          str=str+"\"c\":\""+t[j].c+"\",";
          str=str+"\"s\":\""+i+"\"}";
        }
      }
      if ( i < a.length-1 ) {
        str=str+",";
      }
    }
    str=str+"]";
    localStorage.setItem("_Tracks",str);

    $('#dialog_track').empty();
    $('#dialog_track').append(_html_track());
    _drawCanvas();
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Help
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_manual(){
    $("#dialog_manual").dialog({
      autoOpen: true,
      modal: false,
      width: 700,
      draggable: true,
	  height: 625,
      resizable: true
    });
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // About
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_about(){
    $("#dialog_about").dialog({
      autoOpen: true,
      modal: true,
      width: 400,
      height: 400,
      draggable: true,
      resizable: true
    });
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Citation
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_citation(){
    $("#dialog_citation").dialog({
      autoOpen: true,
      modal: true,
      width: 650,
      draggable: true,
      resizable: true
    });
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Reset to browser
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_reset(){
    $("#dialog_reset").dialog({
      autoOpen: true,
      modal: true,
      width: 320,
      draggable: true,
      resizable: true
    });
  }

  function _dlg_reset_cancel() {
    $("#dialog_reset").dialog('close');
  }

  function _dlg_reset_confirm() {
    localStorage.clear();
    _initCache();
    location.reload();
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Variants filter
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_filter(){
    $("#dialog_filter").dialog({
      autoOpen: true,
      modal: true,
      width: 350,
      draggable: true,
      resizable: true
    });
    $('#prm_quality').val(localStorage.getItem('_QUAL'));
    $('#prm_depth').val(localStorage.getItem('_DP'));
    $('#prm_dp4').val(localStorage.getItem('_DP4'));
  }

  /////////////////////////////////////////////// Change variant QUAL
  function _changeQUAL(){
    var qual=$('#prm_quality').val();
    localStorage.setItem("_QUAL", qual);
    _showLoading();
    _messageOnScreen("Changing filter: Quality > "+qual);
    _execCanvas();
  }

  /////////////////////////////////////////////// Change variant DEPTH
  function _changeDEPTH(){
    var dp=$('#prm_depth').val();
    localStorage.setItem("_DP", dp);
    _showLoading();
    _messageOnScreen("Changing filter: Depth > "+dp);
    _execCanvas();
  }

  /////////////////////////////////////////////// Change variant DP4
  function _changeDP4(){
    var dp=$('#prm_dp4').val();
    localStorage.setItem("_DP4", dp);
    _showLoading();
    _messageOnScreen("Changing filter: Depth of Alternative allele > "+dp);
    _execCanvas();
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Options view: block
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_theme(){
    $("#dialog_theme").dialog({
      autoOpen: true,
      modal: true,
      width: 300,
      draggable: true,
      resizable: true
    });
    $('#prm_bgc').val(localStorage.getItem('_Color'));
  }

  /////////////////////////////////////////////// Change color
  function _changeColor(){
    var color=$('#prm_bgc').val();
    localStorage.setItem("_Color", color);
    location.reload();
  }

  /////////////////////////////////////////////// Change amino acids
  function _changeAmino(){
    if (localStorage.getItem("_Amino") == "on"){
      localStorage.setItem("_Amino", "off");
    } else {
      localStorage.setItem("_Amino", "on");
    }
    _drawCanvas();
  }

  /////////////////////////////////////////////// Change indicator
  function _changeIndicator(){
    if (localStorage.getItem("_Indicator") == "on"){
      localStorage.setItem("_Indicator", "off");
	  var element = document.getElementById("cvs_ind"); 
	  element.style.width = '0px'; 
	  element.style.height = '0px'; 
      $('#prm_idc').val("off");
    } else {
      localStorage.setItem("_Indicator", "on");
	  var element = document.getElementById("cvs_ind"); 
	  element.style.width = '150px'; 
	  element.style.height = '165px'; 
      $('#prm_idc').val("on");
    }
    _drawCanvas();
  }

  /////////////////////////////////////////////// Change title width
  function _changeTitleW(){
    var width=$('#prm_tw').val();
    localStorage.setItem("_TitleW", width);
    _drawCanvas();
    _messageOnScreen("Changing width of title: "+width+" pixel");
  }

  /////////////////////////////////////////////// Change title with ID or Name
  function _changeTitleID(){
    localStorage.setItem("_Name",$('#prm_switch_name').val());
    _drawCanvas();
    _dlg_make_list();
  }

  /////////////////////////////////////////////// Change title with ID or Name
  function _changeTitleVariety(){
    localStorage.setItem("_NameSub",$('#prm_switch_sub').val());
    _drawCanvas();
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Dialog: Cell information
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_infocell(str){
    $("#dialog_infocell").dialog({
      autoOpen: true,
      modal: true,
      width: 600,
      draggable: true,
      resizable: true
    });
    $('#dialog_cellinformation').empty();
    $('#dialog_cellinformation').append(str);
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Dialog: Blocks
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_block(){
    $("#dialog_block").dialog({
      autoOpen: true,
      modal: true,
      width: 300,
      draggable: true,
      resizable: true
    });
    $('#prm_bn').val(localStorage.getItem('_Block'));
    $('#prm_bh').val(localStorage.getItem('_BlockH'));
    $('#prm_bw').val(localStorage.getItem('_BlockW'));
  }


  /////////////////////////////////////////////// Change column(load block)
  function _changeBlock(){

    var col=parseInt($('#prm_bn').val());

    localStorage.setItem('_Block', String(col));
    if(Objects.Pos+col>_last(Objects.Zoom)) localStorage.setItem('_Pos',String(_last(Objects.Zoom)-col+1));

    _showLoading();
    _messageOnScreen("Changing "+Objects.Block+" to "+col+" blocks");
    _execCanvas();
  }

  /////////////////////////////////////////////// Change block width
  function _changeBlockW(){
    var width=$('#prm_bw').val();
    localStorage.setItem("_BlockW", width);
    _drawCanvas();
    _messageOnScreen("Changing width of block: "+width+" pixel");
  }

  /////////////////////////////////////////////// Change block height
  function _changeBlockH(){
    var height=$('#prm_bh').val();
    localStorage.setItem("_BlockH", height);
    _drawCanvas();
    _messageOnScreen("Changing width of height: "+height+" pixel");
  }

  //////////////////////////////////////////////////////////////////////////////////////
  // Effect level list
  //////////////////////////////////////////////////////////////////////////////////////
  function _dialog_list_effect(){
    $("#dialog_list_effect").dialog({
      autoOpen: true,
      modal: false,
      width: 350,
      draggable: true,
      resizable: true
    });
  }

