Similar Posts

Explicación para el ‘obtect literal’ en Javascript

ByLuis

Muchas veces nuestra forma de aprender Javascript (o cualquier otra cosa) es encontrándonos con cosas desconocidas en scripts que estamos viendo e intentando comprender.

Una de estas nuevas posibilidades que nos ofrece Javascript son los “obtect literal”. Que sustituyen la falta de clases en Javascript, y nos facilita el uso de variables globales entre otras cosas.

Alguna vez te habrás encontrado con algo parecido al siguiente código y lo habrás querido comprender, una sencilla explicación nos la ofrece Wait till I come.

miObjeto={
miVariable:'valor',
init:function(){
},
hazAlgo:function(){
}
}

Show love to the object literal

Vía / DOM Scripting Task Force

links for 2007-05-11

ByLuis
|

Formularios CSS

ByLuis

Algo que parece de lo más sencillo a veces nos puede llevar más tiempo del que pensamos, el desarrollo de formularios, si queremos que sea bueno, puede ser muy variado, por eso os pasamos una recopilación de distintas implementaciones de formularios que hemos encontrado.
En ellos podrás encontrar desde el uso de fieldset y legend, maquetación sin el uso de tablas, división en grupos de datos, formularios dinámicos dependientes de selección de opciones previas y muchos otros más.
CSS-Based Forms: Modern Solutions
Vía / dzone

Hapi.js + Vue.js empezando con las routes

Hapi.js + Vue.js empezando con las routes

ByLuis

Empezamos a mostrar contenido, hasta ahora solo mostraba un error 404 cuando se accedía a la URL del servidor.

Ahora vamos a añadir una route simple que muestre un objeto JSON cuando se acceda a la home. Recordad que la parte del servidor solo va a devolver respuestas JSON que tratará el frontend.

Usaremos plugins para tratar todas las rutas que incluiremos en glue. En este ejemplo tan solo añadiremos un route al server que devuelva un mensaje:

const Config = require( '../config' );

const websiteName = Config.get( '/website/name' );

const register = function( server, serverOptions ) { // eslint-disable-line
	server.route( {
		method: 'GET',
		path: '/',
		options: {
			tags: [ 'api', 'home' ],
			description: 'Server home',
			notes: 'Server home',
			auth: false,
		},
		handler: function( request, h ) { // eslint-disable-line
			return {
				message: `Welcome to ${ websiteName }`,
			};
		},
	} );
};

module.exports = {
	name: 'api-home',
	dependencies: [],
	register,
};

Ahora solo falta añadir el plugin en el manifest.js

const manifest = {
	server: {
		port: Config.get( '/server/port' ),
	},
	register: {
		plugins: [
			{
				plugin: './api/home',
			},
		],
	},
};

Puedes bajarte el código aquí

Colección de calendarios Javascript

ByLuis

En muchas aplicaciones web, la utilización de un campo fecha suele ser algo habitual. Es preferible que el usuario no tenga que escribir ninguna fecha, sino que esta se tenga que introducir mediante un control de tipo calendario, evitando así que ocurran ciertos errores y facilitando la labor al usuario. Tened en cuenta que hay diversos formatos DD/MM/YYYY, MM/DD/YYYY, DD-MM-YYYY, …

Espero que esta lista de calendarios realizados mediante Javascript os pueda ser de utilidad:

  • The DHTML / JavaScript Calendar: visible mediante popup o en plano, adecuado para seleccionar fecha y hora, válido para la mayoría de los navegadores, admite CSS, themes, navegación por teclado, muestra los días de los meses adyacentes, traducido a varios idiomas, días especiales resaltados de distinta manera.cal1.png
  • Calendar Popup: se muestra un popup mediante ventana o usando capas, implementado para que tenga el aspecto de Microsoft Outlook, fácil de usar.cal2.png
  • Zapatec Calendar: script comercial, muy completo, admite varios meses, válido para la mayoría de los navegadores, permite varios formatos de fecha y multiple selección de días.cal3.png
  • ScriptCalendar: versión comercial, basado en objetos, fácil de usar y de modificar, válido para la mayoría de los navegadores.cal4.png
  • CalendarXP: versión comercial, muy completo que a parte del calendario pequeño, muestra un calendario grande que admite más detalles.cal5.png
  • Tigra Calendar: el que más me ha gustado, cada campo es seleccionable, se puede adjuntar a un campo existente, meses seleccionables mediante scrolling y muchas cosas más.cal6.png
  • Epoch Calendar: básico, de aspecto atractivo y válido para ser usado en aplicaciones AJAX.cal7.png

links for 2007-04-18

ByLuis