cifo-training · naranjito72 · Aug 4, 2019 · Aug 4, 2019 · Aug 4, 2019 · Aug 4, 2019
diff --git a/basicos.code-workspace b/basicos.code-workspace
@@ -0,0 +1,13 @@
+{
+	"folders": [
+		{
+			"path": "."
+		},
+		{
+			"path": "C:\\Users\\usuario\\Desktop\\Ejercicios\\xabier\\botones compra"
+		}
+	],
+	"settings": {
+		"workbench.colorCustomizations": {}
+	}
+}
diff --git a/exercici1/css/styles.css b/exercici1/css/styles.css
@@ -0,0 +1,9 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800&display=swap');
+body{
+    font-family: 'Raleway', Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 125%;
+
+}
+.container{
+    margin-top:9vh;
+}
diff --git a/exercici1/img/click.png b/exercici1/img/click.png
diff --git a/exercici1/index.html b/exercici1/index.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <link rel="stylesheet" href="./css/styles.css">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Basic jS1</title>
+</head>
+<body>
+    <div class="container">
+        <div class="row">
+            <div class="col-sm">
+
+            </div>
+            <div class="col-sm">
+            <div class="card" style="width: 18rem;">
+                <img src="./img/click.png" class="card-img-top" alt="TheClick36">
+                <div class="card-body">
+                  <h5 class="card-title">IndexOf()</h5>
+                  <p class="text">Click the <button class="btn btn-secondary" id="boton1" onclick="myFunction()"> Push me</button> to see the index of j in:</p>
+                  <p class="text">"My favorite dessert is Jelly"</p>
+                  <p class="card-text" id="pintar" ></p>
+                 <!--  <p class="row">
+                      <p class="col-sm col-md-4">
+                      <button class="btn btn-secondary" id="boton2">Delete</button>
+                      </p>
+                    </p> -->
+                  <a href="https://www.theclick36.com/" target= "_blank" class="btn btn-primary">Go somewhere</a>
+                </div>
+              </div>
+            </div>
+            <div class="col-sm">
+
+            </div>
+        </div>
+    </div>
+    <script src="./js/functions.js"></script>
+
+</body>
+</html>
diff --git a/exercici1/js/functions.js b/exercici1/js/functions.js
@@ -0,0 +1,15 @@
+
+let x = "My favorite dessert is Jello";
+let y = x.indexOf('J');
+console.log(y);
+/* document.getElementById('boton1').onClick = function(){
+    myFunction()
+}; */
+
+function myFunction() {
+
+
+     document.getElementById('pintar').innerHTML = y;
+  } 
+
+
diff --git a/exercici2/css/styles.css b/exercici2/css/styles.css
@@ -0,0 +1,9 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800&display=swap');
+body{
+    font-family: 'Raleway', Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 125%;
+
+}
+.container{
+    margin-top:9vh;
+}
diff --git a/exercici2/img/click.png b/exercici2/img/click.png
diff --git a/exercici2/index.html b/exercici2/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <link rel="stylesheet" href="./css/styles.css">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Basic jS2</title>
+</head>
+<body>
+    <div class="container">
+        <div class="row">
+            <div class="col-sm">
+
+            </div>
+            <div class="col-sm">
+            <div class="card" style="width: 18rem;">
+                <img src="./img/click.png" class="card-img-top" alt="TheClick36">
+                <div class="card-body">
+                  <h5 class="card-title">Prompt</h5>
+                  <p class="text">Click the <button class="btn btn-secondary" id="boton1" onclick="myFunction()"> Boton </button> to see the answer to the prompts!</p>
+                  <p class="card-text" id="pintar" ></p>
+                  <a href="https://www.theclick36.com/" target= "_blank" class="btn btn-primary">Go somewhere</a>
+                </div>
+              </div>
+            </div>
+            <div class="col-sm">
+
+            </div>
+        </div>
+    </div>
+    <script src="./js/functions.js"></script>
+
+</body>
+</html>
diff --git a/exercici2/js/functions.js b/exercici2/js/functions.js
@@ -0,0 +1,12 @@
+let nombre = prompt('¿ Cual es su nombre por favor?');
+let apellidos = prompt(' ¿y su primer apellido?');
+let juntos = (`${nombre} ${apellidos}`);
+ console.log(nombre + " " + apellidos);
+
+ function myFunction() {
+    juntos == (`${nombre = ' '}`)|| juntos == (`${nombre = ' '} ${apellidos = ' '}`)?
+        document.getElementById('pintar').innerHTML = "Hola desconocido!":
+
+        document.getElementById('pintar').innerHTML = (`Hola ${juntos}`);
+
+ } ;
diff --git a/exercici3/css/styles.css b/exercici3/css/styles.css
@@ -0,0 +1,9 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800&display=swap');
+body{
+    font-family: 'Raleway', Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 125%;
+
+}
+.container{
+    margin-top:9vh;
+}
diff --git a/exercici3/img/click.png b/exercici3/img/click.png
diff --git a/exercici3/index.html b/exercici3/index.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <link rel="stylesheet" href="./css/styles.css">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Basic jS3/Copia</title>
+</head>
+<body>
+    <div class="container">
+        <div class="row">
+            <div class="col-sm">
+
+            </div>
+            <div class="col-sm">
+            <div class="card" style="width: 18rem;">
+                <img src="./img/click.png" class="card-img-top" alt="TheClick36">
+                <div class="card-body">
+                  <h5 class="card-title">Match!</h5>
+                  <p class="text">Click the <button class="btn btn-secondary" id="boton1" onclick="myFunction()"> Boton </button> to see if the words match!.</p>
+                  <p class="card-text" id="pintar" ></p>
+                  <p class="card-text" id="pintar1" ></p>
+                  <p class="card-text" id="pintar2" ></p>
+                  <a href="https://www.w3schools.com/jsref/jsref_includes.asp" target= "_blank" class="btn btn-primary">Go somewhere</a>
+                </div>
+              </div>
+            </div>
+            <div class="col-sm">
+
+            </div>
+        </div>
+    </div>
+    <script src="./js/functions.js"></script>
+
+</body>
+</html>
diff --git a/exercici3/js/functions.js b/exercici3/js/functions.js
@@ -0,0 +1,36 @@
+
+
+/*  function azar(){
+// recorrido palabras pa generar el random
+for (i=0; i < palabrasLength; i++){
+    document.getElementById('pintar').innerHTML = azar();
+
+}
+
+}  */
+   function myFunction() {
+    let texto = prompt('Introduce una palabra de la A a la Z').toLowerCase();
+
+    document.getElementById('pintar1').innerHTML = (`La letra inscrita es la ${texto}`);
+
+   // Debo generar YO el random y no cogerlo del string escrito en prompt
+
+   //declaración de DONDE coge el string para generar el random
+
+   let palabras = "ABCÇDEFGHIJKLMNOPQRSTUVWXTZabcçdefghiklmnopqrstuvwxyz";
+   // cuantos elementos quiero random
+  // let palabrasLength = " ";
+   // donde coloco el valor de ese random
+
+   let azarPalabra = Math.floor(Math.random()* palabras.toLowerCase().length);
+
+   let randomPalabra = palabras.toLowerCase().substring(azarPalabra, azarPalabra+1);
+   document.getElementById('pintar2').innerHTML = (`La letra generada es la ${randomPalabra}`);
+   //comparamos los dos valores
+
+   let compara = texto.includes(randomPalabra);
+    document.getElementById('pintar').innerHTML = compara;
+
+}
+/* Finalmente he tenido que buscar el random en el prompt. pequeño descanso y quiero hacerlo con un random */
+
diff --git a/exercici4/css/styles.css b/exercici4/css/styles.css
@@ -0,0 +1,9 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800&display=swap');
+body{
+    font-family: 'Raleway', Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 125%;
+
+}
+.container{
+    margin-top:9vh;
+}
diff --git a/exercici4/img/click.png b/exercici4/img/click.png
diff --git a/exercici4/index.html b/exercici4/index.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <link rel="stylesheet" href="./css/styles.css">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Basic jS4</title>
+</head>
+<body>
+    <div class="container">
+        <div class="row">
+            <div class="col-sm">
+
+            </div>
+            <div class="col-sm">
+            <div class="card" style="width: 18rem;">
+                <img src="./img/click.png" class="card-img-top" alt="TheClick36">
+                <div class="card-body">
+                  <h5 class="card-title">Jubilación</h5>
+                  <p class="text">Click the <button class="btn btn-secondary" id="boton1" onclick="myFunction()"> Button</button> to see how long til...</p>
+                  <p class="text">You stop working!</p>
+                  <p class="card-text" id="pintar" ></p>
+                 <!--  <p class="row">
+                      <p class="col-sm col-md-4">
+                      <button class="btn btn-secondary" id="boton2">Delete</button>
+                      </p>
+                    </p> -->
+                  <a href="https://www.w3schools.com/js/js_if_else.asp" target= "_blank" class="btn btn-primary">Go somewhere</a>
+                </div>
+              </div>
+            </div>
+            <div class="col-sm">
+
+            </div>
+        </div>
+    </div>
+    <script src="./js/functions.js"></script>
+
+</body>
+</html>
diff --git a/exercici4/js/functions.js b/exercici4/js/functions.js
@@ -0,0 +1,29 @@
+
+let edad = prompt("How old are you?");
+let edadJubilacion = 67;
+let jubiladoYa = (edadJubilacion - edad);
+console.log(edad);
+
+
+/* function jubilado(){
+    if(edad < edadJubilacion){
+        return ("You need still" +" "+ jubiladoYa +" " +" to become a goverment employ!")
+    }else{
+        return ("You are rather lucky,"+" "+ -jubiladoYa +" "+ "years enjoying your well earned peace of mind.")
+    }
+};
+
+function myFunction() { 
+    document.getElementById('pintar').innerHTML = jubilado();
+ } ;
+ document.getElementById('boton1').onClick = function(){
+    myFunction();
+}; */
+ const myFunction = () =>{
+     edad < edadJubilacion ?
+     document.getElementById('pintar').innerHTML = (`You need still ${jubiladoYa}  to become a goverment employ!`):
+     document.getElementById('pintar').innerHTML = (`You are rather lucky ${-jubiladoYa} years enjoying your well earned peace of mind.`);
+ }
+
+
+
diff --git a/exercici5/css/styles.css b/exercici5/css/styles.css
@@ -0,0 +1,9 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800&display=swap');
+body{
+    font-family: 'Raleway', Verdana, Geneva, Tahoma, sans-serif;
+    font-size: 125%;
+
+}
+.container{
+    margin-top:9vh;
+}
diff --git a/exercici5/img/click.png b/exercici5/img/click.png