Notas

Nivel 1

prueba

llamadaAjax(urlAire, (err,dato) => {
	err ? console.warn(err) : console.log(dato);
})

llamadaAjax(url)
	.then(console.log)
	.catch(console.warn)

async function init(){
	try {
		const dato = await llamadaAjax(urlAire)
		console.log(dato)
	} catch(err) {
		console.warn(err)
	}
}

Librería

const urlAire = "http://airemad.com/api/v1/station"

function llamadaAjax(url, cb){
	const promesa = new Promise ((resolve, reject) => {
		fetch(url)
		    .then(request => request.text())
		    .then(text => {
		        resolve(JSON.parse(text));
		    })
		    .catch(error => {
		        reject(error);
		    });
	})

	if(cb && typeof(cb) === "function"){
		promesa
			.then(data => cb(false, data))
			.catch(cb)
	} else {
		return promesa
	}
	
}

Nivel 2

prueba

const servEstaciones = servicioHttp("http://airemad.com/api/v1/")

servEstaciones("station")
    .then(console.log)
    .catch(console.warn)

servEstS001("station/S001", (err, data) => {
   if(err) {
      console.warn(err)  
 } else {
     console.log(data)
}
})

código

function servicioHttp (baseUrl){

	//credetials, tokens, etc..

	return function(endpoint, cb) {

		const promesa = new Promise ((resolve, reject) => {
			fetch(${baseUrl + endpoint})
			    .then(request => request.text())
			    .then(text => {
			        resolve(JSON.parse(text));
			    })
			    .catch(error => {
			        reject(error);
			    });
		})

		if(cb && typeof(cb) === "function"){
			promesa
				.then(data => cb(false, data))
				.catch(cb)
		} else {
			return promesa
		}


	}
}

Nivel 3 🦄

reto

//HEADERS
servicioHttp("http://airemad.com/api/v1/")
	.headers({
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    })
    .method("trace")
    //promesa o cb




// comportamiento para GET, POST, PUT, DELETE
servicioHttp("http://airemad.com/api/v1/")
	.get("station/123")
	.then(console.log)
	.catch(console.warn)

servicioHttp("http://airemad.com/api/v1/")
	.get("station/123", (err, data) => {
		if(err){
			console.warn(err)
		} else {
			console.log(data)
		}

	})


// comportamiento para GET, POST, PUT, DELETE
servicioHttp("http://airemad.com/api/v1/")
	.post("station", {id:123})
	.then(console.log)
	.catch(console.warn)

código

function $http (baseUrl){

	let headers = {}
	function wrapperAjax ({url, method, data}){
		const setup = {}
			setup.method = method;
			setup.headers = headers;
			if(data){
				setup.body = typeof(data) !== "string" ? JSON.stringify(data): data;
			}
		return fetch(`${baseUrl+ url}`, setup)
	}

	function fallbackStrategy (prom, cb) {
		if(cb && typeof(cb) === "function") {
			prom
				.then(response => response.json())
				.then(data => cb(false, data))
				.catch(cb)
		} else {
			return prom.then(response => response.json())
		}
	}

	return {
		headers(obj){
			const _self = this;
			this.headers = obj;
			return _self;
		},
		method(verb, url, data, cb){
			return fallbackStrategy(wrapperAjax({
				url, method:verb, data
			}), cb)
		},
		get(url, cb){
			return fallbackStrategy(wrapperAjax({
				url, method:"GET"
			}), cb)
		},
		post(url, data, cb){
			return fallbackStrategy(wrapperAjax({
				url, method:"POST", data
			}), cb)
		},
		put(url, data, cb){
			return fallbackStrategy(wrapperAjax({
				url, method:"PUT", data
			}), cb)
		},
		delete(url, cb){
			return fallbackStrategy(wrapperAjax({
				url, method:"DELETE"
			}), cb)
		}
	}
}

Test Final

$http("http://airemad.com/api/v1/")
	.get("station/S001")
	.then(console.log)
	.catch(console.warn)

Espero que ya estéis todos en Slack.. estoy creando un pequeño canal privado ^^

¿Que usuarios tenéis? (No usar la @ para no mencionar a gente de github ajena en este issue)

Si no tienes usuario... Date de Alta

Fiesta Open Source, Linux y un invitado especial: Slimbook Computers

Info

• Web Oficial
• Sábado 15 de Septiembre de 10:00 a 15:00
• en Se Aceptan Ideas

PAK PAK PAK!
Qué turbio
Y oh, sorpresa!
BOOOOOM
Que está bastante guay.
Por darle un giro más hipster
¡Esto es todo amor, tío!
¡Bugazo en producción! ¡ja, ja!
Puedes hacer movidas serious game.
Básicamente esa es la mecánica.
Fin de la peli.

Recurso bastante 🔝

Supongo que mucha de la documentación será similar a la que tenemos de clase, pero igual habrá cosas que no nos vendrá mal repasar aunque sean repetidas. Por lo menos a mi.

https://github.com/leonardomso/33-js-concepts

Hola!

Usemos este espacio para conocernos un poco más... :-)

Recordad que estos issues nos permiten abrir y participar en debates, compartir recursos, plantear preguntas y muchas cosas más!

Podemos usar Markdown para salirnos del texto plano y enriquecer nuestras aportaciones.

https://api.nfl.com/docs/global/endpoints/index.html

Acaban de sacar esta web que nos permite customizar a la emblemática mascota de Github ;-)

La mayoría de sus legendarias pegatinas son parte de la galería que la comunidad ha construido entorno a esta mascota.

Contexto

• Historia del Octocat
• Octocat en Wikipedia
• Octocat FAQ

Os espero... para poder montar el canal :-)

