templates/forms/rcs-club-sign-up.html.twig line 1

Open in your IDE?
  1. {% extends "base.html.twig" %}
  3. {% block body %}
  5. {% embed "1-col-sidebar.html.twig" %}
  6. {% block column %}
  8.     {% if message is defined and message %}
  9.         <div class="alert alert-{{ message.type }}">
  10.         {% if message.type == 'warning' %}
  11.             <i class="fa fa-exclamation-triangle"></i> 
  12.         {% elseif message.type == 'success' %}
  13.             <i class="fa fa-check"></i> 
  14.         {% endif %}
  15.         {{ message.text | raw}}
  16.         </div>
  17.     {% endif %}
  19.     {% if site_code == constant("App\\Entity\\Content::SITE_RCS") %}
  20.         {% include  "includes/curtain-ads/rclub.html.twig" %}
  21.     {% endif %}
  23. {% if content.getShowTitle() %}
  24.     <h1>{{ content.getTitle() | raw }}</h1>
  25. {% endif %}
  27. {% if content.getFeaturedImageTag() %}
  28.     {% if content.getMediaURL() %}<a href="{{content.getMediaURL()}}">{% endif %}
  29.         {{ content.getFeaturedImageTag("display-block","")|raw }}
  30.         {% if content.getMediaURL() %}</a>{% endif %}
  31. {% endif %}
  33. <form id="rcsclubform" method="post" action="" enctype="multipart/form-data" style="margin-top:20px;">
  34.     
  35.     {% if app.user is empty %}
  37.     <div class="row mb-3">
  38.         <div class="col-md-12">
  39.             <div class="alert alert-info">
  40.                 <i class="fa fa-info"></i> 
  41.                  A user account is required to continue. If you don't have an account, you can create one below.<br>Your account details will be confirmed via e-mail. <!-- ' -->
  42.             </div>
  43.         </div>
  44.         <div class="col-md-6" style="margin-top:0px;">
  45.             {#
  46.             <strong>Have an Account?</strong>
  47.             <div class="">
  48.                 <a class="button text-white" href="/sign-in"><i class="fa fa-key"></i> Sign In</a>
  49.             </div>
  50.             #}
  51.             <strong>Have an Account?</strong>
  52.             <div class="form-check">
  53.                 <input class="form-check-input" type="radio" name="signType" id="signInRadio" value="signIn" required>
  54.                 <label class="form-check-label" for="signInRadio">
  55.                     Sign In
  56.                 </label>
  57.             </div>
  58.         </div>
  59.         <div class="col-md-6">
  60.             {#<strong>First Time User?</strong>
  61.             <div class="">
  62.                 <a class="button text-white" href="/sign-up"><i class="fa fa-key"></i> Sign Up</a>
  63.             </div>
  64.             #}
  65.             <strong>First Time User?</strong>
  66.             <div class="form-check">
  67.                 <input class="form-check-input" type="radio" name="signType" id="signUpRadio" value="signUp" required>
  68.                 <label class="form-check-label" for="signUpRadio">
  69.                     Sign Up
  70.                 </label>
  71.             </div>
  72.         </div>
  73.     </div>
  75.     <div class="row mb-3" id="signInSection" style="display:none;">
  76.         <div class="col-md-12">
  77.             {#<form action="/sign-in" method="post">#}
  78.             {#<form id="rcsclubform" method="post" action="" enctype="multipart/form-data">#}
  79.                 
  80.                 <input type="hidden" id="signin" name="signin" value="1">
  82.                 <div class="row">
  83.                     <div class="col-sm-6">
  84.                         <label class="btn-block">Username or Email Address
  85.                             <input 
  86.                                 class="form-control" 
  87.                                 type="text" 
  88.                                 name="_username" 
  89.                                 placeholder="Your Username or Email Address"
  90.                             />
  91.                         </label>
  92.                     </div>
  93.                     <div class="col-sm-6">
  94.                         <label class="btn-block">Password
  95.                             <input 
  96.                                 class="form-control" 
  97.                                 type="password" 
  98.                                 name="_password" 
  99.                                 placeholder="Your Password"
  100.                             />
  101.                         </label>
  102.                     </div>
  103.                 </div>
  104.                 
  105.                 {#<button 
  106.                     type="submit" 
  107.                     class="btn btn-secondary text-white bg-dark mt-2"
  108.                 >Sign In</button>#}
  109.             {#</form>#}
  110.         </div>
  111.     </div>
  113.     <div class="row mb-3" id="signUpSection" style="display:none;">
  114.         <div class="col-md-12">
  115.             {#<form method="post" action="">#}
  116.             {#<form id="rcsclubform" method="post" action="" enctype="multipart/form-data">#}
  117.                 <input type="hidden" id="site-signup" name="site-signup" value="1">
  118.                 
  119.                 <div class="row">
  120.                     <div class="col-sm-6">
  121.                         <label class="btn-block"><span>First Name:<span style="color:red"> *</span></span>
  122.                             <input
  123.                                 class="form-control"
  124.                                 type="text"
  125.                                 name="lead[firstname]"
  126.                                 placeholder="Your First Name"
  127.                                 value="{{ firstname is defined ? firstname : '' }}"
  128.                             />
  129.                         </label>    
  130.                     </div>
  131.                     <div class="col-sm-6">
  132.                         <label class="btn-block"><span>Last Name:<span style="color:red"> *</span></span>
  133.                             <input
  134.                                 class="form-control"
  135.                                 type="text"
  136.                                 name="lead[lastname]"
  137.                                 placeholder="Your Last Name"
  138.                                 value="{{ lastname is defined ? lastname : '' }}"
  139.                             />
  140.                         </label>
  141.                     </div>
  142.                     
  143.                     <div class="col-sm-6">
  144.                         <label class="btn-block">Your Username<span style="color:red"> *</span>
  145.                             <input
  146.                                 class="form-control"
  147.                                 type="text"
  148.                                 name="lead[username]"
  149.                                 placeholder="Your Username"
  150.                                 value="{{ username is defined ? username : '' }}"
  151.                             />
  152.                         </label>
  153.                         <span><i class="fa fa-exclamation-triangle"></i> Username must be greater than 5 characters in length.</span>
  155.                     </div>
  156.                     <div class="col-sm-6">
  157.                         <label class="btn-block">Your E-mail Address<span style="color:red"> *</span>
  158.                             <input
  159.                                 class="form-control"
  160.                                 type="text"
  161.                                 name="lead[email]"
  162.                                 placeholder="Your E-mail Address"
  163.                                 value="{{ email is defined ? email : '' }}"
  164.                             />
  165.                         </label>
  166.                     </div>
  167.                     
  168.                     <div class="col-sm-6">
  169.                         <label class="btn-block">Your Password<span style="color:red"> *</span>
  170.                             <input
  171.                                 class="form-control"
  172.                                 type="password"
  173.                                 name="password1"
  174.                                 placeholder="Your Password"
  175.                             />
  176.                         </label>
  177.                     </div>
  178.                     <div class="col-sm-6">
  179.                         <label class="btn-block">Confirm Password<span style="color:red"> *</span>
  180.                             <input
  181.                                 class="form-control"
  182.                                 type="password"
  183.                                 name="password2"
  184.                                 placeholder="Confirm Your Password"
  185.                             />
  186.                         </label>
  187.                     </div>
  188.                     
  189.                     <div class="col-sm-6">
  190.                         <label class="btn-block">Address Line 1<span style="color:red"> *</span>
  191.                             <input
  192.                                 class="form-control"
  193.                                 type="text"
  194.                                 name="lead[address1]"
  195.                                 placeholder="Your Address Line 1"
  196.                                 value="{{ address1 is defined ? firstname : '' }}"
  197.                             />
  198.                         </label>
  199.                     </div>
  200.                     <div class="col-sm-6">
  201.                         <label class="btn-block">Address Line 2<span style="color:red"></span>
  202.                             <input
  203.                                 class="form-control"
  204.                                 type="text"
  205.                                 name="lead[address2]"
  206.                                 placeholder="Your Address Line 2"
  207.                                 value="{{ address2 is defined ? firstname : '' }}"
  208.                             />
  209.                         </label>
  210.                     </div>
  211.                     <div class="col-sm-6">
  212.                         <label class="btn-block">City<span style="color:red"> *</span>
  213.                             <input
  214.                                 class="form-control"
  215.                                 type="text"
  216.                                 name="lead[city]"
  217.                                 placeholder="Your City"
  218.                                 value="{{ city is defined ? firstname : '' }}"
  219.                             />
  220.                         </label>
  221.                     </div>
  222.                     <div class="col-sm-6">
  223.                         <label class="btn-block">State / Region<span style="color:red"> *</span>
  224.                             <input
  225.                                 class="form-control"
  226.                                 type="text"
  227.                                 name="lead[state]"
  228.                                 placeholder="Your State / Region"
  229.                                 value="{{ state is defined ? firstname : '' }}"
  230.                             />
  231.                         </label>
  232.                     </div>
  233.                     <div class="col-sm-6">
  234.                         <label class="btn-block">Zip Code<span style="color:red"> *</span>
  235.                             <input
  236.                                 class="form-control"
  237.                                 type="text"
  238.                                 name="lead[zip]"
  239.                                 placeholder="Your Zip Code"
  240.                                 value="{{ zip is defined ? firstname : '' }}"
  241.                             />
  242.                         </label>
  243.                     </div>
  244.                     <div class="col-sm-6" id="outer-company-div" {#style="display:none;"#}>
  245.                         <label class="btn-block">Company<span style="color:red"> *</span>
  246.                             <input
  247.                                 class="form-control"
  248.                                 type="text"
  249.                                 {#name="lead[company_inactive]"#}
  250.                                 name="lead[company]"
  251.                                 placeholder="Your Company"
  252.                                 value="{% if company is defined %}{{company}}{% endif %}"
  253.                                 id="company1"
  254.                             />
  255.                         </label>
  256.                     </div>
  257.                     
  258.                     <div class="col-sm-6">
  259.                         <label class="btn-block"><span>Phone Number:{#<span style="color:red"> *</span>#}</span>
  260.                             <input
  261.                                 type="text"
  262.                                 class="form-control enews-field"
  263.                                 placeholder="Your Phone Number"
  264.                                 name="lead[phone]"
  265.                                 value="{% if phone is defined %}{{phone}}{% endif %}"
  266.                                 {#required#}
  267.                             />
  268.                         </label>
  269.                     </div>
  270.                     
  271.                     <div class="col-sm-6">
  272.                         <label class="btn-block"><span>Type of Work Performed:<span style="color:red"> *</span></span>
  273.                             <select
  274.                                 class="form-control enews-field"
  275.                                 name="lead[contractor_type]"
  276.                             >
  277.                             <option value="Primarily Commercial">Primarily Commercial</option>
  278.                             <option value="Primarily Residential">Primarily Residential</option>
  279.                             <option value="Both">Both</option>
  280.                             <option value="Other">Other</option>
  281.                             <option value="Not a Contractor">Not a Contractor</option>
  282.                             </select>
  283.                         </label>
  284.                     </div>
  285.                     
  286.                     <div class="col-sm-6">
  287.                         <label class="btn-block"><span>Country:<span style="color:red"> *</span></span></label>
  288.                         <label class="btn-block">
  289.                             <input
  290.                                 type="radio"
  291.                                 name="lead[country]"
  292.                                 value="United States"
  293.                                 class="enews-field"
  294.                                 checked
  295.                             />
  296.                             <span>United States</span>
  297.                         </label>
  298.                         <label class="btn-block">
  299.                             <input
  300.                                 type="radio"
  301.                                 name="lead[country]"
  302.                                 value="Canada"
  303.                                 class="enews-field"
  304.                             />
  305.                             <span>Canada</span>
  306.                         </label>
  307.                         <label class="btn-block">
  308.                             <input
  309.                                 type="radio"
  310.                                 name="lead[country]"
  311.                                 value="European Countries"
  312.                                 class="enews-field"
  313.                             />
  314.                             <span>European Countries</span>
  315.                         </label>
  316.                         <label class="btn-block">
  317.                             <input
  318.                                 type="radio"
  319.                                 name="lead[country]"
  320.                                 value="Other"
  321.                                 class="enews-field"
  322.                             />
  323.                             <span><input
  324.                                 type="text"
  325.                                 placeholder="Other"
  326.                                 name="lead[country_other]"
  327.                                 class="enews-field"
  328.                             /></span>
  329.                         </label>
  330.                     </div>
  331.                     
  332.                     <div class="col-sm-6">
  333.                         <label class="btn-block"><span>Business Type:<span style="color:red"> *</span></span>
  334.                             <select
  335.                                 class="form-control enews-field"
  336.                                 name="lead[business_type]"
  337.                             >
  338.                                 <option value="Roofing Contractor">Roofing Contractor</option>
  339.                                 <option value="Exterior/General Contractor">Exterior/General Contractor</option>
  340.                                 <option value="Distributor">Distributor</option>
  341.                                 <option value="Manufacturer/Business Services">Manufacturer/Business Services</option>
  342.                                 <option value="Other">Other</option>
  343.                             </select>
  344.                         </label>
  345.                     </div>
  346.                     
  347.                     
  348.                     {#<h6>2. Add the "Week In Roofing" E-news</h6>#}
  349.                     
  350.                     <div class="col-sm-12" {# class="form-check" #} style="margin-top:30px;padding-left:25px;">
  351.                         <input class="form-check-input" type="checkbox" value="1" id="enews" name="enews" {#onclick="clickEnews()"#} checked>
  352.                         <label class="form-check-label" for="enews">
  353.                             <span class="rtooltip">Sign up for Week In Roofing? <i class="fa fa-info-circle"></i>
  354.                                 <div class="rtooltiptext" style="top:-30px;left:225px;width:260px;padding-left:10px;">
  355.                                     Our weekly newsletter - an inside look <br>at the roofing industry, week by week!
  356.                                 </div>
  357.                             </span>
  358.                         </label>
  359.                     </div>
  361.                     <div class="col-sm-12" style="margin-top:30px;padding-left:25px;">
  362.                         <input class="form-check-input" type="checkbox" value="1" id="metal-enews" name="metal-enews" checked>
  363.                         <label class="form-check-label" for="metal-enews">
  364.                             <span class="rtooltip">Sign up for Week In Metal? <i class="fa fa-info-circle"></i>
  365.                                 <div class="rtooltiptext" style="top:-30px;left:225px;width:260px;padding-left:10px;">
  366.                                     Our weekly newsletter - an inside look <br>at the metal industry, week by week!
  367.                                 </div>
  368.                             </span>
  369.                         </label>
  370.                     </div>
  372.                     <div class="col-sm-12" style="margin-top:30px;padding-left:25px;">
  373.                         <input class="form-check-input" type="checkbox" value="yes" id="rclub_interest" name="lead_custom[rclub_interest]">
  374.                         <label class="form-check-label" for="rclub_interest">
  375.                             <span class="rtooltip">Interested in R-Club? <i class="fa fa-info-circle"></i>
  376.                                 <div class="rtooltiptext" style="top:-30px;left:165px;width:210px;padding-left:10px;">
  377.                                     The most exclusive roofing contractors club in the world!
  378.                                 </div>
  379.                             </span>
  380.                         </label>
  381.                     </div>
  382.                     
  383.                     
  384.                 </div>
  386.                 {#
  387.                 <div style="text-align:center;">
  388.                     <button
  389.                         type="submit" 
  390.                         class="btn btn-secondary mt-2"
  391.                         style="font-size: 22px;"
  392.                     >Sign Up</button>
  393.                 </div>
  394.                 
  395.                 <br>
  396.                 <p>*Please check your spam folder if you don't receive an activation e-mail after several minutes. Contact us at info@rooferscoffeeshop.com if you need any additional help.</p>
  397.                 #}
  398.             {#</form>#}
  399.         </div>
  400.     </div>
  401.     
  402.     
  403.     {% endif %}
  404.     
  405.     
  406.     {% if app.user is not empty and app.user.isMember() %}
  407.         <h4><center>You're already a member, thank you!</center><h4> {# ' #}
  408.     {% else %}
  409.         
  410.         {% for product in products %}
  411.             <label class="d-block">
  412.                 <table class="table">
  413.                     <tr>
  414.                         <td style="width: 1px">
  415.                         <input
  416.                             name="club_product_id"
  417.                             type="radio"
  418.                             value="{{ product.getId() }}"
  419.                             required
  420.                         />
  421.                         </td>
  422.                         <td>
  423.                             <h5 class="m-0 p-0">{{ product.getTitle() }}</h5>
  424.                             {{ product.getDescription()|raw }}<br />
  425.                             <strong>{{ product.getFullPrice() }}</strong>
  426.                         </td>
  427.                     </tr>
  428.                 </table>
  429.             </label>
  430.         {% endfor %}
  431.         <div class="form-row g-recaptcha" data-sitekey="6LeEIlMUAAAAAGhdmJJLdJHPxaWx2GqBjber5n6B" required></div>
  432.         <center>
  433.         <button
  434.             class="btn btn-primary"
  435.             type="submit"
  436.         >Become a Member</button>
  437.         </center>
  438.         <br>
  439.         <p>Each directory offers the ability to list your company name, logo (that links to your website), company description, corporate address, phone number, email address and links to your website, Facebook, X, LinkedIn, Instagram, and YouTube pages. You can also add unlimited keywords to be searched by in the directory and the website at large. This listing will be featured on future in the RoofersCoffeeShop directory.</p>
  440.         <p>Please contact our R-Club Coordinator, Alex Tolle, with any questions or if you need any assistance signing up.</p>
  441.         <p>*Standard Directory included with Company Membership only.</p>
  442.         <p>**Interactive Directory included with Premium Contractors Membership only.</p>
  443.         </p>
  444.     {% endif %}
  445.         
  446.     {#{% endif %}#}
  447.     
  448. </form>
  449. <hr style="margin-top:20px;margin-bottom:35px;">
  450. <div>
  451.     {{ content.getContentFull() | wordpress | raw }}
  452. </div>
  455. <script>
  456.     (function ($) {
  457.         $(function () {
  459.             $("input[name$='signType']").prop('checked', false);
  460.             
  461.              $("input[name$='signType']").change(function() {
  462.                 var signType = $(this).val();
  463.                 if(signType == "signIn") {
  464.                     
  465.                     $("#signInSection > input").each(function() {
  466.                         $(this).prop('required',true);
  467.                     });
  468.                     $("#signUpSection > input").each(function() {
  469.                         $(this).prop('required',false);
  470.                     });
  472.                     $("#signInSection").show();
  473.                     $("#signUpSection").hide();
  475.                 } else if(signType == "signUp") {
  477.                     $("#signInSection > input").each(function() {
  478.                         $(this).prop('required',false);
  479.                     });
  480.                     $("#signUpSection > input").each(function() {
  481.                         if($(this).attr('name') != 'lead[address2]' && $(this).attr('name') != 'lead[phone]') {
  482.                             $(this).prop('required',true);
  483.                         }
  484.                     });
  486.                     $("#signInSection").hide();
  487.                     $("#signUpSection").show();
  488.                 }
  489.             });
  491.         });
  492.     }(jQuery));
  493. </script>
  496. {% endblock %}
  497. {% block sidebar %}
  498.     {% include "includes/sidebar.html.twig" %}
  499. {% endblock %}
  501. {% endembed %}
  503. {% endblock %}