API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jun 2nd, 2016
89
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 13.41 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5.  
  6.     <meta name="description" content="">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1">
  8.     <title>Tweevent</title>
  9.     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
  10.     <link rel="stylesheet" href="https://martinfrouin.fr/projets/tweevent/css/index.css">
  11.     <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0-rc.2/themes/smoothness/jquery-ui.css">
  12.    
  13.     <script src="https://code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js"></script>
  14.     <script src="https://martinfrouin.fr/projets/tweevent/js/functions.js"></script>
  15.  
  16.     <script>
  17.         var $j = jQuery.noConflict();
  18.         function connexion() {
  19.             var exec = true;
  20.             if (document.frm_connexion.username == "" || document.frm_connexion.password == "") {
  21.                 exec = false;
  22.             }
  23.             return exec;
  24.         }
  25.           function charger_bloc(nom_bloc) {
  26.             // Initialisation et suivant le paramètre entrant, on charge le formulaire du bloc correspondant
  27.             var html = "";
  28.             if (nom_bloc == "pro") {
  29.                 // Chargement du formulaire d'inscription pour les pro.
  30.                 // Nom de l'établissement
  31.                 html += "<div class='form-group'>";
  32.                 html += "<label for='pseudo' class='col-sm-3 control-label'>Nom de l'établissement :</label>";
  33.                 html += "<div class='col-sm-4'>";
  34.                 html += "<input required class='form-control' type='text' id='etablissement' name='pseudo' value=''/>";
  35.                 html += "</div>";
  36.                 html += "</div>";
  37.              
  38.                 // SIRET
  39.                 html += "<div class='form-group'>";
  40.                 html += "<label for='pseudo' class='col-sm-3 control-label'>SIRET :</label>";
  41.                 html += "<div class='col-sm-4'>";
  42.                 html += "<input required class='form-control' type='text' id='siret' name='pseudo' value=''/>";
  43.                 html += "</div>";
  44.                 html += "</div>";
  45.              
  46.               // Nom de l'établissement
  47.                 html += "<div class='form-group'>";
  48.                 html += "<label for='pseudo' class='col-sm-3 control-label'>Nom de l'établissement :</label>";
  49.                 html += "<div class='col-sm-4'>";
  50.                 html += "<input required class='form-control' type='text' id='etablissement' name='pseudo' value=''/>";
  51.                 html += "</div>";
  52.                 html += "</div>";
  53.                
  54.                 // Pseudo
  55.                 html += "<div class='form-group'>";
  56.                 html += "<label for='pseudo' class='col-sm-3 control-label'>Email :</label>";
  57.                 html += "<div class='col-sm-4'>";
  58.                 html += "<input required class='form-control' type='email' id='pseudo' name='pseudo' value=''/>";
  59.                 html += "</div>";
  60.                 html += "</div>";
  61.                 // Mot de passe
  62.                 html += "<div class='form-group'>";
  63.                 html += "<label for='password' class='col-sm-3 control-label'>Password :</label>";
  64.                 html += "<div class='col-sm-4'>";
  65.                 html += "<input required class='form-control' type='password' id='password' name='password' value=''/>";
  66.                 html += "</div>";
  67.                 html += "</div>";
  68.             }
  69.             if (nom_bloc == "par") {
  70.                 // Chargement du formulaire d'inscription pour les par.
  71.                 // Pseudo
  72.                 html += "<div class='form-group'>";
  73.                 html += "<label for='pseudo' class='col-sm-3 control-label'>Email :</label>";
  74.                 html += "<div class='col-sm-4'>";
  75.                 html += "<input required class='form-control' type='email' id='pseudo' name='pseudo' value=''/>";
  76.                 html += "</div>";
  77.                 html += "</div>";
  78.                 // Mot de passe
  79.                 html += "<div class='form-group'>";
  80.                 html += "<label for='password' class='col-sm-3 control-label'>Password :</label>";
  81.                 html += "<div class='col-sm-4'>";
  82.                 html += "<input required class='form-control' type='password' id='password' name='password' value=''/>";
  83.                 html += "</div>";
  84.                 html += "</div>";
  85.             }
  86.             // Remplissage html
  87.             html += "<input type='hidden' name='choix_inscription' value='"+nom_bloc+"'/>";
  88.             $("#content_inscription").empty();
  89.             $("#content_inscription").append(html);
  90.         }
  91.     </script>
  92.     <script src="https://code.jquery.com/jquery-2.2.4.min.js" ></script>
  93. </head>
  94. <body class="">
  95. <div class="navbar navbar-inverse navbar-fixed-top" role="navigation" id="slide-nav">
  96.     <div class="container">
  97.         <div class="navbar-header">
  98.             <a class="navbar-toggle">
  99.                 <span class="sr-only">Toggle navigation</span>
  100.                 <span class="icon-bar"></span>
  101.                 <span class="icon-bar"></span>
  102.                 <span class="icon-bar"></span>
  103.             </a>
  104.             <a class="navbar-brand" href="index.html"><img width="180" src="https://martinfrouin.fr/projets/tweevent/img/logo.png"></a>
  105.         </div>
  106.         <div id="slidemenu">
  107.             <form class="navbar-form navbar-right" method="post" action="functions.php?action=connexion"
  108.                  name="frm_connexion">
  109.                 <div class="form-group">
  110.                     <input type="text" id="connection_username" name="username" placeholder="Adresse email" class="form-control">
  111.                     <input type="password" id="connection_pwd" name="password" placeholder="Mot de passe" class="form-control">
  112.                 </div>
  113.                 <button type="submit" id="connection_validation" class="btn btn-primary icon-user" onclick="return connexion()">Connexion</button>
  114.             </form>
  115.         </div>
  116.     </div>
  117. </div>
  118. <div class="inverse" id="navbar-height-col"></div>
  119. <div class="block_home center vcenter" style="height: 641px;">
  120.     <div class="title_home inner">
  121.         <h1>Bienvenue sur<br>Tweevent</h1>
  122.         <div class="about">
  123.             <h3><a href="#inscriptionModal" role="button" data-toggle="modal">S'inscrire</a></h3>
  124.             <h3><a href="#errorModal" id="errorBtn" role="button" data-toggle="modal"></a></h3>
  125.             <h3><a href="#errorModal2" id="errorBtn2" role="button" data-toggle="modal"></a></h3>
  126.             <h3><a href="#inscrOk" id="inscrBtn" role="button" data-toggle="modal"></a></h3>
  127.         </div>
  128.  
  129.     </div>
  130. </div>
  131.  
  132. <script>
  133.     window.onload = function () {
  134.         if (window.jQuery) {
  135.             $("#validationInscription").trigger("click");
  136.         }
  137.         if (window.location.hash) {
  138.             var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
  139.             if (hash == "login_error") {
  140.                 $("#errorBtn").trigger("click");
  141.             }
  142.             else if(hash == "insc_error") {
  143.                 $("#errorBtn2").trigger("click");
  144.             }
  145.             else if(hash == "insc_ok") {
  146.                 $("#inscrBtn").trigger("click");
  147.             }
  148.         } else {
  149.             // No hash found
  150.         }
  151.     }
  152. </script><!-- Validation inscription modal -->
  153.  
  154. <!--inscription modal-->
  155. <div id="inscriptionModal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
  156.     <div class="modal-dialog">
  157.         <div class="modal-content">
  158.             <div class="modal-header">
  159.                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  160.                 <h5>Formulaire d'inscription</h5>
  161.             </div>
  162.             <div id="info_inscription">
  163.  
  164.             </div>
  165.             <form class="form-horizontal" id="register_form" name="frm_ajout_utilisateur" action="functions.php?action=inscription" method="post">
  166.                 <!-- Chargement conditionnel du formulaire d'inscription en AJAX -->
  167.                 <div class="form-group modal-body">
  168.                     <div id="inscription"><br/>
  169.                         <table id="choix_form">
  170.                             <tr>
  171.                             <td>
  172.                             <button onclick="charger_bloc('pro')">
  173.                             Je suis un professionnel
  174.                             </button>
  175.                             </td>
  176.                             <td>
  177.                             <button onclick="charger_bloc('par')">
  178.                             Je suis un particulier
  179.                             </button>
  180.                             </td>
  181.                             </tr>
  182.                         </table>
  183.                         <div id="content_inscription">
  184.  
  185.                         </div>
  186.                     </div>
  187.                 <div class="modal-footer">
  188.                     <div>
  189.                         <input class="btn btn-default" type="submit" name="chk"
  190.                               value="Valider"/>
  191.                         <ul class="pull-left list-inline">
  192.                             <li><a href=""><i class="glyphicon glyphicon-upload"></i></a></li>
  193.                             <li><a href=""><i class="glyphicon glyphicon-camera"></i></a></li>
  194.                             <li><a href=""><i class="glyphicon glyphicon-map-marker"></i></a></li>
  195.                         </ul>
  196.                     </div>
  197.                 </div>
  198.             </form>
  199.         </div>
  200.     </div>
  201. </div>
  202. <!--error modal-->
  203. <div>
  204.     <div id="errorModal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
  205.         <div class="modal-dialog">
  206.             <div class="modal-content">
  207.                 <div class="modal-header">
  208.                     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  209.                     <h5>Oups, une erruer est survenue. Merci de vérifier les données renseignées.(</h5>
  210.                 </div>
  211.             </div>
  212.         </div>
  213.     </div>
  214. </div>
  215. <div>
  216.     <div id="errorModal2" class="modal fade" tabindex="-2" role="dialog" aria-hidden="true">
  217.         <div class="modal-dialog">
  218.             <div class="modal-content">
  219.                 <div class="modal-header">
  220.                     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  221.                     <h5>Oups, cet email est déjà utilisé, merci d'en saisir un autre.</h5>
  222.                 </div>
  223.             </div>
  224.         </div>
  225.     </div>
  226. </div>
  227. <div>
  228.     <div id="inscrOk" class="modal fade" tabindex="-3" role="dialog" aria-hidden="true">
  229.         <div class="modal-dialog">
  230.             <div class="modal-content">
  231.                 <div class="modal-header">
  232.                     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
  233.                     <h5>Votre compte a bien été créer et nous sommes heureux de vous accueilir ! Mais avant de commencer
  234.                         notre histoire, merci de valider votre adresse email en cliquant sur le lien reçu.</h5>
  235.                 </div>
  236.             </div>
  237.         </div>
  238.     </div>
  239. </div>
  240.  
  241.  
  242. <!-- fin modal-->
  243.  
  244. <!-- Scripts -->
  245.  
  246. <!-- Scripts -->
  247. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  248. <!--<script src="js/md5.min.js"></script>-->
  249. <script type="text/javascript">
  250.     $(document).ready(function () {
  251.         //stick in the fixed 100% height behind the navbar but don't wrap it
  252.         $('#slide-nav.navbar-inverse').after($('<div class="inverse" id="navbar-height-col"></div>'));
  253.         $('#slide-nav.navbar-default').after($('<div id="navbar-height-col"></div>'));
  254.         // Enter your ids or classes
  255.         var toggler = '.navbar-toggle';
  256.         var pagewrapper = '#page-content';
  257.         var navigationwrapper = '.navbar-header';
  258.         var menuwidth = '100%'; // the menu inside the slide menu itself
  259.         var slidewidth = '80%';
  260.         var menuneg = '-100%';
  261.         var slideneg = '-80%';
  262.         $("#slide-nav").on("click", toggler, function (e) {
  263.             var selected = $(this).hasClass('slide-active');
  264.             $('#slidemenu').stop().animate({
  265.                 left: selected ? menuneg : '0px'
  266.             });
  267.             $('#navbar-height-col').stop().animate({
  268.                 left: selected ? slideneg : '0px'
  269.             });
  270.             $(pagewrapper).stop().animate({
  271.                 left: selected ? '0px' : slidewidth
  272.             });
  273.             $(navigationwrapper).stop().animate({
  274.                 left: selected ? '0px' : slidewidth
  275.             });
  276.             $(this).toggleClass('slide-active', !selected);
  277.             $('#slidemenu').toggleClass('slide-active');
  278.             $('#page-content, .navbar, body, .navbar-header').toggleClass('slide-active');
  279.         });
  280.         var selected = '#slidemenu, #page-content, body, .navbar, .navbar-header';
  281.         $(function () {
  282.             $(window).resize(function () {
  283.                 $('.block_home').height($(window).height() - $('.block_home').offset().top);
  284.             });
  285.             $(window).resize();
  286.             $(window).on("resize", function () {
  287.                 if ($(window).width() > 767 && $('.navbar-toggle').is(':hidden')) {
  288.                    $(selected).removeClass('slide-active');
  289.                 }
  290.             });
  291.         });
  292.     });
  293. </script>
  294.  
  295. </body>
  296. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!