tag:blogger.com,1999:blog-66337680117305234972024-03-13T11:22:55.425-07:00Programación WebBlog de las actividades de Roberto Carlos Martinez Moreno
del semestre Ago-Dic 2010 de la Dra. Elisa Schaeffer.RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.comBlogger8125tag:blogger.com,1999:blog-6633768011730523497.post-46198811192860267632010-11-17T22:45:00.000-08:002010-12-03T10:05:06.714-08:00Proyecto Final: Presentación<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">Hola compañeros! En mi proyecto final decidí hacerlo en python en Google Apps (aunque también cree una liga para entrar por medio de facebook).</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtjnERrnd4xdzIGlf2rjgUUjPXbwvLcW7duYJKvBaxO44YFS2-HYJq9YGV5WB5V6e7W_88HdTrqM4_RjTc9OwUN_SXJhoK-wJdbtdjpKs_74g8rF-zAhVKR1J2sGflhAqmunYHmyw6F2o/s1600/Captura+de+pantalla+2010-11-18+a+las+00.23.47.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtjnERrnd4xdzIGlf2rjgUUjPXbwvLcW7duYJKvBaxO44YFS2-HYJq9YGV5WB5V6e7W_88HdTrqM4_RjTc9OwUN_SXJhoK-wJdbtdjpKs_74g8rF-zAhVKR1J2sGflhAqmunYHmyw6F2o/s640/Captura+de+pantalla+2010-11-18+a+las+00.23.47.png" width="448" /></a></div><br />
<br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">Se trata de una pagina de administración de tareas en donde al ingresar con tu cuenta de google puedes crear una pequeña lista de tareas agregando emoticones, todo esto en </span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">la nube, ya que puedes acceder a la lista en tu computadora de tu casa, o en las de la escuela incluso también en un celular, siempre y cuando tengas Internet.</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">Al principio podemos ver un cuadro de texto en donde escribimos la tarea, después al dar guardar, ya hemos creado nuestra lista, para borrar simplemente le das a la x que viene de lado de tu tarea. </span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">implementación en código.</span><br />
<br />
Main.py<br />
<pre class="brush: python" name="code">#!/usr/bin/env python
import os
import cgi
from google.appengine.api import users
from google.appengine.ext import webapp
from google.appengine.ext.webapp import util
from google.appengine.ext.webapp import template
from google.appengine.ext import db
import facebook
from facebook import FacebookError
_FbApiKey = '*****'
_FbSecret = '*****'
class Tareita(db.Model):
autor = db.UserProperty()
escrito=db.StringProperty()
termina = db.BooleanProperty()
class Principal(webapp.RequestHandler):
def get(self):
user = users.get_current_user()
nickname = user.nickname()
url = users.create_logout_url(self.request.uri)
url_linktext = 'Salir'
tareitas = Tareita.all()
tareitas.filter("autor =", users.get_current_user())
template_values = {'nickname': nickname, 'tareitas': tareitas,'url': url, 'url_linktext': url_linktext,}
path = os.path.join(os.path.dirname(__file__), 'index.html')
self.response.out.write(template.render(path, template_values))
def post(self):
self.response.out.write(self.request.get("escrito"));
tareita = Tareita()
tareita.autor = users.get_current_user()
tareita.escrito = self.request.get("escrito")
tareita.termina = False
tareita.put()
self.redirect('/')
class borra(webapp.RequestHandler):
def get(self):
recoge=cgi.escape(self.request.get('escrito'))
tareita=db.GqlQuery("select * from Tareita where escrito=:1",recoge)
usu=tareita.fetch(1)
if len(usu)>0:
usu[0].delete()
self.redirect("/")
def main():
application = webapp.WSGIApplication([('/', Principal),
('/borra', borra),],
debug=True)
util.run_wsgi_app(application)
if __name__ == '__main__':
main()
</pre><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">El codigo de python lo que hace es almacenar los datos que se ingrese en una clase de base de datos Tareita, los muestra, los borra segun sea el caso, el self.redirect('/') hace que no tengamos que abrir otra ventana si no que en una misma podamos borrar y crear nuevas tareas, se agrega un path que manda a escribir los datos que se pidan en el html estatico que esta mas abajo.</span><br />
<br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">app.yaml</span><br />
<blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>----------------------------------</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>application: robertohelloworld</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>version: 1</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>runtime: python</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>api_version: 1</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b><br />
</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>handlers:</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>- url: /stylesheets</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>static_dir: stylesheets</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b><br />
</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>- url: .*</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>script: main.py</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>login: required</b></span></blockquote><blockquote><span class="Apple-style-span" style="font-family: 'Courier New', Courier, monospace;"><b>---------------------------------</b></span>--</blockquote><span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">Este archivo que se necesita, simplemente ponemos el script que necesitamos y en donde se va a ejecutar en este caso siempre va a ser en index, le puse que se requiera el acceso por medio de la cuenta de google para así poder filtrar mediante el código python, las tareas que sean solamente del usuario y el mismo las vea, nadie mas</span>.<br />
<br />
<pre class="brush: xml" name="code"><html>
<head>
<link type="text/css" rel="stylesheet" href="/stylesheets/main.css" />
</head>
<body>
<div id="reco">
<h1>Administraci&oacute;n de tareas</h1>
</div><br><br>
<h2>Hola!, {{nickname}}</h2>
<div id="forma"><br>
Escribe tu nueva tarea:<br><br>
<input type="submit" value=" &#9734; " id="pica"/>
<input type="submit" value=" &#9825; " id="pica1"/>
<input type="submit" value=" &#9786; " id="pica2"/>
<input type="submit" value=" &#9787; " id="pica3"/>
<input type="submit" value=" &#9998; " id="pica4"/>
<input type="submit" value=" &#9836; " id="pica5"/><br><br>
<input type="submit" value=" &#10083;·•&#9679; &#10168; " id="pica6"/>
<input type="submit" value=" &#9472;&#9552;&#9734; &#9734;&#9552;&#9472; " id="pica7"/>
<input type="submit" value=" &#9679;&#65087;&#9679; " id="pica8"/>
<input type="submit" value=" &#9679;&#65103;&#9679; " id="pica10"/>
<input type="submit" value=" &#9584;&#9734;&#9582; " id="pica9"/><br><br>
<form action="" method="post">
<input type="text" name="escrito" maxlength="45" id="escri"/><br><br>
<input type="submit" value="Guardar"/>
</form>
<script>
var ta=document.getElementById("escri");
document.getElementById("pica").onclick=function() {
ta.value+='&#9734;';
}
var ta=document.getElementById("escri");
document.getElementById("pica1").onclick=function() {
ta.value+='&#9825;';
}
var ta=document.getElementById("escri");
document.getElementById("pica2").onclick=function() {
ta.value+='&#9786;';
}
var ta=document.getElementById("escri");
document.getElementById("pica3").onclick=function() {
ta.value+='&#9787;';
}
var ta=document.getElementById("escri");
document.getElementById("pica4").onclick=function() {
ta.value+='&#9998;';
}
var ta=document.getElementById("escri");
document.getElementById("pica5").onclick=function() {
ta.value+='&#9836;';
}
var ta=document.getElementById("escri");
document.getElementById("pica6").onclick=function() {
ta.value+='&#10083;·•&#9679; &#10168;';
}
var ta=document.getElementById("escri");
document.getElementById("pica7").onclick=function() {
ta.value+='&#9472;&#9552;&#9734;&#9734;&#9552;&#9472;';
}
var ta=document.getElementById("escri");
document.getElementById("pica8").onclick=function() {
ta.value+='&#9679;&#65087;&#9679;';
}
var ta=document.getElementById("escri");
document.getElementById("pica9").onclick=function() {
ta.value+='&#9584;&#9734;&#9582;';
}
var ta=document.getElementById("escri");
document.getElementById("pica10").onclick=function() {
ta.value+='&#9679;&#65103;&#9679;';
}
</script>
</div><br><br><br>
<h3>Lista de tareas:</h3><br>
<div id="inst"><br><br>
{% for tareita in tareitas %}
<a href="borra?escrito={{ tareita.escrito }}">×</a> {{ tareita.escrito }}<br><br>
{% endfor %}
<br><br>
</div>
<br><br><br>
<div id="adv"><br>
<a href="{{ url }}">{{ url_linktext }}</a> <br><br>
</div>
</body>
</html>
</pre><span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">En el </span>index<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">.html le agregué un varios </span>scripts<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"> que son los que hacen que se pueda poner los </span>emoticones<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"> en la caja de texto, también se utiliza un </span>for<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"> para listar todas las </span>tareitas<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"> que se escriben con una x que es la que manda a llamar a la clase borra para realizar dicha acción.</span><br />
<br />
<br />
<pre class="brush: css" name="code">body {
font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
background-image: url(lateral.jpg);
background-attachment: fixed;
background-repeat: repeat;
text-align: justify;
background-color: #DDDDDD;
}
#forma {
color: black;
padding: 0px;
margin-right: 25px;
margin-left: 25px;
text-align: center;
background-color: #F7BE81;
opacity: 0.9;
border: 12px solid #fff;
position: center;
}
h1 {
color:#81F7F3;
text-align: center;
}
h2 {
color:#CEF6CE;
text-align: center;
}
h3 {
color:#CEF6CE;
text-align: center;
}
#adv {
color: white;
text-align: center;
margin-right: 250px;
margin-left: 250px;
background-color: #C0690C;
background-repeat: no-repeat;
opacity: 0.9;
border: 12px solid #fff;
position: center;
}
#barra{
width:auto;
padding-top: 0px;
height:115px;
background:url(bannernew.jpg) left top repeat-x;
padding-top: 0em;
border: 0;
margin: 0;
}
#inst {
color: white;
text-align: center;
background-color: #088A85;
background-repeat: no-repeat;
margin-right: 100px;
margin-left: 100px;
position: center;
opacity: 0.9;
border: 12px solid #fff;
}
#reco {
color: white;
text-align: center;
background-color: #3B240B;
background-repeat: no-repeat;
opacity: 0.9;
border: 12px solid #3B240B;
position: center;
}
#cuestion {
color: #fff;
padding: 40px;
margin-right: 120px;
margin-left: 120px;
#text-align: center;
background-color: #3B240B;
opacity: 0.9;
border: 12px solid #FFF;
position: center;
}
</pre><span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">El CSS es el mismo de mi proyecto anterior ;) solamente que ahora el fondo corté un pedazo y que se repitiera la imagen para optimizar</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">Espero que la aplicación sea de su agrado, para finalizar les dejo las ligas a mi proyecto.</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><a href="http://robertohelloworld.appspot.com/">http://robertohelloworld.appspot.com/</a> directamente en Google Apps</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><a href="http://apps.facebook.com/tareitas/">http://apps.facebook.com/tareitas/</a></span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: 'Trebuchet MS', sans-serif;">Para descargar todos los archivos de la aplicación y lo corras en tu servidor da clic <a href="https://docs.google.com/leaf?id=0B2FcYRK2GWTYOGEzNTBmZTktN2NkZS00ZDFlLWIzZTEtNTRmZWUwNjlmMmI1&hl=en">aqui</a></span>RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com10tag:blogger.com,1999:blog-6633768011730523497.post-61087823049631305882010-11-11T06:38:00.000-08:002010-11-11T06:38:41.457-08:00Caso de estudio: Usabilidad Web<div style="text-align: justify;">SIASE UANL</div><div style="text-align: justify;"></div><div style="text-align: justify;"><b>Visibilidad del estatus del sistema</b></div><div style="text-align: justify;">No muestra el mapa del sitio, es decir si estamos en alguna apartado de la página no dice de que pestaña viene.</div><div style="text-align: justify;">Por ejemplo en esta página, para acceder al recibo del alumno seguimos los siguientes pasos Principal>Servicios en linea>Siase>Entra>Escuela>Aviso de pago, y no muestra la ubicación después de entrar al SIASE:</div><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1eVG9rG3jQrw_Egqg0h1idkBPKNG0LG5AWSjKss9nO3byU07247VJlS2oiZqoqwhxNYaENboqv9vL_ryfkwJssG7mMjq95AaNkffsQS_iwfbt0D5qlFGyiTDAFhIOtdNka1eB7BF0tYQ/s1600/visibilidad.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5538297943128270994" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1eVG9rG3jQrw_Egqg0h1idkBPKNG0LG5AWSjKss9nO3byU07247VJlS2oiZqoqwhxNYaENboqv9vL_ryfkwJssG7mMjq95AaNkffsQS_iwfbt0D5qlFGyiTDAFhIOtdNka1eB7BF0tYQ/s400/visibilidad.png" style="cursor: pointer; display: block; height: 224px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<br />
<div style="text-align: justify;"><b>Control y libertad del sistema</b></div><div style="text-align: justify;">Por ejemplo cuando ingresamos al sistema, ingresas a una carrera y no puedes regresar a la página donde te muestra el historial en la universidad, si no que tienes que salir del sistema y volver a entrar.</div><div style="text-align: justify;"></div><b><div style="text-align: justify;"><span class="Apple-style-span" style="font-weight: normal;"><b>Flexibilidad y eficiencia de uso</b></span></div></b><br />
<div style="text-align: justify;">En la página principal de la universidad deberia de venir muy visible los apartados más visitados por los usuarios sin embargo algunas cosas se dificultan para encontrar como el SIASE.</div><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm_LGIVm9oMjg7Sqysp1oCvHaamucwuJzifzl4PTojW5650xiSlNwLYTnY0KERadF7KEDbP4Lj0oeT5p3jXnDURzbJc0bqQ907dKpW9NkSa_39hvde3HnixA7uLnSPwh9iqryzs4PNipI/s1600/DOS.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5538297942355312482" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm_LGIVm9oMjg7Sqysp1oCvHaamucwuJzifzl4PTojW5650xiSlNwLYTnY0KERadF7KEDbP4Lj0oeT5p3jXnDURzbJc0bqQ907dKpW9NkSa_39hvde3HnixA7uLnSPwh9iqryzs4PNipI/s400/DOS.png" style="cursor: pointer; display: block; height: 273px; margin: 0px auto 10px; text-align: center; width: 400px;" /></a><br />
<br />
<div style="text-align: justify;"><b>Información necesaria</b></div><div style="text-align: justify;">En la página del SIASE hay algunas opciones en las que podemos entrar, y ahora para nosotros no tienen ninguna utilidad, por ejemplo, esta activa la opcion de Servicio Social para alumnos de primer, segundo hasta cuarto semestre cuando el semestre válido para hacer eso es apartir de quinto, también aparece el formato de entrega de credencial cuando eso paso hace un año, encuestas Dell a además el menu esta lleno de opciones parecidas que se podrian agrupar, por ejemplo kardex y calificaciones, avisos de pago y cuota escolar de rectoria.</div><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjthBGXYMVCEf0g_O8o87qAIsPCVHzU6Z8BhhxPQLAPBtgOuidwvQqFaActbvEr4VKSjPjakxI5GuxjlbHWLTyUxyWRI-4JWXt10osJu71dmy5NRJ5JZhPmLM6ZbD6YpN-VpeGJNWD7xdI/s1600/tres.png" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5538297947718464098" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjthBGXYMVCEf0g_O8o87qAIsPCVHzU6Z8BhhxPQLAPBtgOuidwvQqFaActbvEr4VKSjPjakxI5GuxjlbHWLTyUxyWRI-4JWXt10osJu71dmy5NRJ5JZhPmLM6ZbD6YpN-VpeGJNWD7xdI/s400/tres.png" style="cursor: pointer; display: block; height: 339px; margin: 0px auto 10px; text-align: center; width: 189px;" /></a><br />
<br />
<div style="text-align: justify;"><b>Ayudar a los usuarios a reconocer errores</b></div><div style="text-align: justify;">No cuenta con esta caracteristica la página ya que aveces hay una ventana que muestra un error con un boton de aceptar, aceptas y luego vuelve a salir la ventana, asi hasta que mejor se tiene que cerrar el navegador.</div><div style="text-align: justify;"></div><b><div style="text-align: justify;"><span class="Apple-style-span" style="font-weight: normal;"><b>Ayuda y documentación</b></span></div></b><br />
<div style="text-align: justify;">Deberian agregar una opción de ayuda con documentación adecuada sobre todo para los alumnos de nuevo ingreso, además le falta un cuadro de texto para que el alumno pueda sugerir mejoras, hacer comentarios, quejas, etc.</div><div></div><div>Esta es la lista de reglas que calificamos en la página:</div><div><a href="http://www.useit.com/papers/heuristic/heuristic_list.html">http://www.useit.com/papers/heuristic/heuristic_list.html</a></div><div></div><div>Blogs de mis compañeros:</div><div><a href="http://cecilia-urbina.blogspot.com/">Sandra Cecilia Urbina Coronado</a></div><div><a href="http://jcecprogweb.blogspot.com/">Juan Carlos Espinosa Ceniseros </a></div>RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com2tag:blogger.com,1999:blog-6633768011730523497.post-37719995603724884582010-10-13T21:39:00.000-07:002010-10-13T21:45:31.867-07:00Proyecto de Medio CursoAquí les dejo el video de mi proyecto en donde explico lo que hace y como funciona.<br />
<div class="separator" style="clear: both; text-align: center;"></div><br />
<object height="306" width="500"><param name="movie" value="http://www.youtube.com/v/Ocm4lrUTYvE?fs=1&hl=es_ES&color1=0x006699&color2=0x54abd6"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Ocm4lrUTYvE?fs=1&hl=es_ES&color1=0x006699&color2=0x54abd6" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="500" height="306"></embed></object><br />
<br />
<br />
Para ver el video haz clic <a href="http://www.youtube.com/watch?v=Ocm4lrUTYvE">aqui</a>.<br />
Para descargar los archivos de mi proyecto has clic <a href="https://docs.google.com/leaf?id=0B2FcYRK2GWTYMzBhNzU1MzItOTEwNy00YWZiLWI1MmEtOTIwMzI3ODJlZTY0&sort=name&layout=list&num=50">aqui</a>. (estan en .zip)RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com1tag:blogger.com,1999:blog-6633768011730523497.post-70876146935617945842010-09-05T21:03:00.000-07:002010-09-05T21:03:41.263-07:00Servidor web<div style="font-family: Arial,Helvetica,sans-serif;">Hola, es esta entrada publicaré acerca de los servidores web.</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;"><b>¿Que es un servidor web?</b></div><div style="font-family: Arial,Helvetica,sans-serif;">Podemos decir que un servidor web es un programa que se esta ejecutando esperando peticiones que le hace un cliente usuario de internet, entonces, el servidor web contesta todas esas peticiones entregando información de una pagina web, hipertextos, figuras, botones etc... implementando el protocolo HTTP, lo podemos encontrar en la capa de aplicación del <a href="http://pw-roberto.blogspot.com/2010/08/en-esta-entrada-publicare-acerca-del.html">modelo OSI</a>.</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div class="separator" style="clear: both; font-family: Arial,Helvetica,sans-serif; text-align: center;"><a href="http://tice.wikispaces.com/file/view/internet.JPG/32109833/internet.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="188" src="http://tice.wikispaces.com/file/view/internet.JPG/32109833/internet.JPG" width="320" /></a></div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;">Cabe recalcar que la palabra servidor se le llama al programa como a la maquina que ejecuta este programa.</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;">Por ejemplo el navegador hace una petición al servidor y este le contesta con lo que se le pidió esto es como cuando nosotros ingresamos a la pagina de la universidad, ponemos <i>www.uanl.mx</i> en el navegador y el servidor nos manda a esa dirección con código HTML, que se interpreta y lo vemos en nuestra pantalla.</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
Entre algunos servidores podemos encontrar a Apache, que es uno de los mas utilizados, con gran reputación de estabilidad ya que es personalizable, permite hacer un servidor según nuestras necesidades implementando lo mas nuevo en protocolos, hecho en lenguaje C, corre rápido consumiendo menos recursos que otros y puede utilizarse en múltiplos sistemas operativos.</div><div style="font-family: Arial,Helvetica,sans-serif;"> </div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;">Puedes descargar el código de Apache (que se encuentra en su<a href="http://httpd.apache.org/"> sitio web</a>) ya que es open-source.</div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><span style="font-family: Arial,Helvetica,sans-serif; font-size: small;"><span>Espero que mi explicación les sirva, si tienen algún comentario acerca de esta entrada, espero me digan ya que estoy abierto a cualquier error.</span></span>RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com1tag:blogger.com,1999:blog-6633768011730523497.post-89714569960577079582010-09-05T18:23:00.000-07:002010-09-05T21:08:27.830-07:00Sistema RBG hexadecimal<div style="color: black;">En esta entrada publicaré acerca del sistema RGB (<span style="color: red;">Red</span> <span style="color: lime;">Green</span> <span style="color: blue;">Blue</span>) hexadecimal el cual es el metodo que mas se utiliza para indicar colores en un sitio web.</div><div style="color: black;"><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzjrMJxGK2A1hO7-sFUNeiXgtBbkEDvOFuaIyQEn-aN8wlslKqA3C4q3GqF1gidDKTKxi12jXED1dERQEVsIVdqf2NwB-rLQ9HFwgh1q4HCwoo4IHRSxHrtz8rSinOOFAFVDr0t05eG0Q/s1600/naturaleza_3.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzjrMJxGK2A1hO7-sFUNeiXgtBbkEDvOFuaIyQEn-aN8wlslKqA3C4q3GqF1gidDKTKxi12jXED1dERQEVsIVdqf2NwB-rLQ9HFwgh1q4HCwoo4IHRSxHrtz8rSinOOFAFVDr0t05eG0Q/s320/naturaleza_3.gif" /></a></div><br />
<br />
</div><div style="color: black;">Como su nombre lo dice, este sistema utiliza los numeros base 16, o sea, hexadecimal esto quiere decir que, es un sistema alfanumerico ya que se utilizan: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F.</div><div style="color: black;"><br />
</div><div style="color: black;">Entonces, este sistema lo que hace es recoger 2 digitos hexadecimales para cada intensidad de colores primarios <span style="color: red;">Red </span><span style="color: lime;">Green</span> <span style="color: blue;">Blue</span> esto quiere decir entre 00 y FF entonces entre el valor mas alto, son mas claros los colores.<br />
<br />
por ejemplo:</div><div style="color: black;"><br />
</div><div style="color: black;"><span style="color: red;">Red</span> = 00 <span style="color: lime;">Green</span> = 00 <span style="color: blue;">Blue</span> = 00 esta a lo mas minimo entonces el color que obtendremos es el <b>negro</b></div><div style="color: black;"><br />
</div><div style="color: black;"><span style="color: red;">Red</span> = FF <span style="color: lime;">Green</span> = FF <span style="color: blue;">Blue</span> = FF esta en lo maximo entonces el color que obtendremos es el<b> blanco</b></div><div style="color: black;"><br />
</div><div style="color: black;"><span style="color: red;">Red </span>= FF <span style="color: lime;">Green</span> = 00 <span style="color: blue;">Blue</span> = 00 esta en lo maximo solamente en red por lo tanto es <b style="color: red;">rojo</b></div><div style="color: red;"><br />
</div><div style="color: black;"><span style="color: red;">Red </span>= 00 <span style="color: lime;">Green</span> = FF <span style="color: blue;">Blue</span> = 00 esta en lo maximo solamente en green por lo tanto es <b style="color: lime;">verde</b></div><div style="color: black;"><br />
</div><div style="color: black;"></div><div style="color: black;"><span style="color: red;">Red </span>= 00 <span style="color: lime;">Green</span> = 00 <span style="color: blue;">Blue </span>= FF esta en lo maximo solamente en blue por lo tanto es <b style="color: blue;">azul.</b></div><div style="color: black;"></div><div style="color: black;"><br />
</div><div style="color: black;"><span style="color: red;">Red</span> <span style="background-color: white;">= FF</span><span style="background-color: white;"> </span><span style="color: lime;">Green</span> = FF <span style="color: blue;">Blue</span> =00 rojo y verde es<b> <span style="color: yellow;">amarillo.</span></b></div><div style="color: black;"><br />
</div><div style="color: black;"><span style="color: red;">Red</span> = 00 <span style="color: lime;">Green </span>= FF <span style="color: blue;">Blue</span> = FF azul y verde es <b style="color: cyan;">cyan</b></div><div style="color: black;"><br />
</div><div style="color: black;"><span style="color: red;">Red </span>= FF <span style="color: yellow;"><span style="color: lime;">Green</span> </span>= 00 <span style="color: blue;">Blue</span> = FF rojo y azul es <b style="color: magenta;">magneta</b><br />
<br />
<br />
<span style="color: magenta;"><span style="color: black;">Entonces, cuando los declaramos en un archivo html con css, podemos utilizarlo algo asi.</span></span><br />
<br />
<pre><span style="color: magenta;"><span style="color: black;">body {</span></span>
<span style="color: magenta;"><span style="color: black;">background-color: #000000;</span></span> </pre><pre><span style="color: magenta;"><span style="color: black;">}</span></span></pre><pre><span style="color: magenta;"><span style="color: black;"> </span></span></pre><pre><span style="color: magenta;"><span style="color: black;">h1 { </span></span></pre><pre><span style="color: magenta;"><span style="color: black;">color #FFFFFF;</span></span>
<span style="color: magenta;"><span style="color: black;">} </span></span><b style="color: magenta;"> </b></pre><br />
<br />
Pero en el ejemplo anterior, css nos permite comprimir los valores si por ejemplo tenemos sus componentes iguales de dos en dos. esto es<br />
#000 o #FFF.<br />
<br />
Se pueden escribir con mayusculas o minusculas, pero es preferible escribirlos en mayusculas para tener una mejor presentación al entregar el codigo.<br />
<br />
Cabe recalcar que no es la unica forma de declarar los colores en css, existen cinco formas: por clave, color del sistema, el RGB numerico, porcentual y hexadecimal.<br />
<br />
Si quieren saber un poco mas les dejo este<a href="http://www.librosweb.es/css/capitulo3/colores.html"> link.</a><br />
<br />
Tambien les dejo <a href="http://www.webtaller.com/utilidades/csscoder/colores.php">una pagina</a> con la tabla de colores en hexadecimal.<br />
<br />
<span style="font-size: small;"><span style="font-family: inherit;">Espero que mi explicación les sirva, si tienen algún comentario acerca de esta entrada, espero me digan ya que estoy abierto a cualquier error.</span></span><br />
<br />
<br />
</div>RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com1tag:blogger.com,1999:blog-6633768011730523497.post-7111914814390733112010-08-18T20:46:00.000-07:002010-08-22T11:01:44.108-07:00Codigo java Casino<b>Hola!, en esta entrada publicaré un codigo en java de un juego de casino.</b><br />
<b> </b><br />
<br />
<pre class="brush: java" name="code">import java.util.*;
public class Casino {
public static final Random RNG = new Random();
public static void main(String[] args){
Scanner sc = new Scanner(System.in);
Scanner op = new Scanner(System.in);
int juego, puntos;
int tabla[][] = new int[3][3];
int opcion = 1;
int i, j;
System.out.println("Hola!, Bienvenido a al juego Ruina\n");
System.out.println("\t\tIngrese los puntos que desea apostar\n");
System.out.println("\t\tCada juego apostara 10 puntos de los que ingreso\n");
System.out.println("\t\tSi gana horizontal, vertical o diagonal usted\n");
System.out.println("\t\tva ganar 5 puntos, de lo contrario\n");
System.out.println("\t\tperdera 10 puntos\n");
System.out.println("\t\tSuerte!!!\n");
puntos = sc.nextInt();//lee los puntos o creditos
while(opcion != 0 && puntos > 9) { //si se quiere salir o ya no tiene suficientes puntos
puntos = puntos - 10;
for(i=0; i<3;i++) { //añade los valores random
for(j=0;j<3;j++) {
tabla[i][j]= 1 + Casino.RNG.nextInt(3);
}
}
for(i=0;i<3;i++){ //imprime en terminal la tabla
System.out.print("\t\t\t\t|---|---|---|\n");
System.out.print("\t\t\t\t");
for(j=0;j<3;j++){
System.out.print("| " + tabla[i][j]);
}
System.out.print("|\n");
}
System.out.print("\t\t\t\t|---|---|---|\n\n\n");
if(tabla[0][0]==tabla[1][0]&&tabla[1][0]==tabla[2][0]){ //verifica si gana o no
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[0][1]==tabla[1][1]&&tabla[1][1]==tabla[2][1]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[0][2]==tabla[1][2]&&tabla[1][2]==tabla[2][2]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[0][0]==tabla[0][1]&&tabla[0][1]==tabla[0][2]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[1][0]==tabla[1][1]&&tabla[1][1]==tabla[1][2]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[2][0]==tabla[2][1]&&tabla[2][1]==tabla[2][2]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[0][0]==tabla[1][1]&&tabla[1][1]==tabla[2][2]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(tabla[2][0]==tabla[1][1]&&tabla[1][1]==tabla[0][2]){
System.out.println("\t\tHaz ganado 5 puntos!\n");
puntos = puntos + 5;
}
if(puntos<=0){
System.out.println("Lo siento, ya no hay credito, Hasta luego!\n");
System.out.println("Teclea cero para salir\n");
}else {
System.out.println("\n\n\tLos puntos que llevas son ->" + puntos);
System.out.println("\n\n\nSi no deseas seguir jugando teclea 0 (cero), sino teclea 1(uno)");
opcion = op.nextInt();
}
}
}
}
</pre><br />
<a href="http://www.mediafire.com/?2645xpbv76dq1fw">Aqui </a>les dejo el enlace para descargarlo<br />
<br />
Les dejo una captura de imagen para que vean como funciona..<br />
<br />
<div class="separator" style="clear: both; text-align: center;"></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjknjR3KXG8TaW5RXBHzCEejTgnl0Df4ep1xKbk6tBJeVTU7V9AxKGpTAaDqYurzROLWQ1MgDvPEW9sTbvPr2uPREXaqgJbL8f9hDuLMIY4oNpiW6Gf8MFxCX5hJq0X129UtOsY1kVSdY0/s1600/Pantallazo-4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjknjR3KXG8TaW5RXBHzCEejTgnl0Df4ep1xKbk6tBJeVTU7V9AxKGpTAaDqYurzROLWQ1MgDvPEW9sTbvPr2uPREXaqgJbL8f9hDuLMIY4oNpiW6Gf8MFxCX5hJq0X129UtOsY1kVSdY0/s320/Pantallazo-4.png" /></a></div><span style="font-size: small;">Espero que mi explicación les sirva, si tienen algún comentario acerca de esta entrada, espero me digan ya que estoy abierto a cualquier error.</span><br />
<br />
<span style="font-size: small;">Roberto:) </span>RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com1tag:blogger.com,1999:blog-6633768011730523497.post-19421519848065665982010-08-18T16:39:00.000-07:002010-08-18T16:39:04.582-07:00Clase 12 de agoHola!, en esta entrada publicaré unos links el primero es del código de piedra papel o tijera en java que lo hicimos entre <a href="http://cecilia-urbina.blogspot.com/">Cecilia Urbina</a> y yo la clase pasada.<br />
<br />
<a href="http://www.mediafire.com/?w16h7q9yp2hnkfa">Piedra papel o tijera </a><br />
<br />
Y Este otro link, es un programa que imprime simplemente la serio fibo.<br />
<br />
<a href="http://www.mediafire.com/?hg87g9ykp6ozrvh">Serie fibo</a><br />
<br />
Esperamos que les sirva<br />
<br />
Roberto:)RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com1tag:blogger.com,1999:blog-6633768011730523497.post-48836452633587114842010-08-11T17:48:00.000-07:002010-08-11T18:15:52.250-07:00Modelo OSI<div class="separator" style="clear: both; text-align: center;"></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">En esta entrada publicaré acerca del modelo OSI, del cual no lo conocia y decidi informarme sobre lo que se trata.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;"><br />
</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">¿Que es un modelo OSI?</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Es el modelo de referencia de interconexión de sistemas abiertos, por sus siglas en ingles Open System Interconection, es el que admite que las computadoras se conecten e operen, fue hecho por la ISO que es la que se encarga de los estándares internacionales, para poner un orden entre las computadoras, al momento de trasmitir los datos.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Este modelo cuenta con 7 niveles o capas:</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="font-family: Arial,Helvetica,sans-serif; margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-size: small;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJd_F31wQghVbjYX6DQjwwRCAKSzpd_gwHHKrDH9SWAedULVNC1udHwSCd16b7STIAwVUO7dPZRaG5JeXY0ZrKlAh54_Z_RkGmnPwOppgsijWlpAEqjovdanvVv4yBKRGUxhmy1aCaStY/s1600/7capas.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJd_F31wQghVbjYX6DQjwwRCAKSzpd_gwHHKrDH9SWAedULVNC1udHwSCd16b7STIAwVUO7dPZRaG5JeXY0ZrKlAh54_Z_RkGmnPwOppgsijWlpAEqjovdanvVv4yBKRGUxhmy1aCaStY/s320/7capas.png" /></a></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: small;">Clic para agrandar</span></td></tr>
</tbody></table><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">En esta entrada, resumiré a lo que interviene cada capa.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa de aplicación</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Es la capa que esta mas próxima al usuario, la diferencia de esta capa es que, no da servicio a otro nivel, estas son aplicaciones de red que usamos para trasladar las aplicaciones del usuario, podemos decir algunos ejemplos como FTP, Mail o Telnet, entonces estos son los programas que nosotros vemos.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa de presentación</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Esta capa es la manera en que los datos se interpretan en una computadora, como sabemos es tratada de forma binaria, entonses en la capa presentación se hacen adaptaciones para que se presente de manera mas accesible y fácil, tenemos códigos como ASCII y EBCDIC, que procesa los datos, en esta capa también esta los OS como DOS y UNIX.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa de Sesión</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Es la capa encargada de crear servicios de conexiones, o sea, esto es como iniciar sesión por medio de un login para obtener recursos, administra la sesión, y la cerramos con un logout, por ejemplo tenemos NetBIOS, como protocolo de esta capa, también el RPC.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;"><br />
</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa de Transporte</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">En esta capa es en donde se asegura que cuando se entable una comunicación, sea buena y proteger todos los datos enviados, da aviso a las demás capas que es de calidad, utilizando controles de flujo, números de secuencia y reconocimientos, los protocolos TCP y UDP se encuentran en esta capa.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><br />
</div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa de red.</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">En esta capa su principal función es hacer que lleguen los datos, utilizando dispositivos llamados routers, que se encuentran en esta capa, al igual que los firewalls, entonces podemos decir que se trata de que aquí se le da dirección por medio de IP la ruta que debe seguir.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa de Datos.</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">En esta capa de datos también llamada frame, o marco, es en donde se transfiere la información en grupos de bits, creando paquetes, preparándolos en forma binaria con su protocolo que utilizan, solo se trata con direcciones MAC para el uso de LAN y HDLC o SDLC para WAN.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;"><br />
</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><b><span style="font-size: small;">Capa Físico</span></b></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Este nivel es donde se regula las propiedades físicas, mecánicas y eléctricas, se encuentran los reglamentos como RS-232 o V.24, así como los tipos de conexiones como Coaxial, RJ-45, entre otros, también están todos los medios de transmisión para redes LAN, STP, fibra óptica entre otros, podemos decir que esta capa trasmite la información sobre un medio físico.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">En esta imagen se resume en un ejemplo lo que es el modelo OSI.</span></div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="font-family: Arial,Helvetica,sans-serif; margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><span style="font-size: small;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWBnqMHAyVpHs1eWqvSjF-IaUPaRGUhF4ScRDvc9ijV2pYeGR3Dmwv7AvBWQWR38FhiuBX21g8COcekYuk4wvnBmVF1N9JwkfD6tXWYwHa3q_AprI0p_5V5N_IUgQB7WZo-fshObnDYLE/s1600/Transferencia_informacion_en_el_modelo_OSI.PNG" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWBnqMHAyVpHs1eWqvSjF-IaUPaRGUhF4ScRDvc9ijV2pYeGR3Dmwv7AvBWQWR38FhiuBX21g8COcekYuk4wvnBmVF1N9JwkfD6tXWYwHa3q_AprI0p_5V5N_IUgQB7WZo-fshObnDYLE/s320/Transferencia_informacion_en_el_modelo_OSI.PNG" /></a></span></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: small;">Clic para agrandar</span></td></tr>
</tbody></table><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Y para finalizar les pongo un par de vídeos que nos puso la maestra Laura del Bosque, que explica de forma animada como funciona la red.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><object height="385" width="480"><param name="movie" value="http://www.youtube.com/v/KXjupeVTQ30?fs=1&hl=es_MX&color1=0xe1600f&color2=0xfebd01"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/KXjupeVTQ30?fs=1&hl=es_MX&color1=0xe1600f&color2=0xfebd01" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object></span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><object height="385" width="480"><param name="movie" value="http://www.youtube.com/v/vBmeFGQ-JRM?fs=1&hl=es_MX&color1=0xe1600f&color2=0xfebd01"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/vBmeFGQ-JRM?fs=1&hl=es_MX&color1=0xe1600f&color2=0xfebd01" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object></span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Son un poco viejos pero están interesantes ;) </span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Espero que mi explicación les sirva, si tienen algún comentario acerca de esta entrada, espero me digan ya que estoy abierto a cualquier error.</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;"><br />
</span></div><div style="font-family: Arial,Helvetica,sans-serif;"><span style="font-size: small;">Roberto:)</span></div>RObertohttp://www.blogger.com/profile/11166188729582610562noreply@blogger.com1