https://slack.osweekends.com

No tengo una idea clara.
Estaba pensando cruzar datos de la API de la ISS con otras APIs, para sacar información de por dónde está pasando la Estación Espacial Internacional y mostrar de ese lugar:

• Mostrar información del tiempo atmosférico.
• Saludar en el idioma
  https://www.omniglot.com/language/phrases/hello.htm
• Reproducir la canción que más se oye en ese momento (API spotify lastfm)
  https://www.last.fm/api/show/geo.getTopTracks
  Esa información se podría pintar y/o twitear

El problema además de que muchas veces pasa por zonas inhabitadas o países grandes es que puede dar un resultado acumulado poco interesante.
Le tengo que dar una vuelta más y si no me convence desecharlo.

https://github.com/k88hudson/git-flight-rules/blob/master/README_es.md

Encontré esto

9 killer uses for websockets

test.tar.gz

En breve os llegarán las invitaciones para usar C9.io. Si alguien tiene problemas con esto... que avise esta tarde en clase ;-)

ES6 Javascript - What you need to know
Javascript Promises - What you need to know

Idea final aún en proceso, tecnologías que me gustaría que tuviese:

• WebSockets
• Scrapping automatizados
• Utilización de diferentes paradigmas de programación

Buenas! Estaba sentado haciendo los ejercicios, cuando intentando hacer el ejercicio 2

Saca el estado actual de todas las líneas del metro de Madrid por consola.

cuando me encuentro que el siguiente código no me devuelve información en la web del metro de madrid

        const page = await browser.newPage();
        await page.goto('https://www.metromadrid.es/es/index.html',{waitUntil:'networkidle0'});
        // await page.waitFor(4000);
        
        const lines = await page.evaluate(() => {
            let lineas = Array.from(document.querySelectorAll('.med>.bloquet'));

            return lineas.map(el => {
                return (el.querySelector('.circulacion>.txt')) ? el.querySelector('.circulacion>.txt').innerText : null;
            });
        });
        console.log(lines);
        return lines.sort((a,b) => a - b).filter(el => (el));```

Eso sí, si lo intento en el navegador e introduzco

let lineas = Array.from(document.querySelectorAll('.med>.bloquet'));
let output = lineas.map(el => {
return (el.querySelector('.circulacion>.txt')) ? el.querySelector('.circulacion>.txt').innerText : null;
});

consigo que salga sin problemas... puede ser que haga falta algún delay o algo?

Leí o me pareció leer hace tiempo que cambiar mucho con [a, b] = [b, a] podía acarrear problemas a la larga en el código
¿Es cierto, porqué, etc, etc?

¡Hora de ingeniería inversa!

⚠️ Importante: No uses tu cuenta de Twitter real, ya que podríamos ser desconectados de la plataforma de forma permanente

Ejercicios

1 - Twitter no nos permite usar la consola porque han sobreescrito los métodos.... ¡Es hora de solucionarlo!

Puedes simularlo en cualquier pestaña haciendo esto:

for (var method in console){
	console[method] = function(){}
}

// Tu solución

A este ya me he apuntado:
https://www.koliseo.com/jsdayes/jsday-es-2018#/

¡Únete a Hack The Box](https://www.hackthebox.eu/invite)!

¿Lo has logrado?

⚠️ No compartas como lo lograste

La primera regla de Hack The Box: Nadie habla sobre cómo registrarse en Hack The Box.

Proyecto fin de curso de @abelespana

Idea general

Una quiniela interactiva para votar tus predicciones para los Oscar, con las siguientes características molonas:

Interfaz e interaccion básicas

• Un diseño somero pero donde el usuario pueda escoger sus candidatos entre todas las categorías (24 "fichas" en total, entre 3 y 10 nominados por cada "ficha"). Unos radio buttons, unas fotos y un botón de "Siguiente categoría".
• Cada voto del usuario incrementa un contador que registra el total de categorías votadas y el número de categorías que faltan por votar.
• Validación básica de formularios: ¿exigir que haya un voto en todas los campos o permitir undefined o nulls?
• Posibilidad de seleccionar una opción aleatoria para tus apuestas, porque todo el mundo vota random la categoría de mejor cortometraje documental.
• Aplicar transiciones y efectos visuales (manejo del DOM para efectos tipo mostrar/ocultar o avanzar al siguiente elemento).
• Enviar el formulario y generar un resumen tipo imprimible o descargable en PDF o algo así.

Procesos un poco más avanzados.

• Consultar los detalles sobre las películas nominadas o los actores, o toda la información que nos pueda dar la API de TheMovieDB.
• Login de usuarios tirando de alguna API tipo Facebook, Twitter... O con Firebase, OAth 2 o alguna cosa de estas que no controlo mucho.
• ¿Almacenamiento de datos? Para dar la posibilidad de editar las apuestas una vez validadas. Creo que se puede hacer con Firebase, pero no estoy muy seguro. Si no igual LocalStorage o algo así.
• Mostrar estadísticas con alguna librería sencilla tipo charts.js o highcharts
• Mostrar número total de usuarios que han votado (algo así como: eres la 80ª persona en votar).

Cosas que molarían pero quedarán para futuras versiones ya si eso

• Cada voto del usuario "rellena" una porción de una estatuilla de los Oscar, como una especie de barra de progreso.
• Mostrar estadísticas con alguna librería chula (D3 sería guay, para aprender de paso)
• Posibilidad de comparar tus apuestas con las de otra gente.
• Y lo que se me vaya ocurriendo.

El finde del 19 de Octubre hay un Hackaton montado por la NASA en Madrid.
https://www.eventbrite.es/e/entradas-nasa-spaceappsmadrid-49654886101