JavaScript 02. Dónde ubicar nuestro código

2. Dónde ubicar nuestro código.

- Casi siempre lo veremos ubicado dentro de lo que es el head de nuestro documento html.
- O dentro del body.
- O fuera del body antes del final de la etiqueta </html>.
- O en un archivo externo .js que enlazaremos desde una etiqueta desde nuestro head.

JavaScript 01. Introducción

JavaScript 01 Introducción

- Java Script fue inventado por Netscape (navegador) en 1995, es un lenguaje de programación que permite agregar animación, interactividad y efectos dinámicos a nuestras páginas html. Por ejemplo interactuar con menús, botones, galerías de imagen, etc.

* Su principal ventaja es que al ejecutarse del lado cliente tiene una inmediatez  que no tienen otros leguajes que se ejecutan del lado del servidor.

- Nosotros cuando visitamos una página web, lo que hacemos es escribir una url en nuestro navegador de preferencia y con esto estamos realizando una petición http. Esta petición va a llegar a nuestro servidor, va a buscar la página html que nosotros estamos solicitando, una vez encontrada, nos manda una respuesta a nuestro navegador y es con este documento que nos retorna donde viene nuestro código JavaScript, y es ahí, del lado del cliente, nuestro navegador, en donde se ejecuta este código.
Del lado del front end, en términos de diseño y programación.

El Blog Hostel Gestor de contenidos y usuarios

El Blog Hostel, es un gestor de contenidos y usuarios.

Por medio de esta app web podremos gestionar valoraciones de precios, servicios, opiniones, descripción, fotos, video promo, contacto, reservas, localización y mapas.

Organización por provincias o islas, y ayuntamientos. 

Gestión integral de usuarios y administradores. 

Descripción de nuestra empresa, servicios, noticias, fotos, video promo, contacto, localización y mapa.

La descarga es gratuita desde el siguiente enlace: https://github.com/JuanBarrosPazos/ElBlog_Hostel

Menu Carrusel Circular

 Hola a todos, os dejo el código necesario para poder integrar en vuestra web un menú tipo carrusel circular, muy vistoso.

Lo podéis descargar gratis desde este enlace.

Show Rom Image Js

 Con este sencillo código podréis integrar de forma sencilla una linda presentación de imágenes en vuestra sitio web.

Espero que os sea muy útil.

Descarga la gratis desde este enlace.

Arrastrar Soltar Archivos Jquery Php

Hola a todos hoy os dejo el código necesario para poder cargar archivos en vuestra web, con solo arrastrarlos, con validación incluida.

Generador de codigos qr web

 Con este código podréis generar códigos qr personalizados para poder utilizarlos de forma sencilla para y desde vuestra web.

Lector de codigos qr web cam

Mediante este sencillo código podremos leer códigos qr desde nuestra página web utilizando la web can del usuario.

Descargarlo gratis desde este enlace.

Cargar y recortar imagenes

 

Hola a todos os dejo el código necesario para poder cargar y recortar imágenes en vuestra web de una forma sencilla.

Espero que os sea muy útil.

Descargarlo gratis desde este enlace.

DROPZONE JS COMO VALIDAR ANCHO Y ALTO DE UNA IMAGEN FILE.WIDTH FILE.HEIGTH

Hola a todos de nuevo.
En un artículo muy reciente (ir al articulo) hemos visto una solución para validar el tipo de archivo y su peso en Dropzone.js, a partir de la configuración inicial.

A quedado patente la dificultad de acceder al objeto file.width y file.heigth en esta librería y os propongo una solución para validar el ancho y alto de una imagen.

A partir de la configuración inicial, igual que en el otro ejemplo, realizaremos unas pequeñas modificaciones para conseguir esta validación.

Vamos:

/* Esta es la configuration inicial:
          accept: function(file, done) {
            return done();
          },
          init: function() {
            return noop;
          }, */

// Y esta es la nueva configuración:
     accept: function(file, done) {

JS DOS METODOS PARA VALIDAR EXTENSION DE ARCHIVO

PARTIMOS DE UNA ARRAY EN EL QUE INCLUIMOS LAS EXTENSIONES PERMITIDAS.

Primero recupero la extensión del archivo:

    var archivo = $("#uploadImage").val(); // o file.name
    //RECUPERO LA EXTENSION DEL ARCHIVO
    var ext = (archivo.substring(archivo.lastIndexOf("."))).toLowerCase();

Método 1º por medio de un for recorremos el array:

    ext_ok = new Array(".gif", ".jpg", ".png", ".jpeg", ".mkv", ".mp4", ".avi", ".webm");
    //COMPRUEBO SI LA EXTENSION ESTA PERMITIDA
    permitida = "";
    for (var i = 0; i < ext_ok.length; i++) {
        if (ext_ok[i] == ext) { permitida = "yes";
                                   break;
         }else {permitida = "no";}
    } // FIN for

DROPZONE JS VALIDACIONES EXTRA

En este artículo os comentaré como he ampliado las validaciones de dropzone js de una forma sencilla:
En este otro artículo (ir al artículo) os explico como validar el ancho y alto de una imágen, por medio de los objetos file.width y file.heigth.

Partiendo de la configuración inicial en:

      This is an original option:
          accept: function(file, done) {
            return done();
          },
          init: function() {
            return noop;
          },
         
 He integrado alguna validación muy fácil de modificar y que nos retorna los errores en pantalla sin problema:

      accept: function(file, done) {

      ext_img = new Array(".jpg", ".png", "jpeg");
      var namei = file.name;
      var exti = (namei.substring(namei.lastIndexOf("."))).toLowerCase();

DROPZONE JS CONFIGURACION BASICA

Hola a todos en este post voy a compartir con vosotros las configuaciones básicas de dropzone js y los comentarios sobre ellas.
En otro atriculo os comentaré como he integrado algunas balidaciones extra según el tipo de archivo y su peso.

      /* url: defines the target for the upload form, and is the only required parameter.
      That said, if you’re attaching it to a form element then it’ll simply use the form’s action attribute, in which case you don’t even need to specify that. */
      url: null,
      // method: sets the HTTP method and again, it’ll simply default to POST
      method: "post",
      withCredentials: false,