Tutorial: ¡Otros ejemplos de aplicaciones para fanpages!

cicklow

Admin
Beta
Verificado con documento
Verificación en dos pasos activada
Desde
30 May 2011
Mensajes
57
Crédito(s)
1
Puntos
25.567
En este mini curso podrán ver y aprender como hacer otro tipo de aplicaciones para las fanspages. Vamos a usar como referencia la apps ->
Insertar CODE, HTML o PHP:
http://www.mediafire.com/?mais8gty1wz8wcw
Vamos a reemplazar solo este código por otros (tab.php):
PHP:
if($_REQUEST['crear']==""){
			//Numero aleatorio y mostramos el resultado
			$CUAL = mt_rand(10,95);
			echo '<a href="'.$_MSERVER.'tab.php?crear=1&cual='.$CUAL.'&signed_request='.$_REQUEST['signed_request'].'"><img src="pic/button.png" border="0"></a><br/><br/>';
			echo '<img src="fondos/tmp_'.$CUAL.'.jpg">';
}else{
			//Subimos la imagen
			$_P['message'] = trim('Descubre tu suerte diaria. '.$_LNK);
			$_P['source'] = "@" . realpath('fondos/tmp_'.$_REQUEST['cual'].'.jpg');
			$ch = curl_init();
			curl_setopt($ch, CURLOPT_URL,'https://graph.facebook.com/'.$_R['user_id'].'/photos?access_token='.$_R['oauth_token']);
			curl_setopt($ch, CURLOPT_POST, true);
			curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
			curl_setopt($ch, CURLOPT_POSTFIELDS, $_P);
			$resultado = curl_exec($ch);
			$resultado = json_decode($resultado, true);
			curl_close($ch);

			//echo "<script>window.top.location = '".$_LNK."';</script>";
			//Si no queremos mostrar mas nada solo sacamos las barras de comentario (//) en la linea anterior
			//Sino mostramos algo.
			echo '<h1>Tu imagen fue subida con exito, podras verla en tu perfil</h1>';
}
1- Subir la imagen sin paso previo por usuario
Este código lo que hace es evitar el paso de mostrar el resultado y decirle al usuario que haga clic en un botón para subir la imagen al muro.
PHP:
			//Numero aleatorio y mostramos el resultado
			$CUAL = mt_rand(10,95);
			echo '<img src="fondos/tmp_'.$CUAL.'.jpg">';

			//Subimos la imagen
			$_P['message'] = trim('Descubre tu suerte diaria. '.$_LNK);
			$_P['source'] = "@" . realpath('fondos/tmp_'.$CUAL.'.jpg');
			$ch = curl_init();
			curl_setopt($ch, CURLOPT_URL,'https://graph.facebook.com/'.$_R['user_id'].'/photos?access_token='.$_R['oauth_token']);
			curl_setopt($ch, CURLOPT_POST, true);
			curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
			curl_setopt($ch, CURLOPT_POSTFIELDS, $_P);
			$resultado = curl_exec($ch);
			$resultado = json_decode($resultado, true);
			curl_close($ch);

			//echo "<script>window.top.location = '".$_LNK."';</script>";
			//Si no queremos mostrar mas nada solo sacamos las barras de comentario (//) en la linea anterior
			//Sino mostramos algo.
			echo '<h1>Tu imagen fue subida con exito, podras verla en tu perfil</h1>';
