.errors-container p {
color: #CC0132;
}
+
+#viewOverlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 41;
+ cursor: pointer;
+ background-color: rgba(59, 74, 153, 0.44);
+ transition: opacity 400ms;
+ opacity: 0;
+ visibility: hidden;
+}
+
+#viewOverlay.active {
+ opacity: 1;
+ visibility: visible;
+}
+
+#view {
+ position: absolute;
+ top: 0;
+ z-index: 42;
+ display: none;
+ overflow: hidden;
+ background-size: 100% 100%;
+ max-width: 600px;
+ width: 100%;
+ left: 50%;
+ transform: translateX(-50%);
+ transition: opacity 400ms, top 400ms;
+}
+
+#view.active {
+ top: 103.101px;
+ opacity: 1;
+ transform: translate(-50%, 0);
+ display: block;
+}
+
+#Bastide_cart {
+ background-color: #fff;
+ color: #000;
+ height: 100%;
+ width: 100%;
+ min-height: 25vh;
+ min-width: 320px;
+ max-width: 336px;
+ margin: 0 auto;
+}
+
+#Bastide_cart * {
+ font-family: "Roboto Condensed", sans-serif;
+ font-size: 12px;
+}
+
+#Bastide_cart[data-content="register"] {
+ max-width: 600px !important;
+}
+
+#Bastide_cart[data-content="register_ok"] {
+ min-height: auto;
+}
+
+#Bastide_cart .caption {
+ padding: 25px 30px 35px;
+ height: auto;
+ position: relative;
+}
+
+#Bastide_cart .caption h2 {
+ margin: 0;
+}
+
+#Bastide_cart #mview-dialog-title {
+ font-size: 16px;
+ font-weight: bold;
+ text-transform: uppercase;
+}
+
+a.back {
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 60px;
+ height: 60px;
+ padding: 22px;
+ line-height: 1;
+ z-index: 1;
+ background-color: transparent;
+}
+
+.form-header {
+ width: 100%;
+ padding: 4px 10px;
+ margin-bottom: 20px;
+ text-transform: uppercase;
+ color: #fff;
+ font-weight: 700;
+}
+
+#Bastide_cart #Bastide_auth_form .form-group,
+#Bastide_cart #Bastide_auth_form .form-controls.condition {
+ margin-bottom: 30px;
+}
+
+.cta {
+ width: 100%;
+ height: 40px;
+ max-width: 220px;
+ text-transform: uppercase;
+ text-align: center;
+ font-size: 14px !important;
+ border: 1px solid rgba(59, 74, 153);
+ margin: 0 auto;
+ cursor: pointer;
+ font-weight: 700;
+}
+
+#register, .form-header {
+ background-color: rgba(59, 74, 153);
+ color: #ffffff;
+}
+
+#create-account {
+ text-align: center;
+}
+
+.error input {
+ border-color: #CC0132;
+}
+.error .errors-container {
+ margin-top: 5px;
+ color: #CC0132;
+}
+
+label {
+ font-weight: normal !important;
+ line-height: normal;
+}
+
+input {
+ border: 1px solid #000000;
+}
+
+#Bastide_auth_form {
+ padding: 0 58px 50px;
+}
+
+#Bastide_register_form {
+ text-align: right;
+}
+
+#Bastide_register_form *:not(#forgot-password):not(.underbar):not(.cta) {
+ text-align: left;
+}
+#Bastide_register_form .title {
+ margin-bottom: 1em;
+ font-weight: bold;
+}
+#Bastide_register_form form {
+ display: flex;
+ flex-direction: column;
+}
+#Bastide_register_form .form-controls {
+ margin-bottom: 1.25em;
+ display: flex;
+ flex-direction: column;
+}
+#Bastide_register_form .form-controls label {
+ margin-bottom: .625em;
+ text-transform: uppercase;
+}
+#Bastide_register_form .form-controls input {
+ height: 30px;
+}
+#Bastide_register_form a {
+ text-decoration: underline;
+ color: rgba(59, 74, 153);
+}
+#Bastide_register_form input[type=checkbox] {
+ width: 16px;
+ height: 16px;
+ -webkit-appearance: none;
+ appearance: none;
+ background-color: #fff;
+ margin: 0 10px 0 0;
+ position: relative;
+ flex-shrink: 0;
+}
+#Bastide_register_form input[type=checkbox]:checked::before {
+ content: url('../images/valid.svg');
+ width: 10px;
+ height: 10px;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+}
+#Bastide_register_form .form-group {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 0 40px;
+}
+#Bastide_register_form .form-controls {
+ width: calc(50% - 40px);
+ flex: auto;
+ position: relative;
+}
+#Bastide_register_form .form-controls.condition {
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+}
+#Bastide_register_form .form-controls.condition .errors-container {
+ position: absolute;
+ bottom: -2px;
+ transform: translateY(100%);
+ left: 25px;
+}
+#Bastide_register_form .form-controls.condition label {
+ text-transform: initial;
+}
+function getCaption(title) {
+ $('#Bastide_cart .caption').remove()
+ return `<div class="caption "><a href="#/closeview" role="button" aria-label="Fermer" aria-keyshortcuts="Escape" class="back"><svg viewBox="0 0 512 512" class="interface-close nav-icon svg-icon" aria-hidden="true"><use xlink:href="#interface-close"></use></svg></a><h2 id="mview-dialog-title">${title}</h2></div>`
+}
+
$(function () {
console.log($('meta[name="csrf-token"]'));
$('#wf-form-login').attr('action', '/landing/login');
$("#wf-form-login").append('<input type="hidden" name="_token" value="' + $('meta[name="csrf-token"]').attr('content') + '" />');
+ var mview = `<div id="view"></div>`;
+ var registerForm = `<div id="Bastide_cart" data-content="register"><div id="Bastide_auth_form"><form id="Bastide_register_form" class="" data-content="register" action="/fluidbook/signin">
+ <div class="form-group">
+ <div class="form-header">
+ établissement hospitalier
+ </div>
+ <div class="form-controls">
+ <label for="">Nom de l'établissement</label>
+ <input type="text" name="hospital" />
+ </div>
+ <div class="form-controls">
+ <label for="">Numéro de finess de l’établissement</label>
+ <input type="text" name="finess" />
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="form-header">
+ Contact
+ </div>
+ <div class="form-controls">
+ <label for="">Votre nom</label>
+ <input type="text" name="name" />
+ </div>
+ <div class="form-controls">
+ <label for="">Votre prénom</label>
+ <input type="text" name="firstname" />
+ </div>
+ <div class="form-controls">
+ <label for="">Votre fonction</label>
+ <input type="text" name="function" />
+ </div>
+ <div class="form-controls">
+ <label for="">votre Numéro de téléphone</label>
+ <input type="text" name="phone" />
+ </div>
+ <div class="form-controls">
+ <label for="">votre adresse email pro</label>
+ <input type="email" name="email" />
+ </div>
+ <div class="form-controls">
+ <label for="">confirmer votre adresse email PRO</label>
+ <input type="text" name="email_confirmation" />
+ </div>
+ <div class="form-controls">
+ <label for="">définir votre mot de passe</label>
+ <input type="password" name="password" />
+ </div>
+ <div class="form-controls">
+ <label for="">confirmer votre mot de passe</label>
+ <input type="password" name="password_confirmation" />
+ </div>
+ </div>
+ <div class="form-controls condition" data-valid="/images/valid.svg">
+ <input id="condition_field" type="checkbox" name="accept" />
+ <label for="condition_field">Je reconnais avoir été informé que les informations recueillies sur ce
+ formulaire sont enregistrées dans un fichier informatisé traité par Bastide le Confort
+ Médical. Pour plus d’informations je peux consulter la <a href="/charte-de-protection-des-donnees-personnelles.html">charte de protection des
+ données personnelles</a>.
+ </label>
+ </div>
+ <input type="hidden" name="_token" value="${$('meta[name="csrf-token"]').attr('content')}" />
+ <button id="register" class="cta" type="submit">Valider</button>
+ </form></div></div></div>`
+
+ $(document).on("click", "#create-account", function() {
+ $("#viewOverlay").addClass("active")
+ $("section.main").append(mview)
+ $("section.main #view").addClass("active").append(registerForm)
+ $("#Bastide_cart").prepend(getCaption('Créer un compte'))
+ })
- $(document).on("submit", '#wf-form-login', function (e) {
+ $(document).on("submit", "#wf-form-login", function(e) {
e.preventDefault()
- console.log(window.location.href+'/catalogue')
let formData = $(this).serialize()
var $this = this
$.ajax({
});
});
+ $(document).on("submit", "#Bastide_register_form", function(e) {
+ e.preventDefault()
+ var $this = this
+ let formData = $(this).serialize()
+
+ $.ajax({
+ url: '/fluidbook/signin',
+ type: 'POST',
+ data: formData,
+ success: function(data) {
+ $("#Bastide_cart").attr("data-content","").prepend(getCaption('Merci !'))
+ $("#Bastide_auth_form").html(`<div id="Bastide_notif_form" data-content="register_ok"><p>Votre demande de création de compte sera examinée dans les plus brefs délais.
+ Vous recevrez un email de confirmation dans les 24h (pensez à vérifier votre dossier spam).</p>
+ <p>Nos équipes commerciales se tiennent à votre disposition : <a href="mailto:resah@bastide-medical.fr">
+ resah@bastide-medical.fr</a></p>
+ </div>`)
+ },
+ error: function(xhr, status, error) {
+ let errors = JSON.parse(xhr.responseText);
+ $("#Bastide_register_form .errors-container").remove()
+ $(".error").removeClass("error")
+ for(let k in errors['errors']) {
+ $("#Bastide_register_form [name="+k+"]").parent().append('<div class="errors-container"></div>')
+ $(".errors-container").parent().addClass("error")
+ for(let i in errors['errors'][k]) {
+ $("#Bastide_register_form [name="+k+"]").parent().find('.errors-container').append(`<div>${errors['errors'][k][i]}</div>`)
+ }
+ }
+ }
+ });
+ })
+
+ $(document).mouseup(function(e)
+ {
+ var container = $("#Bastide_cart");
+
+ // if the target of the click isn't the container nor a descendant of the container
+ if (!container.is(e.target) && container.has(e.target).length === 0)
+ {
+ $("#viewOverlay").removeClass("active")
+ $("#view").remove()
+ }
+ });
+
});