##include(Defaults)

##local.Define(TabBgColor)<contentof>#DDDDDD</contentof>
##local.Define(SelectedBGColor)<contentof>#83A2DC</contentof>
##local.Define(DefaultFontColor)<contentof>#000000</contentof>
##local.Define(ReverseFontColor)<contentof>#FFFFFF</contentof>
##local.Define(DivBGColor)<contentof>#FFFFFF</contentof>
##local.Define(SeletedBorderColor)<contentof>#1D3C76</contentof>
<style>
    body, p, td, div, li, select, input, button, file 
    {
        font-family: verdana arial tahoma;
        color: black;
    }
    
    input, button 
    {
        font-size:11px;
    }
    
    ul#menu
    {
    font:bold 14px verdana, arial, sans-serif;
    list-style-type:none;
    padding-bottom:24px;
    border-bottom:1px solid #505050;
    margin:0px;
    }     
    #menu a
    {
    float: left;
    display: block;
    color: #666;
    text-decoration: none;
    padding: 2px 4px 1px 4px;
    }
     
    #menu a:hover
    {
    background: #fff;
    }
     
    ul#menu li
    {
    float: left;
    height: 23px;
    background-color: ##local.TabBgColor ;
    margin: 2px 2px 0px 2px;
    border: 1px solid #505050;
    }
     
    ul#menu li.selectedTab
    {
    border-bottom: 1px solid ##local.TabBgColor;
    background-color: ##local.TabBgColor;
    cursor:default;
    }
    ul#menu li.selectedTab a
    {
    cursor:default;
    }
    ul#menu li.selectedTab a:hover
    {
    background-color: ##local.TabBgColor;
    }
</style>

<script>

    function ShowDetailsTab()
    {
       //alert(parent.quizobj+"--"+parent.quizid+"--"+parent.quiztitle);
       if(parent.selectedmenu=="questions")
        { 
            parent.selectedmenu = "details";           
           //do sth with the questionlistform form
            var rs = ComposeQuestionList();
             
            var str = "{}";
            if ( rs != null)
            {
                str = "{"+DumpAsVarMap(rs, "")+"}";
            }
            
            var field = window.document.getElementById("Field.questions");
            field.value = str;
            
            var form = window.document.getElementById("questionlistform");
            form.target = ""; 
 
            form.Method.value = "UpdateFromForm2";
            form.SubStyle.value = "Details";
            form.origine.value = "";
            form.submit(); 
            return;
        }
        else
        if(parent.selectedmenu == "invite")
        {
            parent.selectedmenu = "details";
            var url = "##this?SubStyle=Details";
            window.location.replace(url);
        } else
        {
            parent.selectedmenu = "details";
            var url = "##this?SubStyle=Details&Method=Edit&Type=Quiz&id=##request.id";
            window.location.replace(url);
        }
    }
    

    function ShowQuestionsTab()
    {
        if(parent.selectedmenu=="details")
        {
            parent.selectedmenu = "questions";
            var form = document.getElementById("EditForm");
            form.Method.value = "UpdateFromForm2";
            form.SubStyle.value = "Questions";
            form.submit();

            return;
        }
        else
        {        
            parent.selectedmenu = "questions";
            var url = "##this?SubStyle=Questions&Method=Edit&Type=Quiz&id=##request.id";
            window.location.replace(url);
        }
    
    }
    
    function ShowPreviewTab()
    {
       //alert(parent.quizobj+"--"+parent.quizid+"--"+parent.quiztitle); 
        if(parent.selectedmenu=="details")
        {
            parent.selectedmenu = "preview";
            var form = window.document.getElementById("EditForm");
            form.Method.value = "UpdateFromForm2";
            form.SubStyle.value = "Preview";
            form.submit();

            return;
        }
        else
        if(parent.selectedmenu=="questions")
        { 
            parent.selectedmenu = "preview";           
           //do sth with the questionlistform form
            var rs = ComposeQuestionList();
            var str = "{ }";
            if ( rs != null)
            {
                str = "{"+DumpAsVarMap(rs, "")+"}";
            }
            
            var field = window.document.getElementById("Field.questions");
            field.value = str;
            
            var form = window.document.getElementById("questionlistform");
            form.target = ""; 
 
            form.Method.value = "UpdateFromForm2";
            form.SubStyle.value = "Preview";
            form.origine.value = "";
            form.submit(); 
            return;
        } 
        else
        {
            parent.selectedmenu = "preview";
            var url = "##this?SubStyle=Preview&Method=Edit&Type=Quiz&id=##request.id";
            window.location.replace(url);
        }
    
    }
    
    function ShowInviteTab()
    {
       //alert(parent.quizobj+"--"+parent.quizid+"--"+parent.quiztitle); 
        if(parent.selectedmenu=="details")
        {
            parent.selectedmenu = "invite";
            var form = window.document.getElementById("EditForm");
            form.Method.value = "WriteRecord2";
            form.SubStyle.value = "Invite";
            form.submit();

            return;
        }
        else
        if(parent.selectedmenu=="questions")
        { 
            parent.selectedmenu = "invite";           
           //do sth with the questionlistform form
            var rs = ComposeQuestionList();
            var str = "{ }";
            if ( rs != null)
            {
                str = "{"+DumpAsVarMap(rs, "")+"}";
            }
            
            var field = window.document.getElementById("Field.questions");
            field.value = str;
            
            var form = window.document.getElementById("questionlistform");
            form.target = ""; 
 
            form.Method.value = "WriteRecord2";
            form.SubStyle.value = "Invite";
            form.origine.value = "";
            form.submit(); 
            return;
        } 
        else
        { 
            parent.selectedmenu = "invite"; 
            var url = "##this?SubStyle=Invite&Method=Edit&Type=Quiz&id="+parent.quizid;
            window.location.replace(url);
        }
    }

 
