Creando un simple menu con jquery

Lunes, 1. Marzo 2010

Codigo html:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Menu</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<div id="menu">
<label id="opcion1">Opcion1</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<label id="opcion2">Opcion2</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<label id="opcion3">Opcion3</label>
</div>
<div id="desplegable1">
<a href="#">Enlace1</a>
<br />
<a href="#">Enlace2</a>
<br />
<a href="#">Enlace3</a>
<br />
<a href="#">Enlace4</a>
<br />
<a href="#">Enlace5</a>
<br />
<a href="#">Enlace6</a>
</div>
<div id="desplegable2">
<a href="#">Enlace7</a>
<br />
<a href="#">Enlace8</a>
<br />
<a href="#">Enlace9</a>
<br />
<a href="#">Enlace10</a>
<br />
<a href="#">Enlace11</a>
<br />
<a href="#">Enlace12</a>
</div>
<div id="desplegable3">
<a href="#">Enlace13</a>
<br />
<a href="#">Enlace14</a>
<br />
<a href="#">Enlace15</a>
<br />
<a href="#">Enlace16</a>
<br />
<a href="#">Enlace17</a>
<br />
<a href="#">Enlace18</a>
</div>
</body>
</html>

Codigo css:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
#menu {
    border: 1px solid #000000;
    text-align: center;
}
#desplegable1 {
    position: absolute;
    left: 407px;
    border: 1px solid #000000;
    }
#desplegable2 {
    position: absolute;
    left: 482px;
    border: 1px solid #000000;
    }
#desplegable3 {
    position: absolute;
    left: 560px;
    border: 1px solid #000000;
}
a {
    text-decoration: none;
    color: #00CCFF;
}

Codigo js:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
$(document).ready(function() {
$("#opcion1").mouseover(dentro);
$("#opcion1").mouseout(fuera);
$("#opcion2").mouseover(dentro2);
$("#opcion2").mouseout(fuera2);
$("#opcion3").mouseover(dentro3);
$("#opcion3").mouseout(fuera3);
$("#desplegable1").css("display", "none");
$("#desplegable2").css("display", "none");
$("#desplegable3").css("display", "none");
function dentro() {
$("#desplegable1").css("display", "inline");
$("#desplegable1").mouseover(dentro_submenu);
}
function fuera() {
$("#desplegable1").css("display", "none");
$("#desplegable1").mouseout(fuera_submenu);
}
function dentro2() {
$("#desplegable2").css("display", "inline");
$("#desplegable2").mouseover(dentro_submenu2);
}
function fuera2() {
$("#desplegable2").css("display", "none");
$("#desplegable2").mouseout(fuera_submenu2);
}
function dentro3() {
$("#desplegable3").css("display", "inline");
$("#desplegable3").mouseover(dentro_submenu3);
}
function fuera3() {
$("#desplegable3").css("display", "none");
$("#desplegable3").mouseout(fuera_submenu3);
}
function dentro_submenu() {
$("#desplegable1").css("display", "inline");
}
function fuera_submenu() {
$("#desplegable1").css("display", "none");
}
function dentro_submenu2() {
$("#desplegable2").css("display", "inline");
}
function fuera_submenu2() {
$("#desplegable2").css("display", "none");
}
function dentro_submenu3() {
$("#desplegable3").css("display", "inline");
}
function fuera_submenu3() {
$("#desplegable3").css("display", "none");
}
}
);

Clase para crear formularios – FormBox 0.1

Jueves, 21. Enero 2010

Jodiendo un rato con poo en php codee una simple clase

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<?php
class form
{
    private $action;
    private $method;
    private $size;
    private $maxlength;
    private $id;
    private $src;
    private $elements;
    private $name;
    private $value;
    private $text;
    public function __construct($action, $method)
    {
        $this->action = $action;
        $this->method = $method;
    }
    public function openform()
    {
        echo "<form action=\"" . $this->action . "\" method=\"" . $this->method . "\"> \n";
    }
    public function field_text($id, $size, $maxlength)
    {
        $this->id = $id;
        $this->size = $size;
        $this->maxlength = $maxlength;
        echo "<input type=\"text\" id=\"" . $this->id . "\" size=\"" . $this->size . "\" maxlength=\"" .
            $this->maxlength . "\"> \n";
    }
    public function field_password($id, $size, $maxlength)
    {
        $this->id = $id;
        $this->size = $size;
        $this->maxlength = $maxlength;
        echo "<input type=\"password\" id=\"" . $this->id . "\" size=\"" . $this->size .
            "\" maxlength=\"" . $this->maxlength . "\"> \n";
    }
    public function select($elements = array(), $name)
    {
        $this->name = $name;
        $this->elements = $elements;
        echo "<select name=\"" . $this->name . "\"> \n";
        foreach ($this->elements as $single) {
            echo "<option name=\"" . $single . "\" value=\"" . $single . "\">" . $single .
                "</option> \n";
        }
        echo "</select>";
    }
    public function field_image($src)
    {
        $this->src = $src;
        echo "<input type=\"image\" src=\"" . $this->src . "\">";
    }
    public function field_button($name, $value)
    {
        $this->name = $name;
        $this->value = $value;
        echo "<input type=\"button\" name=\"" . $this->name . "\" value=\"" . $this->
            value . "\"> \n";
    }
    public function checkbox($name, $value, $text)
    {
        $this->name = $name;
        $this->value = $value;
        $this->text = $text;
        echo "<lebel><input type=\"checkbox\" name=\"" . $this->name . "\" value=\"" . $this->
            value . "\"> " . $this->text . "</label> \n";
    }
    public function closeform()
    {
        echo "</form> \n";
    }
}
?>

