{"id":1649,"date":"2023-02-09T14:04:24","date_gmt":"2023-02-09T19:04:24","guid":{"rendered":"https:\/\/chevronsrn.ca\/?page_id=1649"},"modified":"2023-02-14T15:17:22","modified_gmt":"2023-02-14T20:17:22","slug":"soumission-test","status":"publish","type":"page","link":"https:\/\/chevronsrn.ca\/en\/soumission-test\/","title":{"rendered":"Soumission-test"},"content":{"rendered":"<div id=\"spinner\" class=\"spinner-border\" role=\"status\">\n  <span class=\"sr-only\">Loading&#8230;<\/span>\n  <p> Envoi en cours&#8230; <\/p>\n<\/div>\n<div id=\"fullform\">\n  <form id=\"regForm\" action=\"https:\/\/www.chevronsrn.ca\/php\/post_form.php\" method=\"post\" name=\"myForm\"\n    enctype=\"multipart\/form-data\">\n    <!--<h1>Register:<\/h1>-->\n    <!-- One \"tab\" for each step in the form: -->\n    <div class=\"tab\">\n\n      <label for=\"client\"><b>Step 1 of 4 : Which type of client are you?<\/b><\/label>\n      <select id=\"client\" name=\"client\">\n        <option value=\"selectionner\">Select<\/option>\n        <option value=\"distributeur\">Distributor<\/option>\n        <option value=\"entrepreneur\">Contractor<\/option>\n        <option value=\"commercial\">Entreprise\/Commercial<\/option>\n        <option value=\"particulier\">Individual<\/option>\n      <\/select>\n      <div id=\"page1\">\n        <label id=\"entreprise_lbl\"> Distributor name <\/label>\n        <p><input id=\"entreprise\" name=\"entreprise\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n        <label id=\"personne_lbl\"> Contact name <\/label>\n        <p><input id=\"personne\" name=\"personne\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n        <label id=\"telephone_lbl\"> Phone number <\/label>\n        <p><input id=\"telephone\" name=\"telephone\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n        <label id=\"courriel_lbl\"> Contact e-mail <\/label>\n        <p><input id=\"email\" name=\"email\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n      <\/div>\n      <!-- <p><input  placeholder=\"First name...\" oninput=\"this.className = ''\"><\/p> -->\n      <!--  <p><input placeholder=\"First name...\" oninput=\"this.className = ''\"><\/p> -->\n      <!-- <p><input placeholder=\"Last name...\" oninput=\"this.className = ''\"><\/p> -->\n    <\/div>\n    <div class=\"tab\">\n      <p> <b>Step 2 of 4 : Where and when?<\/b> <\/p>\n      <label> Project name <\/label>\n      <p><input id=\"nomproj\" name=\"nomproj\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n      <label> Project location <\/label>\n      <p><input id=\"ville\" name=\"ville\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n      <label> Delivery address <\/label>\n      <p><input id=\"adresse\" name=\"adresse\" placeholder=\"\" oninput=\"this.className = ''\"><\/p>\n      <label> Date required <\/label>\n      <p><input type=\"date\" id=\"date\" name=\"date\" placeholder=\"\"><\/p>\n    <\/div>\n    <div class=\"tab\">\n      <p> <b> Step 3 of 4 : Building details <\/b> <\/p>\n\n      <label for=\"batiment\">Type of building<\/label>\n      <p>\n        <select id=\"batiment\" name=\"batiment\">\n          <option value=\"\">Select<\/option>\n          <option value=\"residentiel\">Residential<\/option>\n          <option value=\"commercial\">Commercial<\/option>\n          <option value=\"agricole\">Agricultural<\/option>\n        <\/select>\n      <\/p>\n      <label> Building size<\/label>\n      <table class=\"tableb\">\n        <tbody>\n          <tr>\n            <td>\n              <input type=\"number\" id=\"long\" name=\"long\" placeholder=\"Length\" min=\"1\" oninput=\"this.className = ''\">\n            <\/td>\n            <td>\n              <input type=\"number\" id=\"larg\" name=\"larg\" placeholder=\"Width\" min=\"1\" oninput=\"this.className = ''\">\n            <\/td>\n            <td>\n              <input type=\"number\" id=\"haut\" name=\"haut\" placeholder=\"Height\" min=\"1\" oninput=\"this.className = ''\">\n            <\/td>\n\n          <\/tr>\n        <\/tbody>\n      <\/table>\n      <label> Trusses length (ft)&nbsp;<\/label><span class=\"portee-tt\" title=\"My tooltip\"><i\n          class=\"fas fa-info-circle\"><\/i><\/span>\n\n      <table class=\"tablec\">\n        <tbody>\n          <tr>\n            <td>\n              <input type=\"number\" id=\"portee\" min=\"1\" name=\"portee\">\n            <\/td>\n          <\/tr>\n        <\/tbody>\n      <\/table>\n\n\n      <label for=\"type\"> Select trusses model<\/label>\n\n      <div id class=\"typeModal\"><input id=\"type\" name=\"type\" type=\"text\" placeholder=\"Select\" value=\"\"><\/div>\n\n      <label> Slope&nbsp;<\/label><span class=\"pente-tt\" title=\"My tooltip\"><i\n          class=\"fas fa-info-circle\"><\/i><\/span>\n      <table class=\"tablec\">\n        <tbody>\n          <tr>\n            <td>\n              <input type=\"number\" name=\"p1\" id=\"p1\" min=\"0\" placeholder=\"\">\n            <\/td>\n            <td>\/<\/td>\n            <td>\n              <input type=\"number\" name=\"p2\" id=\"p2\" min=\"0\" placeholder=\"\" value=\"12\">\n            <\/td>\n          <\/tr>\n        <\/tbody>\n      <\/table>\n      <label for=\"excedent\">Type d&#8217;ex\u00e9dent&nbsp;<\/label><span class=\"excedent-tt\" title=\"My tooltip\"><i\n          class=\"fas fa-info-circle\"><\/i><\/span>\n      <p>\n        <select id=\"excedent\" name=\"excedent\">\n          <option value=\"\">Select<\/option>\n          <option value=\"faux\">Cantilevered<\/option>\n          <option value=\"queue\">Tailed<\/option>\n          <option value=\"autre\">Other<\/option>\n        <\/select>\n      <\/p>\n\n      <label for=\"longexcedent\">Longeur d&#8217;ex\u00e9dent&nbsp;<\/label><span class=\"longexcedent-tt\" title=\"My tooltip\"><i\n          class=\"fas fa-info-circle\"><\/i><\/span>\n      <p>\n        <select id=\"longexcedent\" name=\"longexcedent\">\n          <option value=\"\">Select<\/option>\n          <option value=\"s12po\">Standard 12&#8243;<\/option>\n          <option value=\"s16po\">Standard 16&#8243;<\/option>\n          <option value=\"autre\">Other<\/option>\n        <\/select>\n      <\/p>\n\n      <label for=\"fascia\">Fascia height&nbsp;<\/label><span class=\"fascia-tt\" title=\"My tooltip\"><i\n          class=\"fas fa-info-circle\"><\/i><\/span>\n      <p>\n        <select id=\"fascia\" name=\"fascia\">\n          <option value=\"\">Select<\/option>\n          <option value=\"s4po\">Standard 4&#8243;<\/option>\n          <option value=\"s6po\">Standard 6&#8243;<\/option>\n          <option value=\"double\">Double fascia<\/option>\n          <option value=\"autre\">Other<\/option>\n        <\/select>\n      <\/p>\n\n\n    <\/div>\n    <div class=\"tab\">\n      <b>Step 4 of 4<\/b>\n\t  <br>\n\t  <b>Section Chevrons &#8211; Poutrelles<\/b>\n      <table>\n        <tbody>\n          <tr>\n            <td>\n              Need farm? <span class=\"fermebout-tt\" title=\"My tooltip\"><i\n                  class=\"fas fa-info-circle\"><\/i><\/span>\n            <\/td>\n            <td>\n              Need floor joints? <span class=\"poutrelles-tt\" title=\"My tooltip\"><i\n                  class=\"fas fa-info-circle\"><\/i><\/span>\n            <\/td>\n          <\/tr>\n          <tr>\n            <td>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"bout\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"bout\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n            <td>\n              <label class=\"radio_label\"> <input class=\"radio_btn\" type=\"radio\" name=\"poutrelle\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"poutrelle\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n          <\/tr>\n\n          <tr>\n            <td>\n              Besoin d&#8217;\u00e9chelle? <span class=\"echelle-tt\" title=\"My tooltip\"><i class=\"fas fa-info-circle\"><\/i><\/span>\n            <\/td>\n            <td>\n\t\t\t<b style=\"color:Red;\"> *NOUVEAU* <\/b> <br>\nNeed prefabricated walls? \n<\/td>\n          <\/tr>\n          <tr>\n            <td>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"echelle\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"echelle\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n            <td>\n              <label class=\"radio_label\"> <input class=\"radio_btn\" type=\"radio\" name=\"mur\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"mur\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n          <\/tr>\n\n          <tr>\n            <td>\n              Besoin de l&#8217;inteaux? <span class=\"linteaux-tt\" title=\"My tooltip\"><i\n                  class=\"fas fa-info-circle\"><\/i><\/span>\n            <\/td>\n            <td>\n              Attach your plans\n            <\/td>\n          <\/tr>\n          <tr>\n            <td>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"linteaux\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"linteaux\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n            <td>\n              <input type=\"file\" name=\"fileToUpload[]\" id=\"fileToUpload\" multiple=\"\">\n            <\/td>\n          <\/tr>\n\n\n        <\/tbody>\n      <\/table>\n\n      <textarea name=\"message\" placeholder=\"Message\"><\/textarea>\n\n\n      <!--<form action=\"upload.php\" method=\"post\" enctype=\"multipart\/form-data\">\nIns\u00e9rer vos plans (plusieurs items peuvent \u00eatre s\u00e9lectionn\u00e9s):\n<input type=\"file\" name=\"fileToUpload\" id=\"fileToUpload\" multiple>\n<input type=\"submit\" value=\"T\u00e9l\u00e9verser\" name=\"submit\">\n<\/form>\n<\/p>-->\n      <!--  <p><input placeholder=\"Username...\" oninput=\"this.className = ''\"><\/p> -->\n      <!--  <p><input placeholder=\"Password...\" oninput=\"this.className = ''\"><\/p> -->\n    <\/div>\n\n    <!-- Page  5 -->\n    <div class=\"tab\">\n\n\n      <b>\u00c9tape 5 de 5<\/b>\n\t  <br>\n\t  <b>Section Murs<\/b>\n      <br>\n\t\t\n\t\t<p style=\"color:Red;\"> Informations importantes <\/p> \n<p>\n\nTous les murs sons con\u00e7us avec un rev\u00eatement osb 7\/16 afin d\u2019assurer la solidit\u00e9 du mur.\n<br>\n<br>\n\nL\u2019isolation int\u00e9rieure et la finition ext\u00e9rieure doivent \u00eatre faites par le client.\n <\/p>\n\n\n      <u>\n\t  \n      Pour toute demande de soumission, vous devez nous faire parvenir un plan avec les dimensions et ouvertures souha\u00eet\u00e9es\n    <\/u>\n    <br>\n    <b>Attach your plans<\/b>\n    <input type=\"file\" name=\"fileToUpload2[]\" id=\"fileToUpload2\" multiple=\"\">\n    <br>\n    <br>\n  \n\n      <label for=\"ossature\"><b>Type d&#8217;ossature<\/b>&nbsp;<\/label>\n      <p>\n        <select id=\"ossature\" name=\"ossature\">\n          <option value=\"\">Select<\/option>\n          <option value=\"2x4\">2&#8243; x 4&#8243;<\/option>\n          <option value=\"2x6\">2&#8243; x 6&#8243;<\/option>\n          <option value=\"2x8\">2&#8243; x 8 &#8220;<\/option>\n        <\/select>\n      <\/p>\n\n      <label for=\"hauteurmur\"><b>Hauteur de murs<\/b>&nbsp;<\/label>\n      <p>\n        <select id=\"hauteurmur\" name=\"hauteurmur\">\n          <option value=\"\">Select<\/option>\n          <option value=\"8\">8&#8242;<\/option>\n          <option value=\"9\">9&#8242;<\/option>\n          <option value=\"10\">10&#8242;<\/option>\n          <option value=\"autre\">Other<\/option>\n        <\/select>\n      <\/p>\n\n      <input type=\"number\" id=\"autrehauteur\" name=\"autrehauteur\" placeholder=\"Hauteur de mur non standard\" min=\"1\" oninput=\"this.className = ''\">\n\n\n      <b> Dimensions portes et fen\u00eatres <\/b>\n   \n      <td>\n        <input type=\"text\" style=\"margin-bottom : 5px\" id=\"dimpf1\" name=\"dimpf1\"  placeholder=\"#1\"  oninput=\"this.className = ''\">\n      <\/td>\n     \n      <td>\n        <input type=\"text\" style=\"margin-bottom : 5px\" id=\"dimpf2\" name=\"dimpf2\"  placeholder=\"#2\"  oninput=\"this.className = ''\">\n      <\/td>\n      <br>\n      <td>\n        <input  type=\"text\" style=\"margin-bottom : 5px\" id=\"dimpf3\" name=\"dimpf3\"  placeholder=\"#3\"  oninput=\"this.className = ''\">\n      <\/td>\n\n      <b>Options<\/b>\n      <br>\n      <img decoding=\"async\" src=\"https:\/\/chevronsrn.ca\/wp-content\/uploads\/2023\/02\/murs1.jpg\">\n\n      <br>\n      <label for=\"matisolation\">Mat\u00e9riau isolation ext\u00e9rieur&nbsp;<\/label>\n      <p>\n        <select id=\"matisolation\" name=\"matisolation\">\n          <option value=\"\">Select<\/option>\n          <option value=\"Tyvek\">Tyvek<\/option>\n          <option value=\"Rboard1\">Rboard 1&#8243;<\/option>\n        <\/select>\n      <\/p>\n\n      <table>\n        <tbody>\n<tr>\n        \n      <!--  <\/tr>\n        <tr>\n          <td>\n            O.S.B. 7\/16\" \n          <\/td>\n          <td>\n            \n          <\/td>\n        <\/tr>\n        <tr>\n          <td>\n            <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"osb\" value=\"1\"> Oui<\/label>\n            <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"osb\" value=\"0\" checked=\"\">\n              Non<\/label>\n          <\/td>\n          <td>\n          \n          <\/td>\n        <\/tr>  -->\n\n\n          <tr>\n            <td>\n              Forence 1&#8243;x4&#8243; \n            <\/td>\n            <td>\n              Double lisse du haut\n            <\/td>\n          <\/tr>\n          <tr>\n            <td>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"forence\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"forence\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n            <td>\n              <label class=\"radio_label\"> <input class=\"radio_btn\" type=\"radio\" name=\"doublelisse\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"doublelisse\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n          <\/tr>\n\n          <tr>\n            <td>\n              Muret de b\u00e9ton\n            <\/td>\n            <td>\n              \n            <\/td>\n          <\/tr>\n          <tr>\n            <td>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"muretbeton\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"muretbeton\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n            <td>\n              <input type=\"number\" id=\"hauteurmurbeton\" name=\"hauteurmurbeton\" placeholder=\"Hauteur (po)\" min=\"1\" oninput=\"this.className = ''\">\n            <\/td>\n          <\/tr>\n\n\n            \n      \n               \n           \n  \n  \n\n          <tr>\n            <td>\n              Lisse du bas trait\u00e9e \n            <td>\n             Sangle de levage \n            <\/td>\n          <\/tr>\n          <tr>\n            <td>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"lissebas\" value=\"1\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"lissebas\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n            <td>\n              <label class=\"radio_label\"> <input class=\"radio_btn\" type=\"radio\" name=\"sangle\" value=\"1\" id=\"mur\"> Yes<\/label>\n              <label class=\"radio_label\"><input class=\"radio_btn\" type=\"radio\" name=\"sangle\" value=\"0\" checked=\"\">\n                No<\/label>\n            <\/td>\n          <\/tr>\n\n\n      <\/table>\n      <label for=\"autresdetails\">Autres D\u00e9tails&nbsp;<\/label>\n      <br>\n      <textarea name=\"autresdetails\" placeholder=\"Autres D\u00e9tails\"><\/textarea>\n\n    <\/div>\n\n    <div style=\"overflow:auto;\">\n      <div style=\"float:right;\">\n        <button type=\"button\" id=\"prevBtn\" onclick=\"nextPrev(-1)\">Back<\/button>\n        <button type=\"button\" id=\"nextBtn\" onclick=\"nextPrev(1)\">Next<\/button>\n      <\/div>\n    <\/div>\n\n    <div style=\"display: none\" id=\"portee-tt\">The span is the length of the roof truss from wall to wall.\n      <img decoding=\"async\" src=\"..\/..\/img\/tooltips\/RoofLength.png\" alt=\"port\u00e9e\" width=\"286\" height=\"105\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"pente-tt\">La pente est le degr\u00e9 d&#8217;inclinaison de la toiture <br> La hauteur est la\n      mesure du bas de la ferme jusqu&#8217;au sommet. <br>\n      <img fetchpriority=\"high\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/RoofSlope.png\" alt=\"pente\" width=\"344\" height=\"292\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"longexcedent-tt\">\n      <img decoding=\"async\" src=\"..\/..\/img\/tooltips\/ExcessLentgh.png\" alt=\"longexcedent\" width=\"159\" height=\"146\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"excedent-tt\">\n      <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/ExcessType.png\" alt=\"excendent\" width=\"500\" height=\"289\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"fascia-tt\">\n      <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/FasciaHeight.png\" alt=\"fascia\" width=\"416\" height=\"108\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"fermebout-tt\">\n      La ferme de bout va servir \u00e0 accueillir les \u00e9chelles qui feront office d&#8217;exc\u00e9dant <br>\n      <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/FarmLadder.png\" alt=\"Pente\" width=\"416\" height=\"108\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"echelle-tt\">\n      La ferme de bout va servir \u00e0 accueillir les \u00e9chelles qui feront office d&#8217;exc\u00e9dant <br>\n      <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/FarmLadder.png\" alt=\"Pente\" width=\"416\" height=\"108\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"linteaux-tt\">\n      The lintel is used to support your structure and your materials <br>\n      Particularly at the level of doors and windows <br>\n      We distribute LVL beams designed for this purpose. <br>\n      <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/Lintels.png\" alt=\"linteaux\" width=\"174\" height=\"220\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"poutrelles-tt\">\n      Floor joists are the beams that support your floor. <br>Nos poutrelles ajour\u00e9es on\n      plusieurs avantages : <br> facilit\u00e9 de passage des tuyaux et conduits, rapidit\u00e9 d\u2019assemblage, longueurs\n      pairs\/impairs, r\u00e9sistance maximale, polyvalentes. <br>\n      <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/tooltips\/FloorJoist.png\" alt=\"poutrelles\" width=\"326\" height=\"245\">\n    <\/div>\n\n    <div style=\"display: none\" id=\"typeModal\">\n      <table>\n        <tr>\n          <td>\n            Standard truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/StandardTruss.png\" alt=\"Standard\" width=\"280\" height=\"90\">\n          <\/td>\n          <td>\n            Tailed truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/TailedTruss.png\" alt=\"Queue\" width=\"280\" height=\"90\">\n          <\/td>\n        <\/tr>\n        <tr>\n          <td>\n            Storage truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/StorageTruss.png\" alt=\"Rangement\" width=\"280\" height=\"90\">\n          <\/td>\n          <td>\n            Habitable truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/HabitableTruss.png\" alt=\"Habitable\" width=\"280\" height=\"90\">\n          <\/td>\n        <\/tr>\n        <tr>\n          <td>\n            Scissor truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/ScissorTruss.png\" alt=\"Ciseaux\" width=\"280\" height=\"90\">\n          <\/td>\n          <td>\n            Unislope Truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/UniSlopeTruss.png\" alt=\"Monopente\" width=\"280\" height=\"90\">\n          <\/td>\n        <\/tr>\n        <tr>\n          <td>\n            Canadian truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/CanadianTruss.png\" alt=\"Canadienne\" width=\"280\" height=\"90\">\n          <\/td>\n          <td>\n            Cathedral truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/CathedralTruss.png\" alt=\"Cathedrale\" width=\"280\" height=\"90\">\n          <\/td>\n        <\/tr>\n        <tr>\n          <td>\n            Barn truss <br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/BarnTruss.png\" alt=\"Grange\" width=\"280\" height=\"90\">\n          <\/td>\n          <td>\n            Versant truss<br>\n            <img loading=\"lazy\" decoding=\"async\" src=\"..\/..\/img\/trusses\/VersantTruss.png\" alt=\"4 Versants\" width=\"280\" height=\"90\">\n          <\/td>\n        <\/tr>\n      <\/table>\n    <\/div>\n\n    <!-- Circles which indicates the steps of the form: -->\n    <div id=\"step\" style=\"text-align:center;margin-top:40px;\">\n      <span class=\"step\"><\/span>\n      <span class=\"step\"><\/span>\n      <span class=\"step\"><\/span>\n      <span class=\"step\"><\/span>\n      <span class=\"step\"><\/span>\n    <\/div>\n  <\/form>\n<\/div>\n<style>\n  \/* Style the form *\/\n  #regForm {\n    background-color: #ffffff;\n    margin: 100px auto;\n    padding: 40px;\n    width: 70%;\n    min-width: 300px;\n  }\n\n  \/* Style the input fields *\/\n  input {\n    padding: 10px;\n    width: 100%;\n    font-size: 17px;\n    font-family: Raleway;\n    border: 1px solid #aaaaaa;\n\n  }\n\n  select {}\n\n  \/* Mark input boxes that gets an error on validation: *\/\n  input.invalid {\n    background-color: #ffdddd;\n  }\n\n  select.invalid {\n    background-color: #ffdddd;\n  }\n\n  \/* Hide all steps by default: *\/\n  #page1 {\n    display: none;\n  }\n\n  .tab {\n    display: none;\n\n  }\n\n  \/* Make circles that indicate the steps of the form: *\/\n  .step {\n    height: 15px;\n    width: 15px;\n    margin: 0 2px;\n    background-color: #bbbbbb;\n    border: none;\n    border-radius: 50%;\n    display: inline-block;\n    opacity: 0.5;\n  }\n\n  \/* Mark the active step: *\/\n  .step.active {\n    opacity: 1;\n  }\n\n  \/* Mark the steps that are finished and valid: *\/\n  .step.finish {\n    background-color: #4CAF50;\n  }\n\n  .radio_btn {\n    display: block;\n    \/* space between buttons *\/\n    vertical-align: middle;\n  }\n\n  .radio_label {\n    margin: 20px;\n    display: inline-block;\n  }\n\n  .length {\n    float: left;\n  }\n\n  .tableb {\n    margin: 0px;\n\n  }\n\n  .tablec {\n    margin: 0px;\n    max-width: 300px;\n  }\n\n  .tooltip {\n    opacity: 1 !important;\n    display: inline-block;\n    vertical-align: middle;\n  }\n\n  .spinner-border {\n    display: none;\n  }\n\n  button:hover {\n    background-color: #1f1f1f;\n  }\n<\/style>\n<script>\n\n\n  document.getElementById(\"personne\").defaultValue = \"\";\n  document.getElementById(\"email\").defaultValue = \"\";\n  document.getElementById(\"telephone\").defaultValue = \"\";\n  document.getElementById(\"entreprise\").defaultValue = \"\";\n  var currentTab = 0; \/\/ Current tab is set to be the first tab (0)\n  showTab(currentTab); \/\/ Display the current tab\n\n\n  function validateEmail(email) {\n    const re = \/^(([^<>()[\\]\\\\.,;:\\s@\\\"]+(\\.[^<>()[\\]\\\\.,;:\\s@\\\"]+)*)|(\\\".+\\\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$\/;\n    return re.test(email);\n  }\n\n  function validate() {\n    const $result = $(\"#result\");\n    const email = $(\"#email\").val();\n    $result.text(\"\");\n\n    if (validateEmail(email)) {\n      $result.text(email + \" is valid :)\");\n      $result.css(\"color\", \"green\");\n      valid = true;\n    } else {\n      $result.text(email + \" is not valid :(\");\n      $result.css(\"color\", \"red\");\n      valid = false;\n    }\n    return valid;\n  }\n\n\n  function showTab(n) {\n    \/\/ This function will display the specified tab of the form ...\n    var x = document.getElementsByClassName(\"tab\");\n    x[n].style.display = \"block\";\n    \/\/ ... and fix the Previous\/Next buttons:\n    if (n == 0) {\n      document.getElementById(\"prevBtn\").style.display = \"none\";\n    } else {\n      document.getElementById(\"prevBtn\").style.display = \"inline\";\n    }\n    j =  $('input[name=\"mur\"]:checked').val();\n    if (n == 3 && j == true){\n      document.getElementById(\"nextBtn\").innerHTML = \"Suivant\";\n    }\n    else if (n == (x.length - 1)) {\n      document.getElementById(\"nextBtn\").innerHTML = \"Envoyer\";\n    } else {\n      document.getElementById(\"nextBtn\").innerHTML = \"Suivant\";\n    }\n    \/\/ ... and run a function that displays the correct step indicator:\n    fixStepIndicator(n)\n  }\n\n  function nextPrev(n) {\n    \/\/ This function will figure out which tab to display\n    var x = document.getElementsByClassName(\"tab\");\n    \/\/ Exit the function if any field in the current tab is invalid:\n    if (n == 1 && !validateForm()) return false;\n    \/\/ Hide the current tab:\n    x[currentTab].style.display = \"none\";\n\n    \/\/ Increase or decrease the current tab by 1:\n    currentTab = currentTab + n;\n \n    \/\/ if you have reached the end of the form... :\n    j =  $('input[name=\"mur\"]:checked').val();\n\n    j =  $('input[name=\"mur\"]:checked').val();\n    if (j == true && currentTab > 4) {\n\n      document.getElementById(\"regForm\").submit();\n      var x = document.getElementById(\"regForm\");\n      x.style.display = \"none\";;\n      var y = document.getElementById(\"spinner\");\n      y.style.display = \"block\";\n      return false;\n    }\n    else if (j == false && currentTab > 3) {\n      document.getElementById(\"regForm\").submit();\n      var x = document.getElementById(\"regForm\");\n      x.style.display = \"none\";;\n      var y = document.getElementById(\"spinner\");\n      y.style.display = \"block\";\n      return false;\n\n    }\n    \n\n\n    \/\/ if (currentTab >= x.length) {\n    \/\/   \/\/...the form gets submitted:\n    \/\/   document.getElementById(\"regForm\").submit();\n    \/\/   var x = document.getElementById(\"regForm\");\n    \/\/   x.style.display = \"none\";;\n    \/\/   var y = document.getElementById(\"spinner\");\n    \/\/   y.style.display = \"block\";\n\n\n    \/\/   return false;\n    \/\/ }\n    \/\/ Otherwise, display the correct tab:\n    showTab(currentTab);\n  }\n\n  function validateForm() {\n    \/\/ This function deals with validation of the form fields\n    var x, y, i, valid = true, badEmail = false;\n    if (currentTab == 0) {\n      valid = validate();\n\n      if (!valid) {\n        alert(\"Entrer un courriel valide\");\n        badEmail = true;\n      }\n\n    }\n    x = document.getElementsByClassName(\"tab\");\n    y = x[currentTab].getElementsByTagName(\"input\");\n    z = x[currentTab].getElementsByTagName(\"select\")\n    \/\/ A loop that checks every input field in the current tab:\n    for (i = 0; i < y.length; i++) {\n      \/\/ If a field is empty...\n      if (y[i].id == \"email\") {\n        if (badEmail) {\n          valid = false;\n          y[i].className += \" invalid\";\n        }\n\n\n        if (y[i].value == \"\") {\n\n\n\n          \/\/ add an \"invalid\" class to the field:\n          if (y[i].id != \"fileToUpload\") {\n            y[i].className += \" invalid\";\n            \/\/ and set the current valid status to false:\n            valid = false;\n          }\n        }\n\n\n      }\n    }\n    for (i = 0; i < z.length; i++) {\n      \/\/ If a field is empty...\n      if (z[i][0].selected == true) {\n        \/\/ add an \"invalid\" class to the field:\n\n        z[i].className += \" invalid\";\n\n        \/\/ and set the current valid status to false:\n        valid = false;\n      }\n    }\n    \/\/ If the valid status is true, mark the step as finished and valid:\n    if (valid) {\n      document.getElementsByClassName(\"step\")[currentTab].className += \" finish\";\n    }\n    return valid; \/\/ return the valid status\n  }\n\n  function fixStepIndicator(n) {\n    \/\/ This function removes the \"active\" class of all steps...\n    var i, x = document.getElementsByClassName(\"step\");\n    for (i = 0; i < x.length; i++) {\n      x[i].className = x[i].className.replace(\" active\", \"\");\n    }\n    \/\/... and adds the \"active\" class to the current step:\n    x[n].className += \" active\";\n  }\n\n  $(\"select\").on(\"change\", function () {\n    \/\/$(\"#\" + $(this).val()).show().siblings().hide();\n    var client;\n    client = $(\"#client option:selected\").val();\n    if (client == \"distributeur\") {\n      $(\"#entreprise\").show();\n      $(\"#entreprise_lbl\").show();\n      \/\/$(\"#entreprise\").attr(\"placeholder\", \"Nom du magasin\");\n      $(\"#entreprise_lbl\").html(\"Nom du magasin\");\n      \/\/ $(\"#personne\").attr(\"placeholder\", \"Nom du commis\");\n      $(\"#personne_lbl\").html(\"Nom du commis\");\n      \/\/  $(\"#telephone\").attr(\"placeholder\", \"Num\u00e9ro de t\u00e9l\u00e9phone du commis\");\n      $(\"#telephone_lbl\").html(\"Num\u00e9ro de t\u00e9l\u00e9phone du commis\");\n      \/\/  $(\"#email\").attr(\"placeholder\", \"Courriel du commis\");\n      $(\"#email_lbl\").html(\"Courriel du commis\");\n    }\n    else if (client == \"entrepreneur\") {\n      $(\"#entreprise\").show();\n      $(\"#entreprise_lbl\").show();\n      \/\/  $(\"#entreprise\").attr(\"placeholder\", \"Nom de l'entreprise\")\n      $(\"#entreprise_lbl\").html(\"Nom de l'entreprise\")\n      \/\/   $(\"#personne\").attr(\"placeholder\", \"Nom du charg\u00e9 de projet\");\n      $(\"#personne_lbl\").html(\"Nom du charg\u00e9 de projet\");\n      \/\/   $(\"#telephone\").attr(\"placeholder\", \"Num\u00e9ro de t\u00e9l\u00e9phone du charg\u00e9 de projet\");\n      $(\"#telephone_lbl\").html(\"Num\u00e9ro de t\u00e9l\u00e9phone du charg\u00e9 de projet\");\n      \/\/   $(\"#email\").attr(\"placeholder\", \"Courriel du charg\u00e9 de projet\");\n      $(\"#email_lbl\").html(\"Courriel du charg\u00e9 de projet\");\n    }\n    else if (client == \"entreprise\") {\n      $(\"#entreprise\").show();\n      $(\"#entreprise_lbl\").show();\n      \/\/   $(\"#entreprise\").attr(\"placeholder\", \"Nom de l'entreprise\")\n      $(\"#entreprise_lbl\").html(\"Nom de l'entreprise\")\n      \/\/    $(\"#personne\").attr(\"placeholder\", \"Nom de la personne responsable\");\n      $(\"#personne_lbl\").html(\"Nom de la personne responsable\");\n      \/\/    $(\"#telephone\").attr(\"placeholder\", \"Num\u00e9ro de t\u00e9l\u00e9phone de la personne responsable\");\n      $(\"#telephone_lbl\").html(\"Num\u00e9ro de t\u00e9l\u00e9phone de la personne responsable\");\n      \/\/    $(\"#email\").attr(\"placeholder\", \"Courriel de la personne responsable\");\n      $(\"#email_lbl\").html(\"Courriel de la personne responsable\");\n    }\n    else if (client == \"particulier\") {\n      $(\"#entreprise\").hide();\n      $(\"#entreprise_lbl\").hide();\n      \/\/$(\"#entreprise\").attr(\"placeholder\", \"Nom\");\n      \/\/\t$(\"#entreprise_lbl\").html('Nom')\n      \/\/ $(\"#personne\").attr(\"placeholder\", \"Nom\");\n      $(\"#personne_lbl\").html('Nom')\n      \/\/    $(\"#telephone\").attr(\"placeholder\", \"Num\u00e9ro de t\u00e9l\u00e9phone\");\n      $(\"#telephone_lbl\").html('Num\u00e9ro de t\u00e9l\u00e9phone')\n      \/\/   $(\"#email\").attr(\"placeholder\", \"Courriel\");\n      $(\"#email_lbl\").html(\"Courriel\");\n    }\n\n    if (client == \"selectionner\") {\n      $(\"#page1\").hide()\n    }\n    else {\n      $(\"#page1\").show()\n    }\n\n\n\n    \/*  if (client ==\"particulier\"){\n       $(\"#entreprise\").hide();\n      $(\"#entreprise_lbl\").hide();\n      }*\/\n  })\n\n\n\n  jQuery(document).ready(function () {\n\n\n\n    $('#date').val(new Date().toDateInputValue());\n    $(\"#btn3\").click(function () {\n      $(\"#test3\").val(\"Dolly Duck\");\n    });\n\n\n    $('#mur input[type=radio]').change(function(){\n      alert ( $(this).val() )\n     \n      })\n\n      $(\"#hauteurmur\").change(function () {\nvar selectedSubject = $(\"#hauteurmur option:selected\").val();\nalert(\"You have selected the country - \" + selectedSubject);\nconsole.log(selectedSubject);\n    \n  })\n\n})\n\n\n  new jBox('Tooltip', {\n    attach: '.portee-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#portee-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.pente-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#pente-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.longexcedent-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#longexcedent-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.excedent-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#excedent-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.fascia-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#fascia-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.fermebout-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#fermebout-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.echelle-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#echelle-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.linteaux-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#linteaux-tt')\n  });\n\n  new jBox('Tooltip', {\n    attach: '.poutrelles-tt',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#poutrelles-tt')\n  });\n\n  var typeModal = new jBox('Modal', {\n    attach: '.typeModal',\n    title: 'S\u00e9letionner un type de ferme \/ Select truss model',\n    getTitle: 'data-jbox-title',\n    getContent: 'data-jbox-content',\n    content: $('#typeModal')\n  });\n\n\n\n\n  $('body').on('click', 'img', function () {\n    var test = $(\"#type\");\n    var test_value = $(\"#type\").attr('value');\n    $(\"#type\").attr('value', \"\");\n    var type = $(this).attr(\"alt\")\n    \/*var test = $(\"#type\");*\/\n    \/*$('input[name=\"type\"]').val(type);*\/\n    $(\"#type\").attr('value', type);\n    $(\"#type\").val(type);\n    $(\"#typeModal\").hide;\n    \/*$(\"#type\").innerHTML = type;*\/\n    \/*var test = $(\"#type\").val;*\/\n    \/*(\"#type\").val=type;*\/\n    \/*alert(type);*\/\n    typeModal.close();\n  })\n\n\n  $('#regForm').submit(function () {\n    $('#spinner').show();\n    \/*$.post('\/somepage.htm', function() {\n    \/*    $('#wait').hide();\n   \/* });\n   \/* return false;*\/\n  });\n\n\n<\/script>","protected":false},"excerpt":{"rendered":"<p>Loading&#8230; Envoi en cours&#8230; \u00c9tape 1 de 4 : Quel type de client \u00eates vous? S\u00e9lectionnerDistributeurEntrepreneurEntreprise\/CommercialParticulier Nom du magasin Nom du commis Num\u00e9ro de t\u00e9l\u00e9phone Courriel \u00c9tape 2 de 4 : O\u00f9 et quand? Nom du projet Ville du projet Adresse de livraison Date requise \u00c9tape 3 de 4 : D\u00e9tails du b\u00e2timent Type de&hellip;&nbsp;<a href=\"https:\/\/chevronsrn.ca\/en\/soumission-test\/\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">Soumission-test<\/span><\/a><\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"neve_meta_sidebar":"full-width","neve_meta_container":"","neve_meta_enable_content_width":"on","neve_meta_content_width":100,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","_ti_tpc_template_sync":false,"_ti_tpc_template_id":"","footnotes":""},"class_list":["post-1649","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/pages\/1649","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/comments?post=1649"}],"version-history":[{"count":65,"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/pages\/1649\/revisions"}],"predecessor-version":[{"id":1725,"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/pages\/1649\/revisions\/1725"}],"wp:attachment":[{"href":"https:\/\/chevronsrn.ca\/en\/wp-json\/wp\/v2\/media?parent=1649"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}