</script>    



##local.define(QuizItemEditorContent)<contentof>
<script>
    window.onload = function()
    {
        if ("##request.ToBeUpdated" === "true" )
        {
            parent.UpdateQuizSelect("##Value.quiz.id", "##formatter.JScriptQuote()<contentof>##Value.QualDataIgnoreIfMissing(quiz.title)</contentof>");
        }
        else if ("##request.IsNew" === "true" )
        {
            parent.InsertQuizSelect("##Value.quiz.id", "##formatter.JScriptQuote()<contentof>##Value.QualDataIgnoreIfMissing(quiz.title)</contentof>");
        }
    }
</script>
<script>
    
    function SetQuizInit()
    {
        var quizobj =  '##this.Obj';
        
        var quiztitle = '##formatter.JScriptQuote()<contentof>##Value.QualDataIgnoreIfMissing(quiz.title)</contentof>' ;
        var quizid =  ##if Value.quiz.id '##Value.quiz.id' ##else 'new' ##endif;
     
        parent.quizobj = quizobj;
        parent.quiztitle = quiztitle;
        parent.quizid = quizid;
    }
    
    function SaveQuiz()
    {
        var form = window.document.getElementById("EditForm");
        
        var title = xGetElementById("Field.quiz.title."+"##request.Lang");
    
        if ( "##request.Method" != "AddNew")  
        {
            if ( title.value !== "##formatter.JScriptQuote()<contentof>##Value.QualDataIgnoreIfMissing(quiz.title)</contentof>" )
            {
                form.ToBeUpdated.value = "true";
            }
            else
            {
                form.ToBeUpdated.value = "flase";
            }
        }   
        form.Method.value = "WriteRecord2";
        //form.SubStyle.value = "Questions";
        form.submit();
    }
    
    function calulateQuestionNb ()
    {
        var nb = "##value.quiz.nb_questions";
        
    }
</script>

    ##local.define(CategoryItemEditorTitle)<contentof>
        <table width=100% height=20 bgcolor=##local.TabBgColor>
            <tr>
                <td>
                    <ul id="menu">
                      <li class="selectedTab" id="details">
                        <a href="#">##leg.ELEARNING.Quiz.TabBar.Details</a>
                      </li>
                      <li id="questions">
                        <a href="javascript:ShowQuestionsTab()">##leg.ELEARNING.Quiz.TabBar.Questions</a>
                      </li>
                      <li id="preview">
                        <a href="javascript:ShowPreviewTab()">##leg.ELEARNING.Quiz.TabBar.Preview</a>
                      </li>
                      <li id="invite">
                        <a href="javascript:ShowInviteTab()">##leg.ELEARNING.Quiz.TabBar.Invite</a>
                      </li>
                    </ul>
                </td>
            </tr>
        </table>
    </contentof>

    ##local.define(CategoryItemEditorContent)<contentof>
        
        ##local.ZonesTypeScripts
        
        <script>
            documentManager.registerType ( "VarMap", stringValidatorObject );
        </script>
        <table cellspacing="0" cellpadding="2" border="0" height="100%" width="100%" >
            <input type="hidden" name="IsMap.Field.questions" value="1"/>
            
            
            /*##Value.Dump()*/
            ##local.define(label)<contentof>##leg.ELEARNING.Quiz.QuizDetail.QuizID</contentof> ##local.define(field)<contentof>quiz.id</contentof>
            ##local.FieldRow

            
            ##local.define(label)<contentof>##leg.ELEARNING.Common.Subject</contentof> ##local.define(field)<contentof>quiz.title</contentof>
            ##local.MultiLingualFieldRow
        
            ##local.SepFieldRow
        
            ##local.define(label)<contentof>##leg.ELEARNING.Common.Type</contentof> ##local.define(field)<contentof>quiz.type</contentof>
            ##local.FieldRow
        
            ##local.SepFieldRow
        
            ##local.define(label)<contentof>##leg.ELEARNING.Quiz.QuizDetail.QuestionNum</contentof> ##local.define(field)<contentof>quiz.nb_questions</contentof>
            ##local.FieldRow
        
            ##local.define(label)<contentof>##leg.ELEARNING.Quiz.QuizDetail.CorrectionType</contentof> ##local.define(field)<contentof>quiz.correction_type</contentof>
            ##local.FieldRow
        
            ##local.define(label)<contentof>##leg.ELEARNING.Quiz.QuizDetail.AllowedTime</contentof> ##local.define(field)<contentof>quiz.allowed_time</contentof>
            ##local.FieldRow
        
            ##local.define(label)<contentof>##leg.ELEARNING.Quiz.QuizDetail.ShowAnswer</contentof> ##local.define(field)<contentof>quiz.show_answers</contentof>
            ##local.FieldRow
            
            <tr>
                <td height="100%" colspan=3>&nbsp;
                   /* <textarea name="Field.questions" id="Field.questions"  cols=100 rows=50 >##Value.questions</textarea>       */
                </td>
            </tr>
            
        </table>
    </contentof>
    ##local.define(CategoryItemEditorTools)<contentof>
        <table width=100% border=0>
            <tr>
                <td width=33%>&nbsp;
                </td>
                <td width=33% align="center">
                    <INPUT id="applybutton" type="Button" value="##leg.CMS.LeafEditor.ApplyButton" onclick="SaveQuiz()">
                </td>
                <td width=33% align="right">
                    <INPUT id="nextbutton" type="Button" value="##leg.CMS.LeafEditor.NextButton &gt;&gt;" onclick="ShowQuestionsTab()">
                </td>
            </tr>
        </table>
    
    </contentof>
    
    ##local.QuizItemEditorBody
    <script>SetQuizInit()</script>
    