[Los ejemplos a continuar usan GD, tengan en cuenta que esto consume recursos y si la aplicación da resultado tienen que tener un buen server para no morir en el intento]
2- Usar GD para agregar el nombre de usuario a una imagen
PHP:
			//Usamos GD para crear la imagen
			$font = 'impact.ttf'; //Fuente a usar (ir a la carpeta windows/fonts seleccionar una fuente, copiar y pegar en la carpeta de la apps)
			$image = imagecreatefromjpeg('buena_suerte2.jpg'); //Imagen base

			if ($image === false) { die ('Unable to open image'); }

			$textcolor = imagecolorallocate($image,255,255,255); //Color del texto RGB

			imagettftext($image, 20, 0, 20,50, $textcolor, $font, $A['first_name'].' Tiene hoy'); //Agregamos el nombre
			imagettftext($image, 60, 0, 65,375, $textcolor, $font, mt_rand(10,95).'% de'); //Agregamos el %

			imagejpeg($image,'tmp/tmp_'.$A['id'].'.jpg',90); //Creamos la imagen en la carpeta tmp
			imagedestroy($image); //Vaciamos la memoria

			echo '<img src="tmp/tmp_'.$A['id'].'.jpg">'; //Mostramos la img al usuario!

			//Subimos la imagen
			$_P['message'] = trim('Descubre tu suerte diaria. '.$_LNK);
			$_P['source'] = "@" . realpath('tmp/tmp_'.$A['id'].'.jpg');
			$ch = curl_init();
			curl_setopt($ch, CURLOPT_URL,'https://graph.facebook.com/'.$_R['user_id'].'/photos?access_token='.$_R['oauth_token']);
			curl_setopt($ch, CURLOPT_POST, true);
			curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
			curl_setopt($ch, CURLOPT_POSTFIELDS, $_P);
			$resultado = curl_exec($ch);
			$resultado = json_decode($resultado, true);
			curl_close($ch);

			//echo "<script>window.top.location = '".$_LNK."';</script>";
			//Si no queremos mostrar mas nada solo sacamos las barras de comentario (//) en la linea anterior
			//Sino mostramos algo.
			echo '<h1>Tu imagen fue subida con exito, podras verla en tu perfil</h1>';
Resultado:

Imagen Base:


3- Colocar la imagen del usuario, el nombre y un %
Este ejemplo lee la imagen del usuario, el nombre y lo agrega a una imagen base
PHP:
	$url = 'http://graph.facebook.com/'.$A['id'].'/picture?type=large';
	$font = 'impact.ttf'; //Fuente a usar

	//Funcion encargada de ver la url real de la imagen del usuario
	function VerRealURL($U){
		$ch2 = curl_init();
		curl_setopt($ch2, CURLOPT_URL, $U);
		curl_setopt($ch2, CURLOPT_HEADER, true);
		curl_setopt($ch2, CURLOPT_RETURNTRANSFER, true);
		$ZZ = curl_exec($ch2);
		curl_close($ch2);

		preg_match('/Location:(.*?)\n/', $ZZ, $matches);
		return trim(array_pop($matches));
	}

	//Funcion encargada de ver que tipo de foto tiene (jpg,gif,etc)
	function open_image($file){
	    $size = getimagesize($file);
	    switch($size["mime"]){
        	case "image/jpeg":
	            $im = imagecreatefromjpeg($file); //jpeg file
        	    break;
	        case "image/gif":
        	    $im = imagecreatefromgif($file); //gif file
	            break;
        	case "image/png":
	            $im = imagecreatefrompng($file); //png file
        	    break;
	        default: 
        	    $im=false;
	            break;
	    }
	    return $im;
	}

	//Vemos la url de la foto del usuario
	$url = VerRealURL($url);
	//La abrimos
	$image = open_image($url);

	if ($image === false) { die ('Unable to open image'); }

	//Vemos el tamaño
	$w = imagesx($image);
	$h = imagesy($image);

	//calculamos las nuevas dimensiones preservando el aspecto
	$new_w=200;
	$new_h=200;
	if(($w/$h) > ($new_w/$new_h)){
		$new_h=$new_w*($h/$w);
	} else {
		$new_w=$new_h*($w/$h);   
	}

	//Cargamos la imagen base
	$im2 = imagecreatefromjpeg('caraderata.jpg');
	//Agregamos la img del usuario al base
	imagecopyResampled($im2, $image, 260, 166, 0, 0, $new_w, $new_h, $w, $h);

	//Color de texto negro
	$textcolor = imagecolorallocate($im2,0,0,0);
	$text1 = $A['first_name'];

	//Agregamos el texto y el nombre
	imagettftext($im2, 25, 0, 20,40, $textcolor, $font, 'Segun lo que se ve en la foto de');
	imagettftext($im2, 30, 0, 20,90, $textcolor, $font, $text1);
	//Agregamos el %
	imagettftext($im2, 20, 0, 20,120, $textcolor, $font, 'Tiene un');
	imagettftext($im2, 50, 0, 130,160, $textcolor, $font, mt_rand(10,95).'%');
	imagettftext($im2, 20, 0, 260,120, $textcolor, $font, 'de cara de rata');

	//Guardamos la img
	imagejpeg($im2,'tmp/tmp_'.$A['id'].'.jpg',90);
	imagedestroy($im2);
	echo '<img src="tmp/tmp_'.$A['id'].'.jpg">'; //Mostramos la img al usuario!

			//Subimos la imagen
			$_P['message'] = trim('Descubre tu suerte diaria. '.$_LNK);
			$_P['source'] = "@" . realpath('fondos/tmp_'.$A['id'].'.jpg');
			$ch = curl_init();
			curl_setopt($ch, CURLOPT_URL,'https://graph.facebook.com/'.$_R['user_id'].'/photos?access_token='.$_R['oauth_token']);
			curl_setopt($ch, CURLOPT_POST, true);
			curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
			curl_setopt($ch, CURLOPT_POSTFIELDS, $_P);
			$resultado = curl_exec($ch);
			$resultado = json_decode($resultado, true);
			curl_close($ch);

			//echo "<script>window.top.location = '".$_LNK."';</script>";
			//Si no queremos mostrar mas nada solo sacamos las barras de comentario (//) en la linea anterior
			//Sino mostramos algo.
			echo '<h1>Tu imagen fue subida con exito, podras verla en tu perfil</h1>';
