Merge branch 'develop'

classes/class-p4ct-ajax-handler.php

@@ -63,9 +63,11 @@ private function hooks() {
 	 */
 	public function support_launcher_ajax_handler() {
 
+		$gpea_options = get_option( 'gpea_options' );
+
 		$args = [
 			'action' => FILTER_SANITIZE_STRING,
-			'recipient_email' => FILTER_SANITIZE_EMAIL,
+			'recipient_email' => FILTER_SANITIZE_STRING,
 			'subject' => FILTER_SANITIZE_STRING,
 			'send_to' => FILTER_SANITIZE_URL,
 			'name' => FILTER_SANITIZE_STRING,
@@ -84,7 +86,15 @@ public function support_launcher_ajax_handler() {
 		// We assume $data['recipient_email'], $data['subject'] to have correct values.
 		if ( $data['name'] && $data['email'] && $data['message'] ) {
 
-			$to = $data['recipient_email'];
+			// switch option for receipient email
+
+			if ( 'special' == $data['recipient_email'] ) {
+				$data['recipient_email'] = $gpea_options['gpea_support_recipient_email_special'];
+			} else {
+				$data['recipient_email'] = $gpea_options['gpea_support_recipient_email_general'];
+			}
+
+			$to      = $data['recipient_email'];
 			$subject = $data['subject'];
 			$message = $data['message'];
 			$headers = [ "From: $data[name] <$data[email]>\n" ];

classes/class-p4ct-metabox-register.php

@@ -873,7 +873,23 @@ public function register_main_options_metabox() {
 				'id'      => 'gpea_facebook_app_id',
 				'type'    => 'text',
 			)
-		);		
+		);
+
+		$cmb_options->add_field(
+			array(
+				'name'    => esc_html__( 'Support email recipient: general', 'gpea_theme_backend' ),
+				'id'      => 'gpea_support_recipient_email_general',
+				'type'    => 'text',
+			)
+		);
+
+		$cmb_options->add_field(
+			array(
+				'name'    => esc_html__( 'Support email recipient: special donations', 'gpea_theme_backend' ),
+				'id'      => 'gpea_support_recipient_email_special',
+				'type'    => 'text',
+			)
+		);
 
 	}
 

frontend/js/Donation/validation.js

@@ -4,6 +4,9 @@ const requiredMessage = window.NRO_PROPERTIES[NRO].validation.required;
 const invalidMessage = 'Please check the format of this field';
 const countryMessage = 'Should be one of "HK", "TW", "KR"';
 
+const ddc_recruiter_id = window.NRO_PROPERTIES[NRO].regex.ddc_recruiter_id;
+const ddc_recruiter_id_Message = window.NRO_PROPERTIES[NRO].validation.format_ddc_recruiter_id;
+
 // const invalidePhone = window.NRO_PROPERTIES[NRO].validation.format_phone;
 
 const required = {
@@ -105,10 +108,14 @@ const dataConstraints = {
     validateTwNationalId: {},    
   },
   ['en__field--NOT_TAGGED_33']: {    
-    length: {maximum: 10},
+    // length: {maximum: 10},
+    // format: {
+    //   pattern: "(^[0-9]+$|^$)",
+    //   message: "can only contain a-z and 0-9"
+    // }
     format: {
-      pattern: "(^[0-9]+$|^$)",
-      message: "can only contain a-z and 0-9"
+      pattern: ddc_recruiter_id,
+      message: ddc_recruiter_id_Message
     }
   },
   // ['en__field--NOT_TAGGED_33']: {
@@ -173,7 +180,7 @@ const allConstraints = Object.assign(
 function prepareFormForValidation(form) {
   for (const name in allConstraints) {    
     if (allConstraints.hasOwnProperty(name)) {
-      console.log(name);
+      // console.log(name);
       // const options = allConstraints[name];
       let input = form.querySelector('.' + name + ' input');
       if (!input) input = form.querySelector('.' + name + ' select');

frontend/js/components/donation-tabs.js

@@ -12,7 +12,8 @@ export default function() {
     tab.addEventListener('click', e => {
       const tabBar = e.target.parentElement;
       const siblings = tabBar.children;
-      const form = tabBar.parentElement.querySelector('form');      
+      const form = tabBar.parentElement.querySelector('form');
+      const formDiv = document.querySelector('.donation-form');
       const handles = tabBar.parentElement.querySelectorAll('.dollar-handles');
       const tabRecurring = tabBar.parentElement.querySelector('.tab-item__recurring');
       const handlesOnce = tabBar.parentElement.querySelectorAll(
@@ -28,18 +29,21 @@ export default function() {
       /* reminder box */
       const reminderBox = document.querySelector('.donation-reminder-box');
       // if reminder box present, and we are inside dollar handles, and oneoff is clicked -> we prompt for user confirmation
-      if ( handles.length && reminderBox && e.target.classList.contains('tab-item__once') ) {
+      if ( reminderBox && e.target.classList.contains('tab-item__once') ) {
         reminderBox.style.display = 'flex';
+        if ( formDiv ) formDiv.classList.add('reminder-active');
         const buttonConfirmOneOff = document.querySelector('.js-donation-confirm-oneoff');
         const buttonConfirmRegular = document.querySelector('.js-donation-confirm-regular');
 
         buttonConfirmOneOff.addEventListener('click', eventClick => {
           reminderBox.style.display = 'none';
+          if ( formDiv ) formDiv.classList.remove('reminder-active');
           // if one off confirmed, just hide the alert
         });
 
         buttonConfirmRegular.addEventListener('click', eventClick => {
           reminderBox.style.display = 'none';
+          if ( formDiv ) formDiv.classList.remove('reminder-active');
           tabRecurring.click();
           // if regular confirmed, trigger click over it
         });
@@ -149,7 +153,8 @@ export default function() {
       //   frequencyValue + ':' + amountValue
       // );
 
-      donationUrl = donationUrl + '?donate_amt=' + frequencyValue + ':' + amountValue;
+      if ( (form.action).indexOf('?') > -1 ) donationUrl = donationUrl + '&donate_amt=' + frequencyValue + ':' + amountValue;
+      else donationUrl = donationUrl + '?donate_amt=' + frequencyValue + ':' + amountValue;
 
     } else {
       donationUrl.searchParams.append('transaction.donationAmt', amountValue);

frontend/js/petition-thankyou.js

@@ -8,39 +8,39 @@ function petitionThankyou(Scroll) {
   const screenShare = document.querySelector('.js-screen-share');
   const screenDonate = document.querySelector('.js-screen-donate');
 
-  // If I choose YES on "Will you share?"
-  document.querySelector('.js-yes-share').addEventListener('click', e => {
-    screenShare.classList.add('is-visible');
+  // If I choose YES on "Will you donate?"
+  document.querySelector('.js-yes-donate').addEventListener('click', e => {
+    screenDonate.classList.add('is-visible');
 
-    stepShare.classList.remove('is-disabled');
-    stepShare.classList.remove('is-crossed');
+    stepDonate.classList.remove('is-disabled');
+    stepDonate.classList.remove('is-crossed');
 
-    Scroll.animateScroll(screenShare);
+    Scroll.animateScroll(screenDonate);
   });
 
-  // If I choose NO on "Will you share?"
-  document.querySelector('.js-no-share').addEventListener('click', e => {
-    screenDonate.classList.add('is-visible');
+  // If I choose NO on "Will you donate?"
+  document.querySelector('.js-no-donate').addEventListener('click', e => {
+    screenShare.classList.add('is-visible');
 
-    stepShare.classList.remove('is-disabled');
     stepDonate.classList.remove('is-disabled');
-    if (!stepShare.classList.contains('is-checked')) {
-      stepShare.classList.add('is-crossed');
+    stepShare.classList.remove('is-disabled');
+    if (!stepDonate.classList.contains('is-checked')) {
+      stepDonate.classList.add('is-crossed');
     }
 
-    Scroll.animateScroll(screenDonate);
+    Scroll.animateScroll(screenShare);
   });
 
-  // If I choose SKIP on the sharing screen
-  document.querySelector('.js-skip-share').addEventListener('click', e => {
-    screenDonate.classList.add('is-visible');
+  // If I choose SKIP on the donate screen
+  document.querySelector('.js-skip-donate').addEventListener('click', e => {
+    screenShare.classList.add('is-visible');
 
-    stepDonate.classList.remove('is-disabled');
-    if (!stepShare.classList.contains('is-checked')) {
-      stepShare.classList.add('is-crossed');
+    stepShare.classList.remove('is-disabled');
+    if (!stepDonate.classList.contains('is-checked')) {
+      stepDonate.classList.add('is-crossed');
     }
 
-    Scroll.animateScroll(screenDonate);
+    Scroll.animateScroll(screenShare);
   });
 
   // If I click any share thing on the sharing screen

frontend/scss/_general.scss

@@ -217,6 +217,7 @@ body.is-loading .body-spinner {
 
 /* remove stuff from mater */
 svg.external-link,
-svg.external-icon {
+svg.external-icon, 
+svg.external_link {
   display: none;
 }

frontend/scss/_template-petition-thankyou.scss

@@ -25,6 +25,7 @@
     padding-top: 0;
     > section {
       padding-top: 0;
+      padding-bottom: 0;
     }
   }
 
@@ -158,3 +159,24 @@
 .page-template-petition-thankyou.health::after {
   background-color: $color-health;
 }
+
+/* adapt section-donate feature */
+
+.page-template-petition-thankyou {
+  .section-donate::before {
+    background: none;
+    display: none;
+  }
+  .section-donate:not(.upper-fade)::after {
+    display: none;
+  }
+  .section-donate .content {
+    max-width: none;
+    margin-bottom: 40px;
+  }
+
+  footer .footer-lower {
+    margin-top: 0;
+  }
+
+}

frontend/scss/_template-petition.scss

@@ -60,6 +60,10 @@
     }
     button.fb {
       width: 100%;
+      height: 40px;
+      @include lessThan('sm') {
+        width: 50%;
+      }      
     }
   }
 
@@ -256,3 +260,32 @@
   }
 
 }
+
+
+/* fix to petition form ui */
+
+.page-template-petition {
+  .enform-side-style .enform {
+    button.fb {
+      display: none;
+      @include greaterThan('sm') {
+        display: inline-block;
+      }
+    }
+    .en__field--emailAddress {
+      display: none;
+      @include greaterThan('sm') {
+        display: block;
+      }  
+    }
+
+    &.is-open {
+      button.fb {
+        display: inline-block;
+      }
+      .en__field--emailAddress {
+        display: block;
+      }
+    }  
+  }
+}

frontend/scss/cells/_cookies.scss

@@ -16,40 +16,40 @@
   position: fixed;
 
   // background: $color-arctic;
-  background: rgba(26, 28, 38, 0.95);
+  background: rgba(54, 55, 63, 0.95);
   color: #fff;
 
+
+
   a {
     color: #fff;
     text-decoration: underline;
   }
 
-  div.row.m-0 {
-    display: flex;
-  }
-
-  div.col-sm-9.col-md-10 {      
+  p {      
+    display: inline-flex;
     margin: 0 auto;
     max-width: 80%;
     flex: 80%;
     font-size: 14px;
     padding-top: 10px;
     padding-bottom: 10px;
+    padding-right: 30px;
     @include greaterThan('sm') {
       flex: 1;
       max-width: 90%;
       line-height: 30px;
     }
   }
 
-  div.col-sm-3.col-md-2 {
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-align: center;
-    align-items: center;
-    -ms-flex-line-pack: justify;
-    align-content: space-between;
-  }
+  // div.col-sm-3.col-md-2 {
+  //   display: -ms-flexbox;
+  //   display: flex;
+  //   -ms-flex-align: center;
+  //   align-items: center;
+  //   -ms-flex-line-pack: justify;
+  //   align-content: space-between;
+  // }
 
   .btn.btn-secondary.p-0 {
     background: $color-green;

frontend/scss/cells/_donation-form.scss

@@ -4,6 +4,14 @@
   background: white;
   position: relative;
 
+  &.reminder-active {
+    overflow: visible;
+    margin-bottom: 100px;
+    @include greaterThan('lg') {
+      margin: 0 -3px 10px;
+    }
+  }
+
   .tab-bar {
     height: 47px;
     background-color: #dddddd;
@@ -146,7 +154,8 @@
     display: none;
     align-items: center;
     justify-content: center;
-    overflow: hidden;
+    overflow: visible;
+    min-height: 300px;
     .donation-reminder-box--content {
       padding: 30px;
       h6 {