viernes, 1 de noviembre de 2013

Diferencia entre Aplicación web e Páxina web

Ante a pregunta de cal é a diferencia entre unha Aplicación web e unha Páxina web, creo que a mellor resposta é unha demostración.

A continuación crearanse dous arquivos PHP, en cada un se incluirá únicamente unha función.

O primeiro caso é unha función que accede en modo lectura a un arquivo de texto, no que só se almacena un número.

Almacena este número nunha variable e pecha o arquivo.

Logo volta a abrilo, en modo escritura, eliminando o dato existente, e almacenando o dato anterior incrementando o seu valor en unha unidade.


<?php
 function incrementarNumero () {
  // Abrimos o arquivo onde se almacena o numero
  $fp = fopen("numero.txt","r");  

  // Lemos o numero
  $numero = intval(fgets($fp)); 

  // Incrementamos o numero
  $numero++; 

  // Pechamos o arquivo para volver a abrilo para escritura
  fclose($fp); 

  // Abrimos o arquivo en modo escritura
  $fp = fopen("numero.txt","w"); 

  // Escribimos o numero
  fputs($fp,$numero); 

  // Pechamos o arquivo novamente
  fclose($fp);
 }
?>

A segunda función tamén abre o arquivo en modo lectura e devolve o valor.


<?php
 function recuperarNumero () {
  // Abrimos o arquivo onde se almacena o numero
  $fp = fopen("numero.txt","r");  

  // Lemos o numero
  $numero = intval(fgets($fp)); 

  // Pechamos o arquivo para volver a abrilo para escritura
  fclose($fp); 

  // Devolvemos o numero lido
  return $numero;
 }
?>

Estas dúas funcións son chamadas dende outros dous arquvos PHP.

No primeiro caso para realizar un contador de visitas en unha Páxina web.


<!DOCTYPE html>
<HTML>
<HEAD>
 <TITLE>Paxina Web</TITLE>
 <!-- Metadatos -->
 <META http-equiv="Content-Type" content="text/html;charset=utf-8">
 <META name="author" content="Vicente Arosa">
 <META name="generator" content="Notepad ++">
</HEAD>
<BODY style="color:black; background-color:white">
 <h2>P&aacute;xina web</h2>
 
 Numero de visitas: 

 <?php
  include ("incrementar_numero.php");
  include ("recuperar_numero.php");  
  
  //con cada visita incrementamos o contador de visitas
  incrementarNumero ();
  
  //amosamos o contador actualizado
  echo (recuperarNumero ());
 ?> 
</BODY>
</HTML>

O resultado é o seguinte:




No segundo caso, tamén usando as mesmas funcións se realiza unha aplicación de control de aforo en un local. 

En esta aplicación se contará cada novo cliente que entre no local, a fin de saber si se pode permitir o acceso a máis clientes.


<!DOCTYPE html>
<HTML>
<HEAD>
 <TITLE>Aplicaci&oacute;n Web</TITLE>
 <!-- Metadatos -->
 <META http-equiv="Content-Type" content="text/html;charset=utf-8">
 <META name="author" content="Vicente Arosa">
 <META name="generator" content="Notepad ++">
</HEAD>
<BODY style="color:black; background-color:white">
 <h2>Control de aforo</h2>
 
 Aforo m&aacute;ximo do local: 150 <BR>
 Numero actual de clientes: 

 <?php
  include ("incrementar_numero.php");
  include ("recuperar_numero.php");  
  
  //con cada cliente que entra incrementamos o número de clientes
  incrementarNumero ();
  
  //amosamos o numero de clientes dentro do local.
  echo (recuperarNumero ());
 ?> 
</BODY>
</HTML>

O resultado é o seguinte:


En resumen:

Que o resultado do noso código sexa unha Páxina web ou unha Aplicación web, dependerá do uso que se lle dea, non das tecnoloxías a usar.

Normalmente as Páxinas web teñen un maior compoñente de deseño, mentres que nas aplicacións web, soe ser máis importante a parte de programación.

jueves, 10 de octubre de 2013

martes, 1 de octubre de 2013

domingo, 22 de septiembre de 2013

Proba de nivel

Acaba de ser publicado na plataforma Moodle do curso o exercicio de repaso puntuable sobre HTML, CSS, JAVASCRIPT, PHP e uso de Arquivos.

Pódese acceder á mesma na seguinte dirección, na sección
"UF1845 Acceso a datos en aplicacións web do entorno servidor":


http://83.165.182.60/course/view.php?id=2

Como alternativa, só dende a aula de formación, é posible acceder á mesma páxina na dirección:

http://10.0.0.18/course/view.php?id=2

viernes, 13 de septiembre de 2013

Acceso a ficheros e lectura completa do mesmo

Para poder acceder a ficheiros mediante PHP, é preciso realizar tres pasos:

  1. Abrir o ficheiro mediante fopen.
  2. Ler ou escribir no ficheiro.
  3. Pechar o ficheiro mediante fclose.

A continuación se amosa un exemplo que le o contido de un ficheiro de texto e o inclúe nunha páxina HTML, mediante o uso da función fpassthru.

