Author Topic: [MOD-beta] Imagen con etiqueta de texto.  (Read 31565 times)

0 Members and 1 Guest are viewing this topic.

Offline exefire

  • Newbie
  • *
  • Posts: 30
  • FotoBomberos.com
    • View Profile
    • FotoBomberos.com
[MOD-beta] Imagen con etiqueta de texto.
« on: May 13, 2006, 11:13:23 PM »
Este MOD escribe un texto en las imágenes que ven los usuarios (normalmente la url del sitio) y redimensiona las imágenes para que se vean dentro de los tamaños predeterminados de los templates. Lo bueno es que hace todo lo anterior sin editar los archivos originales.
Dentro de las redimensiones está diseñado para 3 tamaños. Por ejemplo: uno mediano para ver en el sitio, uno grande para que aparesca en una nueva ventana y uno pequeño para… bueno, no lo se… pero dejé 3 tamaños que pueden ser editados en el archivo mostrar_config.php.
Si quieres ver un ejemplo pueden entrar a mi sitio www.fotobomberos.com

Archivos a modificar:
* Recuerda respaldar.
include/functions.php

Nuevos archivos:
mostrar.php
mostrar_config.php

Creación de nuevos archivos:

mostrar.php
Code: [Select]
<?php
// Realizado por ExeFire - exefire@gmail.com

header("Contet-type: image/jpeg"); // Esto indica al navegador que se le va a enviar datos de imagen
include ('mostrar_config.php'); //agregamos la variables desde la pagina de configuración

/*  Lee la variable de tamaño que utilizaremos
$valor_max_width Es la constante de ancho máximo
$valor_max_width Es la constante de alto máximo
*/
 
if ($_GET['tam'] !=''){ 
$tam $_GET['tam'];
switch ($tam){
case '1':{
$valor_max_width $cons_ancho1;
$valor_max_height $cons_alto1;
break;}
case '2':{
$valor_max_width $cons_ancho2;
$valor_max_height $cons_alto2;
break;}
case '3':{
$valor_max_width $cons_ancho3;
$valor_max_height $cons_alto3;
break;}
}
}


if(!isset(
$_GET['imagen'])) {

    
$imagen '';
    
$ext '';

} else {

    
$imagen $_GET['imagen'];
    
$ext strtolower(end(explode(".",$_GET['imagen']))); // Obtenemos así la extensión de la imagen

}

$validext = array("jpeg","jpg","png","gif"); // Definimos las extensiones válidas

$dir $dir.'/';


if(empty(
$imagen) || !in_array($ext,$validext) || !file_exists($dir.$imagen)) { 
// Si no se ha enviado una imagen como parámetro o la extensión no es válida, 
//enviaremos una imagen de error 

    
$im imagecreate 320 240 ); // Tamaño de la imagen de la imagen de error

    
$bg imagecolorallocate $im 0); // El primer color que indiquemos será el color de fondo
    
