From 32e813edc749a11701ae65566e654093e3b0b0db Mon Sep 17 00:00:00 2001
From: candice <candice@hainatravel.com>
Date: Wed, 28 Jun 2023 09:58:33 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BA=95=E9=83=A8=E6=A8=A1=E6=9D=BF=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0newsletter=E8=A1=A8=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 application/views/mobile_first/gh-pc.php | 64 ++++++++++++++++++++++++
 application/views/mobile_first/gh.php    | 64 ++++++++++++++++++++++++
 2 files changed, 128 insertions(+)

diff --git a/application/views/mobile_first/gh-pc.php b/application/views/mobile_first/gh-pc.php
index f7cabd7b..410dbc64 100644
--- a/application/views/mobile_first/gh-pc.php
+++ b/application/views/mobile_first/gh-pc.php
@@ -280,6 +280,25 @@
         We are here to help you...<br> start planning your tailor-made trip with 1-1 help from our travel advisors.
         <div class="tourbutton"><a href="/forms/tailormade">Create Your Trip </a></div>
     </div>
+    <div class="footerbox newsletter_form">
+        <div class="list_content">
+          <h2 style="padding-top: 0; text-align: center;">Sign up to Our Newsletter</h2>
+          <p style="text-align: center;">Be the first to receive exciting updates, exclusive promotions, and valuable travel tips from our
+              team of experts. </p>
+          <form action="https://www.globalhighlights.com/forms/newsletter_save" method="post" id="newsletter_form" name="newsletter_form" novalidate="">
+            <label id="name_area">
+              <input type="text" name="name" id="realname" class="contact_name" placeholder="* Your name">
+              <div style="color: #a31022;display: none" class="requiredArea" id="realname_errmsg">Please fill up your name.</div>
+            </label>
+            <label id="email_area">
+              <input type="email" class="safyemail autoemail ui-autocomplete-input contact_email" name="email" id="email" autocomplete="off" placeholder="* Email">
+              <div style="color: #a31022;display: none" class="requiredArea" id="email_errmsg">Please fill up your email address.</div>
+              <div style="color: #a31022;display: none" class="requiredArea" id="email_verify_errmsg">Please verify your email.</div>
+            </label>
+            <button id="submit_newsletter" type="button" class="sendInquiry">Inspire Me</button>
+          </form>
+        </div>
+      </div>
     <div id="footer">
         <div class="footerContent">
             <h2>The Global Highlights Experience</h2>
@@ -459,6 +478,51 @@
             }, 10000);
         }
     </script>
+    <script>
+
+        document.addEventListener('DOMContentLoaded', () => {
+          var submitbutton = document.getElementById("submit_newsletter");
+          var newsletterForm = document.getElementById("newsletter_form");
+        
+          submitbutton.addEventListener('click', function(event) {
+            var validateResult = validateNewsletterForm();
+            if (validateResult) {
+              newsletterForm.submit();
+            }
+          });
+        });
+        
+        function validateNewsletterForm() {
+          var result = true;
+          var realnameVal = document.getElementById("realname").value;
+          var emailVal = document.getElementById("email").value;
+        
+          var realnameErrEl = document.getElementById("realname_errmsg");
+          var emailErrEl = document.getElementById("email_errmsg");
+          var emailVerifyErrEl = document.getElementById("email_verify_errmsg");
+        
+          realnameErrEl.style.display = 'none';
+          emailErrEl.style.display = 'none';
+          emailVerifyErrEl.style.display = 'none';
+        
+          if (realnameVal === '') {
+            realnameErrEl.style.display = '';
+            result = false;
+          }
+          if (emailVal === '') {
+            emailErrEl.style.display = '';
+            result = false;
+          } else {
+            var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;
+            if (!emailPattern.test(emailVal)) {
+              emailVerifyErrEl.style.display = '';
+              result = false;
+            }
+          }
+          return result;
+        }
+        </script>
+        
     <!--PC底部 结束-->
 
     <!--@PRODUCT-JS@-->
diff --git a/application/views/mobile_first/gh.php b/application/views/mobile_first/gh.php
index 5d635e1c..87a8a4fa 100644
--- a/application/views/mobile_first/gh.php
+++ b/application/views/mobile_first/gh.php
@@ -225,6 +225,25 @@ aria-label="festival">
  We are here to help you...<br> start planning your tailor-made tour with 1-1 help from our travel advisors.
     <div class="tourbutton"><a href="/forms/tailormade" >Create Your Trip </a></div>
 </div>
