check

2020-01-15 23:42:58 -06:00
parent 567e991278
commit 252ec865b3
33 changed files with 1556 additions and 238 deletions
--- a/public/home/event/event.css
+++ b/public/home/event/event.css
@@ -1,31 +1,61 @@
 section.item{
- background-size:cover;
- height:80vh;
- background-attachment: fixed;
- margin: auto;
- background-image:url("img/grulla_10.jpg");
- background-position:center;
+  background-size:cover;
+  height:80vh;
+  background-attachment: fixed;
+  margin: auto;
+  background-image:url("img/grulla_10.jpg");
+  background-position:center;
 }
 section.place{
- background: #C22A39;
- padding:40px;
+  background: #C22A39;
+  padding:40px;
 }
 p.place{
  font-size: 1.5em;
  color: white;
  text-align: center;
 }
+
 p.cname{
- font-size: 1.7em;
- color: white;
- text-align: center;
- margin: 7px;
+  font-size: 1.7em;
+  color: white;
+  text-align: center;
+  margin: 7px;
 }
+a.bt3{
+display:block;
+padding:0.7em 1.7em;
+margin: 4em 20vw 2px;
+border-radius:0.2em;
+font-family:'Roboto',sans-serif;
+color:#FFFFFF;
+background-color:#333333;
+box-shadow:inset 0 -0.6em 1em -0.35em rgba(0,0,0,0.17),inset 0 0.6em 2em -0.3em rgba(255,255,255,0.15),inset 0 0 0em 0.05em rgba(255,255,255,0.12);
+text-align:center;
+}
+a.bt3:active{
+box-shadow:inset 0 0.6em 2em -0.3em rgba(0,0,0,0.15),inset 0 0 0em 0.05em rgba(255,255,255,0.12);
+}
+@media all and (max-width:30em){
+a.bt3{
+display:block;
+margin:0.4em auto;
+}}
+span.bt3{
+font-size:3em;
+ font-family:'Comic Sans MS';
+ border-right:1px solid rgba(255,255,255,0.5);
+ padding-right:0.3em;
+ margin-right:0.3em;
+ vertical-align:middle;
+}
+/*===========================*/
 section.description{
- background-color:white;
- justify-content: center;
- -webkit-justify-content: center;
+  background-color:white;
+  justify-content: center;
+  -webkit-justify-content: center;
 }
+
 article.info{
  flex:1 1 250px;
  max-width:370px;
@@ -33,55 +63,58 @@ article.info{
  min-width:250px;
  padding-left:20px;
 }
+
 p.pbig{ 
  font-weight:bold;
  font-size:1.8em;
-  }
+}
+
 p.pmed{
  font-size:1.1em;
-  }
+}

 article.specs{
- flex:2 2 250px;
- margin:auto;
- max-width:420px;
+  flex:2 2 250px;
+  margin:auto;
+  max-width:420px;
 }
+
 p#subt{
