var items=2;
function AddItem(elms, addbutton) {
    div=document.getElementById(elms);
    button=document.getElementById(addbutton);
    items++;
    newitem="<input type=\"text\"  class=\"text\" id=\"id_login_"+items+"\" name=\"login_"+items+"\"/>\
                      <input type=\"text\"  class=\"text\" id=\"id_password_"+items+"\" name=\"password_"+items+"\"/>";
    newnode=document.createElement("div");
    newnode.innerHTML=newitem;
    div.insertBefore(newnode,button);
  }

var all_items = new Array();
function AddallItems(elms, addbutton, cur ) {
    div=document.getElementById(elms);
    button=document.getElementById(addbutton);
    all_items[cur]  = all_items[cur] + 1;
    group = cur;
    newitem="<input type=\"text\"  class=\"text\" id=\"["+group+"]["+all_items[cur] +"]id_login\" name=\"["+group+"]["+all_items[cur] +"]login\"/>\
                     <input type=\"text\"  class=\"text\" id=\"["+group+"]["+all_items[cur] +"]id_password\" name=\"["+group+"]["+all_items[cur] +"]password\"/>\
                    <img id=\"up"+group+""+all_items[cur]+"\" src=\"/media/img/admin/arrow-up.gif\" onclick=\"swap_places_up("+group+","+all_items[cur]+")\" />\
                    <img id=\"down"+group+""+all_items[cur]+"\" src=\"/media/img/admin/arrow-down.gif\" onclick=\"swap_places_down("+group+","+all_items[cur]+")\" style=\"display:none;\"/>\
    ";
    newnode=document.createElement("div");
    newnode.id="block"+group+all_items[cur];
    newnode.innerHTML=newitem;
    div.insertBefore(newnode,button);
    document.getElementById("down"+group+(all_items[cur]-1)).style.display = "inline";
  }
  
function AddGroup( elms, fs, cur ) {
    div=document.getElementById(elms);
    fieldset=document.getElementById(fs);
    all_items[cur]  = 0;
    group = cur;
    newitem = ''
    for(i=1; i<=2; i++){
        all_items[cur]  = i;
        prefix = "["+group+"]["+all_items[cur] +"]"
        display_up=''
        display_down=''
        if(i == 1){
           display_up = "style=\"display:none;\"" 
        }
        if(i == 2){
           display_down = "style=\"display:none;\"" 
        } 
        newitem=newitem+"<div id=\"block"+group+all_items[cur]+"\"><input type=\"text\"  class=\"text\" id=\""+prefix+"id_login\" name=\""+prefix+"login\"/>\
                        <input type=\"text\"  class=\"text\" id=\""+prefix+"id_password\" name=\""+prefix+"password\"/>\
                        <img id=\"up"+group+""+all_items[cur]+"\" src=\"/media/img/admin/arrow-up.gif\" onclick=\"swap_places_up("+group+","+all_items[cur]+")\"  "+display_up+" />\
                       <img id=\"down"+group+""+all_items[cur]+"\" src=\"/media/img/admin/arrow-down.gif\" onclick=\"swap_places_down("+group+","+all_items[cur]+")\"  "+display_down+"/>\
        </div>";
    }
    newitem = '<h3>График '+(group+1)+'</h3>' +newitem;
    newdivbutton=document.createElement("div");
    newdivbutton.id="addbutton-"+cur;
    newdivbutton.setAttribute("class", "addbutton");
    addelm = document.getElementById("addgroup");
    document.getElementById("addbutton-"+(cur-1)).removeChild(addelm);
    newdivbutton.innerHTML = " \
                    <a id=\"add\" href=\"#\" onclick=\"AddallItems('elms-"+cur+"', 'addbutton-"+cur+"', "+cur+" ); return false;\">Ещё</a>\
                    <script type=\"text/javascript\">\
                    //<![[CDATA\
                            all_items["+cur+"] = 2;\
                    //]]>\
                    </script>\
                    <a id=\"addgroup\"  class=\"iag\" href=\"#\" onclick=\"AddGroup('"+elms+"','params', "+(cur+1)+");return false;\">Добавить график</a>\
                "
    newdiv=document.createElement("div");
    newdiv.innerHTML=newitem;
    
    newnode=document.createElement("fieldset");
    newnode.id = 'elms-'+cur
    newnode.innerHTML = newitem
    newnode.appendChild(newdivbutton);
    div.insertBefore(newnode,fieldset);
  }