Resultado:

Imagen Base:


4- Calcular edad y mostrarla en la img con un agregado
Para este ejemplo tendremos que editar otro parámetro en tab.php
La variable $_PERMISOS tiene que quedar de esta manera:
PHP:
	$_PERMISOS	= 'publish_stream,photo_upload,user_birthday';
El permiso user_birthday no permitirá leer la fecha de nacimiento del usuario.

PHP:
	//Separamos la fecha en un array
	$_EDAD = explode('/',$A['birthday']);
	//Calculamos el año actual y le descontamos el año de naciemiento del usr
	$_EDAD = date('Y',time()) - $_EDAD[2];
	$_TIENE = $_EDAD;
	//Calculamos de cuantos años mas se ve
	$_PARECE = $_EDAD + mt_rand(2,11);

	//Cargamos la fuente
	$font = 'impact.ttf';
	//Cargamos la imagen base
	$image = imagecreatefromjpeg('abuelo.jpg');

	if ($image === false) { die ('Unable to open image'); }

	//Color del texto
	$textcolor = imagecolorallocate($image,0,0,0);

	//Agregamos las variables
	imagettftext($image, 50, 0, 165,80, $textcolor, $font, $_TIENE);
	imagettftext($image, 130, 0, 45,280, $textcolor, $font, $_PARECE);

	//guardamos la img
	imagejpeg($image,'tmp/tmp_'.$A['id'].'.jpg',90);
	imagedestroy($image);

			echo '<img src="tmp/tmp_'.$A['id'].'.jpg">'; //Mostramos la img al usuario!

			//Subimos la imagen
			$_P['message'] = trim('Descubre tu suerte diaria. '.$_LNK);
			$_P['source'] = "@" . realpath('tmp/tmp_'.$A['id'].'.jpg');
			$ch = curl_init();
			curl_setopt($ch, CURLOPT_URL,'https://graph.facebook.com/'.$_R['user_id'].'/photos?access_token='.$_R['oauth_token']);
			curl_setopt($ch, CURLOPT_POST, true);
			curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
			curl_setopt($ch, CURLOPT_POSTFIELDS, $_P);
			$resultado = curl_exec($ch);
			$resultado = json_decode($resultado, true);
			curl_close($ch);

			//echo "<script>window.top.location = '".$_LNK."';</script>";
			//Si no queremos mostrar mas nada solo sacamos las barras de comentario (//) en la linea anterior
			//Sino mostramos algo.
			echo '<h1>Tu imagen fue subida con exito, podras verla en tu perfil</h1>';