$textcolor imagecolorallocate $im 255 255 255 ); // Color negro para el texto

    
imagestring $im 120 100 "Error" $textcolor ); // Escribimos "Error" en la imagen

    
imagejpeg($im,'',75); // Mostramos la imagen por pantalla con una calidad de 75

} else { // Aquí debemos marcar la imagen que nos pasan por parámetro y mostrarla


$imginfo getimagesize($dir.$imagen);

if (
$imginfo == null) {             
$error "ERROR: El archivo fuente no se encontro!";             
return 
false;         
}         

// ancho/alto del archivo fuente 
$srcWidth $imginfo[0];         
$srcHeight $imginfo[1];


//analiza si hay que redimensionar la imagen comparando con nuestras constantes de tamaño máximo
$width1 $srcWidth+20;
$height1 $srcHeight+20;

if (
$srcWidth $valor_max_width) {
$width2 $valor_max_width
$height2 $srcHeight $valor_max_width $srcWidth
} else 
$width2 $srcWidth;
if (
$srcHeight $valor_max_height) {
$width2 $srcWidth $valor_max_height $srcHeight
$height2 $valor_max_height
} else
$height2 $srcHeight;


//escribe los valores analizados anteriormente en las variables originales
$destWidth $width2;
$destHeight =  $height2

// Verifica las funciones GD2 estén instaladas
if (!function_exists('imagecreatefromjpeg')) {             
$error "la libreria de GD2 de imagenes no esta instalada!";             
return 
false;
}         
if (!
function_exists('imagecreatetruecolor')) {             
$error "No existe la funcion imagecreatetruecolor de la libreria GD2 de imagenes!";             
return 
false;
}      

    if(
$ext == "jpeg" || $ext == "jpg") { // Creamos una imagen desde una imagen jpeg

        
$imXX imagecreatefromjpeg($dir.$imagen);

    } elseif(
$ext == "gif") {

        
$imXX imagecreatefromgif($dir.$imagen);

    } else {

        
$imXX imagecreatefrompng($dir.$imagen);

    } 
$im imagecreatetruecolor($destWidth$destHeight);

// A partir de aquí ya tenemos la imagen en $im, ahora a escribir el texto

    
$blanco imagecolorallocate $im ); // Color de fondo del cuadro de texto
    
$negro imagecolorallocate $im ,255 255 255 ); // Color del texto

    
$ancho $destWidth// Ancho de la imagen que se mostrará
    
$alto $destHeight// Alto de la imagen que se mostrará

    // Ahora dibujaremos un rectángulo para que no tengamos problemas si 
//la imagen es del mismo color que le texto que vamos a escribir en ella 

    
$fontwidth imagefontwidth(5);
    
$fontheight imagefontheight(5);

    
$recuadro_ancho $fontwidth*strlen($url); // Cálculamos lo que ocupa el texto en ancho
    
$recuadro_alto $fontheight;


imagecopyresampled($im$imXX0000$destWidth$destHeight$srcWidth$srcHeight);         


    
imagefilledrectangle($im$ancho-10 -$recuadro_ancho ,$alto-20,$ancho,$alto-5+$recuadro_alto,$blanco);

    
// Por último escribimos el texto de nuestro sitio en la imagen

    
imagestring($im,20,$ancho -$recuadro_ancho-5,$alto-20,$url,$negro);


imagejpeg($im''"80"); //se escribe la imagen con una calidad de 80


}

?>
Guardar cambios.

mostrar_config.php
Code: [Select]
<?php 
// Realizado por ExeFire - exefire@gmail.com

// Aquí va la ruta completa hacia el directorio data/media
$ruta_media 'var/html/www/data/media/'
$dir $ruta_media.$_GET['cat_x'];

// Texto que se escribirá la imagen
$url 'www.sitioweb.com';

// Determinar constantes de tamaños:
// Tamaño 1
$cons_ancho1 320;
$cons_alto1 240;  
// Tamaño 2
$cons_ancho2 500;
$cons_alto2 375;  
// Tamaño 3
$cons_ancho3 1600;
$cons_alto3 1600;  

?>

Aquí debes editar la ruta de la carpeta data/media.
Guardar cambios.


Modificación:

include/functions.php

Buscar:
Code: [Select]
"media_src" => $media_src,Cambiar por:
Code: [Select]
"media_src" => "mostrar.php?cat_x=$cat_id&imagen=$media_file_name&tam=2", //"media_src" => $media_src,
Buscar:
Code: [Select]
"width_height" => $width_height, Cambiar por:
Code: [Select]
"width_height" => '', //"width_height" => $width_height,
Buscar:
Code: [Select]
"width" => $width, Cambiar por:
Code: [Select]
"width" => '', //"width" => $width,
Buscar:
Code: [Select]
"height" => $height, Cambiar por:
Code: [Select]
"height" => '', //"height" => $height,
Guardar cambios.