+<div class="footerbox newsletter_form">
+  <div class="list_content">
+    <h2 style="padding-top: 0; text-align: center;">Sign up to Our Newsletter</h2>
+    <p style="text-align: center;">Be the first to receive exciting updates, exclusive promotions, and valuable travel tips from our
+        team of experts. </p>
+    <form action="https://www.globalhighlights.com/forms/newsletter_save" method="post" id="newsletter_form" name="newsletter_form" novalidate="">
+      <label id="name_area">
+        <input type="text" name="name" id="realname" class="contact_name" placeholder="* Your name">
+        <div style="color: #a31022;display: none" class="requiredArea" id="realname_errmsg">Please fill up your name.</div>
+      </label>
+      <label id="email_area">
+        <input type="email" class="safyemail autoemail ui-autocomplete-input contact_email" name="email" id="email" autocomplete="off" placeholder="* Email">
+        <div style="color: #a31022;display: none" class="requiredArea" id="email_errmsg">Please fill up your email address.</div>
+        <div style="color: #a31022;display: none" class="requiredArea" id="email_verify_errmsg">Please verify your email.</div>
+      </label>
+      <button id="submit_newsletter" type="button" class="sendInquiry">Inspire Me</button>
+    </form>
+  </div>
+</div>
 <footer>
 
     <div id="footer">
@@ -350,6 +369,51 @@ aria-label="festival">
         }, 10000);
     }
 </script>
+<script>
+
+document.addEventListener('DOMContentLoaded', () => {
+  var submitbutton = document.getElementById("submit_newsletter");
+  var newsletterForm = document.getElementById("newsletter_form");
+
+  submitbutton.addEventListener('click', function(event) {
+    var validateResult = validateNewsletterForm();
+    if (validateResult) {
+      newsletterForm.submit();
+    }
+  });
+});
+
+function validateNewsletterForm() {
+  var result = true;
+  var realnameVal = document.getElementById("realname").value;
+  var emailVal = document.getElementById("email").value;
+
+  var realnameErrEl = document.getElementById("realname_errmsg");
+  var emailErrEl = document.getElementById("email_errmsg");
+  var emailVerifyErrEl = document.getElementById("email_verify_errmsg");
+
+  realnameErrEl.style.display = 'none';
+  emailErrEl.style.display = 'none';
+  emailVerifyErrEl.style.display = 'none';
+
+  if (realnameVal === '') {
+    realnameErrEl.style.display = '';
+    result = false;
+  }
+  if (emailVal === '') {
+    emailErrEl.style.display = '';
+    result = false;
+  } else {
+    var emailPattern = /^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;
+    if (!emailPattern.test(emailVal)) {
+      emailVerifyErrEl.style.display = '';
+      result = false;
+    }
+  }
+  return result;
+}
+</script>
+
 <!--移动底部 结束-->
 <script>/* memu js https://data.chinahighlights.com/js/mobile-menu.js */
     (function(window){function classReg(className){return new RegExp("(^|\\s+)"+className+"(\\s+|$)")}var hasClass,addClass,removeClass;if("classList" in document.documentElement){hasClass=function(elem,c){return elem.classList.contains(c)};addClass=function(elem,c){elem.classList.add(c)};removeClass=function(elem,c){elem.classList.remove(c)}}else{hasClass=function(elem,c){return classReg(c).test(elem.className)};addClass=function(elem,c){if(!hasClass(elem,c)){elem.className=elem.className+" "+c}};removeClass=function(elem,c){elem.className=elem.className.replace(classReg(c)," ")}}function toggleClass(elem,c){var fn=hasClass(elem,c)?removeClass:addClass;fn(elem,c)}var classie={hasClass:hasClass,addClass:addClass,removeClass:removeClass,toggleClass:toggleClass,has:hasClass,add:addClass,remove:removeClass,toggle:toggleClass};if(typeof define==="function"&&define.amd){define(classie)}else{if(typeof exports==="object"){module.exports=classie}else{window.classie=classie}}})(window);