function AddGroupOP(felm){
    cur = all_items.length
    all_items[cur] = 2
    div=document.createElement("div");
    div.id = "formbody-"+cur;
    div.innerHTML="\
             <h2>График "+cur+"</h2>     \
            <fieldset id=\"elms-"+cur+"\" class=\"f-left w-100\">\
                <div>\
                        <label class=\"required w-40\">Логин</label>\
                        <label class=\"w-40\">Пароль</label>\
                        <br clear=\"all\">\
                    <input class=\"text\" id=\"["+cur+"][1]id_login\" name=\"["+cur+"][1]login\" value=\"\" type=\"text\">\
                    <input class=\"text\" id=\"["+cur+"][1]id_password\" name=\"["+cur+"][1]password\" value=\"\" type=\"text\">\
                    <img id=\"down"+cur+"1\" src=\"/media/img/admin/arrow-down.gif\" onclick=\"swap_places_down("+cur+",1)\" >\
                    <img id=\"up"+cur+"1\" src=\"/media/img/admin/arrow-up.gif\" onclick=\"swap_places_up("+cur+",1)\" style=\"display: none;\">\
                </div>\
                <div>\
                    <input class=\"text\" id=\"["+cur+"][2]id_login\" name=\"["+cur+"][2]login\" value=\"\" type=\"text\">\
                    <input class=\"text\" id=\"["+cur+"][2]id_password\" name=\"["+cur+"][2]password\" value=\"\" type=\"text\">\
                    <img id=\"up"+cur+"2\" src=\"/media/img/admin/arrow-up.gif\" onclick=\"swap_places_up("+cur+",2)\">\
                    <img id=\"down"+cur+"2\" src=\"/media/img/admin/arrow-down.gif\" onclick=\"swap_places_down("+cur+",2)\" style=\"display: none;\">\
                </div>\
                <div id=\"addbutton-"+cur+"\"  class=\"addbutton\">\
                        <a id=\"add\" href=\"#\" onclick=\"AddallItems('elms-"+cur+"', 'addbutton-"+cur+"', "+cur+" ); return false;\">Ещё</a>\
                </div>\
            <br clear=\"all\">\
            </fieldset>\
            <br clear=\"all\">\
    ";
    add = document.getElementById('addgroup')
    document.getElementById(felm).insertBefore(div, add)
}
function Toggle(formid, toggleid){
      elm = document.getElementById(formid);
      telm = document.getElementById(toggleid);
      d = elm.style.display
      if( d == 'none'){
        elm.style.display = 'block'
        telm.innerHTML="Скрыть";
        }
      else{
        elm.style.display = 'none'
        telm.innerHTML="Изменить";
        }
    }

function swap_places_up(group, num){
    up = num - 1
    prefix = '['+group+']'+'['+num+']'
    prefix_up = '['+group+']'+'['+up+']'
    l_id = prefix+'id_login'
    p_id = prefix+'id_password'
    up_l_id = prefix_up+'id_login'
    up_p_id = prefix_up+'id_password'
    lelm = document.getElementById(l_id);
    pelm = document.getElementById(p_id);
    up_l_elm = document.getElementById(up_l_id);
    up_p_elm = document.getElementById(up_p_id);
    up_login = lelm.value
    up_password = pelm.value
    lelm.value = up_l_elm.value
    pelm.value = up_p_elm.value
    up_l_elm.value = up_login
    up_p_elm.value = up_password
    }
function swap_places_down(group, num){
    up = num + 1
    prefix = '['+group+']'+'['+num+']'
    prefix_up = '['+group+']'+'['+up+']'
    l_id = prefix+'id_login'
    p_id = prefix+'id_password'
    up_l_id = prefix_up+'id_login'
    up_p_id = prefix_up+'id_password'
    lelm = document.getElementById(l_id);
    pelm = document.getElementById(p_id);
    up_l_elm = document.getElementById(up_l_id);
    up_p_elm = document.getElementById(up_p_id);
    up_login = lelm.value
    up_password = pelm.value
    lelm.value = up_l_elm.value
    pelm.value = up_p_elm.value
    up_l_elm.value = up_login
    up_p_elm.value = up_password
    }