var dragged =  null;
var droparea = { width: 0, height: 0 };
var draggable_count = 0;
var bgImage = { src: "", width: "", height: ""};
  
function initApplication() {


    $(".sidebar").draggable()
    $("#shower").draggable()



    var isInDroparea = false;

    var drags = document.querySelectorAll("#dragbase .draggable")
    for (var i = 0; i < drags.length; i++) {
        drags[i].ondragstart = dragStartEvent;
        drags[i].ondragend = dragEndEvent;
    }

    $("#dg_width").spinner({
        min: 10,
        step: 1,
        page: 5,
        change: updateDgWidth,
        spin: updateDgWidth
    })
    $("#dg_height").spinner({
        min: 10,
        step: 1,
        page: 5,
        change: updateDgHeight,
        spin: updateDgHeight
    })

    $("#dialog-addImage").dialog({
        autoOpen: false,
        height: 200,
        width: 450,
        modal: true,
        resizable: false,
        buttons: {
            "Přidat obrázek": function () {
                var bValid = true;
                $("#new_img_url").removeClass("ui-state-error");

                var obr = $("#new_img_url").attr("value")
                if (obr != "") {
                    addDraggable(obr)

                }
                $(this).dialog("close");
            },
            "Zrušit": function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            $("#new_img_url").val("").removeClass("ui-state-error");
        }
    });

    $("#dialog-addText").dialog({
        autoOpen: false,
        height: 200,
        width: 450,
        modal: true,
        resizable: false,
        buttons: {
            "Přidat text": function () {
                var bValid = true;
                $("#new_text").removeClass("ui-state-error");

                var txt = $("#new_text").attr("value")
                if (txt != "") {
                    addDraggableText(txt)

                }
                $(this).dialog("close");
            },
            "Zrušit": function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            $("#new_text").val("").removeClass("ui-state-error");
        }
    });


    $("#dialog-addVideo").dialog({
        autoOpen: false,
        height: 250,
        width: 450,
        modal: true,
        resizable: false,
        buttons: {
            "Vložit video": function () {
                var bValid = true;
                $("#new_video_url").removeClass("ui-state-error");

                var video = $("#new_video_url").attr("value")
                if (video != "") {
                    insertVideo(video)

                }
                $(this).dialog("close");
            },
            "Zrušit": function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            $("#new_video_url").val("").removeClass("ui-state-error");
        }
    });

    $("#dialog-addAudio").dialog({
        autoOpen: false,
        height: 250,
        width: 450,
        modal: true,
        resizable: false,
        buttons: {
            "Vložit audio": function () {
                var bValid = true;
                $("#new_audio_url").removeClass("ui-state-error");

                var audio = $("#new_audio_url").attr("value")
                if (audio != "") {
                    insertAudio(audio)

                }
                $(this).dialog("close");
            },
            "Zrušit": function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            $("#new_audio_url").val("").removeClass("ui-state-error");
        }
    });
    
    $("#dialog-importCode").dialog({
        autoOpen: false,
        height: 400,
        width: 800,
        modal: true,
        resizable: false,
        buttons: {

            "Importovat kód": function () {
                importCode();
                $(this).dialog("close");

            },
            "Zavřít": function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            $("#import_code").val("").removeClass("ui-state-error");
        }
    });
    

    $("input[type=button], button")
        .button()
        .click(function (event) {
            event.preventDefault();
        });

    $("#testitem_content").draggable()
    
    var tiContent = document.getElementById("testitem_content");
    tiContent.style.left = "900px";
    tiContent.style.top = "450px";
    tiContent.style.display = "none";

    $("#tabs").tabs();

    // fix the classes
    $(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *")
        .removeClass("ui-corner-all ui-corner-top")
        .addClass("ui-corner-bottom");
    // move the nav to the bottom
    $(".tabs-bottom .ui-tabs-nav").appendTo(".tabs-bottom");

    $("#tabs").on("tabsactivate", function (event, ui) {

        var pid = ui.newPanel.attr("id")

        if (pid == "tabs-2") generatePreview()
        if (pid == "tabs-3") generateCode()
            //if (ui.newTab) 
            //
    });

    setMode('gap_input');
    document.getElementById("code_auth").checked = true;
    
    document.getElementById("mainmode_input").checked = true;
    resetAll();
    CKEDITOR.inline( 'edit_title', configEditSimple );
    CKEDITOR.inline( 'edit_task', configEditSimple );
    
    report("&#160;");  
}
  
var coords = { x: 0, y: 0}
  
function getCoords(evt) {
    var rect = evt.target.getBoundingClientRect();

    var mouseX = Math.round(evt.clientX - rect.left);
    var mouseY = Math.round(evt.clientY - rect.top);

    coords = {
        x: mouseX,
        y: mouseY
    }

}
  
function dragStartEvent(e) {
    var rodic = this.parentNode


    puvRodic = this.parentNode
    var dname = this.nodeName.toLowerCase();
    var novy = document.createElement("SPAN") //dragged.cloneNode(true)
    if (dname == "img") {
        novy = document.createElement("img")
        novy.src = this.src;
        novy.setAttribute("data-id", this.getAttribute("data-id"));
    }
    //novy.setAttribute("draggable", "true")
    //novy.setAttribute("class", "draggable")
    novy.innerHTML = this.innerHTML

    var popis = document.createElement("span")
    popis.style.position = "absolute"
    popis.style.top = Math.round(coords.y - this.height / 2 - 2) + "px"
    popis.style.left = Math.round(coords.x - this.width / 2 - 2) + "px"
    popis.style.width = droparea.width + "px"
    popis.style.height = droparea.height + "px"
    popis.style.lineHeight = (droparea.height - 2) + "px"

    popis.className = "droparea"
    popis.appendChild(novy)
        //EventHelpers.addEvent(novy, 'dragstart', dragStartMoveEvent);
        //EventHelpers.addEvent(novy, 'dragend', dragEndCloneEvent);
    rodic.appendChild(popis)
        //dragged.style.visibility = "hidden" 


    popis.onclick = function () {
        selectItem(this)
    }
    document.getElementById("qArea").appendChild(popis)
    dragged = popis;
    $(popis).draggable()
}                   
   
  
function dragOverEvent(e) {
    isInDroparea = true;
    getCoords(e);
    EventHelpers.preventDefault(e);
}
   
function dragEndEvent(e) {
    var puvRodic = dragged.parentNode;
    if (!isInDroparea) {
        dragged = null;
    } else { //var coords = getCoords(e);
        report("drop pokus na " + coords.x + ", " + coords.y)
          
        dragged = null;
    }
    EventHelpers.preventDefault(e);
}
   
function dragLeaveEvent(e) {
   isInDroparea = false;
   	EventHelpers.preventDefault(e);   	
   }
   
function dropEvent(e) {
   	 
  EventHelpers.preventDefault(e);
      var puvRodic = dragged.parentNode; 
 
     var rodic = this; 
      if (puvRodic.className == "dragbase" ) { }
        
      
       
	    
      //pretahovani prvku zpet do vychozi dragbase 
      if (puvRodic.className.indexOf("droparea") > -1 && rodic.className.indexOf("dragbase") > -1 ) { 
        /*   
        puvRodic.removeChild(dragged);
        
        var dname = dragged.nodeName.toLowerCase()
        var ditems = rodic.querySelectorAll(dname);
        for (var k = 0; k < ditems.length; k++) {
           if (dname == "span" && ditems[k].firstChild.nodeValue == content) ditems[k].style.visibility = "visible"
           if (dname == "img" && ditems[k].src == dragged.src) { 
              ditems[k].style.visibility = "visible"
            }
          }
          */
       }
     
   	 
   
   }
 
 var actualDraggable = null;
 var actualInstance = null; 
 var xOffset = 0;
 var yOffset = 0;
 
function initDragging(evt, ui) {
   xOffset = $("#qArea").offset().left - ui.helper.offset().left; 
   yOffset = $("#qArea").offset().top - ui.helper.offset().top ;
   //alert(typeof ui.helper)
   selectDraggable($("span", ui.helper)[0])
      
 }
 
function stopDragging(evt, ui) {
    var novy = ui.helper[0].cloneNode(true) //dragged.cloneNode(true)
    novy.style.position = "static";
    novy.className = ""
    novy.removeAttribute("draggable")

    var popis = document.createElement("span")
    popis.style.position = "absolute"

    var cx = evt.pageX - $("#qArea").offset().left - ui.helper.width() / 2 //ui.position.left - 0*xOffset     
    var cy = evt.pageY - $("#qArea").offset().top - ui.helper.height() / 2 //ui.position.top - 1*yOffset

    popis.style.top = (cy) + "px" //Math.round(coords.y - ui.height/2 - 2) + "px"
    popis.style.left = (cx) + "px" //Math.round(coords.x - ui.width/2 - 2) + "px"
    popis.style.width = droparea.width + "px";
    popis.style.height = droparea.height + "px";
        //popis.style.lineHeight = (droparea.height-2)  + "px"

    popis.className = "droparea";
    popis.appendChild(novy);
    document.getElementById("qArea").appendChild(popis);
    $(popis).draggable();
}
 
function addInstanceOf(dadNode, posX, posY) {
    var novy = dadNode.cloneNode(true) //dragged.cloneNode(true)
    novy.style.position = "static";
    novy.className = ""
    novy.removeAttribute("draggable")

    var plocha = document.getElementById("img_placeholder")

    var popis = document.createElement("span")
    popis.style.position = "absolute"

    var cx = (posX == undefined) ? plocha.scrollLeft + 20 : posX
    var cy = (posY == undefined) ? plocha.scrollTop + 20 : posY

    popis.style.top = (cy) + "px"
    popis.style.left = (cx) + "px"
    popis.style.width = droparea.width + "px"
    popis.style.height = droparea.height + "px"

    popis.className = "droparea"
    popis.appendChild(novy)
    plocha.appendChild(popis)
    $(popis).draggable({
        start: initDragging,
        drag: updateConnectors
    }).click(function () {
        if ($(this).is('.ui-draggable-dragging')) {
            //   return;
        }
        //alert ( this.innerHTML )
        getDraggableById(this.firstChild.getAttribute("data-id"))
        actualInstance = this;
    });

    getInputMaxLength();
}

function  addDraggableText(txt, posX, posY) {
   draggable_count++;
    var novy = document.createElement("span");
    novy.innerHTML=  txt;
    novy.setAttribute("draggable", "true");
    novy.setAttribute("data-id", "drag_" + draggable_count);
    novy.setAttribute("alt", "draggable text");
    novy.setAttribute("contenteditable", "true");
    novy.className = "draggable";
    //novy.ondragstart = dragStartEvent;
    //novy.ondragend = dragEndEvent;
    novy.onclick = function () { selectDraggable(this) }
    //novy.onload = function () {unifyDraggables() }
    
    var adder = document.getElementById("add_draggable");
    if (adder) {
      adder.parentNode.insertBefore(novy, adder)
    }
    else { document.getElementById("dragbase").appendChild(novy) }
    $(novy).draggable({ helper: "clone", start: initDragging,  stop: stopDragging, drag: updateConnectors } )
   // $("#dragbase").append(novy)
    //alert(novy.width)
       
    addInstanceOf(novy, posX, posY);
    
    unifyDraggables()
 }
 
 function deleteSelectedDraggable() {
     if (!actualDraggable) return;

     var content = actualDraggable;
     var drops = $(".droparea")
     for (var i = drops.length - 1; i > -1; i--) {
         if (drops[i].firstChild.nodeName == content.nodeName && drops[i].firstChild.getAttribute("data-id") == content.getAttribute("data-id")) {
             drops[i].parentNode.removeChild(drops[i])
         }
     };

     actualDraggable.parentNode.removeChild(actualDraggable);
     actualDraggable = null;

     unifyDraggables();

     document.getElementById("del_draggable").style.display = "none";
     document.getElementById("imgSize").style.display = "none";
     document.getElementById("textValue").style.display = "none";
 }
function getDraggableById(did) {
  $("span[data-id]").removeClass("actual")
   var sought = $("#dragbase span[data-id='" + did +"']")[0];
   $("span[data-id='" + did +"']").addClass("actual")
    if (sought) { selectDraggable(sought); }
}

 function selectDraggable(node) {

     if (actualDraggable) $(actualDraggable).removeClass("actual");

     actualDraggable = node;
     var ad = $(actualDraggable)
     ad.addClass("actual")
     if (!ad.attr("data-orig-width")) {
         ad.attr("data-orig-width", ad.width());
         ad.attr("data-orig-height", ad.height());
     }

     document.getElementById("imgSize").style.display = "none";
     document.getElementById("textValue").style.display = "none";
     if (actualDraggable.nodeName.toLowerCase() == "img") {
         document.getElementById("imgSize").style.display = "block";
         $("#dg_width").spinner("value", ad.width());
         $("#dg_height").spinner("value", ad.height());
     }

     if (actualDraggable.nodeName.toLowerCase() == "span") {
         document.getElementById("textValue").style.display = "block";
         document.getElementById("dg_text").value = actualDraggable.innerHTML;

     }

     document.getElementById("del_draggable").style.display = "block"
 }
function updateDgText () {
  var newContent = document.getElementById("dg_text").value
    actualDraggable.innerHTML = newContent
 
    $("#qArea [data-id='" +actualDraggable.getAttribute("data-id") + "']").html(newContent)
    unifyDraggables() 
    getInputMaxLength();
}

function updateDgWidth() {
  actualDraggable.width = $("#dg_width").spinner( "value" );
  var ow = parseFloat(actualDraggable.getAttribute("data-orig-width"));
  var oh = parseFloat(actualDraggable.getAttribute("data-orig-height"));
  actualDraggable.height = Math.round(oh*parseFloat(actualDraggable.width)/ow)  
  $("#dg_height").spinner( "value", actualDraggable.height )  
  unifyDraggables() 
}

function updateDgHeight() {
  actualDraggable.height = $("#dg_height").spinner( "value" ); 
  var ow = parseFloat(actualDraggable.getAttribute("data-orig-width"));
  var oh = parseFloat(actualDraggable.getAttribute("data-orig-height"));
  actualDraggable.width = Math.round(ow*parseFloat(actualDraggable.height)/oh)  
  $("#dg_width").spinner( "value", actualDraggable.width )  
  unifyDraggables() 
}

//sjednoceni rozmeru dropareas 
 function unifyDraggables() {
  var drags = $(".draggable, .droparea span")
  droparea.width = 0; droparea.height = 0;
  for (var i = 0; i < drags.length; i++) {
   
    droparea.width = Math.max( droparea.width, $(drags[i]).width() )
    droparea.height = Math.max( droparea.height, $(drags[i]).height() )
  }
  $(".droparea").css( { "width": droparea.width + "px", "height": droparea.height + "px", "line-height": (droparea.height-2) + "px"} )
 }
 

  
  function createTestItem() {
   var qItems = "" 
    var range = window.getSelection().getRangeAt(0)
     var novy = document.createElement("SPAN")
     novy.setAttribute("class", "droparea");
     
     range.surroundContents(novy);
     
     checkItems()
     
  }
  
  function checkItems() {
   var base = document.getElementById("dragbase");
     base.innerHTML = ""
     
     var items = document.getElementById("qArea").querySelectorAll(".droparea");
     for (var i = 0; i < items.length; i++) {
        var item = document.createElement("SPAN");
        item.setAttribute("class", "testitem");
        item.setAttribute("draggable", "true");
        item.innerHTML = items[i].innerHTML;
        base.appendChild(item)
     }
    initDrag()
    
    checkLatex(document.getElementById("qArea"))
  }
  
  function clearFormat() {
  document.execCommand("removeFormat", false, null)
  checkItems()
 
  }
  
  function checkLatex(uzel) {
    if (uzel == null) return
    if (uzel.nextSibling) checkLatex(uzel.nextSibling)
    if (uzel.nodeType == 1 ) {
      //for (var i = 0; i < uzel.childNodes.length; i++) {   }
      checkLatex(uzel.firstChild);
      
    }
    if (uzel.nodeType == 3 ) {
      if (uzel.nodeValue.indexOf("$") == -1) return;
      var rodic = uzel.parentNode;
      var kousky = uzel.nodeValue.split("$");
      for (var j = 0; j < kousky.length; j++) {  //alert(kousky[j])
        var novy = null;
        if (j %2 == 0) {
          novy = document.createTextNode(kousky[j]) 
          rodic.insertBefore(novy, uzel)
          }
        if (j %2 == 1) { 
          novy = document.createElement("IMG");
          novy.setAttribute("src", "https://is.muni.cz/auth/system/tex2img?code=" + escape(kousky[j]) )
          novy.setAttribute("style", "vertical-align: -4px;")
          novy.setAttribute("alt", kousky[j])
          }
        rodic.insertBefore(novy, uzel)
      }
    rodic.removeChild(uzel)
    if (novy.nextSibling) checkLatex(novy.nextSibling)
    }
  }
  
  function insertTable() {
  var cols = parseInt(document.getElementById("table_cols").value)
  if (isNaN(cols)) cols = 2
  var rows = parseInt(document.getElementById("table_rows").value)
  if (isNaN(rows)) rows = 2
  
  var type = document.getElementById("table_class").value
  var trida = (type != "" ) ? "class='" + type + "'" : ""
  
  var head = document.getElementById("table_head").checked 
 
     var vystup = "<table " + trida + " width=\"100%\">"
      if (head) {
       vystup += "<tr>"
       for (var i = 0; i < cols; i++) vystup += "<th><\/th>"
       vystup += "<\/tr>"
      }
    for (var ii = 0; ii < rows; ii++) {
        vystup += "<tr>"
       for (var j = 0; j < cols; j++) vystup += "<td><\/td>"
       vystup += "<\/tr>"
    }
  vystup += "<\/table>"
  document.execCommand("insertHTML", false, vystup)
  }
  
   //alert( escape("x\\in\\{-2,-1,1,2\\}") )
  
function setQuestionType(typ) {
  document.getElementById("dragbase").style.display = (typ == "dad") ? "block" : "none"
  } 
   
function showPreview() {
  var qType = document.getElementById("question_type").value;
   var q = document.createElement("div");
   var trida = ""
   if (qType == "dad") { trida = " dad_move_sc"
     
   }
   q.setAttribute("class", "question" + trida)
   
   var qTitle = document.createElement("div");
   qTitle.setAttribute("class", "title")
   
   var task = document.createElement("div");
   task.setAttribute("class", "task") 
     
   var dragbase = document.createElement("div");
   dragbase.setAttribute("class", "dragbase")
   
   var content = document.createElement("div");
   content.setAttribute("class", "content")
   
   q.appendChild(qTitle)
   q.appendChild(task)
   if (qType == "dad") q.appendChild(dragbase)
   q.appendChild(content)
   
   qTitle.innerHTML = document.getElementById("edit_title").innerHTML
   task.innerHTML = document.getElementById("edit_task").innerHTML
   content.innerHTML = document.getElementById("qArea").innerHTML
   
   var sc =document.getElementById("shower-content")
   sc.innerHTML = ""  
   sc.appendChild(q)
   
   
   var items = sc.querySelectorAll(".droparea");
   var maxLength = 0;
     for (var i = 0; i < items.length; i++) {
      maxLength = Math.max(maxLength, items[i].innerHTML. length )
     }
     
     for (var i = 0; i < items.length; i++) {
        
        if (qType == "dad")
        { var item = document.createElement("SPAN");
        item.setAttribute("class", "draggable");
        item.setAttribute("draggable", "true");
        item.innerHTML = items[i].innerHTML;
        dragbase.appendChild(item)
        
        items[i].className = "droparea_move_sc"
        
        var tk = 0.5 //0.5
        items[i].setAttribute("style", "width: " + (maxLength*tk) + "em" )
        }
        else items[i].className = "droparea_move_sc"
        items[i].innerHTML = ""
        
        var field = document.createElement("input");
        field.setAttribute("type", "text")
        field.setAttribute("style", "width: " +(maxLength*tk) + "em")
        items[i].appendChild(field)
        //EventHelpers.addEvent(items[i], 'dragover', dragOverMoveSCEvent);
   	    //EventHelpers.addEvent(items[i], 'drop', dropMoveSCEvent);
     }
    if (qType == "dad") initDrag()
   
   document.getElementById("shower").style.left= "700px"
   }
   
function showCode() {
  /* pocet_a = 0;
   pocet_b = 0;
   pocet_c = 0;
   pocet_l = 0;
   pocet_m = 0;
   pocet_n = 0;
   pocet_r = 0;
   pocet_t = 0;
   pocet_v = 0;
   */
   var qType = document.getElementById("question_type").value;
   
   var pocet_t = 0;
   
   var area = document.createElement("textarea");
   area.setAttribute("rows", "10")
   area.setAttribute("cols", "70")
   
   var vystup = "<HTML>\n"
   vystup += "<style> @import \"/do/rek/el/storage/styles/testovy.css\";\n .popisovaci { font-family: Arial, sans-serif; font-size: 12px } @import \"/do/rek/el/storage/utils/jquery-ui/jquery-ui_min.css\"; <\/style>\n";
   vystup += "<script src=\"/do/rek/el/storage/utils/jquery/jquery-2.2.4.min.js\" type=\"text/javascript\"><\/script>\n"
   vystup += "<script src=\"/do/rek/el/storage/utils/jquery-ui/jquery-ui_min.js\" type=\"text/javascript\"><\/script>\n"
  vystup += "<script src=\"/do/rek/el/storage/utils/jquery-ui/jquery_ui_touch-punch.js\" type=\"text/javascript\"><\/script>\n"
   vystup += "<script src=\"/do/rek/el/storage/utils/dad/dragAndDrop_07.js\" type=\"text/javascript\"><\/script>\n"
   var trida = ""
   if (qType == "dad")  trida = " dad_clone"
   vystup += "<div class='question" + trida +"'>\n"
   
   var qTitle = document.getElementById("edit_title").innerHTML
   if (qTitle != "") vystup += "<div class=\"title\">" + qTitle + "<\/div>\n"
   var qTask = document.getElementById("edit_task").innerHTML
   if (qTask != "") vystup += "<div class=\"task\">" + qTask + "<\/div>\n"
      
   var dragitems = "";
   var dropareas = ""
   
      
   
   
   var contentWidth = 0;
   var contentHeight = 0;
   var maxWidth = 0;
   var maxHeight = 0;
   var spravne = ""
   
   var drops = document.querySelectorAll(".droparea"); // , #qArea img
   
     for (var i = 0; i < drops.length; i++) {
      var posX = drops[i].style.left;
      posX = parseInt(posX.substring(0, posX.indexOf("px")))
      var posY = drops[i].style.top;
      posY = parseInt(posY.substring(0, posY.indexOf("px")))
      
      contentWidth = Math.max(contentWidth, drops[i].offsetWidth + posX )
      contentHeight = Math.max(contentHeight, drops[i].offsetHeight + posY )
      
      var dropX = drops[i].style.left
      dropX = parseInt(dropX.substring(0, dropX.indexOf("px"))) + 0 
      
      var dropY = drops[i].style.top
      dropY = parseInt(dropY.substring(0, dropY.indexOf("px"))) + 2 
      
      var source = drops[i].firstChild.getAttribute("data-id")
        spravne  += ":t" + (i+1) + "=\"" + source +"\" ok\n"
      
      dropareas += " <span class=\"droparea_clone\" style=\"position: absolute; top: " + dropY + "; left: " +  dropX + "; width: " + droparea.width +"px; height: " +  droparea.height +"px; line-height: " +  (droparea.height -2) + "px \"> :t" + (i+1) + " </span>\n"
   
      
      }
 
    var bgImage = document.querySelector("#qArea img");
    if (!bgImage) return; // neni nastaveny obrazek na pozadi
    
    contentWidth = Math.max(contentWidth, bgImage.offsetWidth)   
    contentHeight = Math.max(contentHeight, bgImage.offsetHeight)
    
    var drags = document.querySelectorAll(".draggable");
    
    for (var i = 0; i < drags.length; i++) {
        if (drags[i].nodeName.toLowerCase() == "span") {
        dragitems  += " <span class=\"draggable\" draggable=\"true\">" + drags[i].firstChild.nodeValue + "<\/span>\n" ;
        //dropareas += " <span class=\"popis-t droparea_move_sc\" style=\"top: " + items[i].style.top + "; left: " +  items[i].style.left + "; width: " +  items[i].offsetWidth +"px; height: " +  items[i].offsetHeight +"px;\"> :t" + (i+1) + " </span>\n"
          }    
       if (drags[i].nodeName.toLowerCase() == "img") {
        
        dragitems  += " <img class=\"draggable\" data-id=\"" + drags[i].getAttribute("data-id") + "\" draggable=\"true\" src=\"" + drags[i].src + "\" alt=\"draggable item\"/>\n" ;
        
          }
        }
      
    var dragbase = "<div class=\"dragbase\">" + dragitems + "</div>\n"
    
    if (qType == "dad") vystup += dragbase
   
    vystup += "<div class=\"content\">\n" 
    var obr = document.querySelector("#qArea img")
    
    vystup += "<div class=\"popisovaci\" style=\"position: relative; width: " + contentWidth +"px; height: " + contentHeight +"px; background: url(" + obr.getAttribute("src") + ") " + obr.style.left + "  " + obr.style.top + " no-repeat\">\n"
   vystup += dropareas; 
    vystup += "<\/div>\n"
    vystup += "<\/div>\n"
 
    
    vystup += spravne
   
    if (!document.getElementById("code_auth").checked) vystup = vystup.replace(/https:\/\/is.slu.cz\/auth/g, "http://is.slu.cz");
   
   else { vystup = vystup.replace(/http:\/\/is.slu.cz/g, "https://is.slu.cz/auth"); }
   
    $('#code_shower' ).val(vystup)
    $('#dialog-showCode' ).dialog( 'open' )
   
  
   }
 
function setQMode(mode) {
    var text = document.getElementById("code_shower").value;
    if (mode == "noauth") {
        text = text.replace(/https:\/\/is.slu.cz\/auth/g, "http://is.slu.cz");
    }
    if (mode == "auth") {
        text = text.replace(/http:\/\/is.slu.cz/g, "https://is.slu.cz/auth");
    }

    document.getElementById("code_shower").value = text;

}

/****  Import kodu hotovych otazek              ***/

function showImportDialog() {
    
     $('#dialog-importCode' ).dialog( 'open' );
}


function importCode() {
    if (!isQuestionEmpty()) {
        if (!confirm("Importovaná otázka přepíše všechna dta ve formuláři. Opravdu načíst?")) {
            return;
        }
    }
        
    var vstup = document.getElementById("import_code").value;
    if (vstup == "") return;
    var question = vstup.substring(0, vstup.indexOf("\n:"));
    var solution = vstup.substring(vstup.indexOf("\n:"));
    if (question.indexOf("<div class=\"question") == -1) {
        alert("Tento typ otázky editor nepodporuje.")
        return;
    }
    
    question = question.substring(question.indexOf("<div class=\"question"))
    
    //nacitani prvku z 
    
    var div = document.createElement("div");
    div.innerHTML = question;
    
    
    var quest = { title: "", task: "", content: "", media: ""}
    var title = div.querySelector("div.title");
    if (title) quest.title = title.innerHTML;
    
    var task = div.querySelector("div.task");
    if (task) quest.task = task.innerHTML;
    
   
    
    var media = div.querySelector("div.media");
    var mediaUrl = "";
    var mediaType = "";
    if (media) {
        var cont = media.innerHTML;
        var match = cont.match(/www\.youtube\.com\/embed\/([^"]+)"/) 
        if (match) {
            mediaUrl = "www.youtube.com/watch?v=" + match[1];
            mediaType = "video";
        }
        match = cont.match(/value="klip=([^\&]+)\&amp;/);
         if (match) {
            mediaUrl = match[1];
             mediaType = (cont.match(/player_city\.swf/)) ? "video" : "audio";
        }
        match = cont.match(/value="id=([^\&]+)\&amp;/);
         if (match) {
            mediaUrl = "https://is.muni.cz/auth/video/" + match[1];
              mediaType = "video";
        }
        
        media.parentNode.removeChild(media);
    }
    
    var content = div.querySelector("div.content");
    if (content) quest.content = content.innerHTML;
        
    var mode = "gap_input";
    if (quest.content.indexOf(" :t") > -1) mode = "gap_input";
    if (quest.content.indexOf(" :v") > -1) mode = "gap_select";
    if (div.querySelector(".dad_move_sc")) mode = "gap_dad";
    
    var lines = solution.split(/\n+/g);
    var testItems = {};
    
    if (mode == "gap_input") {
        for (var i = 0; i < lines.length; i++) {
            var pattern = /:(t\d*)="([^"]*)"(\s+(nok|ok)?\s+([-+]?\d*\.?\d*\%?)*)*\s*("([^"]*)")*/;
            // 0 -cele, 1 - t+cislo, 2 - klic, 3- ok body, 4 - ok/nok, 5 - body, 7 - feedback 
            lines[i] = lines[i].replace(/\s+$/, "");
            var match = lines[i].match(pattern)
            if (match) {
                for (var j = 0; j < match.length; j++) {
                    if (match[j] == undefined) match[j] = "";
                }
                 var opt = { value: match[2], ok: match[3], score: match[5], fb: match[7].replace(/\&quot;/g, "\"" )};
                if (testItems[match[1]]) {
                    testItems[match[1]].push(opt);
                }
                else {
                   testItems[match[1]] = [ opt ]
                }
                }
            } 
        
        for (var i in testItems) {
            var vystup = "<span class=\"testitem t\" data-type=\"t\" contenteditable=\"false\">";
            for (var j = 0; j < testItems[i].length; j++) {
                var item = testItems[i][j];
                
                vystup += "<span class=\"option\" data-feedback=\"" + item.fb +"\" data-score=\"" + item.score +"\">" + item.value +"<\/span>";                
            }
            vystup += "<\/span>";
         
          quest.content = quest.content.replace( new RegExp(" :" + i + "_*"), vystup); 
        }
    
    }
    if (mode == "gap_dad") {
        for (var i = 0; i < lines.length; i++) {
            var pattern = /:(t\d*)="([^"]*)"(\s+(nok|ok)?\s+([-+]?\d*\.?\d*\%?)*)*\s*("([^"]*)")*/;
            // 0 -cele, 1 - t+cislo, 2 - klic, 3- ok body, 4 - ok/nok, 5 - body, 7 - feedback 
            lines[i] = lines[i].replace(/\s+$/, "");
           //quest.content = quest.content.replace(/\&quot;/g, "\"");
            
            var match = lines[i].match(pattern);
            if (match) {
                for (var j = 0; j < match.length; j++) {
                    if (match[j] == undefined) match[j] = "";
                }
                 var opt = { value: match[2], ok: match[3], score: match[5], fb: match[7].replace(/\&quot;/g, "\"" )};
                if (testItems[match[1]]) {
                    testItems[match[1]].push(opt);
                }
                else {
                   testItems[match[1]] = [ opt ]
                }
                }
            } 
        
        for (var i in testItems) {
            var vystup = "<span class=\"testitem t\" data-type=\"t\" contenteditable=\"false\">";
            for (var j = 0; j < testItems[i].length; j++) {
                var item = testItems[i][j];
                vystup += "<span class=\"option\" data-feedback=\"" + item.fb +"\" data-score=\"" + item.score +"\">" + item.value +"<\/span>";                
            }
            vystup += "<\/span>"
          
          quest.content = quest.content.replace( new RegExp("<span[^>]*class=\"droparea_move_sc\"[^>]*>\\s+:" + i + "\\s+<\/span>"), vystup);
            
        }
        
    
    }
    
    if (mode == "gap_select") {
        for (var i = 0; i < lines.length; i++) { //:v(\d*)([a-z])="([^"]*)"(\s+(nok|ok)?\s*([-+]?\d*\.?\d*\%?)*)?(\s+"([^"]*)")?
            var pattern = /:v(\d*)([a-z])="([^"]*)"(\s+(nok|ok)?\s*([-+]?\d*\.?\d*\%?)*)?(\s+"([^"]*)")?/;
            // 0 -cele, 1 - cislo, 2- pismeno, 3 - klic, 4- ok body, 5 - ok/nok, 6 - body, 8 - feedback 
            lines[i] = lines[i].replace(/\s+$/, "");
            var match = lines[i].match(pattern);
            if (match) {
                for (var j = 0; j < match.length; j++) {
                    if (match[j] == undefined) match[j] = "";
                }
                var index = parseInt(match[1]) -1;
                var opt = { letter: match[2],  value: match[3], ok: match[5], score: match[6], fb: match[8].replace(/\&quot;/g, "\"" )};
                if (!testItems["v" + match[2]]) {
                    testItems["v" + match[2]] = [ ];
                }
               
                testItems["v" + match[2]][index] = opt;
                }
            } 
        
        for (var i in testItems) {
            var vystup = "<span class=\"testitem v\" data-type=\"v\" contenteditable=\"false\">";
            for (var j = 0; j < testItems[i].length; j++) {
                var item = testItems[i][j];
                var correct = (item.ok == "ok") ? " data-correct='ok'" : ""
                vystup += "<span class=\"option\"" + correct+" data-feedback=\"" + item.fb +"\" data-score=\"" + item.score +"\">" + item.value +"<\/span>";                
            }
            vystup += "<\/span>"
           
          quest.content = quest.content.replace( new RegExp(" :v1" + i.substring(1) + ""), vystup); 
        }
    
    }
   
   resetAll();
    
    setMode(mode);
  	var editor = currentEditor;
	
  document.getElementById("edit_title").innerHTML = quest.title;
  document.getElementById("edit_task").innerHTML = quest.task;  

   if (mode == "gap_input" || mode == "gap_select" || mode == "gap_dad" ) {
   	      
      editor.setData( quest.content );
     
	}
	
 getInputMaxLength(); 
    if (mediaType == "video") {
        insertVideo(mediaUrl)
        
    }
    if (mediaType == "audio") {
        insertAudio(mediaUrl)
        
    }
    
}

   function hidePreview() {
     document.getElementById("shower").style.left= "-10000px"
   }
  


 /****************** pomocne funkce *****************/  
   
   function randomizer(a1, a2) {
      return Math.floor(3*Math.random()) - 1
   }
      // zjištění hodnoty prvky s daným id
 /*   function getValue(nodeId) {
      return document.getElementById(nodeId).value;
    } 
           */
    //nastavení hodnoty porvku s daným id
    function setValue(nodeId, code) {
      document.getElementById(nodeId).value = code;
    }
    
    // vložení HTML kódu do uzlu s daným id
    function setHTML(nodeId,code) {
      document.getElementById(nodeId).innerHTML = code;
    }
    
    //zjištění HTML kodu uvnitř daného uzlu 
    function getHTML(nodeId) {
      return document.getElementById(nodeId).innerHTML;
    } 

 var actual = { width: "", height: "", node: null };
 var maxim = { width: 0, height: 0};
 
 function selectItem(uzel) {
 if (actual.node) actual.node.style.borderColor = "#bbb"
   actual.node = uzel;
   uzel.style.borderColor = "red"
   var content = (uzel.nodeName.toLowerCase() == "span") ? uzel.firstChild.nodeValue : uzel.src
   document.querySelector("#item_content").value = content 
 }

  function updateTestItem() {
  if (!actual.node) return;
   var obsah = document.querySelector("#item_content").value
   obsah = obsah.replace(/\n/g, "")
   actual.node.firstChild.nodeValue = obsah
  }
 
 function addTestItems() {
  var obsah = document.querySelector("#new_items").value
  if (obsah == "") return;
  var radky = obsah.split("\n");
  
  for (var i = 0; i < radky.length; i++) {
    if (radky[i].value == "") continue;
    
    var novy = document.createElement("div");
    document.querySelector("#qArea").appendChild(novy)
    novy.setAttribute("class", "popis-t droparea_clone")
    novy.setAttribute("style", "left: " + (20) + "px; top: " + (i*30) + "px;" )
    novy.setAttribute("onmousedown", "recordSize(this)")
    novy.setAttribute("onmouseup", "checkSize(this)")
    novy.setAttribute("onclick", "selectItem(this)")
    novy.setAttribute("ondblclick", "editTitle(this)")
    novy.appendChild(document.createTextNode(radky[i]))
    
    maxim.width = Math.max(maxim.width, novy.offsetWidth);
    maxim.height = Math.max(maxim.height, novy.offsetHeight);
  }
  unifySize()
  
  $(".popis-t").draggable()
  $(".popis-t").resizable()

  

 }
 
 
 function recordSize(uzel) {
   actual.width = uzel.style.width;
   actual.height = uzel.style.height;
   
 } 
 
 function checkSize(uzel) {
   if (uzel.style.width != actual.width || uzel.style.height != actual.height ) {
    //alert("zmena velikosti")
    var popisy = document.querySelectorAll(".popis-t")
    for (var i = 0; i < popisy.length; i++) {
      if (popisy[i] == uzel ) continue;
      popisy[i].style.width = uzel.style.width
      popisy[i].style.height = uzel.style.height
    }
   }
 }   
function unifySize() {
  var popisy = document.querySelectorAll(".popis-t")
    for (var i = 0; i < popisy.length; i++) {
      popisy[i].style.width = maxim.width + "px"
      popisy[i].style.height = maxim.height + "px"
    }
}
 
 function loadImage(adresa) {
 if (adresa == undefined) adresa = document.querySelector("#pic_url").value
 if (adresa == "") return;
 
  var init = document.querySelector("#bg-init")
  var img = document.querySelector("#qArea img")
  
  if (init.style.display != "none") {
     init.style.display = "none";
     img = document.createElement("img");
     
     var svgNS = "http://www.w3.org/2000/svg"
     var svg = init.parentNode.insertBefore(document.createElementNS(svgNS,  "svg"),init)
     svg.setAttribute("xmlns", svgNS);
     svg.setAttribute("version", "1.1");
     svg.setAttribute("id", "connectors");
     svg.style.position = "absolute"
     svg.style.left = "0px"
     svg.style.top = "0px"
      svg.onclick = addConnectorAt 
     init.parentNode.insertBefore(img, svg)
     
  }
 
  img.setAttribute("src", adresa);
  
  img.onload = function() { 
    bgImage.src = this.src; 
    bgImage.width = this.width; 
    bgImage.height = this.height 
    
    
    
    $("#connectors").attr("width", this.width).attr("height", this.height).attr("viewbox", "0 0 " + this.width + " " + this.height)
    }
 }
 
 
 
 function deleteItem() {
  if (!actual.node) return;
  
  actual.node.parentNode.removeChild(actual.node);
  actual.node = null;
  document.querySelector("#item_content").value = ""
 }

function deleteInstance() {
  
  if (!actualInstance) return;
  actualInstance.parentNode.removeChild(actualInstance);
  actualInstance = null;
  
  document.getElementById("dg_text").value = ""
}
 
 function deleteAllItems() {
  $("#qArea .droparea").remove()
  
  document.getElementById("dg_text").value = ""
 }
 
 function editTitle(uzel) {
  var pole = document.createElement("input")
  var obsah = uzel.firstChild.nodeValue;
   
  pole.setAttribute("type", "text")
  pole.setAttribute("value", uzel.firstChild.nodeValue)
  //pole.setAttribute("onkeyup", "this.parentNode.childNodes[1].nodeValue = this.value")
  pole.setAttribute("onkeydown", "this.parentNode.childNodes[1].nodeValue = this.value")
  pole.setAttribute("onchange", "this.parentNode.childNodes[1].nodeValue = this.value")
  pole.setAttribute("onblur", "this.parentNode.insertBefore(document.createTextNode(this.value), this.parentNode.firstChild); this.parentNode.removeChild(this.parentNode.childNodes[1])")
  pole.className = "editacni"
  uzel.insertBefore(pole, uzel.firstChild )
  pole.focus()
  uzel.removeChild(uzel.childNodes[1])
 }
 
 
var positioning = "rel";
var dad = "classic"
var mainMode = "";

var textMaxLength = 0;
var textMaxChars = 0;
var currentEditor = null;
 
function resetAll() {
 
    $("#editForms section").remove();
    addPlainArea();
    
    $(".droparea").remove()
    $("#dragbase .draggable").remove()
    document.getElementById("edit_title").innerHTML = ""
    document.getElementById("edit_task").innerHTML = ""
    
       
    $( "#tabs" ).tabs( "option", "active", 0 );
    
    deleteMedia();
   // $("#br-init").html("").click(function() { $('#dialog-setBgImage' ).dialog( 'open' ) })
    
}

function gotoMainSelect() {
    document.getElementById("main_select").style.display = "block"
    document.getElementById("edit_panes").style.display = "none"
}

function isQuestionEmpty() {
    
    var isEmpty = true;
    var cont = document.getElementById("edit_title").innerHTML;
    cont = cont.replace(/<br\/?>/g, "");
    cont = cont.replace(/\s+/g, "");
    if (cont != "" ) isEmpty = false;
   
    cont = document.getElementById("edit_task").innerHTML; 
    cont = cont.replace(/<br\/?>/g, "");
    cont = cont.replace(/\s+/g, "");
    if (cont != "" ) isEmpty = false;
    
    console.log("Content: $" + cont + "$");
    
    var obsah = document.querySelector(".editArea");
    if (obsah) {
        var cont = obsah.innerHTML;
        if (cont != "" && cont != "<p><br></p>" && cont != "<p><br /></p>") isEmpty = false;
        console.log("Obsah: $" + cont + "$");
    }
    console.log("IsEmpty: " + isEmpty+ "")
    return isEmpty;
}

function setMode(mode) {
    console.log("Zmena modu z " + mainMode + " na " + mode);
    var isEmpty = isQuestionEmpty();
    

    if (mainMode != "" && mainMode == mode) { //nothing new, let's quit
        return;
    }

    if ( isEmpty ) {
       mainMode = mode;
       resetAll(); 
    }

       


    if ((mainMode == "gap_input" && mode == "gap_select" || mainMode == "gap_dad" && mode == "gap_select" || mainMode == "gap_select" && mode == "gap_dad" || mainMode == "gap_select" && mode == "gap_input") && !isQuestionEmpty()) {
        if (confirm("Všechna data otázky budou vymazána. Opravdu pokračovat?")) {
            mainMode = mode;
            resetAll();
            
        } else {
            if (mainMode == "gap_input") document.getElementById("mainmode_input").checked = true;
            if (mainMode == "gap_select") document.getElementById("mainmode_select").checked = true;
            if (mainMode == "gap_dad") document.getElementById("mainmode_dad").checked = true;
            
             return;
        }
    }
    if (mode == "gap_input") document.getElementById("mainmode_input").checked = true;
    if (mode == "gap_select") document.getElementById("mainmode_select").checked = true;
    if (mode == "gap_dad") document.getElementById("mainmode_dad").checked = true;
    
    document.getElementById("edit_panes").style.display = "block"

    mainMode = mode;

    var activeTab = $("#tabs").tabs("option", "active");
    if (activeTab == 1) generatePreview();
    if (activeTab == 2) generateCode();
 
    var demo = document.getElementById("demos"); 
    demo.style.display = (demos[mainMode].length > 0) ? "block" : "none"

   $("#demos input").remove();

    for (var i = 0; i < demos[mainMode].length; i++) {
        var input = demo.appendChild(document.createElement("input"));
        input.type = "button";
        input.value = "Vzorový příklad";
        input.onclick = showDemo;
        input.className = "ui-button ui-widget ui-state-default ui-corner-all";
        input.setAttribute("data-index", i)
    }

    switch (mode) {
    case "gap_input":
        //document.getElementById("dragbase").style.display = "none"

        document.getElementById("browser_warning").style.display = "none"
        document.getElementById("form_relative").style.display = "block";
        break;

    case "gap_select":
        //  document.getElementById("dragbase").style.display = "none"
        document.getElementById("browser_warning").style.display = "none"
        document.getElementById("form_relative").style.display = "block"

        break;

    case "gap_dad":
        document.getElementById("browser_warning").style.display = "block"
            // document.getElementById("dragbase").style.display = "block"
        document.getElementById("form_relative").style.display = "block"

        break;


    default:
        break;
    }
}


function setDad(val) {
    dad = val;
    
    if (val == "dad") {
        document.getElementById("dragbase").style.display = "block";
    }
    else {
        document.getElementById("dragbase").style.display = "none";
    }
}

// The instanceReady event is fired, when an instance of CKEditor has finished
// its initialization.
CKEDITOR.on( 'instanceReady', function( ev ) {
	// Show the editor name and description in the browser status bar.
	document.getElementById( 'eMessage' ).innerHTML = 'Instance <code>' + ev.editor.name + '<\/code> loaded.';

	// Show this sample buttons.
	//document.getElementById( 'eButtons' ).style.display = 'block';
});

var configEditSimple = { 
  allowedContent: true,
    
  toolbar: [
      { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] },
       ['FontSize', 'TextColor', 'BGColor'],
      { name: 'insert', items : ['SpecialChar'] }
     
				
				]
      
};

var configEditText = { 
  allowedContent: true,
   extraPlugins: "testitems",
    
  toolbar: [
          { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] },
					[ 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
					[ 'FontSize', 'TextColor', 'BGColor' ] ,
				  { name: 'paragraph', groups: [ 'indent', 'blocks', 'align'], items: [ 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] },
				  { name: 'insert', items : [ 'Table','HorizontalRule','SpecialChar'] },
      { name: 'tests', items : [ "InsertTestField"] },
				
				],  
    
  on: {
    focus: onFocus,
    blur: onBlur,
    
    dataReady: function (evt) {
        getInputMaxLength(); 	                     
    },
      
    selectionChange: function(evt) {
             
        document.getElementById("testitem_content").style.display = "none";
        if (actSelected) {
            actSelected.classList.remove("actual");
            actSelected = null;
        }
           var selected = evt.editor.getSelection().getStartElement().$
           var name = selected.nodeName.toLowerCase()
          document.getElementById( 'eMessage' ).innerHTML = selected.nodeName + "." + selected.className 
          
         
          if (name == "span" && selected.classList.contains("option")) {
              if (actSelected) {
                  actSelected.classList.remove("actual");
              }
              actSelected = selected.parentNode;
              actSelected.classList.add("actual");
                readTestitem(selected.parentNode);
               
             }
             if (name == "span" && selected.classList.contains("testitem")) {
                  if (actSelected) {
                      actSelected.classList.remove("actual");
                  }
                 actSelected = selected;
                 actSelected.classList.add("actual");
                readTestitem(selected);
               
             }
          if (name == "textarea" && selected.className.indexOf("testitem") > -1) {
              
                actSelected = selected;
                readTestitem(selected);
                
             } 
          
            
       }
    
    } 
};

var configEditSelect = {
    allowedContent: true,
    extraPlugins: "testitems",

    toolbar: [
        {
            name: 'basicstyles',
            groups: ['basicstyles', 'cleanup'],
            items: ['Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat']
        },
     ['NumberedList', 'BulletedList', '-', 'Link', 'Unlink'],
     ['FontSize', 'TextColor', 'BGColor'],
        {
            name: 'paragraph',
            groups: ['indent', 'blocks', 'align'],
            items: ['Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock']
        },
        {
            name: 'insert',
            items: ['Table', 'HorizontalRule', 'SpecialChar']
        },
        {
            name: 'tests',
            items: ["InsertDropdown"]
        },

    ],

    on: {
        focus: onFocus,
        blur: onBlur,



        selectionChange: function (evt) {

            document.getElementById("testitem_content").style.display = "none";
            if (actSelected) {
                actSelected.classList.remove("actual");
                actSelected = null;
            }
            var selected = evt.editor.getSelection().getStartElement().$
            var name = selected.nodeName.toLowerCase()
            document.getElementById('eMessage').innerHTML = selected.nodeName + "." + selected.className


            if (name == "span" && selected.className == "option") {
                if (actSelected) {
                    actSelected.classList.remove("actual")
                }
                actSelected = selected.parentNode;
                actSelected.classList.add("actual");
                readTestitem(selected.parentNode);

            }
            if (name == "span" && selected.className.indexOf("testitem") > -1) {
                if (actSelected) {
                    actSelected.classList.remove("actual")
                }
                actSelected = selected;
                actSelected.classList.add("actual");
                readTestitem(selected);

            }
            if (name == "textarea" && selected.className.indexOf("testitem") > -1) {

                actSelected = selected;
                readTestitem(selected);

            }


            // document.getElementById( 'eMessage' ).innerHTML = name + "." + selected.$.className

        }

    }
};

function hideToolBarDiv( evt )  {
        // Select the correct toolbar DIV and hide it.
        //'event.editor.name' returns the name of the DIV receiving focus.
        document.getElementById(evt.editor.name+'TBdiv').style.display= "none";
     }

function InsertHTML(content) {
	// Get the editor instance that we want to interact with.
	var editor = CKEDITOR.currentInstance; //instances.editor1;


	// Check the active editing mode.
	if ( editor.mode == 'wysiwyg' )
	{
		// Insert HTML code.
		// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertHtml
		editor.insertHtml( content );
	}
	else
		alert( 'You must be in WYSIWYG mode!' );
		
	
}

function addSubquestion(node) {
  
  var section = node.parentNode.insertBefore(document.createElement("section"), node);
  section.className = "subquestion"
  
  var task = section.appendChild(document.createElement("h4"))
  task.setAttribute("contenteditable", "true");
  task.innerHTML = "zadání"
  
  var div = section.appendChild(document.createElement("div"));
  div.setAttribute("contenteditable", "true");
  div.innerHTML = "&nbsp;";
  div.className = "editArea"
  /*
  var toolbar = section.appendChild(document.createElement("fieldset"));
  toolbar.className = "toolbar"
  
  var input = toolbar.appendChild(document.createElement("input"));
  input.type = "button";
  input.value = "Smazat podotázku";
  input.className = "deleter"
  input.onclick = function () { deleteSubquestion(this) }
  */
  
  CKEDITOR.inline(div, configEdit)
  CKEDITOR.inline(task, configEdit)
}

function addSubquestionRC(node, type) {
  var varCount = parseInt(document.getElementById("count_sq" + type).value );
  if (varCount == undefined || isNaN(varCount)) varCount = 3;
  var section = node.parentNode.insertBefore(document.createElement("section"), node);
  section.className = "subquestion choicer"
  
  var task = section.appendChild(document.createElement("h4"))
  task.setAttribute("contenteditable", "true");
  task.innerHTML = "zadání"
  
  var list = section.appendChild(document.createElement("ol"));
  
  for (var i =0; i < varCount; i++) {
    list.appendChild(createRCVariant(type));
    
  }
  var appender = section.appendChild(document.createElement("input"));
    appender.type = "button";
    //appender.src = "design/add_option.png";
    appender.value = "Přidat položku";
    appender.title = "Přidat položku"
    appender.className = "itemAppender";
    appender.onclick = function () { appendRCVariant(this) }
  
    var toolbar = section.appendChild(document.createElement("fieldset"));
    toolbar.className = "toolbar"
    
    var input = toolbar.appendChild(document.createElement("input"));
    input.type = "button";
    input.value = "Smazat podotázku";
    input.className = "deleter"
    input.onclick = function () { deleteSubquestion(this) }
  
}

function appendRCVariant(node) {
  var list = node.parentNode.querySelector("ol");
  var type = list.querySelector(".checker").type
  list.appendChild(createRCVariant(type.charAt(0)));
} 

function deleteRCVariant(node) {
  var item = node.parentNode;
  item.parentNode.removeChild(item);  
}

function createRCVariant(type) {
  var li = document.createElement("li");
    
    var deleter = li.appendChild(document.createElement("input"));
    deleter.type = "image";
    deleter.value = "x";
    deleter.src= "design/delete_option.png"
    deleter.title = "Smazat položku"
    deleter.className = "deleter";
    deleter.onclick = function () { deleteRCVariant(this) } 
                                     
    var editer = li.appendChild(document.createElement("span"));
    editer.className = "editer";
    
    var check = editer.appendChild(document.createElement("input"));
    check.type = (type == "r") ? "radio" : "checkbox";
    
     check.setAttribute("name", type + "c");
    check.className = "checker";
    
    var scorer = editer.appendChild(document.createElement("input"));
    scorer.type = "text";
    scorer.placeholder = "body"
    scorer.size = 3;
    
    var editArea = li.appendChild(document.createElement("div"));
    editArea.setAttribute("contenteditable", "true");
    editArea.innerHTML = "&nbsp;";
    editArea.className = "editArea" 
    CKEDITOR.inline(editArea, configEdit);
    
    return li;
}

function addPlainArea(node) {
    
  if (node == undefined) {
    node = document.getElementById("editForms").firstChild;
  }
  
  var section = node.parentNode.insertBefore(document.createElement("section"), node);
  
  section.className = "subquestion"
  
  var div = section.appendChild(document.createElement("div"));
  div.setAttribute("contenteditable", "true");
  div.innerHTML = "&nbsp;";
  div.className = "editArea"
  var cfg = (mainMode == "gap_select" ) ? configEditSelect : configEditText;
    
  currentEditor = CKEDITOR.inline(div, cfg);
 
}

function deleteSubquestion(node) {
  if (confirm("Opravdu smazat podotázku?")) {
  var sq = node.parentNode.parentNode;
  sq.parentNode.removeChild(sq);
  }  
}


var defaultTI = {
                a : "<textarea data-type='a' class='testitem a' contenteditable=\"false\" rows='2' cols='70' ></textarea>",
                t : "<span class=\"testitem t\" contenteditable=\"false\" data-type=\"t\"><span class=\"option\" data-feedback=\"\" data-score=\"\">text</span></span>",
                n : "<span class=\"testitem n\" contenteditable=\"false\" data-type=\"n\"><span class=\"option\" data-feedback=\"\" data-score=\"\">12.3</span></span>",
                v : "<span class=\"testitem v\" contenteditable=\"false\" data-type=\"v\"><span class=\"option\" data-feedback=\"\" data-score=\"\" data-correct=\"ok\">varianta 1</span><span class=\"option\" data-feedback=\"\" data-score=\"\">varianta 2</span><span class=\"option\" data-feedback=\"\" data-score=\"\">varianta 3</span></span>"
                }

function readTestitem(node) {
    report("&#160;");  
    var iform = document.getElementById("edited_testitem");
    iform.parentNode.style.display = "block";
    var dialog = document.getElementById("testitem_content");

    
    iform.innerHTML = "";

    var itype = "";
    if (node.classList.contains("t")) itype = "t";
    if (node.classList.contains("v")) itype = "v";
    if (node.classList.contains("n")) itype = "a";
    //node.className.substring(node.className.indexOf(" ") + 1);
    if (itype == "t" || itype == "n" || itype == "v") {
        var opts = node.querySelectorAll(".option");
        var table = iform.appendChild(document.createElement("table"));
        table.className = itype + "_edit"

        var thead = table.appendChild(document.createElement("tr"))
        var th = thead.appendChild(document.createElement("th"))
        th = thead.appendChild(document.createElement("th"));
        th.className = itype + "_ok"
        th.innerHTML = "OK"
        th = thead.appendChild(document.createElement("th"))
        th.innerHTML = "Odpověď"
        th = thead.appendChild(document.createElement("th"))
        th.innerHTML = "Body"

        th = thead.appendChild(document.createElement("th"))
        th.innerHTML = "Zpětná vazba"

        iform.appendChild(table)

        for (var i = 0; i < opts.length; i++) {
            var isError = opts[i].classList.contains("error");
            
            var tr = table.appendChild(document.createElement("tr"))

            var td = tr.appendChild(document.createElement("td"))
            var input = td.appendChild(document.createElement("input"));
            input.value = "Odstranit variantu";
            input.title = "Odstranit variantu";
            input.type = "image";
            input.src = "design/delete_option.png";
            input.onclick = removeTIOption;

            var isOK = (itype == "t" || itype == "n") ? true : opts[i].hasAttribute("data-correct")
            td = tr.appendChild(document.createElement("td"));
             td.className = "edit_ok"
            input = td.appendChild(document.createElement("input"));
            input.value = "Varianta je OK";
            input.title = "Varianta je OK";
            input.type = "checkbox";
            input.checked = isOK;
            input.onchange = function (evt) {
                updateTestitem(evt);
            }
            if (isOK && itype == "v") tr.className = "correct";
           
            td = tr.appendChild(document.createElement("td"));
            var input1 = document.createElement("input");
            input1.value = opts[i].innerHTML;
            input1.onchange = updateTestitem;
            input1.onkeyup = updateTestitem;
            if (isError && input1.value == "") {
                input1.classList.add("error");
                report("Varianta odpovědi nemůže být prázdný řetězec.", "error")
            }
            
            td.className = "ti_value"
            td.appendChild(input1)

            td = tr.appendChild(document.createElement("td"));
            var input2 = document.createElement("input");
            input2.value = opts[i].getAttribute("data-score");
            input2.onchange = updateTestitem;
            input2.onkeyup = updateTestitem;
            
            td.className = "ti_score"
            td.appendChild(input2);
            var match = input2.value.match(/[-+]?\d+\.?\d*\%?/);
            if (input2.value.length > 0 && 
                  (!match || match && match[0].length != input2.value.length)
                 ) {

                  input2.classList.add("error");
                  report("Nesprávné bodové hodnocení.", "error");
                 
              }
            

            td = tr.appendChild(document.createElement("td"))
            var input3 = document.createElement("input");
            input3.value = opts[i].getAttribute("data-feedback");
            
            input3.onchange = updateTestitem;
            input3.onkeyup = updateTestitem;
            
            td.className = "ti_feedback"
            td.appendChild(input3)

        }
        var adder = iform.appendChild(document.createElement("input"));
        adder.type = "image"
        adder.src = "design/add_option.png"
        adder.title = "Přidat variantu"
        adder.value = "Přidat variantu"
        adder.onclick = function (evt) {
            addTIOption();
            updateTestitem(evt);
        }
        
//       var fb = document.createElement("p");
//        fb.setAttribute("id", "feedback");
//         iform.appendChild(fb);
//        

        var updater = document.createElement("input");
        updater.type = "button"
        updater.className = "updater"
        updater.title = "Uložit změny a zavřít"
        updater.value = "OK"
        updater.onclick = function (evt) {
            updateTestitem(evt);
            this.parentNode.parentNode.style.display = 'none'
        }
        iform.appendChild(updater);
        
         var deleter = document.createElement("input");
        deleter.type = "button"
        deleter.className = "deleter"
        deleter.title = "Smazat prvek"
        deleter.value = "Smazat prvek"
        deleter.onclick = function (evt) {
            if (confirm("Opravdu smazat prvek?") ) {
                deleteTestitem(evt);
                this.parentNode.parentNode.style.display = 'none'
            }
            
        }
        iform.appendChild(deleter)
        
    }



    if (itype == "a") {
        var label = iform.appendChild(document.createElement("label"))
        label.appendChild(document.createTextNode("Šířka: "))
        var input = label.appendChild(document.createElement("input"))
        input.type = "text"
        input.value = node.cols
        input.setAttribute("data-min", "40");
        input.setAttribute("data-max", "120");
        input.setAttribute("data-target", "cols");
        var inc = label.appendChild(document.createElement("input"))
        inc.type = "button"
        inc.value = "+"
        inc.setAttribute("data-change", "10");
        inc.onclick = changeValue;

        var dec = label.appendChild(document.createElement("input"))
        dec.type = "button"
        dec.value = "-"
        dec.setAttribute("data-change", "-10");
        dec.onclick = changeValue;

        label = iform.appendChild(document.createElement("label"))
        label.appendChild(document.createTextNode("Výška: "))
        input = label.appendChild(document.createElement("input"))
        input.type = "text"
        input.value = node.rows
        input.setAttribute("data-min", "1");
        input.setAttribute("data-max", "15");
        input.setAttribute("data-target", "rows");

        inc = label.appendChild(document.createElement("input"))
        inc.type = "button"
        inc.value = "+"
        inc.setAttribute("data-change", "1");
        inc.onclick = changeValue;

        dec = label.appendChild(document.createElement("input"))
        dec.type = "button"
        dec.value = "-"
        dec.setAttribute("data-change", "-1");
        dec.onclick = changeValue;
    }

}

function updateTestitem(evt) {
    //if (evt) {}
  report("&#160;")  
  if (!actSelected) return;
  actSelected.innerHTML = "";
  actSelected.classList.remove("error");
    var correctSelected = false;
    
  var opts = document.querySelectorAll("#edited_testitem tr");
  for (var i = 1; i < opts.length; i++) {
      var item = opts[i].parentNode;
      item.classList.remove("error");
      
      var fields = opts[i].querySelectorAll("input");
      var opt = actSelected.appendChild(document.createElement("span"));
      opt.className = "option";
      if (fields[1].checked) {
          opt.setAttribute("data-correct", "ok");
          correctSelected = true;
      }
      var field = fields[2];
      field.classList.remove("error");
      opt.classList.remove("error");
      opt.innerHTML = field.value;
      if (field.value == "") {
          if (!actSelected.classList.contains("error")) actSelected.classList.add("error");
          field.classList.add("error");
          opt.classList.add("error");
          //item.classList.add("error");
          
          report("Varianta odpovědi nemůže být prázdný řetězec.", "error");
          if (evt.target == field) return;
      }
            
      field = fields[3];
      field.classList.remove("error");
      opt.setAttribute("data-score", fields[3].value);
      //alert(typeof field.value.match(/[-+]?\d+\.?\d*\%?/)); //[-+]?\d*\.?\d*\%?
      var match = field.value.match(/[-+]?\d+\.?\d*\%?/);
      if (field.value.length > 0 && 
          (!match || match && match[0].length != field.value.length)
         ) {
          if (!actSelected.classList.contains("error")) actSelected.classList.add("error");
          field.classList.add("error");
          opt.classList.add("error");
          report("Nesprávné bodové hodnocení.", "error");
          if (evt.target == field) return; 
      }
      
      opt.setAttribute("data-feedback", fields[4].value);
      
  
  }
  if (mainMode == "gap_select" && !correctSelected) {
      if (!actSelected.classList.contains("error")) actSelected.classList.add("error");
      report("Alespoň jedna varianta musí být označená jako správná.", "error");
      
  }
  
    
    
  getInputMaxLength();
  if (!checkTestItems() ) {
        reportGlobal("Otázka obsahuje chyby. Po jejich odstranění bude možné pokračovat dále.", "error");
    }
    else {
        reportGlobal("", "");
    }
}

function deleteTestitem(evt) {
    if (!actSelected) return;

    actSelected.parentNode.removeChild(actSelected);
    actSelected = null;
    getInputMaxLength();
}

function report (text, type) {
    var fb = document.getElementById("feedback");
    fb.className = "";
    if (type != undefined) fb.className = type;
    
    fb.innerHTML = text;
}

function reportGlobal (text, type) {
    var fb = document.getElementById("fb_global");
    fb.className = "";
    if (type != undefined) fb.className = type;
    
    fb.innerHTML = text;
}

function addTIOption() {
var table = document.querySelector("#edited_testitem table")
    var tr = table.appendChild(document.createElement("tr"))
    
    var td = tr.appendChild(document.createElement("td"))
     var input = td.appendChild(document.createElement("input"));
    input.value = "Odstranit variantu";
    input.title = "Odstranit variantu";
    input.type = "image";
    input.src = "design/delete_option.png";
    input.onclick = removeTIOption;
    
    td = tr.appendChild(document.createElement("td"))
    input = td.appendChild(document.createElement("input"));
    input.value = "Varianta je OK";
    input.title = "Varianta je OK";
    input.type = "checkbox";
    input.checked = false;
    input.onclick = updateTestitem;
    input.onchange = updateTestitem;
    td.className = "edit_ok"
    
    td = tr.appendChild(document.createElement("td"))
    var input1 = document.createElement("input");
    input1.value = "";
    input1.onkeyup = updateTestitem;
    input1.onchange = updateTestitem;
    td.className = "ti_value"
    td.appendChild(input1)
    
    td = tr.appendChild(document.createElement("td"))
    var input2 = document.createElement("input");
    input2.value = "";
    input2.onkeyup = updateTestitem;
    input2.onchange = updateTestitem;
    td.className = "ti_score"
    td.appendChild(input2)
    
    td = tr.appendChild(document.createElement("td"))
    var input3 = document.createElement("input");
    input3.value = "";
    input3.onkeyup = updateTestitem;
    input3.onchange = updateTestitem;
    td.className = "ti_feedback"
    td.appendChild(input3)
}

function removeTIOption(evt) {
  var tr = evt.currentTarget;
  if (tr.nodeName.toLowerCase() == "input") tr = tr.parentNode.parentNode;
  
  var rodic = tr.parentNode;
  if (rodic.querySelectorAll("tr").length > 2) {
      rodic.removeChild(tr);
      updateTestitem();
  }
  else { alert("V prvku musí zůstat alespoň jedna varianta."); return;  }
  
  
}

var actSelected = null;

function changeValue (evt) {
  var input = evt.currentTarget
  var change = parseInt(input.getAttribute("data-change"))
 
  
  var cil = input.parentNode.querySelector("input");
  var min = parseInt(cil.getAttribute("data-min"));
  var max = parseInt(cil.getAttribute("data-max"));
  var target = cil.getAttribute("data-target");
  var current = parseInt(cil.value);
  
  var newValue = Math.max( min, current + change);
  newValue = Math.min( max, newValue);
  
  actSelected.setAttribute(target, newValue);
  cil.value = newValue 
}

function generateCode() {
    if (!checkTestItems() ) {//chyba v polozkach, navrat k editaci
        reportGlobal("Otázka obsahuje chyby. Po jejich odstranění bude možné pokračovat dále.", "error");
        $("#tabs").tabs("option", "active", 0); 
        return;
    }
   
    reportGlobal("");
    document.getElementById("testitem_content").style.display = "none";
    var q_content;
   if (mainMode == "gap_input" | mainMode == "gap_select") q_content = GapInput.getCode() 
   //if (mainMode == "gap_select") q_content = getGapSelectCode()
   if (mainMode == "gap_dad") q_content = getGapDadCode()
   
   q_content.content = q_content.content.replace(/\&nbsp;/g, " ");
   q_content.content = q_content.content.replace(/\s+/g, " ");
   
   var qTitle = document.getElementById("edit_title").innerHTML
   if (qTitle == "Titulek otázky") qTitle = ""
   
   var qTask = document.getElementById("edit_task").innerHTML
   if (qTask == "Zadání otázky") qTask = ""
   
  
   
    var vystup = "<HTML>\n<style type=\"text/css\"> @import \"/do/rek/el/storage/styles/testovy.css\"; <\/style>\n"
    var classDAD = ""
    if (mainMode =="gap_dad" || mainMode =="desc_dad" || mainMode =="pic_dad"  ) {
        vystup += "<style type=\"text/css\"> @import \"/do/rek/el/storage/utils/jquery-ui/jquery-ui_min.css\"; </style>\n" + 
         "<script src=\"/do/rek/el/storage/utils/jquery/jquery-2.2.4.min.js\" type=\"text/javascript\"></script>" + 
          "<script src=\"/do/rek/el/storage/utils/jquery-ui/jquery-ui_min.js\" type=\"text/javascript\"></script>" + 
        "<script src=\"/do/rek/el/storage/utils/jquery-ui/jquery_ui_touch-punch.js\" type=\"text/javascript\"></script>" + 
        "<script src=\"/do/rek/el/storage/utils/dad/dragAndDrop_07.js\" type=\"text/javascript\"></script>\n";
        
        classDAD = " dad_move_sc"
    }
   
   if (mainMode =="pic_dad") {
    vystup += "<style type=\"text/css\"> @import \"/do/rek/el/storage/utils/jquery-ui/jquery-ui_min.css\"; </style>\n" + 
         "<script src=\"/do/rek/el/storage/utils/jquery/jquery-2.2.4.min.js\" type=\"text/javascript\"></script>" + 
          "<script src=\"/do/rek/el/storage/utils/jquery-ui/jquery-ui_min.js\" type=\"text/javascript\"></script>" + 
        "<script src=\"/do/rek/el/storage/utils/jquery-ui/jquery_ui_touch-punch.js\" type=\"text/javascript\"></script>" + 
        "<script src=\"/do/rek/el/storage/utils/dad/dragAndDrop_07.js\" type=\"text/javascript\"></script>\n";
    classDAD = " dad_clone" 
   }
    
    vystup += "<div class=\"question" + classDAD +"\">\n"
    

   if (qTitle.trim() != "") vystup += "<div class=\"title\">" + qTitle + "<\/div>\n"
   if (qTask.trim() != "") vystup += "<div class=\"task\">" + qTask +"<\/div>\n"
   
   if ( mainMode == "gap_dad" || mainMode == "desc_dad" ) {
        vystup += "<div class=\"dragbase\">\n";
        var spans = q_content.draggables //document.querySelectorAll("#dragbase span")
        for (var i = 0; i < spans.length; i++) {
            vystup += "<span class=\"draggable\" draggable=\"true\">" + spans[i] + "</span>\n"
        }
        vystup += "<\/div>\n"
    }
  
    
    
   vystup += "<div class=\"content\">\n";
    
   //audio nebo video v otazce
    var figure = document.querySelector("#multimedia_insert figure");
    if (figure) {
        vystup += "\n<div class='media'>" + figure.innerHTML + "</div>\n\n"
    }
   vystup += q_content.content + "\n</div>\n</div>\n"
    
   vystup += q_content.ok + "\n";
   vystup = vystup.replace(/table\>\s+\<tbody/g, "table><tbody")
   vystup = vystup.replace(/tbody\>\s+\<tr/g, "tbody><tr")
   vystup = vystup.replace(/tr>\s+\<tr/g, "tr><tr")
   vystup = vystup.replace(/tr>\s+\<td/g, "tr><td")
   vystup = vystup.replace(/td>\s+\<td/g, "td><td")
   vystup = vystup.replace(/td>\s+\<\/tr/g, "td></tr")
   vystup = vystup.replace(/tr>\s+\<\/tbody/g, "tr><\/tbody")
   vystup = vystup.replace(/tbody>\s+\<\/table/g, "tbody><\/table")
   vystup = vystup.replace(/t([dh]) style="[^"]+"/g, "t$1");
    
     if (!document.getElementById("code_auth").checked) vystup = vystup.replace(/https:\/\/is.slu.cz\/auth/g, "https://is.slu.cz");
   
   else { 
        vystup = vystup.replace(/https:\/\/is.slu.cz\/(el|do)/g, "https://is.slu.cz/auth/$1"); 
       vystup = vystup.replace(/http:\/\/is.slu.cz/g, "https://is.slu.cz/auth"); 
      
   }
    
     $('#code_shower' ).val(vystup);
  
}

var GapInput = {
   getPreview: function () {
       getInputMaxLength();
       var result = { content: "" } 
       var obsah = document.createElement("div");
       obsah.innerHTML = document.querySelector(".subquestion .editArea").innerHTML; 
      
        var tis = obsah.querySelectorAll(".testitem");
        var maxLength = Math.floor((textMaxChars*8))/10
        
        for (var i = 0; i < tis.length; i++) {
            var type = tis[i].getAttribute("data-type");
            var opts = tis[i].querySelectorAll(".option");
            
            if (type == "t") {
                var newTi = document.createElement("input");
                newTi.setAttribute("style", "width: " + maxLength + "em;")
                newTi.type = "text";
                newTi.value = ""
                
                tis[i].parentNode.insertBefore(newTi, tis[i]);
                tis[i].parentNode.removeChild(tis[i])
            }
           
            if (type == "v") {
            var newTi = document.createElement("select");
            newTi.appendChild(document.createElement("option"))
            for (var j = 0; j < opts.length; j++) {
            var opt = newTi.appendChild(document.createElement("option"));
            opt.innerHTML = opts[j].innerHTML
             
            }
                         
            tis[i].parentNode.insertBefore(newTi, tis[i]);
            tis[i].parentNode.removeChild(tis[i])
        }
          
        }
       result.content = obsah.innerHTML  
       return result;  
   },
    
    getCode: function () {
         getInputMaxLength();
        var result = { content: "", ok: "" }
       var obsah = document.createElement("div");
       obsah.innerHTML = document.querySelector(".subquestion .editArea").innerHTML; //CKEDITOR.instances.editor3.getData();
      
       var ti_counts = {a: 0, c: 0, l: 0, m: 0, n: 0, r: 0, s: 0, t: 0, v: 0}
       
        var t_ = "";
        for (var i = 0; i < textMaxChars; i++) t_ += "_"
        
        var tis = obsah.querySelectorAll(".testitem");
        
        for (var i = 0; i < tis.length; i++) {
            var type = tis[i].getAttribute("data-type");
            var opts = tis[i].querySelectorAll(".option");
            ti_counts[type]++;
            
            if (type == "t") {
               for (var j = 0; j < opts.length; j++) {
                   var score = opts[j].getAttribute("data-score");
                   var fb = opts[j].getAttribute("data-feedback");
                   if (fb != "") {
                       fb = fb.replace(/\"/g, "&quot;" )
                       fb = " \"" + fb + "\"";
                   }
                   result.ok += ":t" + ti_counts[type] + "=\"" + opts[j].innerHTML +"\" ok " + score + fb + "\n"
               }
                var ti_replace = "  :t" + ti_counts[type] + t_ + "  "
                tis[i].parentNode.insertBefore(document.createTextNode(ti_replace), tis[i]);
                tis[i].parentNode.removeChild(tis[i])
            }
           if (type == "v") {
                for (var j = 0; j < opts.length; j++) {
                   var score = opts[j].getAttribute("data-score");
                   var fb = opts[j].getAttribute("data-feedback");
                   if (fb != "") {
                       fb = " \"" + fb + "\"";
                   }
                   var is_ok = (opts[j].hasAttribute("data-correct") && opts[j].getAttribute("data-correct") == "ok") ? " ok " : " "
                   result.ok += ":v" + (j+1) + String.fromCharCode(96 + ti_counts[type]) + "=\"" + opts[j].innerHTML +"\" " + is_ok + score + fb + "\n" 
                }
               var ti_replace = "  :v1" + String.fromCharCode(96 + ti_counts[type]) + "  "
                tis[i].parentNode.insertBefore(document.createTextNode(ti_replace), tis[i]);
                tis[i].parentNode.removeChild(tis[i]) 
            }
          
        }
        
       result.content = obsah.innerHTML
       return result;
        }

    
}

var DADSorting = {
   getPreview: function () {
       var result = { content: "" } 
       var obsah = document.createElement("div");
       obsah.innerHTML = CKEDITOR.instances.editor1.getData();
      
        var tis = obsah.querySelectorAll(".testitem");
        
        for (var i = 0; i < tis.length; i++) {
            var type = tis[i].getAttribute("data-type");
            var opts = tis[i].querySelectorAll(".option");
            
            if (type == "t") {
                var newTi = document.createElement("input");
                newTi.setAttribute("style", "width: " + textMaxLength + "px;")
                newTi.type = "text";
                newTi.value = ""
                
                tis[i].parentNode.insertBefore(newTi, tis[i]);
                tis[i].parentNode.removeChild(tis[i])
            }
           
            if (type == "v") {
            var newTi = document.createElement("select");
            newTi.appendChild(document.createElement("option"))
            for (var j = 0; j < opts.length; j++) {
            var opt = newTi.appendChild(document.createElement("option"));
            opt.innerHTML = opts[j].innerHTML
             
            }
                         
            tis[i].parentNode.insertBefore(newTi, tis[i]);
            tis[i].parentNode.removeChild(tis[i])
        }
          
        }
       result.content = obsah.innerHTML  
       return result;  
   },
    
    getCode: function () {
        var result = { content: "", ok: "" }
       var obsah = document.createElement("div");
       obsah.innerHTML = CKEDITOR.instances.editor1.getData();
      
       var ti_counts = {a: 0, c: 0, l: 0, m: 0, n: 0, r: 0, s: 0, t: 0, v: 0}
       
        var t_ = "";
        for (var i = 0; i < textMaxChars; i++) t_ += "_"
        
        var tis = obsah.querySelectorAll(".testitem");
        
        for (var i = 0; i < tis.length; i++) {
            var type = tis[i].getAttribute("data-type");
            var opts = tis[i].querySelectorAll(".option");
            ti_counts[type]++;
            
            if (type == "t") {
               for (var j = 0; j < opts.length; j++) {
                   var score = opts[j].getAttribute("data-score");
                   result.ok += ":t" + ti_counts[type] + "=\"" + opts[j].innerHTML +"\" ok " + score + "\n"
               }
                var ti_replace = "  :t" + ti_counts[type] + t_ + "   "
                tis[i].parentNode.insertBefore(document.createTextNode(ti_replace), tis[i]);
                tis[i].parentNode.removeChild(tis[i])
            }
           if (type == "v") {
                for (var j = 0; j < opts.length; j++) {
                   var score = opts[j].getAttribute("data-score");
                   var is_ok = (opts[j].hasAttribute("data-correct") && opts[j].getAttribute("data-correct") == "ok") ? " ok " : " "
                   result.ok += ":v" + (j+1) + String.fromCharCode(96 + ti_counts[type]) + "=\"" + opts[j].innerHTML +"\" " + is_ok + score + "\n" 
                }
               var ti_replace = "  :v1" + String.fromCharCode(96 + ti_counts[type]) + "  "
                tis[i].parentNode.insertBefore(document.createTextNode(ti_replace), tis[i]);
                tis[i].parentNode.removeChild(tis[i]) 
            }
          
        }
        
       result.content = obsah.innerHTML
       return result;
        }

    
}

function getGapInputCode() {
   var result = { content: "", ok: "" }
   
    
   var obsah = document.createElement("div");
   obsah.innerHTML = CKEDITOR.instances.editor1.getData();
  
   var ti_counts = {a: 0, c: 0, l: 0, m: 0, n: 0, r: 0, s: 0, t: 0, v: 0}
    // zjisteni max. delky pouziteho retezce
   /*
    var maxLength = 0;
    var tisT = obsah.querySelectorAll(".testitem.t .option");
    for (var i = 0; i < tisT.length; i++) {
        maxLength = Math.max(maxLength, tisT[i].innerHTML.length);
    }
    */
    var t_ = "";
    for (var i = 0; i < textMaxChars; i++) t_ += "_"
    
    var tis = obsah.querySelectorAll(".testitem");
    
    for (var i = 0; i < tis.length; i++) {
        var type = tis[i].getAttribute("data-type");
        var opts = tis[i].querySelectorAll(".option");
        ti_counts[type]++;
        
        if (type == "t") {
           for (var j = 0; j < opts.length; j++) {
               var score = opts[j].getAttribute("data-score");
               result.ok += ":t" + ti_counts[type] + "=\"" + opts[j].innerHTML +"\" ok " + score + "\n"
           }
            var ti_replace = "  :t" + ti_counts[type] + t_ + "  "
            tis[i].parentNode.insertBefore(document.createTextNode(ti_replace), tis[i]);
            tis[i].parentNode.removeChild(tis[i])
        }
       
      
    }
    
   result.content = obsah.innerHTML
   return result;  
}

function getGapSelectCode() {
   var result = { content: "", ok: "" }
   var obsah = document.createElement("div");
   obsah.innerHTML = CKEDITOR.instances.editor1.getData();
  
   var ti_counts = {a: 0, c: 0, l: 0, m: 0, n: 0, r: 0, s: 0, t: 0, v: 0}
    // zjisteni max. delky pouziteho retezce
    var maxLength = 0;
        
    var tis = obsah.querySelectorAll(".testitem");
    
    for (var i = 0; i < tis.length; i++) {
        var type = tis[i].getAttribute("data-type");
        var opts = tis[i].querySelectorAll(".option");
        ti_counts[type]++;
             
        if (type == "v") {
            for (var j = 0; j < opts.length; j++) {
               var score = opts[j].getAttribute("data-score");
                var is_ok = (opts[j].hasAttribute("data-correct") && opts[j].getAttribute("data-correct") == "ok") ? " ok " : " "
               result.ok += ":v" + (j+1) + String.fromCharCode(96 + ti_counts[type]) + "=\"" + opts[j].innerHTML +"\" " + is_ok + score + "\n" 
            }
           var ti_replace = "  :v1" + String.fromCharCode(96 + ti_counts[type]) + "  "
            tis[i].parentNode.insertBefore(document.createTextNode(ti_replace), tis[i]);
            tis[i].parentNode.removeChild(tis[i]) 
        }
    }
    
   result.content = obsah.innerHTML
      result.content = result.content.replace(/\s(:v1.)\s/g, "  $1  ")
   return result;  
}

function getGapDadCode() {
   var result = { content: "", ok: "", draggables : [] }
   var obsah = document.createElement("div");
   obsah.innerHTML = document.querySelector(".subquestion .editArea").innerHTML; 
  
   var ti_counts = {a: 0, c: 0, l: 0, m: 0, n: 0, r: 0, s: 0, t: 0, v: 0}
    // zjisteni max. delky pouziteho retezce
     var tisT = document.querySelectorAll(".testitem.t .option");
    for (var i = 0; i < tisT.length; i++) {
        result.draggables.push(tisT[i].innerHTML)
    }
   
    var t_ = "";
    for (var i = 0; i < textMaxChars; i++) t_ += "_"
    var maxLength = Math.floor((textMaxChars*8))/10;
    var tis = obsah.querySelectorAll(".testitem");
    
    for (var i = 0; i < tis.length; i++) {
        var type = tis[i].getAttribute("data-type");
        var opts = tis[i].querySelectorAll(".option");
        ti_counts[type]++;
        
        if (type == "t") {
           for (var j = 0; j < opts.length; j++) {              
               var score = opts[j].getAttribute("data-score");
               var fb = opts[j].getAttribute("data-feedback");
               fb = fb.replace(/\"/g, "&quot;" );
               if (fb != "") {
                   fb = "\"" + fb + "\"";
               }
               result.ok += ":t" + ti_counts[type] + "=\"" + opts[j].innerHTML +"\" ok " + score + " " + fb + "\n"
           }
            //var ti_replace = " :t" + ti_counts[type] + "  "
            var newTi = document.createElement("span");
            var dadMinWidth = Math.max(3, maxLength/2);
            newTi.setAttribute("style", "min-width: " + dadMinWidth  + "em;")
            newTi.className = "droparea_move_sc"
            newTi.appendChild(document.createTextNode( "  :t" + ti_counts[type] + "  ")); 
            tis[i].parentNode.insertBefore(newTi, tis[i]);
            tis[i].parentNode.removeChild(tis[i]);
        }
       
      
    }
    
   result.content = obsah.innerHTML
   return result;  
}

function checkTestItems() {
   if (document.querySelector(".editArea .error")) {
       //alert();
       return false;
   }
    return true;
}

function generatePreview() {
    if (!checkTestItems() ) {
        reportGlobal("Otázka obsahuje chyby. Po jejich odstranění bude možné pokračovat dále.", "error");
        $("#tabs").tabs("option", "active", 0); //chyba v polozkach, navrat k editaci
        return;
    }
    
    reportGlobal("");
    document.getElementById("testitem_content").style.display = "none";
    
    var q_content;
   if (mainMode == "gap_input" || mainMode == "gap_select") q_content = GapInput.getPreview() 
   //if (mainMode == "gap_select") q_content = getGapSelectPreview()
   if (mainMode == "gap_dad") q_content = getGapDadPreview()
   if (mainMode == "desc_input") q_content = getDescInputPreview()
   if (mainMode == "desc_dad") q_content = getDescDadPreview()
   if (mainMode == "pic_dad") q_content = MatchMultiple.getPreview()
   
   if (mainMode == "match_multiple") q_content = getPicDadPreview()
   
   var qTitle = document.getElementById("edit_title").innerHTML
   if (qTitle == "Titulek otázky") qTitle = ""
   
   var qTask = document.getElementById("edit_task").innerHTML
   if (qTask == "Zadání otázky") qTask = ""
   
    var vystup = ""
    var classDAD = ""
    if (mainMode.indexOf("dad") > -1 ) {
        vystup += "<script src=\"https://is.muni.cz/auth/do/rect/el/storage/utils/dad/EventHelpers.js\" type=\"text/javascript\"><\/script>\n"
        vystup += "<script src=\"https://is.muni.cz/auth/do/rect/el/storage/utils/dad/DragDropHelpers.js\" type=\"text/javascript\"><\/script>\n"
        vystup += "<script src=\"https://is.muni.cz/auth/do/rect/el/storage/utils/dad/dragAndDrop_06.js\" type=\"text/javascript\"><\/script>\n"
        classDAD = " dad_move_sc"
    }
    
    if (mainMode =="pic_dad") {
    classDAD = " dad_clone" 
   }
    
    vystup += "<div class=\"question" + classDAD +"\">\n"
    if (qTitle != "") vystup += "<div class=\"title\">" + qTitle + "<\/div>\n"
   if (qTask != "") vystup += "<div class=\"task\">" + qTask +"<\/div>\n" 
    if ( mainMode == "gap_dad" || mainMode == "desc_dad" ) {
        vystup += "<div class=\"dragbase\">\n";
        var spans = q_content.draggables //document.querySelectorAll("#dragbase span")
        for (var i = 0; i < spans.length; i++) {
            vystup += "<span class=\"draggable\" draggable=\"true\">" + spans[i] + "</span>\n"
        }
        vystup += "<\/div>\n"
    }

    if ( mainMode == "pic_dad") {
        vystup += "<div class=\"dragbase\">\n";
        var spans = q_content.draggables //document.querySelectorAll("#dragbase span")
        for (var i = 0; i < spans.length; i++) {
            vystup += "<img class=\"draggable\" draggable=\"true\" data-id=\"" +  spans[i].id + "\" src=\"" + spans[i].src + "\" width=\"" + spans[i].width + "\" height=\"" + spans[i].height + "\" alt=\"draggable item\" \>\n"
        } 
    }
   
    //audio nebo video v otazce
    var figure = document.querySelector("#multimedia_insert figure");
    if (figure) {
        vystup += "<figure>" + figure.innerHTML + "</figure>"
    }
    
  
   vystup += "<div class=\"content\">\n"
   
   vystup += q_content.content
  
   vystup = vystup.replace(/td style="[^"]+"/g, "td") 
   //if (mainMode.indexOf("desc") > -1 || mainMode == "pic_dad" ) vystup += q_content.content
   vystup += "\n</div>\n</div>\n"
   
   if (mainMode.indexOf("dad") > -1) {
        vystup += "<p><script>updateDraggables();DragDropHelpers.fixVisualCues = true</script></p>\n";
   }
  
    
     document.getElementById("preview_content").innerHTML = vystup;
     updateDraggables()
     DragDropHelpers.fixVisualCues = true
//    document.getElementById("dialog-showPreview").style.display = "block"; 
    //$('#dialog-showPreview' ).dialog( 'open' )
   //document.getElementById("question_code").value = vystup;
}

function getInputMaxLength() {
   var maxLength = 0;
   var maxChars = 0;
    var tisT = document.querySelectorAll(".testitem.t .option");
    
    for (var i = 0; i < tisT.length; i++) { 
        maxLength = Math.max(maxLength, $(tisT[i]).width());
        maxChars = Math.max(maxChars, tisT[i].innerHTML.length);
    }
    
    tisT = document.querySelectorAll(".droparea span");
    for (var i = 0; i < tisT.length; i++) { 
        maxLength = Math.max(maxLength, $(tisT[i]).width());
        maxChars = Math.max(maxChars, tisT[i].innerHTML.length)
    }
    
    maxLength += 10
    textMaxLength = maxLength;
    textMaxChars = maxChars;
    //alert(textMaxChars) 
}

function getGapInputPreview() {
   var result = { content: "" } 
   var obsah = document.createElement("div");
   obsah.innerHTML = CKEDITOR.instances.editor1.getData();
  
    // zjisteni max. delky pouziteho retezce
   
    
 
    var tis = obsah.querySelectorAll(".testitem");
    
    for (var i = 0; i < tis.length; i++) {
        var type = tis[i].getAttribute("data-type");
        var opts = tis[i].querySelectorAll(".option");
        
        
        if (type == "t") {
            var newTi = document.createElement("input");
            newTi.setAttribute("style", "width: " + (textMaxChars*.8) + ";")
            newTi.type = "text";
            newTi.value = ""
            
            tis[i].parentNode.insertBefore(newTi, tis[i]);
            tis[i].parentNode.removeChild(tis[i])
        }
       
      
    }
   result.content = obsah.innerHTML  
   return result;  
}

function getGapSelectPreview() {
   var result = { content: "", ok: "" }
   var obsah = document.createElement("div");
   obsah.innerHTML = CKEDITOR.instances.editor1.getData();
  
   var ti_counts = {a: 0, c: 0, l: 0, m: 0, n: 0, r: 0, s: 0, t: 0, v: 0}
    // zjisteni max. delky pouziteho retezce
    var maxLength = 0;
        
    var tis = obsah.querySelectorAll(".testitem");
    
    for (var i = 0; i < tis.length; i++) {
        var type = tis[i].getAttribute("data-type");
        var opts = tis[i].querySelectorAll(".option");
        ti_counts[type]++;
             
        if (type == "v") {
            var newTi = document.createElement("select");
            newTi.appendChild(document.createElement("option"))
            for (var j = 0; j < opts.length; j++) {
            var opt = newTi.appendChild(document.createElement("option"));
            opt.innerHTML = opts[j].innerHTML
             
            }
                         
            tis[i].parentNode.insertBefore(newTi, tis[i]);
            tis[i].parentNode.removeChild(tis[i])
        }
    }
    
   result.content = obsah.innerHTML
   return result;  
}

function getGapDadPreview () {
    var result = { content: "", draggables: [] } 
   var obsah = document.createElement("div");
   obsah.innerHTML = document.querySelector(".subquestion .editArea").innerHTML; 
  
    // zjisteni max. delky pouziteho retezce
    
    var tisT = $(".testitem.t .option");
    for (var i = 0; i < tisT.length; i++) {
        
        result.draggables.push(tisT[i].innerHTML)
    }
  
    
 
    var tis = obsah.querySelectorAll(".testitem");
    
    for (var i = 0; i < tis.length; i++) {
        var type = tis[i].getAttribute("data-type");
        var opts = tis[i].querySelectorAll(".option");
        var maxLength = Math.floor((textMaxChars*8))/10
                             
        if (type == "t") {
            var newTi = document.createElement("span");
            newTi.setAttribute("style", "width: " + maxLength + "em;")
            newTi.className = "droparea_move_sc";
            
            var field = newTi.appendChild(document.createElement("input"));
            field.type = "text"
            field.value = ""
            
                        
            tis[i].parentNode.insertBefore(newTi, tis[i]);
            tis[i].parentNode.removeChild(tis[i])
        }
       
      
    }
   result.content = obsah.innerHTML
   return result;  
}

function InsertText() {
	// Get the editor instance that we want to interact with.
	var editor = CKEDITOR.instances.editor1;
	var value = document.getElementById( 'txtArea' ).value;

	// Check the active editing mode.
	if ( editor.mode == 'wysiwyg' )
	{
		// Insert as plain text.
		// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-insertText
		editor.insertText( value );
	}
	else
		alert( 'You must be in WYSIWYG mode!' );
}

function SetContents() {
	// Get the editor instance that we want to interact with.
	var editor = CKEDITOR.instances.editor1;
	var value = document.getElementById( 'htmlArea' ).value;

	// Set editor contents (replace current contents).
	// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setData
	editor.setData( value );
}

function GetContents() {
	// Get the editor instance that you want to interact with.
	var editor = CKEDITOR.instances.editor1;

	// Get editor contents
	// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-getData
	alert( editor.getData() );
}

function ExecuteCommand( commandName ) {
	// Get the editor instance that we want to interact with.
	var editor = CKEDITOR.instances.editor1;

	// Check the active editing mode.
	if ( editor.mode == 'wysiwyg' )
	{
		// Execute the command.
		// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-execCommand
		editor.execCommand( commandName );
	}
	else
		alert( 'You must be in WYSIWYG mode!' );
}

function CheckDirty() {
	// Get the editor instance that we want to interact with.
	var editor = CKEDITOR.instances.editor1;
	// Checks whether the current editor contents present changes when compared
	// to the contents loaded into the editor at startup
	// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-checkDirty
	alert( editor.checkDirty() );
}

function ResetDirty() {
	// Get the editor instance that we want to interact with.
	var editor = CKEDITOR.instances.editor1;
	// Resets the "dirty state" of the editor (see CheckDirty())
	// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-resetDirty
	editor.resetDirty();
	alert( 'The "IsDirty" status has been reset' );
}

function Focus() {
	CKEDITOR.instances.editor1.focus();
}

var cnt = 0
function onFocus(evt) {
	//document.getElementById( 'eMessage' ).innerHTML = '<b>' + this.name + ' is focused </b> ' //+ ++cnt + evt.currentTarget;
}

function onBlur() {
	//document.getElementById( 'eMessage' ).innerHTML = this.name + ' lost focus';
}


function clearEmptyElement(node) {
  if (node.innerHTML == "<br>") node.innerHTML = ""
}

//************************   vkladani a editace multimedii - video, audio *********/
var actMedia = null;

var video_widths = [360, 480, 600];
var video_ratios = [1.333, 1.778];

function insertVideo(url, w, h) {
    var mmedia = document.getElementById("multimedia_insert")
    var figure = mmedia.querySelector("figure");
    if (!figure) figure = mmedia.insertBefore( document.createElement("figure"),mmedia.firstChild);
    if (w == undefined) w= 480; 
    if (h == undefined) h= 360;
    if (url == undefined) url = "https://is.muni.cz/do/1499/el/nastroje/gem/media/info-odpovedniky.flv"
    var ratio = w/h;
    var source = "unknown";
    
    var video = "<object height=\"" + h +"\" width=\"" + w + "\" data=\"https://is.muni.cz/auth/do/1499/el/storage/players/player_city.swf\" type=\"application/x-shockwave-flash\">" + 
"<param value=\"sameDomain\" name=\"allowScriptAccess\" />" +
"<param value=\"https://is.muni.cz/auth/do/1499/el/storage/players/player_city.swf\" name=\"movie\" />" +
"<param name=\"flashVars\" value=\"klip=" + url +"&amp;autoplay=false&amp;loop=false\" />" +
"<param value=\"false\" name=\"menu\" />" +
"<param value=\"best\" name=\"quality\" />" +
"<param value=\"true\" name=\"allowFullScreen\" />  </object>";
    
    if (url.indexOf("www.youtube.com/watch?v=") > -1) { //video z YouTube
        var source = url.substring(url.indexOf("=") +1)
       
        video = "<iframe width=\"480\" height=\"360\" src=\"https://www.youtube.com/embed/" + source + "\" frameborder=\"0\" allowfullscreen></iframe>";
     source = "youtube";   
    }
    
    if (url.indexOf("https://is.muni.cz/auth/video/") == 0) { //video v IS
        var videoId = url.substring(url.lastIndexOf("/")+1);
        if (videoId.indexOf("?") > -1) {
            videoId = videoId.substring(0, videoId.indexOf("?"));
        }
        
        video =  "<object type=\"application/x-shockwave-flash\" data=\"https://is.muni.cz/auth/dstore/video/player.swf\" width=\"480\" height=\"390\"><param name=\"movie\" value=\"https://is.muni.cz/auth/dstore/video/player.swf\" /><param name=\"menu\" value=\"false\" /><param name=\"flashVars\" value=\"id={video_id}&amp;type=auth&amp;autoplay=false&amp;is=is.muni.cz\" /><param name=\"allowScriptAccess\" value=\"sameDomain\" /><param name=\"allowFullscreen\" value=\"true\" /><p>{video_id} Pro správné přehrání videa musíte mít nainstalovaný <a href=\"http://www.adobe.com/go/getflash\" class=\"silver ext_blank\" target=\"_blank\">Adobe Flash Player 9.0</a> nebo vyšší.</p></object>".replace(/\{video_id\}/g, videoId);
        source = "IS";
        w= 480;
        h = 360;
        url = videoId;
    }
    
     if (url.indexOf(".video")  == url.length -6 ) { //video v IS
        loadVideoPage(url);
         return;
     }
    
    actMedia = {type: "video", width: w, height: h, url: url, ratio: ratio, source: source} //16:9 = 1:0.5625
    
    figure.innerHTML = video
    
    document.getElementById("vsize").value = 1;
    document.getElementById("vratio").value = 1.333;
    
    document.getElementById("video_url").innerHTML = url;
    
    document.getElementById("media_insert").style.display = "none"
    document.getElementById("video_settings").style.display = "block"
    document.getElementById("audio_settings").style.display = "none"
}

function loadVideoPage(url) {
   var http_request = false;
    if (window.XMLHttpRequest) { // Mozilla, Safari,...
        http_request = new XMLHttpRequest();
        if (http_request.overrideMimeType) {
            http_request.overrideMimeType('text/html');
            
        }
    } else if (window.ActiveXObject) { // IE
        try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
        }
    }
    if (!http_request) {
        alert(strProblemXMLHTTP);
        return false;
    }


    http_request.onreadystatechange = function () {
        parseVideoPage(http_request);
    };
      
    http_request.open('GET', url, true);
    http_request.send(); 
    
}

function parseVideoPage(req) {
    if (req.readyState == 4) {
        if (req.status == 200) {
            var vystup = ""

            var response = req.responseText //.documentElement;
            var idPos = response.indexOf("\"id=") + 4
            var videoId = response.substring(idPos, response.indexOf("&", idPos));
            insertVideo("https://is.muni.cz/auth/video/" + videoId);
        
        } else {
            if (req.getAllResponseHeaders()) {
                alert(strProblemRequest);
            }
        }
    }
    
}

function setVideoSize(index) {
   var obj = document.getElementById("multimedia_insert").querySelector("object, iframe");
   if (!obj || !actMedia || actMedia.type != "video") return;
   if (actMedia.width == video_widths[index]) return;
    
    actMedia.width = video_widths[index];
    actMedia.height = Math.round(video_widths[index]/actMedia.ratio)
    obj.setAttribute("width", actMedia.width);
    obj.setAttribute("height", actMedia.height);
    
}

function setVideoRatio(ratio) {
  
    var obj = document.getElementById("multimedia_insert").querySelector("object, iframe");
    if (!obj || !actMedia || actMedia.type != "video" ) return;
    
    if (typeof ratio == "string") ratio = parseFloat(ratio)
    if (isNaN(ratio)) return;
    
    actMedia.ratio = ratio;
    actMedia.height = Math.round(actMedia.width/ratio)
        
    obj.setAttribute("width", actMedia.width);
    obj.setAttribute("height", actMedia.height);
    
}

function insertAudio(url) {
    var mmedia = document.getElementById("multimedia_insert")
    var figure = mmedia.querySelector("figure");
    if (!figure) figure = mmedia.insertBefore( document.createElement("figure"),mmedia.firstChild);
    var w= 300; 
    var h= 70;
    if (url == undefined) url = "https://is.muni.cz/do/1499/el/nastroje/gem/media/elportal.mp3"
   
    
    figure.innerHTML = "<object height=\"" + h +"\" width=\"" + w + "\" data=\"https://is.muni.cz/auth/do/1499/el/storage/players/soundplayer_auto.swf\" type=\"application/x-shockwave-flash\">" + 
"<param value=\"sameDomain\" name=\"allowScriptAccess\" />" +
"<param value=\"https://is.muni.cz/auth/do/1499/el/storage/players/soundplayer_auto.swf\" name=\"movie\" />" +
"<param name=\"flashVars\" value=\"klip=" + url +"&amp;autoplay=false&amp;loop=false\" />" +
"<param value=\"false\" name=\"menu\" />" +
"<param value=\"best\" name=\"quality\" />" +
"</object>";
    
    actMedia = {type: "audio", url: url}
    document.getElementById("audio_url").innerHTML = url;
    document.getElementById("media_insert").style.display = "none"
    document.getElementById("video_settings").style.display = "none"
    document.getElementById("audio_settings").style.display = "block"
    
}

function deleteMedia() {
   var mmedia = document.getElementById("multimedia_insert")
   var figure = mmedia.querySelector("figure");
   if (figure) figure.parentNode.removeChild(figure); 
    
    document.getElementById("media_insert").style.display = "block"
    document.getElementById("video_settings").style.display = "none"
    document.getElementById("audio_settings").style.display = "none"
    
}