Implementando reCAPTCHA

Lunes, 4. Enero 2010

Para poder usar recaptcha necesitamos registrarnos para que nos prooporcionen una public key y una private key nos damos de alta aqui

Despues de tener las keys debemos de descargar la libreria de aqui

la incluimos en nuestro documento

1
2
3
<?php
require_once("recaptchalib.php");
?>

Debemos de utilizar la funcion “recaptcha_get_html()” para poder imprimirel captcha, en esta funcion consta de los siguientes parametrso: $publickey (proporcionada al registro), is_valid (verifica si el captcha es correcto), erro (muestra un error si no es correcto), quedaria de la siguiente manera:

1
2
3
4
<?php
$captcha = recaptcha_get_html($publickey);
echo $captcha;
?>

Para poder validar nuestro captcha haremos uso de la funcion “recaptcha_check_answer()” que es donde usaremos nuestra private key, esta funcion requiere de los siguientes parametros: $privatekey (porporcionada al registro), $remoteip (la ip remota), $challenge (un campo del captcha) y $response (un campo oculto del captcha), esta funcion quedaria de la siguiente manera:

1
2
3
4
5
6
<?php
$check = recaptcha_check_answer($privatekey,
$remoteip = $_SERVER['REMOTE_ADDR'],
$challenge = $_POST['recaptcha_challenge_field'],
$response = $_POST['recaptcha_response_field']);
?>

La validacion quedaria asi:

1
2
3
4
5
6
7
<?php
if($check->is_valid) {
echo "Captcha is correct";
} else {
echo $check->error;
}
?>

El documento completo seria asi:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>reCAPTCHA</title>
</head>
<body>
<form action="" method="POST">
<?php
  require_once("recaptchalib.php");
  function recaptcha($publickey)
  {
      $captcha = recaptcha_get_html($publickey);
      echo $captcha;
  }
  recaptcha("Tu public key");
  function check($privatekey)
  {
      $error = "FALSE";
      $check = recaptcha_check_answer($privatekey, $remoteip = $_SERVER['REMOTE_ADDR'], $challenge = $_POST['recaptcha_challenge_field'], $response = $_POST['recaptcha_response_field']);
      if ($check->is_valid) {
          echo "Captcha is correct";
      } else {
          echo $check->error;
      }
  }
?>
<input type="submit" name="verify" value="Verify" />
</form>
<?php
  if ($_POST['verify']) {
      check("Tu private key");
  }
?>
</body>
</html>

Jugado con la Api de Twitter

Lunes, 4. Enero 2010

Sin nada que hacer andaba viendo un rato twitter.

Para hacer conectarnos al servidor vamos a usar cURL:

1
2
3
4
5
6
7
8
9
<?php
 $connect = curl_init();
      curl_setopt($connect, CURLOPT_URL, $url);
      curl_setopt($connect, CURLOPT_VERBOSE, 0);
      curl_setopt($connect, CURLOPT_RETURNTRANSFER, 1);
      curl_setopt($connect, CURLOPT_USERPWD, "$user:$pass");
      curl_setopt($connect, CURLOPT_CONNECTTIMEOUT, 5);
      $show = curl_exec($connect);
?>

Despues de esto Twitter nos presta varios metodos para poder mostrar: friends, followers, twetts, timeline, etc.

http://twitter.com/statuses/friends.xml

http://twitter.com/statuses/followers.xml

http://twitter.com/statuses/public_timeline.xml

La funcion completa seria esta:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
  function connect2twitter($url, $user, $pass)
  {
      $connect = curl_init();
      curl_setopt($connect, CURLOPT_URL, $url);
      curl_setopt($connect, CURLOPT_VERBOSE, 0);
      curl_setopt($connect, CURLOPT_RETURNTRANSFER, 1);
      curl_setopt($connect, CURLOPT_USERPWD, "$user:$pass");
      curl_setopt($connect, CURLOPT_CONNECTTIMEOUT, 5);
      $show = curl_exec($connect);
      if ($show) {
          echo $show;
      }
  }
  connect2twitter("http://twitter.com/statuses/friends_timeline.xml", "tuuser", "tupass");
?>

Actualizacion Visits 1.1

Sábado, 21. Noviembre 2009

Actualizada a la version 1.1 el plugin visits =)

Screen:
screen

Descarga desde WP

http://wordpress.org/extend/plugins/visits/