Hipermegared

.eslintrc

@@ -0,0 +1,29 @@
+{
+  "parserOptions": {
+    "ecmaVersion": 6
+  },
+  "rules": {
+    "keyword-spacing": 1,
+    "space-before-function-paren": [1, "never"],
+    "eqeqeq": 1,
+    "space-infix-ops": 1,
+    "comma-spacing": 1,
+    "brace-style": 1,
+    "no-multiple-empty-lines": 1,
+    "camelcase": 1,
+    "func-call-spacing": 1,
+    "key-spacing": 1,
+    "semi": 1,
+    "no-floating-decimal": 1,
+    "no-multi-spaces": 1,
+    "object-property-newline": 1,
+    "padded-blocks": [1, "never"],
+    "space-before-blocks": 1,
+    "space-in-parens": 1,
+    "spaced-comment": 1,
+    "quotes": [1, "single"],
+    "id-length": [1, { "exceptions": ["i", "j", "x"] }],
+    "indent": [1, 2],
+    "no-array-constructor": 1
+  }
+}

README.md

@@ -1,56 +1,80 @@
 # Valida datos de tarjetas de crédito
 
-* **Track:** _Common Core_
-* **Curso:** _JS Deep Dive: Crea tu propia librería usando JavaScript_
-* **Unidad:** _Producto final_
+El validador de tarjetas se encargara de confirmar que los datos entregados
+de las tarjetas sean correctos, para validar la tarjeta se solicitaran los siguientes datos.
 
-***
++ Número de tarjeta, verifica por algoritmo de Luhn y que el correspondan a 16 catacteres numericos.
 
-El plugin debe recibir una referencia a un elemento del DOM que contenga
-`<input>`s con los siguientes nombres (atributo `name`):
++ Fecha de Vencimiento, verifica que la fecha tenga el formato correcto y que no esté expirada.
 
-* `cn` (Card Number): El número de la tarjeta de crédito
-* `exp` (Expiry Date): Fecha de expiración
-* `cvv` (Card Verification Value): Código de validación de 3 dígitos
-* `name`: Nombre completo como aparece en la tarjeta
++ Número CVV, verifica que se ingresen datos númericos de 3 caracteres.
 
-## Ejemplo
++ Nombre Completo, verifica que solo se ingresen caracteres alfabeticos
 
-```html
+### Dependencias
+
+[![npm](https://img.shields.io/npm/v/npm.svg)]()
+[![npm](https://img.shields.io/badge/Javascript-ES6-brightgreen.svg)]()
+[![npm](https://img.shields.io/badge/mocha--jsdom-1.1-brightgreen.svg)]()
+[![npm](https://img.shields.io/badge/mocha-5.5.1-brightgreen.svg)]()
+[![npm](https://img.shields.io/badge/chai-4.1.2-brightgreen.svg)]()
+[![npm](https://img.shields.io/badge/browserify-15.2.0-brightgreen.svg)]()
+[![npm](https://img.shields.io/badge/jsdom-11.6.1-brightgreen.svg)]()
+
+### Modo de Uso
+
++ CDN
+
+
+https://cdn.rawgit.com/IreeRodriguez/card-validator/hipermegared/lib/main.min.js
+
++ NPM
+
+npm install cardvalidatoriv
+
++ Descarga
+
+Decargar archivo main.js de este github 
+
+
+
+Para usar esta libreria hay que ingresar el siguiente script, el objeto se deben incluir las Id que se han usado en el formulario
+
+
+``` js 
+<script type="text/javascript">
+  const config = {
+    cardNumber: cardNumberId,
+    expDate: expDateId,
+    CVV: cvvId,
+    cardName: nameId,
+    subButton: buttonId
+  };
+</script>
+```
+
++ Ejemplo de HTML 
+
+``` html
 <form>
   <div class="form-group">
     <label for="cn">Número de tarjeta</label>
-    <input id="cn" name="cn" />
+    <input id="cardNumberId" name="cn" />
   </div>
   <div class="form-group">
     <label for="exp">Fecha de vencimiento</label>
-    <input id="exp" name="exp" />
-  </div>
-  <div class="form-group">
+    <input id="expDateId" name="exp" />
+   </div>
+   <div class="form-group">
     <label for="cvv">CVV</label>
-    <input id="cvv" name="cvv" />
-  </div>
-  <div class="form-group">
+    <input id="cvvId" name="cvv" />
+   </div>
+   <div class="form-group">
     <label for="name">Nombre completo</label>
-    <input id="name" name="name" />
+    <input id="nameId" name="name" />
   </div>