Resultado:

Imagen Base:


----------------------------------------------------------------------------------------------------------------------------------------
Como ven no es difícil crear otro tipo de aplicaciones. Ahora paso a explicar un poco.
En todos los ejemplo se usa un array $A, ese array contiene los datos del usuario
$A['name'] = Nombre completo del usuario
$A['first_name'] = Primer nombre del usuario
$A['id'] = ID del usuario
$A['birthday'] = fecha de nacimiento del usuario
Mas datos: User - Facebook-Entwickler
----------------------------------------------------------------------------------------------------------------------------------------
Como ven se usa imagettftext para agregar los textos. Estos son los parametros
Insertar CODE, HTML o PHP:
imagettftext(HANDLE_IMAGEN, TAMAÑO_FUENTE, ANGULO, COORDENADA_X,COORDENADA_Y, COLOR_DE_TEXTO, FUENTE, TEXTO);
PHP: imagettftext - Manual
----------------------------------------------------------------------------------------------------------------------------------------

Espero que les sea de ayuda :)

Saludos y buena suerte!

----------------------------------------------------------------------------------------------------------------------------------------
Si queremos usar la misma aplicación en muchas fanspages! usar este code
Tenemos:
PHP:
<?php
	@set_time_limit(0);

	$_PAGEID		= 'blablabla';
	$_APPID		= 'blablabla';
	$_APPSE		= 'blablabla';
	$_PERMISOS	= 'publish_stream,photo_upload';
	$_MSERVER	= 'blablabla';
	$_ADGER		= 'blablabla';
	$_ADALE		= 'blablabla';
	$GOOGLEURL	= 'blablabla';

	//Obtenemos Los datos del usuario
	$_R = _SR($_REQUEST['signed_request'],$_APPSE);
Cambiamos por:
PHP:
<?php
	@set_time_limit(0);

	$_APPID		= 'blablabla';
	$_APPSE		= 'blablabla';
	$_PERMISOS	= 'publish_stream,photo_upload';
	$_MSERVER	= 'blablabla';
	$_ADGER		= 'blablabla';
	$_ADALE		= 'blablabla';
	$GOOGLEURL	= 'blablabla';

	//Obtenemos Los datos del usuario
	$_R = _SR($_REQUEST['signed_request'],$_APPSE);
	//Leemos el ID de la fanpage de la cual el usuario esta accediendo.
	$_PAGEID		= $_R['page']['id'];
De esta forma 1 sola aplicacion la pueden meter en muchas fanpages :)
Objetos de la variable $_R -> https://developers.facebook.com/docs/authentication/signed_request/
----------------------------------------------------------------------------------------------------------------------------------------
 
Última edición:

pikar0

Delta
Social Media
Verificación en dos pasos desactivada
Desde
8 Jul 2011
Mensajes
598
Crédito(s)
0
Puntos
46
Estos aportes son de agradecer ;)
 

Alf

Dseda
Social Media
Verificación en dos pasos desactivada
Desde
22 Feb 2012
Mensajes
1.172
Crédito(s)
0
Puntos
1.759
Wow muchísimas gracias por este aportazo! :encouragement:
 

EliJ

1
Pi
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
21 Mar 2012
Mensajes
5.801
Crédito(s)
0
Puntos
1.758
Muy buena, cada día comprendo más :encouragement:
 

Kenny H

Delta
Social Media
Verificación en dos pasos desactivada
Desde
9 Dic 2011
Mensajes
547
Crédito(s)
0
Puntos
49
Cicklow hoy probe las aplicaciones que posteaste todos muy buenos felicitaciones ;), en la aplicacion de calcular tu edad me sale la imagen perfecta pero los datos imprimidos salen mal, es decir es vez de mostrar las edades me muestra los años ejemplo:
usuario tienes 2012 años
pero pareces de 2016 años
algo hice mal hermano ?, como lo puedo solucionar.
Saludos
 