-margin: 10px;
-color: black;
-font-size: 1.2em;
+  margin: 10px;
+  color: black;
+  font-size: 1.2em;
 }

 article.specs >p{
-margin-bottom: 30px;
-color: black;
-font-size: .875rem;
-font-weight: 400;
-line-height: 1.5;
-min-width:250px;
+  margin-bottom: 30px;
+  color: black;
+  font-size: .875rem;
+  font-weight: 400;
+  line-height: 1.5;
+  min-width:250px;
 }

 p.promo{
-margin: 10px;
-color: #c22a39;
-font-size: 1.2em;
+  margin: 10px;
+  color: #c22a39;
+  font-size: 1.2em;
 }

 section.map{
-background-color:#333333;
-overflow:hidden;
- height:80vh;
- min-height:400px;
- position:relative;
+  background-color:#333333;
+  overflow:hidden;
+  height:80vh;
+  min-height:400px;
+  position:relative;
 }

 section.map > iframe{
- width:70%;
- height:70%;
- top:15%;
- left:15%;
- overflow: hidden;
- position:absolute;
+  width:70%;
+  height:70%;
+  top:15%;
+  left:15%;
+  overflow: hidden;
+  position:absolute;
 }
 p.arrive{
  position:absolute;
@@ -89,6 +122,6 @@ p.arrive{
  top:1%;
  font-size:1.5em;
  color:white;
-  }
+}
 article.contact{
-  }
+}
--- a/public/home/spay/grulla_10.jpg
+++ b/public/home/spay/grulla_10.jpg
--- a/public/home/spay/storep.css
+++ b/public/home/spay/storep.css
@@ -0,0 +1,201 @@
+
+section.item{
+  background-color:rgba(255,255,255);
+  max-width: 1000px;
+  margin: auto;
+}
+
+article.iimage{
+  flex:5 1;
+  margin:auto;
+  display:inline;
+  padding:0px 5px;
+
+}
+img.small{
+  border-radius:20px;
+  display:block;
+  width:auto;
+  height:100%;
+  margin:auto;
+  padding:15px;
+}
+article.iinfo{
+  background-color:white;
+  flex:4 1;
+  margin:0px 10px;
+}
+p.txt{
+  font-size:1.2em;
+}
+
+section.ibottom{
+  background: #C22A39;
+  padding-bottom:1px;
+  padding-bottom:1px;
+
+}
+
+section.description{
+  background-color:white;
+  justify-content: center;
+  -webkit-justify-content: center;
+}
+
+p.promo{
+  color: #c22a39;
+  font-size: 1.4em;
+  text-align:right;
+  margin-right:10%;
+  font-weight:bold;
+}
+
+
+p.elow{
+  color: black;
+  font-size: 1.4em;
+  text-align:right;
+  margin-right:10%;
+}
+
+p.eldep{
+  color: #c22a39;
+  font-size: 1.4em;
+  text-align:right;
+  text-transform: uppercase;
+  margin-right:10%;
+  font-weight:bold;
+}
+
+div.ppl{
+  background-color: rgba(0,0,0,0.8);
+  border-radius: 25px;
+  padding:20px;
+  text-align: center;
+}
+p.nombre{
+  font-size: 2.2em;
+  color: white;
+  text-align: left;
+  margin: auto;
+  max-width:850px;
+  font-weight:bold;
+}
+
+p.tit{
+  font-size: 1.8em;
+  color: white;
+  text-align: center;
+  margin: 30px auto;
+  font-style: italic;
+}
+
+p.total{
+  font-weight: bold;
+  font-size: 1.2em;
+  text-align: end;
+}
+
+div#cover{
+  background: black;
+  z-index: 100;
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  transition:opacity .4s linear;
+  top:0px;
+  opacity:0;
+}
+ /* * form css based on */
+ /* * https://www.sanwebe.com/2014/08/css-html-forms-designs*/
+ /* * thaks for make my life a bit easier*/
+ /* ***************************************************************/
+
+.form-style-1 {
+  margin:10px auto;
+  max-width: 400px;
+  padding: 20px 12px 10px 20px;
+  font: 13px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
+}
+.form-style-1 li {
+  padding: 0;
+  display: block;
+  list-style: none;
+  margin: 10px 0 0 0;
+}
+.form-style-1 label{
+  margin:0 0 3px 0;
+  padding:0px;
+  display:block;
+  font-weight: bold;
+}
+.form-style-1 input[type=text], 
+.form-style-1 input[type=date],
+.form-style-1 input[type=datetime],
+.form-style-1 input[type=number],
+.form-style-1 input[type=search],
+.form-style-1 input[type=time],
+.form-style-1 input[type=url],
+.form-style-1 input[type=email],
+textarea, 
+select{
+  box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  border:1px solid #BEBEBE;
+  padding: 7px;
+  margin:0px;
+  -webkit-transition: all 0.30s ease-in-out;
+  -moz-transition: all 0.30s ease-in-out;
+  -ms-transition: all 0.30s ease-in-out;
+  -o-transition: all 0.30s ease-in-out;
+  outline: none;	
+}
+.form-style-1 input[type=text]:focus, 
+.form-style-1 input[type=date]:focus,
+.form-style-1 input[type=datetime]:focus,
+.form-style-1 input[type=number]:focus,
+.form-style-1 input[type=search]:focus,
+.form-style-1 input[type=time]:focus,
+.form-style-1 input[type=url]:focus,
+.form-style-1 input[type=email]:focus,
+.form-style-1 textarea:focus, 
+.form-style-1 select:focus{
+  -moz-box-shadow: 0 0 8px #88D5E9;
+  -webkit-box-shadow: 0 0 8px #88D5E9;
+  box-shadow: 0 0 8px #88D5E9;
+  border: 1px solid #88D5E9;
+}
+.form-style-1 .field-divided{
+  width: 49%;
+}
+.form-style-1 .field-mini{
+  width: 5em;
+}
+.form-style-1 .field-long{
+  width: 100%;
+}
+.form-style-1 .field-select{
+  width: 100%;
+}
+.form-style-1 .field-textarea{
+  height: 100px;
+}
+
+.fbutton,
+.form-style-1 input[type=submit], .form-style-1 input[type=button]{
+  background: #4B99AD;
+  padding: 8px 15px 8px 15px;
+  border: none;
+  color: #fff;
+}
+.form-style-1 input[type=submit]:hover, .form-style-1 input[type=button]:hover{
+  background: #4691A4;
+  box-shadow:none;
+  -moz-box-shadow:none;
+  -webkit-box-shadow:none;
+}
+.form-style-1 .required{
+  color:red;
+}
+
--- a/public/home/spay/stripe.js
+++ b/public/home/spay/stripe.js
@@ -0,0 +1,209 @@
+/* some format to numbers */
+var it=1;
+var students = new Array(10);
+
+window.addEventListener('load', function() {
+  document.getElementById('cu').innerHTML=cu.toLocaleString();
+  document.getElementById('gt').innerHTML=cu.toLocaleString();
+});
+
+var mq = document.forms["cform"]["mq"];
+mq.addEventListener('change',function() {
+  var mult = cu*mq.value;
+  document.getElementById('gt').innerHTML=mult.toLocaleString();
+});
+
+/* hide contact form, show card info fields */ 
+var cinfob = document.getElementById('cinfob');
+var cinfo = document.getElementById('cinfo');
+var cform = document.getElementById('cform');
+var ccard = document.getElementById('ccard');
+cinfob.addEventListener('click', function(ev){ 
+  it --;
+  atof();
+  if (it==1){cinfob.hidden=true;}
+  
+});
+
+cinfo.addEventListener('click', function(ev){ 
+  if ( 
+    (document.forms["cform"]["mname"].value =="") || 
+    (document.forms["cform"]["mmail"].value =="")
+  ){console.log("form incomplete");}
+  else if ( mq.value > it) {
+    students[it - 1]=ftoa();
+    it ++;
+    if(typeof students[it - 1]!== "undefined"){
+      atof();
+    }
+    cinfob.hidden=false;
+  }
+  else {
+    students[it - 1]=ftoa();
+    cform.hidden = true;
+    ccard.hidden = false;
+  }
+});
+
+function ftoa(){
+  var rad;
+  if (document.getElementById('r2').checked) { rad = document.getElementById('r2').value; }
+  else if(document.getElementById('r1').checked) { rad = document.getElementById('r1').value; }
+  else { rad = document.getElementById('r3').value; }
+
+  var x= [
+   document.forms["cform"]["mname"].value,
+   document.forms["cform"]["mmail"].value,
+   document.getElementById('obs').value,
+   rad
+  ]
+  var tmp=mq.value;
+   document.getElementById("cform").reset();
+   mq.value=tmp;
+
+  return x;
+}
+
+function atof(){
+   document.forms["cform"]["mname"].value = students[it-1][0];
+   document.forms["cform"]["mmail"].value = students[it-1][1];
+   document.getElementById('obs').value = students[it-1][2];
+   if(document.getElementById('r2').value == students[it-1][3]){ document.getElementById('r2').checked=true;} 
+   if(document.getElementById('r1').value == students[it-1][3]){ document.getElementById('r1').checked=true;} 
+   if(document.getElementById('r3').value == students[it-1][3]){ document.getElementById('r3').checked=true;} 
+}
+
+/* stripe magic begins here */
+var stripe = Stripe('pk_test_wxFt0GhsUK2YsprkLXa2iFrQ00nfjAeucu');
+var elements = stripe.elements();
+var cardElement = elements.create('card', {
+  style: {
+    base: {
+      //iconColor: '#c4f0ff',
+      iconColor: '#64a0af',
+      color: '#000000',
+      fontWeight: 500,
+      fontFamily: 'Roboto, Open Sans, Segoe UI, sans-serif',
+      fontSize: '18px',
+      fontSmoothing: 'antialiased',
+      ':-webkit-autofill': {
+        color: '#fce883',
+      },
+      '::placeholder': {
+  //      color: '#87BBFD',
+        color: '#87BBFD',
+      },
+    },
+    invalid: {
+      iconColor: '#8f577e',
+      color: '#8F577E',
+    },
+  },
+});
+
+cardElement.mount('#card-element');
+
+var cardholderName = document.getElementById('cardholder-name');
+var cardButton = document.getElementById('card-button');
+
+///*y este el codigo de validación de la tarjeta*/
+cardButton.addEventListener('click', function(ev) {
+  document.getElementById('cover').hidden = false;
+  document.getElementById("cover").style.opacity = "0.8";
+  stripe.createPaymentMethod('card', cardElement, {
+    billing_details: {name: cardholderName.value}
+  })
+  .then(function(result) {
+    // Show error in payment form 
+    if (result.error) {
+      document.getElementById("cover").style.opacity = "0";
+      setTimeout(function(){ document.getElementById('cover').hidden = true;},500);
+      console.log("network error");
+    }
+    // Otherwise send paymentMethod.id to your server (see Step 2)
+    else { 
+      fetch('/spay/intentCreate', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ payment_method_id: result.paymentMethod.id, req:"precheck", qantity:mq.value, tid:tid})
+      })
+      .then(function(result) {
+        // Handle server response (see Step 3)
+        result.json().then(function(json) { handleInstallmentPlans(json); })
+      });
+    }
+  });
+});
+
+///*presenta los planes de pago */
+const selectPlanForm = document.getElementById('installment-plan-form');
+let availablePlans = [];
+
+const handleInstallmentPlans = async (response) => {
+  if (response.error) { // Show error from server on payment form
+    console.log("preauth response error");
+  } 
+  else {
+    // Store the payment intent ID.
+    document.getElementById('payment-intent-id').value = response.intent_id;
+    availablePlans = response.available_plans;
+    // Show available installment options
+    availablePlans.forEach((plan, idx) => {
+      const newInput = document.getElementById('immediate-plan').cloneNode();
+      newInput.setAttribute('value', idx);
+      newInput.setAttribute('id', '');
+      const label = document.createElement('label');
+      label.appendChild(newInput);
+      label.appendChild(
+        document.createTextNode(`${plan.count} meses`),
+      );
+      selectPlanForm.appendChild(label);
+    });
+    document.getElementById('ccard').hidden = true;
+    document.getElementById('cplan').hidden = false;
+  }
+  document.getElementById("cover").style.opacity = "0";
+  setTimeout(function(){ document.getElementById('cover').hidden = true;},500);
+};
+
+// termina la transacción
+const confirmButton = document.getElementById('confirm-button');
+confirmButton.addEventListener('click', async (ev) => {
+  document.getElementById('cover').hidden = false;
+  document.getElementById("cover").style.opacity = "0.8";
+  const selectedPlanIdx = selectPlanForm.installment_plan.value;
+  const selectedPlan = availablePlans[selectedPlanIdx];
+  const intentId = document.getElementById('payment-intent-id').value;
+  const response = await fetch('/spay/intentConfirm', {
+    method: 'POST',
+    headers: {'Content-Type': 'application/json'},
+    body: JSON.stringify({
+      payment_intent_id: intentId,
+      selected_plan: selectedPlan,
+      req:"check",
+      students:students,
+      mq:mq.value,
+      tid:tid
+    }),
+  });
+  const responseJson = await response.json();
+  // Show success / error response.
+  document.getElementById("cover").style.opacity = "0";
+  setTimeout(function(){ document.getElementById('cover').hidden = true;},500);
+  document.getElementById('cmsg').hidden = false;
+  document.getElementById('cplan').hidden = true;
+  var message;
+  if (responseJson.status === "succeeded" && selectedPlan !== undefined) {
+    message = `¡Tu compra a ${
+      selectedPlan.count
+    } meses sin intereses se ha realizado con éxito! `;
+  } else if (responseJson.status === "succeeded") {
+    message = "¡Tu compra se ha realizado con éxito!";
+  } else {
+    message = `Tenemos un problema para verificar tus datos. 
+      Por favor intenta de nuevo o comunícate con nosotros`;
+  }
+
+  document.getElementById("status-message").innerText = message;
+});
+
--- a/public/home/store/img/China.jpg
+++ b/public/home/store/img/China.jpg
--- a/public/home/store/img/libro.jpg
+++ b/public/home/store/img/libro.jpg