<?php
//Paso 1 - Apertura de arquivo
$ficheiro = fopen ("saudo.txt","r");
echo ("<BR>Ficheiro aberto.<BR><HR>");


//Paso 2 - Lectura de ficheiro
echo("<DIV style='color:red;'>");
fpassthru ($ficheiro);
echo("</DIV>");

//Paso 3 - Peche de arquivo 
fclose ($ficheiro);
echo ("<HR><BR>Ficheiro pechado");
?>

O resultado é o seguinte:


Sendo o contido do ficheiro o seguinte:



lunes, 9 de septiembre de 2013

Codificación Cesar

Imos realizar un pequeno exercicio de criptografía, mediante o famoso método cesar, atribuido ó mesmísimo Xulio César.

Podedes atopar información sobre este método de codificación e os sistemas de decodificación aplicables na wikipedia (http://es.wikipedia.org/wiki/Cifrado_C%C3%A9sar).


En primeiro lugar creamos un ficheiro HTML que amose en pantalla un formulario para recoller os datos que imos codificar:




<!DOCTYPE html>
<HTML>
<HEAD>
 <TITLE>Formularios</TITLE>
 <!-- Metadatos -->
 <META http-equiv="Content-Type" content="text/html;charset=utf-8">
 <META name="author" content="Vicente Arosa">
 <META name="generator" content="Notepad ++">
</HEAD>
<BODY style="color:black; background-color:white">
 <h2>Formulario encriptacion mediante metodo cesar</h2>

 <FORM name="form001" action="002_cesarEncriptarDesencriptarDesdeFormulario.php" method="get">
  Introduza o texto a codificar: <br>
  <input type="text" name="texto"></input><br>
  Introduza o salto de codificación / decodificacion: <br>
  <input type="text" name="salto"></input><br> 
  
  <input type="submit" value="Codificar / Decodificar"></input>
 </FORM>
</BODY>
</HTML>



Esta páxina envía os datos mediante o método get a unha páxina php que os procesará no servidor, e amosará os resultados no navegador.

Neste caso podería usarse, para o envío, tamén o método post, pero eliximos o método get para poder comprobar na dirección que os datos se envían correctamente.


Cubrimos o formulario:











Pulsamos o botón "Codificar / Decodificar", co que se producirá a chamada á páxina PHP:



Pódese comprobar na parte final da dirección que os datos se envían correctamente.

O código da páxina PHP será o seguinte:






<!DOCTYPE html>
<HTML>
<HEAD>
 <TITLE>Encriptacion cesar</TITLE>
 <!-- Metadatos -->
 <META http-equiv="Content-Type" content="text/html;charset=utf-8">
 <META name="author" content="Vicente Arosa">
 <META name="generator" content="Notepad ++">
 
</HEAD>
<BODY>
 <h2>Encriptacion cesar</h2>

 <?php
  function letraCesar ($letraSinEncriptar, $salto){
   //obtense o codigo ascii da letra a encriptar
   $codigoLetraSinEncriptar = ord ($letraSinEncriptar);
   //sumase tres o codigo da letra a encriptar
   //obtendo o codigo da letra encriptada
   $codigoLetraEncriptada = $codigoLetraSinEncriptar + $salto;
   //obtense o caracter encriptado a partir do seu codigo
   $letraEncriptada = chr ($codigoLetraEncriptada);
   
   //devolvese a letra encriptada
   return $letraEncriptada;
  }
  
 
  function textoCesar ($textoSinEncriptar, $salto) {
   $letraEncriptada;
   $textoEncriptado = "";
   //recorrese toda a cadea
   for ($i = 0; $i < strlen($textoSinEncriptar); $i++){
    //enviase cada letra a encriptar
    $letraEncriptada = letraCesar (substr($textoSinEncriptar, $i, 1), $salto);
    //engadese a letra encriptada á cadea a retornar
    $textoEncriptado = $textoEncriptado . $letraEncriptada;
   }
   
   return $textoEncriptado;
  }
 
  $v1 = textoCesar ($_GET["texto"], $_GET["salto"]);
  echo ($v1);
  echo ("<br>");
 ?>
 
</BODY>
</HTML>


Como se pode comprobar, se subdivide o problema en dous subproblemas, creando unha función para resolver cada un deles. 

En primeiro lugar o problema da codificación se reduce a codificar cada unha das letras, polo que se crea a función letraCesar que docificará unha única letra, devolvendoa codificada. 

O segundo problema redúcese a repetir este proceso para cada letra da mensaxe a codificar, deste traballo se encarga a función textoCesar. Finalmente o único que é preciso e realizar unha chamada a esta última función co texto correcto, o cal se recibe a través do array asociativo $_GET.

O resultado é o seguinte:
 
Dada a naturaza da encriptación Cesar o proceso de encriptación é o mesmo que o de desencriptación pero cambiando o signo do salto, neste caso para decodificar un texto codificado será suficiente con indicar que o salto é o mesmo aplicado na codificación, pero en signo negativo.
No caso do exemplo, decodificaremos "Krod" con salto -3:
O proceso se pode ver no seguinte vídeo:

martes, 3 de septiembre de 2013

Actualización plataforma Moodle

Actualizóuse a plataforma Moodle do curso, engadindo a posibilidade de descargar o código fonte dos exemplos realizados en clase.

Para acceder ás descargas é preciso acceder á sección Exercicios resoltos.



Dentro desta opción, se accede ó listado de arquivos comprimidos en formato zip, dos exemplos resoltos en clase.


miércoles, 14 de agosto de 2013

Creación de imaxes de baixa calidade mediante XnView

Cando se usan imaxes de gran peso en unha páxina web, é interesante a aplicación do atributo lowsrc, o cal realiza a carga de unha imaxe de baixa calidade, que se cargará con antelación á de calidade, dando a impresión de unha maior velocidade de carga.

Para crear de xeito sinxelo estas imaxes, é posible utilizar, entre outras ferramentas, o visor de imaxes gratuito XnView.

As imaxes obtidas mediante este método serán de menor calidade, pero do mesmo tamaño que as orixináis.

Neste caso, se crearán várias imaxes a menor calidade, en formato jpg o cal é un formato que permite a perda de información reducindo a calidade da imaxe no proceso.

Paso 1: Seleccionar todas as imaxes.



Paso 2 Seleccionar Herramientas -> Convertir por lotes...




Aparece unha venta que indica diversos parámetros





Paso 3 Modificar opcións de calidade.


Para iso é suficiente pulsar o botón Opciones.


Para modificar a calidade é suficiente con mover a barra de calidade, ou indicar un número entre 1 e 100 no cadro correspondente.





O valor proposto por defecto e de 80, para conseguir unha imaxe en baixa calidade, (do mesmo tamaño que a orixinal, pero de menor peso) será suficiente con baixar ese valor.




Paso 4 Finalizar o proceso

Pulsase o botón aceptar.

Seleccionase a carpeta de destino.






Finalmente púlsase o botón proceder.


Comezará o proceso de conversión, e unha vez finalizado, cerraráse a ventana.



Un exemplo do resultado sería o seguinte:


Imaxe a calidade orixinal


Imaxe coa calidade moi reducida
O proceso completo pódese apreciar no seguinte vídeo de youtube.


martes, 13 de agosto de 2013

Creación de imaxes en miniatura (Thumbnail) mediante XnView


Mediante o visor de imaxes gratuito XnView, é posible a creación de imaxes en miniatura (Thumbnails) de forma masiva.

Este tipo de imaxes soen usarse nas galerías de imaxes.
Para comezar é importante que as imaxes estean en unha carpeta, e ter creado a carpeta na que almacenaremos as imaxes en miniatura.



En este caso a carpeta coas imaxes a tamaño natural, é a denominada orixinais.

Neste exemplo usaranse imaxes con licencias Creative Commons obtidas da wikimedia.

O proceso é como se indica a continuación:
Paso 1, abriremos a carpeta das imaxes orixinais :


Paso 2, seleccionar todas as imaxes da carpeta, para o que teremos varias solucións :
    1. Seleccionar co rato. 
    2. Menú Editar -> Seleccionar Todo. 
    3. Combinación de teclas CTRL + A. 


Paso 3, seleccionar a opción de conversión por lotes, para o que teremos varias solucións :

    1. Botón dereito, seleccionar "Conversión por lotes...". 
    2. Menú Herramientas-> "Conversión por lotes...". 
    3. Combinación de teclas CTRL + U. 


Aparece unha ventá coas opcións de conversión.


Paso 5, seleccionar a pestana "Transformaciones" :


Paso 6, seleccionar a transformación Imagen -> Cambiar tamaño, e pulsar en "Añadir" :


Esto provoca que na parte dereita apareza a opción seleccionada.


Como se pode comprobar, aparece na lista superior a modificación que desexamos aplicar.

Pódense aplicar várias modificacións simultáneamente, ainda que neste caso só aplicaremos a de "Cambiar tamaño"

Unha vez seleccionado, na parte inferior aparece un apartado de parámetros, nos que indicaremos as novas dimensións, que poden ser en pixeles (na primeira columna de casillas), ou en porcentaxe (na segunda columna) .

Neste caso crearemos imaxes en miniatura de un tamaño de 150 x 100 pixeles.



Neste caso desmarcaremos a casilla "Mantener proporción", para forzar que todas as imaxes sexan do mesmo tamaño, en caso contrario, se mantería a relación entre ancho e alto de cada unha delas.

Paso 7, seleccionar a carpeta de destino.

Na pestana "General" seleccionaremos o directorio no que desexamos que se garden as imaxes modificadas. A mellor opción e seleccionar un directorio distinto para que non se sobreescriban as imaxes orixinais.


Paso 8, Pulsar no botón "Proceder".


Tras pulsar o botón aparecerá unha ventana indicativa do progreso do proceso.


En caso de que exista unha imaxe co mesmo nome na carpeta destino, se indicará mediante unha ventana, na que se solicitará se desexamos sobreescribila.


A continuación se amosa o proceso completo en un vídeo de youtube: