<%inherit file="jm2l:templates/layout.mako"/>
<%namespace name="profil" file="jm2l:templates/Profil/Profil.mako"/>
<%namespace name="sejour" file="jm2l:templates/Profil/Sejour.mako"/>
<%namespace name="intendance" file="jm2l:templates/Logistique/Logistique.mako"/>
<%namespace name="intervention" file="jm2l:templates/Interventions/Interventions.mako"/>
<%namespace name="h" file="jm2l:templates/helpers.mako"/>
<%def name="jsAddOn()">
  <script src="/vendor/select2/js/select2.js"></script>  
  <script src="/vendor/leaflet/js/leaflet.js"></script>  
  <script src="/vendor/leaflet/js/leaflet-routing-machine.min.js"></script>
##  <script src="/static/jquery-ui/jquery-ui.min.js"></script>  
  <script src="/vendor/repeatable-fields/js/repeatable-fields.js"></script>
  <script src="/js/jm2l.js"></script>
</%def>
<%def name="cssAddOn()">
  <link rel="stylesheet" href="/vendor/select2/css/select2.css" type="text/css" media="screen" />
  <link rel="stylesheet" href="/vendor/fileupload/css/jquery.fileupload.css">
  <link rel="stylesheet" href="/vendor/fileupload/css/jquery.fileupload-ui.css">
  <link rel="stylesheet" href="/vendor/leaflet/css/leaflet.css" />
  <link rel="stylesheet" href="/css/jm2l.css" />
  <!-- CSS adjustments for browsers with JavaScript disabled -->
  <noscript><link rel="stylesheet" href="/vendor/fileupload/css/jquery.fileupload-noscript.css"></noscript>
  <noscript><link rel="stylesheet" href="/vendor/fileupload/css/jquery.fileupload-ui-noscript.css"></noscript>  
</%def>
<div id="AjaxModal" class="modal hide fade" tabindex="-1" role="dialog"
    aria-labelledby="AjaxModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="AjaxModalLabel">Modal header</h3>
    </div>
    <div class="modal-body">
        <form id="ModalForm">
            <div id="ModalContent">bla bla</div>
        </form>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary">Enregistrer les modifications</button>
    </div>
</div>

<div id="AjaxPlaceModal" class="modal hide fade" tabindex="-1" role="dialog"
    aria-labelledby="AjaxPlaceModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="AjaxPlaceModalLabel">Modal header</h3>
    </div>
    <div class="modal-body">
        <form id="ModalPlaceForm">
            <div id="ModalPlaceContent">bla bla</div>
        </form>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary">Enregistrer les modifications</button>
    </div>
</div>

<div class="row-fluid">
  <div class="span10 offset1">
    <div class="tabbable" id="main_tab">
        <ul class="nav nav-tabs nav-pills" style="margin-bottom: 5px;">
            <li class="active"><a href="#Profil" id="Map_Profil" data-toggle="tab">Mon Profil</a></li>
            <li><a href="#Sejour" id="Map_Sejour" data-toggle="tab">Mon S&eacute;jour</a></li>
            <li><a href="#Logistique" id="Map_Logistique" data-toggle="tab">Logistique</a></li>            
            <li><a href="#Interventions" id="Map_Interventions" data-toggle="tab">Mes Interventions</a></li>
            <li><a href="#Frais" id="Map_Frais" data-toggle="tab">Mes Frais</a></li>
        </ul>
        <div class="tab-content" style="padding:0 10px">
            <div class="tab-pane fade active in" id="Profil">
                ${profil.profil_wrapper(uprofil, profil_form)}
            </div>

            <div class="tab-pane fade" id="Sejour">
                ${sejour.sejour_wrapper(Places)}
            </div>
        
            <div class="tab-pane fade" id="Interventions">
                <div class="tabbable tabs-left" id="Interventions_tab">
                    
                    <ul class="nav nav-tabs navbar" style="margin-bottom:0;">
						<li class="active"> <a href="#ResumePart" data-toggle="tab">Resum&eacute;</a> </li>
                        <li> <a href="#Conference" data-toggle="tab">Conf&eacute;rence</a> </li>
                        <li> <a href="#Stand" data-toggle="tab">Stand</a> </li>
                        <li> <a href="#Atelier" data-toggle="tab">Atelier</a> </li>
                        <li> <a href="#TableRonde" data-toggle="tab">Table Ronde</a> </li>
                        <li> <a href="#Organisation" data-toggle="tab">Organisation</a> </li>
                    </ul>
                    
                    <div class="tab-content">
                        <div class="tab-pane fade active in" id="ResumePart">
                            ${intervention.Resume()}
                        </div>                        
                        <div class="tab-pane fade" id="Conference">
                            ${intervention.wrapper('C')}
                        </div>
                        <div class="tab-pane fade" id="Stand"> 
                            ${intervention.wrapper('S')}
                        </div>
                        <div class="tab-pane fade" id="Atelier">
                            ${intervention.wrapper('A')}
                        </div>
                        <div class="tab-pane fade" id="TableRonde">
                            ${intervention.wrapper('T')}
                        </div>
                        <div class="tab-pane fade" id="Organisation">
                            ${intervention.wrapper('O')}
                        </div>                        
                    </div>
                    
                </div>
            </div>
        
            <div class="tab-pane fade" id="Logistique">
                ${intendance.Main(Exchanges, miam_form)}
            </div>        
        
            <div class="tab-pane fade" id="Frais">
                <fieldset>
                    <legend class="lowshadow">Une participation à mes frais ?</legend>
                L'&eacute;quipe des JM2L participe aux <u>frais de transport</u> des intervenants !<br /><br />
                Et bien oui, mais cette participation ne sera effective que si vous remplissez <u>toutes les conditions</u> suivantes:
                <ul style="list-style:circle;">
                    <li>Vous animez <strong>un atelier, une conf&eacute;rence ou une table ronde</strong> aux JM2L ${CurrentYear}.</li>
                    <li>Votre fiche est renseign&eacute;e avec <strong>votre RIB</strong>.</li>
                    <li>Votre fiche est renseign&eacute;e avec <strong>les preuves</strong> de vos achats.</li>
                    <li>Vous <strong>présentez l'original de vos tickets</strong> à l'accueil pendant l'évènement.</li>
                    <li>Tous vos documents sont conformes.</li>
                </ul>
                <p>
                    <u>Nota Bene</u>: Ce remboursement s'effectue <u>uniquement par virement bancaire</u>
                    <br />
                    Par exemple, si vous achetez votre ticket d'avion en ligne, demandez une facture à la
                    compagnie aérienne.
                    <br />
                    Si vous n'avez pas de scanner vous permettant de compléter votre fiche,
                    ces opérations pourront être effectuées à l'accueil pendant l'évènement.
                    N'oublez pas d'apporter tous vos documents le cas échéant.<br />
                    Si vous remplissez toutes les conditions, 
                le remboursement sera effectif au maximum 2 semaines après la fin des JM2L.
                </p>
                <br />
                <h4>Téléverser vos documents </h4>
                    <div class="container-fluid">
                        <div class="span6">
                            <label >Je joins mon <strong>Relevé d'identité Bancaire</strong></label>
                            ${h.uploader("RIB", request.user.uid, "mon RIB")}
                        </div>
                        <div class="span6">
                            <label for="edit-rib-upload">Je joins une ou plusieurs <strong>preuve d'achat</strong></label>
                            ${h.uploader("Justif", request.user.uid, "un Justificatif")}
                        </div>
                    </div>
                </fieldset>
            </div>
        
        </div>
    </div>
  </div>
</div>
##${h.uploader_js()}