-  <input type="submit" value="Pagar" />
+  <input id="buttonId" type="submit" value="Pagar" />
 </form>
 ```
 
-```js
-const form = document.querySelector('form');
-
-form.addEventListener('submit', (e) => {
-  e.preventDefault();
-  if (validateCardDetails(form)) {
-    console.log('datos válido... enviar...');
-  } else {
-    console.log('datos inválidos');
-  }
-});
-```
 
-A la hora de hacer las validaciones, la librería debería de añadir la clase
-`.error` a los `<input>`s que no pasen la validación, o la clase `.success`
-en caso de que sí pase.

index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Example</title>
+  </head>
+  <body>
+    <form>
+      <div class="form-group">
+        <label for="cn">Número de tarjeta</label>
+        <input id="minumero" name="cn" />
+      </div>
+      <div class="form-group">
+        <label for="exp">Fecha de vencimiento</label>
+        <input id="exp" name="exp" />
+      </div>
+      <div class="form-group">
+        <label for="cvv">CVV</label>
+        <input id="cvv" name="cvv" />
+      </div>
+      <div class="form-group">
+        <label for="name">Nombre completo</label>
+        <input id="cname" name="name" />
+      </div>
+      <input id="button" type="submit" value="Pagar" />
+    </form>
+
+    <script type="text/javascript">
+
+      const config = {
+        cardNumber: minumero,
+        expDate: exp,
+        CVV: cvv,
+        cardName: cname,
+        subButton: button
+      };
+
+    </script>
+
+    <script type="text/javascript" src="https://cdn.rawgit.com/IreeRodriguez/card-validator/hipermegared/lib/main.min.js"></script>
+
+  </body>
+</html>

index.js

@@ -0,0 +1,12 @@
+const validateInput = require('./src/validateInput');
+const validate = require('./src/validate');
+
+// const config = {
+//   cardNumber: document.getElementById('minumero'),
+//   expDate: document.getElementById('exp'),
+//   CVV: document.getElementById('cvv'),
+//   cardName: document.getElementById('cname'),
+//   subButton: document.getElementById('button')
+// };
+//
+// module.exports = config;

lib/main.js

@@ -0,0 +1,121 @@
+(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+const validateInput = require('./src/validateInput');
+const validate = require('./src/validate');
+
+// const config = {
+//   cardNumber: document.getElementById('minumero'),
+//   expDate: document.getElementById('exp'),
+//   CVV: document.getElementById('cvv'),
+//   cardName: document.getElementById('cname'),
+//   subButton: document.getElementById('button')
+// };
+//
+// module.exports = config;
+
+},{"./src/validate":2,"./src/validateInput":3}],2:[function(require,module,exports){
+const Validate = {};
+let letters = /\D/;
+let num = /[0-9]/g;
+
+Validate.cardNumber = function(cardNumber) {
+  let stringNumber = cardNumber;
+  if (cardNumber === null || cardNumber === undefined) {
+    return false;
+  }
+
+  if (typeof(stringNumber) === typeof (42)) {
+    stringNumber = String(stringNumber);
+  }
+  let sum = 0;
+  const LEN = stringNumber.length;
+  if (LEN === 0 || letters.test(stringNumber)) {
+    return false;
+  } else {
+    for (let i = 0; i < LEN; i++) {
+      let intVal = parseInt(stringNumber.substr(i, 1));
+      if (i % 2 === 0) {
+        intVal *= 2;
+        if (intVal > 9) {
+          intVal = 1 + (intVal % 10);
+        }
+      }
+      sum += intVal;
+    }
+    return (sum % 10) === 0;
+  }
+};
+
+Validate.CVV = function(cvv) {
+  let stringCVV = cvv;
+  if (typeof(cvv) === typeof (42)) {
+    stringCVV = String(cvv);
+  }
+  if (letters.test(stringCVV) || stringCVV.length !== 3) {
+    return false;
+  } else {
+    return true;
+  }
+};
+
+Validate.expDate = function(ExpDate) {
+  let date = /\d{2}\/\d{2}/;
+  let currentDate = new Date();
+  let currentMonth = currentDate.getMonth() + 1;
+  let currentYear = currentDate.getFullYear();
+  let finalDate = currentYear + '-' + currentMonth;
+
+  if (date.test(ExpDate)) {
+    let month = ExpDate.substring(0, 2);
+    let year = ExpDate.substring(3, 5);
+    let inputDate = 20 + year + '-' + month;
+    if (new Date(finalDate) <= new Date(inputDate)) {
+      return true;
+    } else {
+      return false;
+    }
+  } else {
+    return false;
+  }
+};
+
+Validate.cardName = function(cardName) {
+  if (typeof(cardName) === typeof (42)) {
+    return false;
+  }
+  if (cardName === null || cardName === undefined) {
+    return false;
+  }
+  if (num.test(cardName) || /^ *$/.test(cardName) || cardName.length === 0) {
+    return false;
+  } else {
+    return true;
+  }
+};
+
+module.exports = Validate;
+
+},{}],3:[function(require,module,exports){
+const Validate = require('./validate.js');
+// const config = require('../index.js');
+
+const subButton = config.subButton;
+subButton.addEventListener('click', validateInput);
+
+
+function validateInput() {
+  let cardNumber = Validate.cardNumber(config.cardNumber.value);
+  let cvv = Validate.CVV(config.CVV.value);
+  let exp = Validate.expDate(config.expDate.value);
+  let cardName = Validate.cardName(config.cardName.value);
+  if (cardNumber && cvv && exp && cardName) {
+    console.log('datos válido... enviar...');
+    return true;
+  } else {
+    console.log('datos inválidos');
+    return false;
+  }
+};
+
+// module.exports = validateInput;
+
+},{"./validate.js":2}]},{},[1]);