</contentof>

##if request.IsEqual(SubStyle, "InFrame")
    ##local.QuizItemEditorContent
    
    
##endif

##if request.IsEqual(SubStyle, "Details")

    ##local.QuizItemEditorContent
##endif

##if request.IsEqual(SubStyle, "Questions")
    <script language="JavaScript" type="text/javascript" src="/portal2/dragdrop.js"></script>
    
    <script>   
    
        window.onload = function() {

            DragSort.makeListSortable(document.getElementById("questionlist"));   
		    };

    </script>

    <script>
        //common functions
        function escapeStringForMap ( text ) 
        {
            return text.replace ( /\\/g, '\\\\' ).replace ( /"/g, '\\"' );
        }
 
        function isArray(a) 
        {
            return a.constructor == Array;
        }
 
        function DumpAsVarMap (rs, indent)
        {  
            var str="";
            for (var i=0; i<rs.length; i++)
            {
                if (isArray(rs[i]))
                {
                    if (isArray(rs[i][1]))
                    {
                        str += " \""+escapeStringForMap(rs[i][0]) + "\" {"+ DumpAsVarMap(rs[i][1], "")+"}";
                    }
                    else
                    {
                        str += " \""+escapeStringForMap (rs[i][0])+"\" = \""+ escapeStringForMap (rs[i][1])+"\"";
                    }
                }
            }
            return str;
        }
        
    </script>
    <script>
        var selecteditem = null;
        
        function SelectDiv(id, changestatus)
        {
            var button = xGetElementById("removebutton");
            var editbutton =  xGetElementById("editbutton")         
            if (selecteditem != id)
            {           
                if (selecteditem != null)
                {
                    var olddiv = xGetElementById(selecteditem);
                    olddiv.style.backgroundColor = "##local.DivBGColor";
                    olddiv.style.color="##local.DefaultFontColor";
                    olddiv.style.borderColor = "##local.DivBGColor";
                }                
                selecteditem = id;
                             
                var div = xGetElementById(id);
                div.style.backgroundColor="##local.SelectedBGColor";
                div.style.borderColor="##local.SeletedBorderColor";
                div.style.color="##local.ReverseFontColor";
                
                button.disabled = false;
                editbutton.disabled = false;
                editbutton.focus();                  
            } else
            {
                if(changestatus)
                {
                    var div = xGetElementById(id);
                    div.style.backgroundColor = "##local.DivBGColor";
                    div.style.color= "##local.DefaultFontColor";
                    div.style.borderColor = "##local.DivBGColor";
                    selecteditem = null;   
                    button.disabled = true; 
                    editbutton.disabled = true;
                }
            }
        }

        function UpdateRightList()
        {
           var v = document.getElementById("quizSelect").value;
           if ( v!="" )
           {
            parent.getQuizQuestions(v, "RightListFrame");
           }
        }
        
           
        function SaveQuizQuestions()
        {
            var rs = ComposeQuestionList();
            var str = "{"+DumpAsVarMap(rs, "")+"}";
            
            var field = window.document.getElementById("Field.questions");
            field.value = str;
            
            var form = window.document.getElementById("questionlistform");
            form.target = "hiddenFrame"; 
    
            form.Method.value = "WriteRecord2";
            //form.SubStyle.value = "Details";
            form.origine.value = "Questions";
            form.submit(); 
        }
         
        
        function ComposeQuestionList()
        {
           
            var div = xGetElementById("questionlist");

            divs = div.childNodes;
            var rs = new Array();
            
            if (divs != null)
            {
                for(var i=0; i< divs.length; i++)
                {
                    var atom = new Array(2);
                    
                    var sub = new Array(2);                
                    sub[0] = "question";
                    var sub1 = new Array(2);
                        
                    var ssub = new Array(2);
                    atom[0] = "id";
                    atom[1] = divs[i].id; 
                    sub1[0] = atom;
                    
                    ssub[0] = "title";
                    var ssub1 = new Array();
                    
                    var subdivs = divs[i].getElementsByTagName("div");
                    
                    for (var j=0; j<subdivs.length; j++)
                    {
                        var temp = new Array();  
                        temp[0] = subdivs[j].id;
                        temp[1] = subdivs[j].name;
                        ssub1[j] = temp;
                    }
                    
                    ssub[1] = ssub1;
                    
                    sub1[1] = ssub;
                    
                    sub[1] = sub1;
                    rs[i] = sub;
                }
            }
            
            return rs;
        }

        function UpdateQuestionListForm()
        {
            var rs = ComposeQuestionList();
            if (rs!= null)
            { 
                var str = "{"+DumpAsVarMap(rs, "")+"}";
            
                var form = window.document.getElementById("questionlistform");
                var field = window.document.getElementById("Field.questions");
                field.value = str;
                form.Method.value = "UpdateFromForm2";
                form.SubStyle.value = "Questions";
                form.target = "hiddenFrame";
                form.origine.value = "Questions";
                form.submit();
            }
        }
    
        function AddQuestion()
        {
            var frame = document.getElementById("RightListFrame");

            if (document.getElementById(frame.contentWindow.selecteditem)==null)
            {
                var div = frame.contentWindow.document.getElementById(frame.contentWindow.selecteditem);
                var ldiv = xGetElementById("questionlist");  
                var col = ldiv.getElementsByTagName("div");
                if(col.length ==0)
                {
                    ldiv.innerText = "";
                }
                frame.contentWindow.selecteditem = null;
                div.removeAttribute("style");            
                div.style.cursor = "hand";
                ldiv.insertAdjacentHTML("beforeEnd", div.outerHTML);
                var button = document.getElementById("addbutton"); 
                button.disabled = true;
                UpdateQuestionListForm();
            }
         }
        
        function RemoveQuestionFromList()
        {
            if (selecteditem != null)
            {
                var parent = xGetElementById("questionlist");  
                var child = xGetElementById(selecteditem);  
                parent.removeChild(child);
                selecteditem = null;
                
                UpdateQuestionListForm(); 
                
                var button = xGetElementById("removebutton");
                button.disabled = true;
                /*button = xGetElementById("submitbutton");
                button.disabled = true;*/
              
            }
        }
        
        function setOptions()
        {
            var opts = parent.document.getElementById("SelectQuiz");
            var sel = document.getElementById("quizselecttd");

            sel.innerHTML = '<select id="quizSelect" name="quizSelect" size="1" onchange="UpdateRightList()" style="width:100%">'+opts.innerHTML+'</select>';
            
            sel = document.getElementById("quizSelect");
            var opt = document.getElementById("newopt");
            sel.removeChild(opt);
 
            opt = document.createElement ('<OPTION id="allQ">');
            sel.options.add(opt);
            opt.innerHTML="##leg.ELEARNING.Common.QuestionList.AllQuestions";
            opt.value="all";
            
            opt = document.createElement ('<OPTION id="sep">');
            sel.options.add(opt,0);
            opt.innerHTML="----------------";
            opt.value="";
            opt.disabled = "true"; 
            
            opt = document.createElement ('<OPTION id="start">');
            sel.options.add(opt,0);
            opt.innerHTML= "##leg.ELEARNING.Common.QuestionList.SelectQuiz";
            opt.value="";
            opt.selected = "true";
            
        }
        
        function NewQuestion()
        {
            var frame = parent.document.getElementById( "contentFrame");
            var url = "APS_E_LEARNING?##this.styleset&SubStyle=InFrame&Method=AddNew&type=Question&id=&Quizid="+parent.quizid;

            frame.src = url;
        }
        
        function EditQuestion()
        { 
            if(selecteditem !== null)
            {
                //inframe = parent.document.getElementById("InFrame");
                var tr = parent.document.getElementById("quizestr");
                tr.style.display="none";
                this.navigate("APS_E_LEARNING?##this.styleset&SubStyle=InFrame&Method=Edit&type=Question&id="+selecteditem+"&Quizid="+parent.quizid);
                
            }            
        }
    </script>

        ##local.define(FrameContent)<contentof>
            ##local.define(MenuBar)<contentof>
                <table width=100% height=20 bgcolor=##local.TabBgColor>
                    <tr>
                        <td>
                            <ul id="menu">
                              <li  id="details">
                                <a href="javascript:ShowDetailsTab()">##leg.ELEARNING.Quiz.TabBar.Details</a>
                              </li>
                              <li class="selectedTab" id="questions">
                                <a href="#">##leg.ELEARNING.Quiz.TabBar.Questions</a>
                              </li>
                              <li id="preview">
                                <a href="javascript:ShowPreviewTab()">##leg.ELEARNING.Quiz.TabBar.Preview</a>
                                </li>
                              <li id="invite">
                                <a href="javascript:ShowInviteTab()">##leg.ELEARNING.Quiz.TabBar.Invite</a>
                              </li>
                            </ul>
                        </td>
                    </tr>
                </table>
            </contentof>
            
            ##local.define(LeftList)<contentof>
                <iframe id="hiddenFrame" name="hiddenFrame" style={display:none} src=""></iframe>
                <form id="questionlistform" action="##this.obj" method="post" target="">
                	##this.stylesetforform
			        
                    <input name="Method" type="hidden" value="" />
                    <input type="hidden" name="origine" value=""/>
                    
                    <textarea name="Field.questions" id="Field.questions" rows=6 cols=30 style="{display:none}"></textarea>
                    <input type="hidden" name="IsMap.Field.questions" value="1">
                    <table width="100%" height="100%" border="0" cellpadding=0 >
                        <tr>
                            <td width=100% height=100% align="center">
                                <div id="questionlist" style="background-color:#FFFFFF;width:100%;height:100%;overflow-x:auto;overflow-y:auto;border:1px solid black" nowrap="true">
                                  
                                   ##if Value.IsEqual(questions, "")
                                   ##else
                                   ##if Value.IsEqual(questions.question, "")
                                    ##else 
                                        ##Value.ForEachIn(question,"questions")<contentof>
                                        <div id="##question.id" title="##formatter.JScriptQuote()<contentof>##question.QualDataIgnoreIfMissing(title)</contentof>" onmousedown="SelectDiv(##question.id, false)" onmousedownkeeper='' style="cursor:hand;position: relative;border='0.02cm solid white'" align="left" nowrap="true" onmouseover="this.style.border='0.02cm solid navy'" onmouseout="if(selecteditem!=##question.id) this.style.border='0.02cm solid white'">
                                            <span style="width:30px">##question.id</span>---- ##formatter.JScriptQuote()<contentof>##question.QualDataIgnoreIfMissing(title)</contentof>
                                            <div id="ENG" name="##question.title.ENG" style={display:none}></div>
                                            <div id="FRE" name="##question.title.FRE" style={display:none}></div>
                                            <div id="GER" name="##question.title.GER" style={display:none}></div>
                                            <div id="DUT" name="##question.title.DUT" style={display:none}></div>
                                        </div>
                                        </contentof>
                                    ##endif
                                    ##endif
                                </div>
                            </td>
                            <td align="center">
                                <input type="button" name="addbutton" value="##leg.ELEARNING.Quiz.QuizQuestions.ButtonAdd " disabled="true" onclick="AddQuestion()"><br><br><br>
                                <input type="button" name="removebutton" value="##leg.ELEARNING.Quiz.QuizQuestions.ButtonRemove" disabled="true" onclick="RemoveQuestionFromList()"><br><br><br>
                                &nbsp;<input type="button" name="editbutton" value=" ##leg.ELEARNING.Quiz.QuizQuestions.ButtonEdit" disabled="true" onclick="EditQuestion()"><br><br><br>
                                &nbsp;<input type="button" name="newbutton" value="##leg.ELEARNING.Quiz.QuizQuestions.ButtonNew" onclick="NewQuestion()">
                            </td>
                        </tr>
                    </table>                    
                </form>
            </contentof>
            
            
            ##local.define(RightList) <contentof>
                <table width="100%" height="100%" border="0" style="border:0px solid black">
                <tr><td align="center" width="100%" height="100%">
                    <iframe id="RightListFrame" width=100% height=100% class="content" frameborder="0"  src="" style="border:1px solid black;" scrolling=no>
                    </iframe>
                </td></tr>
               </table>
            </contentof>
            
            ##local.define(NextButton)<contentof>
                <input id="nextbutton" type="button" value="##leg.CMS.LeafEditor.NextButton &gt;&gt;" onclick="ShowPreviewTab()">
            </contentof>
            
            ##local.define(PreviousButton)<contentof>
                <input id="prevbutton" type="button" value="&lt;&lt; ##leg.ELEARNING.Quiz.BottomBar.ButtonPrevious" onclick="ShowDetailsTab()">
            </contentof>
          
            /* ##Value.Dump()*/
            <table width="100%" height=100% border="0" style="border:1px solid black; background-color:#EEEEEE">
                <tr>
                    <td colspan="2">##local.MenuBar
                    </td>
                </tr>
                <tr>
                    <td width=40% height=30 align="left"><span style="font:normal normal bold larger;">##leg.ELEARNING.Quiz.QuizQuestions.SectionTitle<i><script>if (parent.quiztitle != "") document.write(parent.quiztitle); else document.write("##leg.ELEARNING.Quiz.QuizQuestions.NoTitle"); </script></i></span></td>
                    <td width=60% height=30 align="center" id="quizselecttd">
                        ##if request.IsEqual(origine, "Questions")
                        ##else
                            <script>setOptions()</script>
                        ##endif
                    </td>
                </tr>
                <tr>
                    <td width=56% height=100% align="center">
                        ##local.LeftList 
                    </td>
                    <td width=44% height=100% align="center">
                        ##local.RightList
                    </td>
                </tr>
                <tr><td colspan=3>
                    <table border=0 width=100% style="border:0px solid black; background-color:#EEEEEE">
                        <tr>
                            <td width=33%  align="left">
                               ##local.PreviousButton
                            </td>
                            <td width=33%  align="center">
                                 
                                 <INPUT id="applybutton" type="Button" value="##leg.CMS.LeafEditor.ApplyButton" onclick="SaveQuizQuestions()">
                            </td>
                            <td width=33%  align="right">

                                 ##local.NextButton
                                 
                            </td>
                        </tr>
                    </table>
                </td></tr>
            </table>           
        </contentof>
        ##include(FrameBody)

##endif

##if request.IsEqual(SubStyle, "Preview")

    <script>
        var selecteditem = null;

        function ShowQuestion(id)
        {
            var frame = document.getElementById( "RightListFrame" );
            frame.src = "APS_E_LEARNING?##this.styleset&SubStyle=Preview&Method=Edit&type=Question&id=" + id;
        }
        
        function SelectDiv(id, changestatus)
        {
            if (selecteditem != id)
            {           
                if (selecteditem != null)
                {
                    var olddiv = xGetElementById(selecteditem);
                    olddiv.style.backgroundColor = "##local.DivBGColor";
                    olddiv.style.color="##local.DefaultFontColor";
                    olddiv.style.borderColor = "##local.DivBGColor";
                }                
                selecteditem = id;
                             
                var div = xGetElementById(id);
                div.style.backgroundColor="##local.SelectedBGColor";
                div.style.borderColor="##local.SeletedBorderColor";
                div.style.color="##local.ReverseFontColor";
                ShowQuestion( div.id );       
                
            } else
            {   
                //var div = xGetElementById(id);
               //ShowQuestion( id );  
            }
        }


    </script>


        ##local.define(FrameContent)<contentof>
            ##local.define(MenuBar)<contentof>
                <table width=100% height=20 bgcolor=##local.TabBgColor>
                    <tr>
                        <td>
                            <ul id="menu">
                              <li  id="details">
                                <a href="javascript:ShowDetailsTab()">##leg.ELEARNING.Quiz.TabBar.Details</a>
                              </li>
                              <li  id="questions">
                                <a href="javascript:ShowQuestionsTab()">##leg.ELEARNING.Quiz.TabBar.Questions</a>
                              </li>
                              <li class="selectedTab" id="preview">
                                <a href="#">##leg.ELEARNING.Quiz.TabBar.Preview</a>
                                </li>
                              <li id="invite">
                                <a href="javascript:ShowInviteTab()">##leg.ELEARNING.Quiz.TabBar.Invite</a>
                              </li>
                            </ul>
                        </td>
                    </tr>
                </table>
            </contentof>
            
            ##local.define(LeftList)<contentof>
                <iframe id="hiddenFrame" name="hiddenFrame" style="{display:none}" src=""></iframe>
                <form id="questionlistform" action="##this.obj" method="post" target="">
                	##this.stylesetforform
			        /*##if request.IsEqual(Method, "AddNew")
				        <input type="hidden" name="IsNew" value="true"/>
			        ##endif
                    ##if request.IsEqual(Method, "Edit")
				        <input type="hidden" name="IsEdit" value="true"/>
			        ##endif*/
                    <input name="Method" type="hidden" value="" />
                    <input type="hidden" name="origine" value=""/>
                    <input type="hidden" name="quizid" value="##request.quizid"/>
                    <input type="hidden" name="quiztitle" value="##request.quiztitle"/>
                    
                    <textarea name="Field.questions" id="Field.questions" rows=6 cols=30 style="{display:none}"></textarea>
                    <input type="hidden" name="IsMap.Field.questions" value="1">
                    <table width="100%" height="100%" border="0" cellpadding=0 >
                        <tr>
                            <td width=100% height=100% align="center">
                                <div id="questionlist" style="background-color:#FFFFFF;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;border:1px solid black" nowrap="true">
                                    ##if Value.IsEqual(questions.question, "")
                                    ##else                 
                                        ##Value.ForEachIn(question,"questions")<contentof>
                                        <div id="##question.id" title="##question.qualData(title)" onmousedown="SelectDiv(##question.id, false)" style="cursor:hand;border='0.02cm solid white'" align="left" nowrap="true" onmouseover="this.style.border='0.02cm solid navy'" onmouseout="if(selecteditem!=##question.id) this.style.border='0.02cm solid white'" >
                                            <span style="width:30px">##question.id</span>---- ##question.qualData(title)
                                            <div id="ENG" name="##question.title.ENG" style={display:none}></div>
                                            <div id="FRE" name="##question.title.FRE" style={display:none}></div>
                                            <div id="GER" name="##question.title.GER" style={display:none}></div>
                                            <div id="DUT" name="##question.title.DUT" style={display:none}></div>
                                        </div>
                                        </contentof>
                                    ##endif
                                </div>
                            </td>
                        </tr>
                    </table>                    
                </form>
            </contentof>
            
            /* preview */
            
            ##local.define(RightList) <contentof>
                <table width="100%" height="100%" border="0" style="border:0px solid black">
                <tr><td align="center" width="100%" height="100%">
                    <iframe id="RightListFrame" width=100% height=100% class="content" frameborder="0"  src="" style="border:1px solid black">
                    </iframe>
                </td></tr>
               </table>
            </contentof>
            
            ##local.define(NextButton)<contentof>
                <input id="nextbutton" type="button" value="##leg.CMS.LeafEditor.NextButton &gt;&gt;" onclick="ShowInviteTab()">
            </contentof>
            
            ##local.define(PreviousButton)<contentof>
                <input id="prevbutton" type="button" value="&lt;&lt; ##leg.ELEARNING.Quiz.BottomBar.ButtonPrevious" onclick="ShowQuestionsTab()">
            </contentof>
          
            /* ##Value.Dump()*/
            <table width="100%" height="100%" border="0" style="border:1px solid black; background-color:#EEEEEE">
                <tr>
                    <td colspan="2">##local.MenuBar
                    </td>
                </tr>
                /*<tr>
                    <td width=30% height=30 align="left"><span style="font:normal normal bold larger;">/* ##leg*/Preview Quiz -- <i><script>document.write(parent.quiztitle);</script></i></span></td>
                    <td width=70% height=30 align="center" id="quizselecttd"></td>
                </tr>*/
                <tr>
                    <td width=30% height=100% align="center">
                        ##local.LeftList 
                    </td>
                    <td width=70% height=100% align="center">
                        ##local.RightList
                    </td>
                </tr>
                <tr>
                    <td width=30% height=30 align="left">
                       ##local.PreviousButton
                    </td>
                    <td width=70% height=30 align="right">
                         
                         
                         ##local.NextButton
                         
                    </td>
                </tr>
            </table>           

    </contentof>   
        ##include(FrameBody)
 
##endif


##if request.IsEqual(SubStyle, "Invite")

    ##local.define(FrameContent)<contentof>
        ##local.define(MenuBar)<contentof>
            <table width=100% height=20 bgcolor=##local.TabBgColor>
                <tr>
                    <td>
                        <ul id="menu">
                          <li  id="details">
                            <a href="javascript:ShowDetailsTab()">##leg.ELEARNING.Quiz.TabBar.Details</a>
                          </li>
                          <li  id="questions">
                            <a href="javascript:ShowQuestionsTab()">##leg.ELEARNING.Quiz.TabBar.Questions</a>
                          </li>
                          <li id="preview">
                            <a href="javascript:ShowPreviewTab()">##leg.ELEARNING.Quiz.TabBar.Preview</a>
                            </li>
                          <li class="selectedTab" id="invite">
                            <a href="#">##leg.ELEARNING.Quiz.TabBar.Invite</a>
                          </li>
                        </ul>
                    </td>
                </tr>
            </table>
        </contentof>
        
        ##if error.Level
            ##error.Dump()
        ##else
            ##local.define(InviteUserFrame)<contentof>
            
                <iframe id="InviteUserFrame" width=100% height=100% class="content" scrolling=no frameborder="0"  src="APS_CREATE_QUIZ_INSTANCE?##this.styleset&SubStyle=&Method=SetQuiz&id=##Value.quiz.id" style="border:0px solid black">
                
                </iframe>
            </contentof>
        
            <table width="100%" height=100% border="0" style="border:1px solid black; background-color:#EEEEEE">
                <tr>
                    <td  height=30>##local.MenuBar
                    </td>
                </tr>
               
                <tr>
                    <td width=100% align="center">
                        ##local.InviteUserFrame
                    </td>
                    
                </tr>
                
            </table>

        ##endif
        
    </contentof>
    
    ##include(FrameBody)


##endif
  


##local.define(QuestionList)<contentof>
       

    <script>
        var selecteditem = null;
        function SelectDiv(id, changestatus)
        {
            if ("##request.SubStyle" == "RightListFrame") 
            {    
                var button = parent.document.getElementById("addbutton"); 
            }
            if (selecteditem != id)
            {           
                if (selecteditem != null)
                {
                    var olddiv = xGetElementById(selecteditem);
                    olddiv.style.backgroundColor = "##local.DivBGColor";
                    olddiv.style.color="##local.DefaultFontColor";
                    olddiv.style.borderColor = "##local.DivBGColor";
                }                
                selecteditem = id;
                             
                var div = xGetElementById(id);
                div.style.backgroundColor="##local.SelectedBGColor";
                div.style.color="##local.ReverseFontColor";
                div.style.borderColor="##local.SeletedBorderColor";
                
                if ("##request.SubStyle" == "RightListFrame") 
                {
                    button.disabled = false;
                    button.focus();                
                };
            } 
            else
            {            
                if (changestatus)
                { 
                    var div = xGetElementById(id);
                    div.style.backgroundColor = "##local.DivBGColor";
                    div.style.color= "##local.DefaultFontColor";
                    div.style.borderColor = "##local.DivBGColor";
                    selecteditem = null;
                    if ("##request.SubStyle" == "RightListFrame") 
                    {                
                        button.disabled = true; 
                    }
                }
            }
        }
        
        function EditQuestion(questionid)
        {
            SelectDiv(questionid, false);
        
            parent.EditQuestion(questionid);
        }
        
    </script>


    ##local.define(FrameContent)<contentof>
        /*##Value.Dump()*/

        /*<iframe id="hiddenFrame" name="hiddenFrame" style="{display:none}" src=""></iframe>*/
        <table width=100% height=100% border="0" cellspacing="0" cellpadding="0"> <tr> <td width=100% height=100%>
        <form id="questionlistform" action="##this.obj" method="post" target="">
            ##this.stylesetforform
            /*##if request.IsEqual(Method, "AddNew")
                <input type="hidden" name="IsNew" value="true"/>
            ##endif
            ##if request.IsEqual(Method, "Edit")
                <input type="hidden" name="IsEdit" value="true"/>
            ##endif*/
            <input name="Method" type="hidden" value="" />

            <textarea name="Field.questions" id="Field.questions" rows=6 cols=30 style="{display:none}"></textarea>
            <input type="hidden" name="IsMap.Field.questions" value="1">
            <div id="quizquestionlist" style="background-color:#FFFFFF;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;border:0px solid black" nowrap="true">
                ##if Value.IsEqual(questions, "")
                ##else
                ##if Value.IsEqual(questions.question, "")
                ##else
                    ##Value.ForEachIn(question,"questions")<contentof>
                    <div id="##question.id" title="##formatter.JScriptQuote()<contentof>##question.QualDataIgnoreIfMissing(title)</contentof>" onmousedown="SelectDiv(##question.id, true)"  style="cursor:hand;border='0.02cm solid white'" align="left" nowrap="true" onmouseover="this.style.border='0.02cm solid navy'" onmouseout="if (selecteditem!=##question.id) this.style.border='0.02cm solid white'" ##if request.IsEqual(SubStyle, "QuestionListFrame") onclick="EditQuestion(##question.id)" ##endif>
                        <span style="width:30px">##question.id</span>---- ##formatter.JScriptQuote()<contentof>##question.QualDataIgnoreIfMissing(title)</contentof>
                        <div id="ENG" name="##question.title.ENG" style={display:none}></div>
                        <div id="FRE" name="##question.title.FRE" style={display:none}></div>
                        <div id="GER" name="##question.title.GER" style={display:none}></div>
                        <div id="DUT" name="##question.title.DUT" style={display:none}></div>
                    </div>
                    </contentof>
                ##endif
                ##endif
            </div>
        </form>
        </td></tr></table>
    </contentof>
    <style>
    body, p, td, div, li, select, input, button, file {
        font-family: verdana arial tahoma;
        color: black;
        background-color: white;
    }
    
    table {
        border:0;
    }
    
    </style> 
    ##include(FrameBody)
</contentof>

##if request.IsEqual(SubStyle, "RightListFrame")
    ##local.QuestionList
##endif
##if request.IsEqual(SubStyle, "QuestionListFrame")
    ##local.QuestionList
##endif