-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7900254
commit ebf4a86
Showing
4 changed files
with
227 additions
and
19 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,175 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1.0" /> | ||
| <meta name="description" content="Recevez une notification dès la sortie de votre passeport sans prise de tête :)"/> | ||
| <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> | ||
| <script | ||
| src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" | ||
| integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" | ||
| crossorigin="anonymous" | ||
| ></script> | ||
| <script | ||
| src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" | ||
| integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" | ||
| crossorigin="anonymous" | ||
| ></script> | ||
| <link | ||
| rel="stylesheet" | ||
| href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" | ||
| integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" | ||
| crossorigin="anonymous" | ||
| /> | ||
| <link rel="stylesheet" href="style.css" /> | ||
| <title>Mtchoun' mouh</title> | ||
| <!-- jQuery Modal --> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script> | ||
| <link | ||
| rel="stylesheet" | ||
| href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" | ||
| /> | ||
| <script type="text/javascript"> | ||
| $(function () { | ||
| $("#help").popover({ | ||
| trigger: "focus", | ||
| }); | ||
| }); | ||
|
|
||
| // disable onPaste | ||
| function disablePaste(e) { | ||
| return false; | ||
| } | ||
| // validate data | ||
| function controlFormData(e) { | ||
| e.preventDefault(); | ||
| var Namere = /[A-Za-z]{1}[A-Za-z]/; | ||
| if (!Namere.test($("#name-input").val())) { | ||
| //alert("Name can not less than 2 char"); | ||
| $("#errorMessage>p").html("Le nom ne peut avoir moins de 2 caractères!"); | ||
| $("#errorMessage").modal("show"); | ||
| return; | ||
| } | ||
|
|
||
| $("#confirmationModal").modal("show"); | ||
| } | ||
|
|
||
| function submitToAPI(e) { | ||
| e.preventDefault(); | ||
| var URL = "${url}"; | ||
|
|
||
| var name = $("#name-input").val(); | ||
| var data = { | ||
| name: name, | ||
| }; | ||
|
|
||
| $.ajax({ | ||
| type: "POST", | ||
| url: URL, | ||
| dataType: "json", | ||
| crossDomain: "true", | ||
| contentType: "application/json; charset=utf-8", | ||
| data: JSON.stringify(data), | ||
|
|
||
| success: function (response) { | ||
| // clear form and show a success message | ||
| $("#errorMessage>p").html( | ||
| "Nous avons trouvé l <a href="+response["message"]+">image</a> d'où provient votre choix 🙂" | ||
|
|
||
| ); | ||
| $("#errorMessage").css("background", "#0f7555"); | ||
| console.log("ok") | ||
| $("#errorMessage").modal("show"); | ||
| document.getElementById("contact-form").reset(); | ||
| //location.reload(); | ||
| }, | ||
| error: function () { | ||
| // show an error message | ||
| $("#errorMessage>p").html( | ||
| "Le nom rentré n'existe pas. \n Veuillez vérifier l'orthographe. " | ||
| ); | ||
| $("#errorMessage").modal("show"); | ||
| //location.reload(); | ||
| }, | ||
| }); | ||
| } | ||
| </script> | ||
| </head> | ||
| <body class="text-center"> | ||
| <!--https://aws.amazon.com/fr/blogs/architecture/create-dynamic-contact-forms-for-s3-static-websites-using-aws-lambda-amazon-api-gateway-and-amazon-ses/--> | ||
| <form id="contact-form" method="post" class="form-signin"> | ||
| <div class="mb-2"> | ||
| <img alt="Logo cameroun" width="150" src="Armoiries_cameroun.svg" /> | ||
| </div> | ||
| <h1 class="h5 font-weight-normal highlight">Si vous êtes là c'est que vous voulez une démonstration. Pas de soucis 🙂 </h1> | ||
| <h2 class="h6 font-weight-normal highlight">Nous vous proposons donc de choisir un nom au hasard dans le <b>communiqué du 22/09/2020</b>. | ||
| Pour cela rien de plus simple: rendez vous juste sur la page du <a href="https://www.consulacam-marseille.fr/index.php?p=consulat-cameroun-passeports">consulat</a> | ||
| et entrez ci-dessous celui-ci choisi. | ||
| </h2> | ||
| <b>NOTEZ BIEN </b> | ||
| <svg | ||
| data-html="true" | ||
| tabindex="0" | ||
| id="help" | ||
| data-toggle="popover" | ||
| data-trigger="focus" | ||
| title="Important !" | ||
| data-content="<p>Le nom doit être écrit pareil et dans le même ordre que celui choisi dans la page du consulat</p> | ||
| <p>Liste des contraintes actuelles (vérifiez que vous n'entrez pas dans ces cas) qui ne sont pas supportés: </p> | ||
| <ol> | ||
| <li>Les noms comprenant le mot <b>vve</b></li> | ||
| <li>Les noms comprenant les accents circonflexes comme Benoît</li> | ||
| <li>Les noms comprenant les trémas comme Raïssa</li> | ||
| <li>Les noms comprenant qu'un seul mot </li> | ||
| <li>Les noms comprenant un mot se terminant par i comme Etoundi </li> | ||
| <li>Les noms comprenant des chiffres romains</li> | ||
| </ol>" | ||
| aria-hidden="true" | ||
| focusable="false" | ||
| data-prefix="fas" | ||
| data-icon="info-circle" | ||
| class="svg-inline--fa fa-info-circle fa-w-16" | ||
| role="img" | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| viewBox="0 0 512 512" | ||
| > | ||
| <path | ||
| fill="currentColor" | ||
| d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z" | ||
| ></path> | ||
| </svg> | ||
| <label for="input-name" class="sr-only">Name:</label> | ||
| <input | ||
| type="text" | ||
| id="name-input" | ||
| placeholder="Veuillez le nom choisi …" | ||
| style="text-transform: uppercase" | ||
| class="form-control" | ||
| /> | ||
| <div | ||
| class="g-recaptcha" | ||
| data-sitekey="6Lc7cVMUAAAAAM1yxf64wrmO8gvi8A1oQ_ead1ys" | ||
| ></div> | ||
|
|
||
| <button | ||
| class="btn btn-lg btn-primary btn-block" | ||
| type="button" | ||
| onClick="submitToAPI(event)" | ||
| > | ||
| Submit | ||
| </button> | ||
|
|
||
| <h3 class="h6 mt-2 font-weight-normal">Retournez en <a href="index.html">page d'accueil </a> </h3> | ||
|
|
||
| <div class="mt-5"> | ||
| <img alt="Logo cameroun" width="150" src="Armoiries_de_Marseille.svg" /> | ||
| </div> | ||
| <p class="mt-3 mb-3 text-muted">© 2020 - <a href="mailto: ${contact}">Contact</a></p> | ||
| </form> | ||
|
|
||
| <!-- Alert-error --> | ||
| <div id="errorMessage" class="modal"> | ||
| <p>Content error</p> | ||
| </div> | ||
| </body> | ||
| </html> |