Las explicaciones del funcionamiento están hechas dentro del texto de mostrar.php y para perzonalizar el texto y los tamaños se debe editar en mostrar_config.php.
Para variar los distintos tipos de tamaños se cambia el valor de la variable tam como se ve en el código mostrar.php?cat_x=$cat_id&imagen=$media_file_name&tam=2 es 2, ósea máximo 500 de ancho y 375 de alto.
De todos modos esta función no está muy pulida que digamos…

Espero pueda ser de ayuda.

Saludos cordiales,

Offline excitex2

  • Addicted member
  • ******
  • Posts: 1.590
  • He desactivado la galería y el buscador
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #1 on: May 14, 2006, 08:40:00 PM »
Saludos,,,

 :wink: :wink: Buen MOD,,, no lo he probado,, pero pinta bien  :wink: :wink:

Pasa el link a la sección : [MOD] Listado de MOD's traducidos o realizado en español

excitex2
Lo importante no es saber,,, lo importante es tener el E-Mail de quien sabe

Offline masterred

  • Sr. Member
  • ****
  • Posts: 494
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #2 on: July 19, 2006, 07:04:22 PM »
hola

Trabaja perfecto el MOD, solo me dio lata el path de data/media pero ya quedo, solo me gustaria saber si se le puede poner una imagen en vez del texto

gracias :lol:
Apache/2.2.21 (Win32)
PHP/5.3.5
Mysql Version: 5.5.19
4images Version: 1.7.?



Offline bOrdO

  • Pre-Newbie
  • Posts: 5
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #3 on: July 22, 2006, 09:33:44 AM »
Es cierto... lo que pregunta masterred, tambien lo quisiera saber..

Y buen Mod..
Por cierto en la web de bomberos que esta de ejemplo (www.fotobomberos.com) Tambien me gustaria saber como colocar la imagen anterior y siguiente en miniatura como en el caso de la web anterior.. que asi lo hace :mrgreen:

Gracias y buen trabajo GRACIAS!

Offline bOrdO

  • Pre-Newbie
  • Posts: 5
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #4 on: August 03, 2006, 03:29:23 AM »
Entonces es pósible usar una imagen, en lugar de etiqueta de texto ?



Como en esta web..


Que ha decir verdad no estoy seguro de que sea una galeria de images.. pero aqui esta

http://graffitimexicano.com.mx/galeria/index.php


 :P

Offline exefire

  • Newbie
  • *
  • Posts: 30
  • FotoBomberos.com
    • View Profile
    • FotoBomberos.com
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #5 on: August 03, 2006, 07:33:13 AM »
si que se puede.
aunque les digo que el método de www.fotobomberos.com no es una foto, sino una fuente (Tahoma).
Lamentablemente por falta de tiempo no he podido subir la versión 1.0 de este MOD y que no siga siendo sólo un BETA.

en cuanto tenga una hora por ahí, les cuento como se puede hacer.

De todos modos, no soy el creador de la rueda, si bien el código es mio, hay un MOD en inglés por ahí que tiene lo que buscan (lo encontré después de hacer el mio :oops:)

Saludos,

Offline ccsakuweb

  • Sr. Member
  • ****
  • Posts: 498
  • Patri
    • View Profile
    • My Art
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #6 on: August 10, 2006, 10:07:55 AM »
wow este me parece mucho mejor que el que instalé que estaba en inglés y hacia algo muy parecido.

Espero la nueva versión, animo !!! ^^

por cierto, el texto que se puede poner en la imagen se vería como en tu web? una especie de marco negro que pone el creador y la web? puede ponersele el tamaño tb?
tambien tu mod hace q se abra en una nueva ventana?
:arrow: 4images Paid Mods: Links, Blog, Albums, Subdomains for users, Diferent templates for user profile, Related picture in details, Last pictures in details.
And the mod that you request me.   Demo: http://www.myart.es

A website dedicated to artist people who loves drawing, design, writing and more

Offline masterred

  • Sr. Member
  • ****
  • Posts: 494
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #7 on: August 10, 2006, 08:30:44 PM »
hola
 el MOD este solo hace que se ponga el nombre de la pagina, con un marco negro,letras blancas o al reves, las ventana popup es otro MOD, ventana popup al clickear habre la original