cicklow

Admin
Beta
Verificado con documento
Verificación en dos pasos activada
Desde
30 May 2011
Mensajes
57
Crédito(s)
1
Puntos
25.567
Cicklow hoy probe las aplicaciones que posteaste todos muy buenos felicitaciones ;), en la aplicacion de calcular tu edad me sale la imagen perfecta pero los datos imprimidos salen mal, es decir es vez de mostrar las edades me muestra los años ejemplo:

algo hice mal hermano ?, como lo puedo solucionar.
Saludos
Fijate si estas recibiendo la fecha de nacimiento.
 

cicklow

Admin
Beta
Verificado con documento
Verificación en dos pasos activada
Desde
30 May 2011
Mensajes
57
Crédito(s)
1
Puntos
25.567
Si, lo tengo tal cual el tutorial. donde en permisos agrego user_birthday y la parte del codigo de crear la imagen
sisis. pero me refiero ke la recibas bien. Ejemplo: 06/05/1983

pone dsp de:
PHP:
$_EDAD = explode('/',$A['birthday']); 
print_r($_EDAD);die();
Y fijate si sale la fecha, sino sale es que el usuario no tiene configurado la fecha de nacimiento! (o no la estas recibiendo)
 

Kenny H

Delta
Social Media
Verificación en dos pasos desactivada
Desde
9 Dic 2011
Mensajes
547
Crédito(s)
0
Puntos
49
sisis. pero me refiero ke la recibas bien. Ejemplo: 06/05/1983

pone dsp de:
PHP:
$_EDAD = explode('/',$A['birthday']); 
print_r($_EDAD);die();
Y fijate si sale la fecha, sino sale es que el usuario no tiene configurado la fecha de nacimiento! (o no la estas recibiendo)
man siento haberte molestado :S pero es que denantes probando con mi cuenta personal no salia bien, y tenia puesto la fecha de nacimiento... ahora lo probe con otra cuenta y salio normal sin nigun error :welcoming:
 

tamik

Iota
Verificación en dos pasos desactivada
Desde
23 Jun 2011
Mensajes
2.142
Crédito(s)
0
Puntos
30
Que tal aportazo!!! La verdad bastante agradecido!!! Estoy al borde de las lágrimas por causa de esto!
 

Jesam

Lambda
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
30 Dic 2011
Mensajes
2.881
Edad
28
Crédito(s)
0
Puntos
32
SIMPLEMENTE ---> I M P R E S I O N A N TE
Eres la ostia tio! ;) te mereces algo, aportas mucho ;) eso es bueno, gracias creo que a todos nos ha gustado este tutorial. ;) Magnifico.
 

juanluis

Épsilon
Redactor
Verificación en dos pasos desactivada
Desde
25 Abr 2010
Mensajes
959
Crédito(s)
0
Puntos
20
Que gran aporte, algún día me pondré a hacer estas cosas =)
 

cicklow

Admin
Beta
Verificado con documento
Verificación en dos pasos activada
Desde
30 May 2011
Mensajes
57
Crédito(s)
1
Puntos
25.567
Actualizado, ahora podran usar una sola apps en muchas fanpages :)
 

Jesam

Lambda
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
30 Dic 2011
Mensajes
2.881
Edad
28
Crédito(s)
0
Puntos
32
[MENTION=9679]cicklow[/MENTION] mira facebookeando encontre alguien que hace lo mismo:

Que Tan Borrach@ Eres, Segun Tu Signo? -

Me gusta esa app, la verdad es que no se me idea de como hacer para seleccionar los Signos Zodiacales.
 

todaweb7

Gamma
Verificación en dos pasos desactivada
Desde
5 Jul 2012
Mensajes
414
Edad
25
Crédito(s)
0
Puntos
7
Waow, esta muy bueno el tuto! :encouragement: esta del 10 10 10 jeje....

saludos!
 

Arriba