<%@ Page Title="" Language="VB" MasterPageFile="~/SIG/Site.master" AutoEventWireup="false" Inherits="SGHweb.SIG_frm_crearExamen" Codebehind="frm_crearExamen.aspx.vb" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
<link href="../Styles/Examen2.css" rel="stylesheet" type="text/css" /> 
<link rel="stylesheet" type="text/css" href="../Scripts/noty/buttons.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<!-- noty -->
<script type="text/javascript" src="../Scripts/noty/jquery.noty.js"></script>
<!-- themes -->
<script type="text/javascript" src="../Scripts/noty/themes/default.js"></script>
<script type="text/javascript" src="../Scripts/noty/layouts/center.js"></script>
<script type="text/javascript">               
    <%
        if (Request.QueryString("status_examen")) = "ok"
                response.Write("mostrar_alerta_success('Examen agregado con exito');")
        end if            
    %>
    <%
        if (Request.QueryString("status_pregunta")) = "ok"
                response.Write("mostrar_alerta_success('Pregunta agregada con exito');")
        end if            
    %>
    <%
        if (Request.QueryString("status_respuesta")) = "ok"
                response.Write("mostrar_alerta_success('Respuesta agregada con exito');")
        end if            
    %>
  
//        function mostrar_ruta()
//        {
//            id_examen = ""+<%=Request.QueryString("eid") %>+"";
//            var retVal = prompt("La ruta de su examen es: ", "http://"+location.host+"/SIG/frm_examen.aspx?eid="+id_examen);
//            //location.replace("http://www.msn.com");
//        }
      </script>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
            function generate_success(type, texto) {
                var n = noty({
                    text: texto,
                    type: type,
                    dismissQueue: false,
                    layout: 'center',
                    modal: true,
                    theme: 'defaultTheme',
                    buttons: [
                            { addClass: 'btn btn-primary', text: 'OK', onClick: function ($noty) {
                                $noty.close();
                            } 
                            }
                ]
                });
                console.log(type + ' - ' + n.options.id);
                return n;
            }

            function mostrar_alerta_success(texto) {
                $(document).ready(function () {
                    ///////////////////////
                    // alert             //
                    //  information      //
                    //   error           //
                    //    warning        //
                    //     notification  //
                    ///////////////////////

                    var success = generate_success('notification', texto);

                    setTimeout(function () {
                        $.noty.setText(success.options.id, texto);
                    }, 1000);
                });
            }

        var x = 1;
        function GetDynamicTextBox(value) {
            return '<label id="lbl_es_' + x + '">Español:</label><input name="respuesta_' + x + '" id="respuesta_' + x + '"type="text" value = "" /> <br id="br_' + x + '" /><label id="lbl_en_' + x + '" style="margin-right: 13px;left: 157px;position: absolute;">Ingles:</label><input name="respuesta_en_' + x + '" id="respuesta_en_' + x + '"type="text" value = "" style="margin-left: 49px;"/>'

        }
        function AddTextBox() {
            x++;
            var div = document.createElement('DIV');
            div.innerHTML = GetDynamicTextBox(x);
            document.getElementById("TextBoxContainer").appendChild(div);
            document.getElementById("contador").value = x;
        }

        function RemoveTextBox() {
            var quitar1 = document.getElementById("respuesta_" + x + "");
            //var quitar2 = document.getElementById("valor_respuesta_" + x + "");
            var quitar3 = document.getElementById("respuesta_en_" + x + "");
            //var quitar4 = document.getElementById("valor_respuesta_en_" + x + "");
            var quitar5 = document.getElementById("br_" + x + "");
            var quitar6 = document.getElementById("lbl_es_" + x + "");
            var quitar7 = document.getElementById("lbl_en_" + x + "");
            quitar1.parentNode.removeChild(quitar1);
            //quitar2.parentNode.removeChild(quitar2);
            quitar3.parentNode.removeChild(quitar3);
            //quitar4.parentNode.removeChild(quitar4);
            quitar5.parentNode.removeChild(quitar5);
            quitar6.parentNode.removeChild(quitar6);
            quitar7.parentNode.removeChild(quitar7);
            x--;
            document.getElementById("contador").value = x;
        }

        function RecreateDynamicTextboxes() {
            var values = eval('<%=Values%>');
            if (values != null) {
                var html = "";
                for (var i = 0; i < values.length; i++) {
                    html += "<div>" + GetDynamicTextBox(values[i]) + "</div>";
                }
                document.getElementById("TextBoxContainer").innerHTML = html;
            }
        }
        window.onload = RecreateDynamicTextboxes;
        function propiedad_obligatoria() {
            var propiedad = document.getElementById('<%= chk_propiedad.ClientId %>');
            var obligatoria = document.getElementById('<%= chk_obligatoria.ClientId %>');
            var div_obligatoria = document.getElementById('div_obligatoria');
            if (propiedad.checked) {
                div_obligatoria.style.display = 'inline';
                obligatoria.style.visibility = 'visible';
                obligatoria.checked = true;
            } else {
                obligatoria.style.visibility = 'hidden';
                obligatoria.checked = false;
                div_obligatoria.style.display = 'none';
            }
        }