Apache/2.2.21 (Win32)
PHP/5.3.5
Mysql Version: 5.5.19
4images Version: 1.7.?



Offline exefire

  • Newbie
  • *
  • Posts: 30
  • FotoBomberos.com
    • View Profile
    • FotoBomberos.com
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #8 on: August 11, 2006, 03:12:24 AM »
Bueno, la verdad es que lo que he publicado aquí es sólo para insertar el texto, pero lo que uso en mi sitio es para todo. Ya que por ejemplo la imagen la muestra en 560 máximo de ancho. En el popup muestra el tamaño original. Además de agregar la etiqueta.
Esperen un poco que me desestrese de la universidad y lo subo.
Saludos,

Offline masterred

  • Sr. Member
  • ****
  • Posts: 494
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #9 on: August 11, 2006, 05:50:16 PM »
toma tu tiempo, solo deseo lo de cambiar el texto por la imagen, dado que tengo ya un MOD de popup, aunque si en el MOD que mencionas, en la ventana popup tambien sale el texto o imagen del sitio, bienvenido.

saludos
Apache/2.2.21 (Win32)
PHP/5.3.5
Mysql Version: 5.5.19
4images Version: 1.7.?



Offline ccsakuweb

  • Sr. Member
  • ****
  • Posts: 498
  • Patri
    • View Profile
    • My Art
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #10 on: August 11, 2006, 07:57:45 PM »
si , animo que parece un gran mod. ^^

a mi también me gustaría que se abriera en una nueva ventana con el texto incluido
:arrow: 4images Paid Mods: Links, Blog, Albums, Subdomains for users, Diferent templates for user profile, Related picture in details, Last pictures in details.
And the mod that you request me.   Demo: http://www.myart.es

A website dedicated to artist people who loves drawing, design, writing and more

Offline ccsakuweb

  • Sr. Member
  • ****
  • Posts: 498
  • Patri
    • View Profile
    • My Art
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #11 on: August 14, 2006, 11:22:24 PM »
se necesita gd instalado? no lo incorpora ya 4images?
:arrow: 4images Paid Mods: Links, Blog, Albums, Subdomains for users, Diferent templates for user profile, Related picture in details, Last pictures in details.
And the mod that you request me.   Demo: http://www.myart.es

A website dedicated to artist people who loves drawing, design, writing and more

Offline excitex2

  • Addicted member
  • ******
  • Posts: 1.590
  • He desactivado la galería y el buscador
    • View Profile
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #12 on: August 15, 2006, 09:15:32 AM »
Saludos,,,

GD es una biblioteca,,, y PHP la utiliza para desarrollar algunas funciones como por ejemplo la manipulación de imagenes.

4images es un script y no lleva incorporado ninguna biblioteca,, bueno lleva solamente una en un MOD para los E-mail's

excitex2
Lo importante no es saber,,, lo importante es tener el E-Mail de quien sabe

Offline ccsakuweb

  • Sr. Member
  • ****
  • Posts: 498
  • Patri
    • View Profile
    • My Art
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #13 on: August 30, 2006, 01:25:31 PM »
pos a mi este mod no me va
tengo instalado autoresized image quizas sea por eso

pero no veo ni el marco y cuando me meto en details la imagen esta rota  :oops:
:arrow: 4images Paid Mods: Links, Blog, Albums, Subdomains for users, Diferent templates for user profile, Related picture in details, Last pictures in details.
And the mod that you request me.   Demo: http://www.myart.es

A website dedicated to artist people who loves drawing, design, writing and more

Offline exefire

  • Newbie
  • *
  • Posts: 30
  • FotoBomberos.com
    • View Profile
    • FotoBomberos.com
Re: [MOD-beta] Imagen con etiqueta de texto.
« Reply #14 on: August 30, 2006, 04:18:02 PM »
te puedes meter a tu log php para ver cual es el error que tira?; es decir, porque está rota la imagen.