function btnAdd_onclick() {

}

function btnAdd_onclick() {

}

</script>
</telerik:RadCodeBlock>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<center>
<div class="exampleWrapper">
    <%--<div style="top: -30px;position: relative;height: 1px;right: -259px;">
    <img id="idioma_en" src="Resources/examen_img/usa_flag.png" alt="" />
    <img id="idioma_es" src="Resources/examen_img/espana_flag.png" alt=""/>
    </div>--%>
    <telerik:RadTabStrip ID="RadTabStrip1" runat="server" SelectedIndex="0" 
        Skin="Office2007" MultiPageID="RadMultiPage1" CausesValidation="False" 
        CssClass="tabStrip">
        <Tabs>
            <telerik:RadTab runat="server" Owner="RadTabStrip1" 
                Text="Examen" PageViewID="1" 
                SelectedImageUrl="~/SIG/Resources/examen_img/1_active.png"  
                DisabledImageUrl="~/SIG/Resources/examen_img/1_disable.png" 
                ImageUrl="~/SIG/Resources/examen_img/1_disable.png">
            </telerik:RadTab>
            <telerik:RadTab runat="server" Owner="RadTabStrip1" 
                Text="Preguntas / Respuestas" PageViewID="2"
                SelectedImageUrl="~/SIG/Resources/examen_img/2_active.png" 
                DisabledImageUrl="~/SIG/Resources/examen_img/2_active.png" 
                ImageUrl="~/SIG/Resources/examen_img/2_disable.png">
            </telerik:RadTab>
        </Tabs>
    </telerik:RadTabStrip>
    <telerik:RadMultiPage ID="RadMultiPage1" runat="server" CssClass="multiPage">>
        <telerik:RadPageView ID="RadPageView1" runat="server" Selected="true">
            <br />
            <asp:Panel ID="Panel_examen_esp" runat="server">
            <table>
                <tr align="left">
                    <td>
                        <telerik:RadTextBox ID="RadTextBox1" Runat="server" Label="Titulo del Examen (Es):" Width="300px">
                        </telerik:RadTextBox>
                    </td>
                    <td>
                        <telerik:RadComboBox ID="RadComboBox1" Runat="server" Culture="es-ES" 
                            DataSourceID="SqlDataSource_TipoExamen" DataTextField="Titulo" 
                            DataValueField="TipoExamenId" Label="Tipo:">
                        </telerik:RadComboBox>
                        <asp:SqlDataSource ID="SqlDataSource_TipoExamen" runat="server" 
                            SelectCommand="SELECT * FROM [TipoExamen]"></asp:SqlDataSource>
                    </td>
                </tr>
                <tr align="left">
                    <td>
                        <telerik:RadTextBox ID="RadTextBox2" Runat="server" Label="Titulo del Examen (En):" Width="300px">
                        </telerik:RadTextBox>
                    </td>
                    <td></td>
                </tr>
            </table>
            
            <p class="label_sin_rad" style="text-align:left" >Header (Es):</p>
            <telerik:RadEditor ID="RadEditor1" runat="server" Language="es-ES" 
                Skin="Windows7" Height="163px" Width="529px">
                <Tools>
                    <telerik:EditorToolGroup Tag="MainToolbar">
                        <telerik:EditorTool Name="FindAndReplace" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="Undo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="Redo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorTool Name="Cut" />
                        <telerik:EditorTool Name="Copy" />
                        <telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />
                    </telerik:EditorToolGroup>
                    <telerik:EditorToolGroup Tag="Formatting">
                        <telerik:EditorTool Name="Bold" />
                        <telerik:EditorTool Name="Italic" />
                        <telerik:EditorTool Name="Underline" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="ForeColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="BackColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorDropDown Name="FontName">
                        </telerik:EditorDropDown>
                        <telerik:EditorDropDown Name="RealFontSize">
                        </telerik:EditorDropDown>
                    </telerik:EditorToolGroup>
                </Tools>
                <Content>
                </Content>
            </telerik:RadEditor>
            
            <p class="label_sin_rad" style="text-align:left">Header (En):</p>
            <telerik:RadEditor ID="RadEditor3" runat="server" Language="es-ES" 
                Skin="Windows7" Height="163px" Width="529px">
                <Tools>
                    <telerik:EditorToolGroup Tag="MainToolbar">
                        <telerik:EditorTool Name="FindAndReplace" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="Undo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="Redo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorTool Name="Cut" />
                        <telerik:EditorTool Name="Copy" />
                        <telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />
                    </telerik:EditorToolGroup>
                    <telerik:EditorToolGroup Tag="Formatting">
                        <telerik:EditorTool Name="Bold" />
                        <telerik:EditorTool Name="Italic" />
                        <telerik:EditorTool Name="Underline" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="ForeColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="BackColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorDropDown Name="FontName">
                        </telerik:EditorDropDown>
                        <telerik:EditorDropDown Name="RealFontSize">
                        </telerik:EditorDropDown>
                    </telerik:EditorToolGroup>
                </Tools>
                <Content>
                </Content>
            </telerik:RadEditor>
            
            <p class="label_sin_rad" style="text-align:left">Footer (Es):</p>
            <telerik:RadEditor ID="RadEditor2" runat="server" Height="163px" 
                Language="es-ES" Skin="Windows7" Width="530px">
                <Tools>
                    <telerik:EditorToolGroup Tag="MainToolbar">
                        <telerik:EditorTool Name="FindAndReplace" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="Undo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="Redo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorTool Name="Cut" />
                        <telerik:EditorTool Name="Copy" />
                        <telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />
                    </telerik:EditorToolGroup>
                    <telerik:EditorToolGroup Tag="Formatting">
                        <telerik:EditorTool Name="Bold" />
                        <telerik:EditorTool Name="Italic" />
                        <telerik:EditorTool Name="Underline" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="ForeColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="BackColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorDropDown Name="FontName">
                        </telerik:EditorDropDown>
                        <telerik:EditorDropDown Name="RealFontSize">
                        </telerik:EditorDropDown>
                    </telerik:EditorToolGroup>
                </Tools>
                <Content>
                </Content>
            </telerik:RadEditor>
            
            <p class="label_sin_rad" style="text-align:left">Footer (En):</p>
            <telerik:RadEditor ID="RadEditor4" runat="server" Height="163px" 
                Language="es-ES" Skin="Windows7" Width="530px">
                <Tools>
                    <telerik:EditorToolGroup Tag="MainToolbar">
                        <telerik:EditorTool Name="FindAndReplace" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="Undo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="Redo">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorTool Name="Cut" />
                        <telerik:EditorTool Name="Copy" />
                        <telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />
                    </telerik:EditorToolGroup>
                    <telerik:EditorToolGroup Tag="Formatting">
                        <telerik:EditorTool Name="Bold" />
                        <telerik:EditorTool Name="Italic" />
                        <telerik:EditorTool Name="Underline" />
                        <telerik:EditorSeparator />
                        <telerik:EditorSplitButton Name="ForeColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSplitButton Name="BackColor">
                        </telerik:EditorSplitButton>
                        <telerik:EditorSeparator />
                        <telerik:EditorDropDown Name="FontName">
                        </telerik:EditorDropDown>
                        <telerik:EditorDropDown Name="RealFontSize">
                        </telerik:EditorDropDown>
                    </telerik:EditorToolGroup>
                </Tools>
                <Content>
                </Content>
            </telerik:RadEditor>
            </asp:Panel>
            <br />
            <telerik:RadButton ID="RadButton1" runat="server" Text="Continuar" style="margin-top:-20px">
            </telerik:RadButton>
        </telerik:RadPageView>
        <telerik:RadPageView ID="RadPageView2" runat="server">
            <br />
            <h1 style="float:left"><%= Request.QueryString("etitulo") %> -> <%= Request.QueryString("ptitulo") %></h1>
            <br /><br />
            <asp:Panel ID="Panel1" runat="server">
                <h3>Titulo de la Pregunta (Es):</h3> 
                <input type="text" name="titulo_pregunta" id="titulo_pregunta" />
                <h3>Titulo de la Pregunta (En):</h3> 
                <input type="text" name="titulo_pregunta_en" id="titulo_pregunta_en" />
                <h3>Tipo de Respuesta:</h3>
                <select name="tipo_pregunta" id="tipo_pregunta">
                <option value="0">-Seleccione-</option>
                <option value="1">Check</option>
                <option value="2">Radio</option>
                <option value="3">Combo</option>
                <option value="4">Texto</option>
                <option value="5">Textarea</option>
                </select>
                <h3>Es Propiedad del examen?</h3>
                <asp:CheckBox ID="chk_propiedad" runat="server" onclick="propiedad_obligatoria()" />
                <div id="div_obligatoria" style="display:none">
                <br />
                <h3>Es Obligatoria?</h3>
                <asp:CheckBox ID="chk_obligatoria" name="chk_obligatoria" Checked="false" runat="server" />
                </div>
                <br />
                <asp:Button ID="Button1" runat="server" Text="Continuar" />                
                <asp:Button ID="Button4" runat="server" Text="Volver" />
                <asp:Button ID="Button3" runat="server" Text="Terminar Examen" />

            </asp:Panel>
            <asp:Panel ID="Panel2" runat="server">
                <h2>Respuestas</h2>
                
                <label id="lbl_es_1">Español:</label><input type="text" name="respuesta_1" id="respuesta_1" /> 
                <br id="br_1" />
                <label id="lbl_en_1" style="margin-right: 13px;left: 157px;position: absolute;">Ingles:</label><input type="text" name="respuesta_en_1" id="respuesta_en_1" style="margin-left: 49px;"/>
                <input type="hidden" name="contador" id="contador" value="1" />
                <div id="TextBoxContainer">
                    <!--Aqui se agregan los textbox dinamicos -->
                </div>
                <input id="btnAdd" type="button" value="Agregar" onclick="AddTextBox();return btnAdd_onclick();return btnAdd_onclick()" />
                <input type="button" value="Quitar" onclick = "RemoveTextBox()" />
                <asp:Button ID="Button2" runat="server" Text="Guardar" />
            </asp:Panel>
  
        </telerik:RadPageView>
    </telerik:RadMultiPage>
</div>
</center>
</asp:Content>

