Destaqueblog http://weblog.destaquenet.com Blog da equipe Destaquenet. Tue, 12 Jan 2010 13:32:31 +0000 http://wordpress.org/?v=2.9.1 en hourly 1 JSP e tag files: criando templates em 10 minutos http://weblog.destaquenet.com/2009/12/17/jsp-e-tag-files-criando-templates-em-10-minutos/ http://weblog.destaquenet.com/2009/12/17/jsp-e-tag-files-criando-templates-em-10-minutos/#comments Thu, 17 Dec 2009 12:30:41 +0000 Daniel Martins http://weblog.destaquenet.com/?p=801 Este mês têm sido bastante curioso pelo fato de três pessoas terem me feito a mesma pergunta: “- Você largou o Java de vez?”. A resposta é não, mas, para não deixar dúvidas, eu resolvi voltar a escrever sobre Java. O assunto foge um pouco do que costumo escrever, mas é algo que considero importante.

Ultimamente, tenho visto a forma como certos desenvolvedores escrevem seus JSPs, e o que me preocupou foi ver o quanto eles desconhecem a tecnologia. Não é raro achar páginas cheias de scriptlets, includes malucos, código du-tri-quadri-plicado e nenhuma taglib além da fornecida pelo framework web em uso.

É muito fácil escrever JSPs da forma errada, mas fazer as coisas de um jeito melhor é mais fácil ainda. Ao contrário do que muitos pensam, é possível sim criar JSPs limpos sem o uso de qualquer framework de layout (como Sitemesh) ou biblioteca (com exceção da JSTL, é claro).

Um exemplo

O primeiro passo é definir o template base para as páginas da aplicação. Considere o seguinte exemplo de XHTML e sua representação gráfica:

<!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">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <meta name="keywords"    content="keyword1, keyword2, keyword3" />
        <meta name="description" content="Page description" />
        <title>Page title</title>
 
        <!-- Essential scripts -->
        <link rel="stylesheet" type="text/css" href="css/style.css"/>
        <script type="text/javascript" src="js/query.js"></script>
 
        <!-- Extra header -->
        <script type="text/javascript" src="js/util.js"></script>
    </head>
    <body>
        <!-- Main -->
        <div id="wrapper">
            <div id="header"></div>
            <div id="content"></div>
            <div id="footer"></div>
        </div> <!-- Main -->
 
        <script type="text/javascript">
            // Other scripts (e.g. Google Analytics)
        </script>
    </body>
</html>
Representação gráfica do layout

Representação gráfica do layout

O que costuma acontecer, mesmo em um layout simples como esse, é o alto índice de duplicação de código entre as diferentes páginas, principalmente em função do uso de Copy and Paste Programming. Muitos desenvolvedores por aí escreveriam o seguinte JSP para representar o layout proposto:

<!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">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <meta name="keywords"    content="keyword1, keyword2, keyword3" />
        <meta name="description" content="Page description" />
        <title>Page title</title>
 
        <!-- Essential scripts -->
        <jsp:include page="scripts.jsp"/>
 
        <!-- Extra header -->
        <script type="text/javascript" src="js/util.js"></script>
    </head>
    <body>
        <!-- Main -->
        <div id="wrapper">
            <jsp:include file="header.jsp"/>
            <div id="content">Page content here</div>
            <jsp:include page="footer.jsp"/>
        </div> <!-- Main -->
 
        <script type="text/javascript">
            // Other scripts
        </script>
    </body>
</html>

Viu o problema? De nada adianta separar os pedaços com e continuar duplicando código. O ideal seria traduzir o layout em algo assim:

<%@ taglib tagdir="/WEB-INF/tags/layout" prefix="layout" %>
<layout:page title="Title" description="Page description" keywords="keyword1, keyword2, keyword3">
    <jsp:attribute name="extraHeader">
        <script type="text/javascript" src="js/util.js"></script>
    </jsp:attribute>
    <jsp:attribute name="extraBottom">
        // Other scripts (e.g. Google Analytics)
    </jsp:attribute>
    <jsp:body>
        Page content here
    </jsp:body>
</layout:page>

A boa notícia é que isso é possível, através de tag files.

Reúso de conteúdo com tag files

Existem pelo menos três formas de se criar custom tags em JSP, cada qual com seu propósito: classic tag handlers, simple tag handlers e tag files. Neste post tratarei somente das tag files, mas saber como e quando utilizar simple tag handlers também é extremamente recomendado a todos que usam JSP no dia-a-dia.

A primeira coisa a fazer é criar o diretório WEB-INF/tags/layout. É nesse diretório que as tag files referentes ao template devem ficar. Agora, crie dois arquivos neste diretório, um para o cabeçalho e outro para o rodapé:

header.tag

<%@ tag body-content="empty" description="Header tag file" %>
<div id="header">
    <!-- Header section here -->
</div>

footer.tag

<%@ tag body-content="empty" description="Footer tag file" %>
<div id="footer">
    <!-- Footer section here -->
</div>

Como podemos ver, as tag files são como JSPs, mas com algumas propriedades especiais.

A última tag file, page.tag, define o esqueleto das páginas da aplicação:

<%@ tag description="Page layout" %>
 
<%@ attribute name="title"       required="true" description="Page title" %>
<%@ attribute name="keywords"    required="true" description="Page keywords to improve SEO" %>
<%@ attribute name="description" required="true" description="Page description" %>
 
<%@ attribute name="extraHeader" fragment="true" description="Extra code to put before </head>" %>
<%@ attribute name="extraBottom" fragment="true" description="Extra code to put before </body>" %>
 
<%@ taglib tagdir="/WEB-INF/tags/layout" prefix="layout" %>
 
<!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">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
 
        <!-- Displaying the attributes using EL -->
        <meta name="keywords"    content="${keywords}" />
        <meta name="description" content="${description}" />
        <title>${title}</title>
 
        <!-- Essential scripts -->
        <link rel="stylesheet" type="text/css" href="css/style.css"/>
        <script type="text/javascript" src="js/query.js"></script>
 
        <!-- Process the given input fragment -->
        <jsp:invoke fragment="extraHeader"/>
    </head>
    <body>
        <!-- Main -->
        <div id="wrapper">
            <!-- Renders the page header -->
            <layout:header/>
 
            <!-- Renders the tag body inside a DIV -->
            <div id="content"><jsp:doBody/></div>
 
            <!-- Renders the page footer -->
            <layout:footer/>
        </div> <!-- Main -->
 
        <!-- Process the given input fragment -->
        <jsp:invoke fragment="extraBottom"/>
    </body>
</html>

Esta última tag file é mais complexa que as anteriores, pois recebe dados e blocos de código (através de fragments). Além disso, ela aceita um corpo, que é executado com <jsp:doBody/>.

O exemplo usado aqui é razoavelmente simples e, por isso, não precisamos apelar para outros recursos mais avançados como variables e dynamic attributes. De qualquer forma, procure conhecer bem a tecnologia, pois você nunca sabe quando um ou outro recurso lhe pode ser útil.

Exemplo de uso

Novamente, um exemplo de uso das tags que criamos:

<%@ taglib tagdir="/WEB-INF/tags/layout" prefix="layout" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<layout:page title="Index page" description="This is the index page of my amazing app" keywords="amazing, app">
    <jsp:attribute name="extraHeader">
        <script type="text/javascript" src="js/util.js"></script>
        <script type="text/javascript" src="js/some_jquery_plugin.js"></script>
    </jsp:attribute>
    <jsp:attribute name="extraBottom">
        $(function() {
            // Call some JQuery function here, specific for this page
        });
    </jsp:attribute>
    <jsp:body>
        Welcome to my amazing app!<br/>
        1+1 = ${1+1}
 
        <ul>
        <c:forEach items="${objects}" var="obj">
            <li>${obj.attr}</li>
        </c:forEach>
        </ul>
    </jsp:body>
</layout:page>

Embora a aplicação como um todo siga um mesmo padrão visual, cada página pode necessitar de recursos adicionais (JavaScript, CSS, etc). Isso não chega a ser um problema, pois nosso template contempla a inclusão de conteúdo extra, se necessário.

Outra vantagem é que as tag files permitem o uso de custom tags e unified EL, mas proíbem o uso de scriptlets, o que já é meio caminho andado rumo a um JSP mais limpo.

Leitura recomendada

]]> http://weblog.destaquenet.com/2009/12/17/jsp-e-tag-files-criando-templates-em-10-minutos/feed/ 0 Templates in 10 minutes with JSP and tag files http://weblog.destaquenet.com/2009/12/17/templates-in-10-minutes-with-jsp-and-tag-files/ http://weblog.destaquenet.com/2009/12/17/templates-in-10-minutes-with-jsp-and-tag-files/#comments Thu, 17 Dec 2009 12:30:06 +0000 Daniel Martins http://weblog.destaquenet.com/?p=822 Have you ever seen JSPs full of Aramaic-like scriptlets, crazy includes, duplicated code and no taglibs beyond that provided by the web framework in use? Are you staring at one right now?

This is a fairly common thing, at least for the companies I worked for so far, and that’s what scares me the most. Hopefully, you can easily make things better if you want to.

In this post, I’ll show you a few techniques that can be used to write clean JSPs without resorting to any kind of templating system whatsoever.

An example

The first step is to define the base template for the application pages. Consider the following XHTML example and its graphic representation:

<!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">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <meta name="keywords" content="keyword1, keyword2, keyword3" />
        <meta name="description" content="Page description" />
        <title>Page title</title>
 
        <!-- Essential scripts -->
        <link rel="stylesheet" type="text/css" href="css/style.css"/>
        <script type="text/javascript" src="js/query.js"></script>
 
        <!-- Extra header -->
        <script type="text/javascript" src="js/util.js"></script>
    </head>
    <body>
        <!-- Main -->
        <div id="wrapper">
            <div id="header"></div>
            <div id="content"></div>
            <div id="footer"></div>
        </div> <!-- Main -->
 
        <script type="text/javascript">
            // Other scripts (e.g. Google Analytics)
        </script>
    </body>
</html>
Template graphic representation

Template graphic representation

What usually happens, even with a simple template such as this, is a high level of code duplication among the different pages due to the heavy use of Copy and Paste Programming:

<!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">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <meta name="keywords"    content="keyword1, keyword2, keyword3" />
        <meta name="description" content="Page description" />
        <title>Page title</title>
 
        <!-- Essential scripts -->
        <jsp:include page="scripts.jsp"/>
 
        <!-- Extra header -->
        <script type="text/javascript" src="js/util.js"></script>
    </head>
    <body>
        <!-- Main -->
        <div id="wrapper">
            <jsp:include file="header.jsp"/>
            <div id="content">Page content here</div>
            <jsp:include page="footer.jsp"/>
        </div> <!-- Main -->
 
        <script type="text/javascript">
            // Other scripts
        </script>
    </body>
</html>

See? Why break the template into small pieces if you are going keep duplicating code anyway? The best thing to do is to translate that template into something like this:

<%@ taglib tagdir="/WEB-INF/tags/layout" prefix="layout" %>
<layout:page title="Title" description="Page description" keywords="keyword1, keyword2, keyword3">
    <jsp:attribute name="extraHeader">
        <script type="text/javascript" src="js/util.js"></script>
    </jsp:attribute>
    <jsp:attribute name="extraBottom">
        // Other scripts (e.g. Google Analytics)
    </jsp:attribute>
    <jsp:body>
        Page content here
    </jsp:body>
</layout:page>

Content reuse with tag files

There are three types of JSP tags, each with its own strengths and weaknesses: classic tag handlers, simple tag handlers and tag files. Today I’ll cover the basics of tag files, but every Java developer should learn when and how to use the other two.

The first thing we need to do is create the WEB-INF/tags/layout directory, which will keep the tag files we are about to create. Now, create two files inside this directory, one for the header and the other for the footer:

header.tag

<%@ tag body-content="empty" description="Header tag file" %>
<div id="header">
    <!-- Header section here -->
</div>

footer.tag

<%@ tag body-content="empty" description="Footer tag file" %>
<div id="footer">
    <!-- Footer section here -->
</div>

As we can see, tag files are just like JSPs, but with some special properties.

The last tag file, page.tag, defines the overall page structure:

<%@ tag description="Page layout" %>
 
<%@ attribute name="title"       required="true" description="Page title" %>
<%@ attribute name="keywords"    required="true" description="Page keywords to improve SEO" %>
<%@ attribute name="description" required="true" description="Page description" %>
 
<%@ attribute name="extraHeader" fragment="true" description="Extra code to put before </head>" %>
<%@ attribute name="extraBottom" fragment="true" description="Extra code to put before </body>" %>
 
<%@ taglib tagdir="/WEB-INF/tags/layout" prefix="layout" %>
 
<!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">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
 
        <!-- Displaying the attributes using EL -->
        <meta name="keywords"    content="${keywords}" />
        <meta name="description" content="${description}" />
        <title>${title}</title>
 
        <!-- Essential scripts -->
        <link rel="stylesheet" type="text/css" href="css/style.css"/>
        <script type="text/javascript" src="js/query.js"></script>
 
        <!-- Process the given input fragment -->
        <jsp:invoke fragment="extraHeader"/>
    </head>
    <body>
        <!-- Main -->
        <div id="wrapper">
            <!-- Renders the page header -->
            <layout:header/>
 
            <!-- Renders the tag body inside a DIV -->
            <div id="content"><jsp:doBody/></div>
 
            <!-- Renders the page footer -->
            <layout:footer/>
        </div> <!-- Main -->
 
        <!-- Process the given input fragment -->
        <jsp:invoke fragment="extraBottom"/>
    </body>
</html>

This last tag file is more complex than the other two, because you can pass to it both values and fragments. Besides, this tag accepts a body, which gets executed with <jsp:doBody/>.

Of course, the example shown here is fairly simple, so we didn’t have to use more advanced features like variables and dynamic attributes. Be that as it may, it’s a good idea to know what the technology has to offer. You’ll never know when a feature will be useful until you need it.

Usage

Now, let’s put those tag files to use:

<%@ taglib tagdir="/WEB-INF/tags/layout" prefix="layout" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<layout:page title="Index page" description="This is the index page of my amazing app" keywords="amazing, app">
    <jsp:attribute name="extraHeader">
        <script type="text/javascript" src="js/util.js"></script>
        <script type="text/javascript" src="js/some_jquery_plugin.js"></script>
    </jsp:attribute>
    <jsp:attribute name="extraBottom">
        $(function() {
            // Call some JQuery function here, specific for this page
        });
    </jsp:attribute>
    <jsp:body>
        Welcome to my amazing app!<br/>
        1+1 = ${1+1}
 
        <ul>
        <c:forEach items="${objects}" var="obj">
            <li>${obj.attr}</li>
        </c:forEach>
        </ul>
    </jsp:body>
</layout:page>

Although the application as a whole follow the same visual standard, each page may need additional resources (JavaScript, CSS, etc.). This is hardly a problem because our template allows us to include extra content if necessary.

The other advantage is that tag files allow the use of custom tags and unified EL, but deny the use of scriptlets, which is a good thing if you want to get rid of messy JSPs.

Recommended reading

]]> http://weblog.destaquenet.com/2009/12/17/templates-in-10-minutes-with-jsp-and-tag-files/feed/ 0 Lançado website do JsHamcrest! http://weblog.destaquenet.com/2009/11/23/lancado-website-do-jshamcrest/ http://weblog.destaquenet.com/2009/11/23/lancado-website-do-jshamcrest/#comments Mon, 23 Nov 2009 23:55:30 +0000 Daniel Martins http://weblog.destaquenet.com/?p=796 Estamos felizes em anunciar que o site de documentação do JsHamcrest está no ar! Para quem ainda não conhece, JsHamcrest é um projeto open source desenvolvido pela Destaquenet, lançado em Abril de 2009, cujo objetivo é fornecer uma biblioteca útil de matchers para JavaScript.

Os amantes de Python provavelmente irão notar que o site foi criado com Sphinx, uma ferramenta para documentação bastante popular no mundo Python.

Isso por si só é bastante interessante; Sphinx pode ser usado para documentar softwares escritos em diferentes linguagens de programação, não apenas em Python! Inclusive, nossa experiência usando esta ferramenta para documentar um projeto JavaScript foi excelente.

Claro que ainda existem melhorias a serem feitas, mas acho que estamos chegando lá. Quem sabe… :-)

]]> http://weblog.destaquenet.com/2009/11/23/lancado-website-do-jshamcrest/feed/ 0 JsHamcrest website launched! http://weblog.destaquenet.com/2009/11/23/jshamcrest-website-launched/ http://weblog.destaquenet.com/2009/11/23/jshamcrest-website-launched/#comments Mon, 23 Nov 2009 23:37:44 +0000 Daniel Martins http://weblog.destaquenet.com/?p=792 We are pleased to announce that the documentation website for JsHamcrest is now publicly available! For those who don’t know, JsHamcrest is an open source project developed by Destaquenet, first released in April 2009, which aims to provide a useful library of matcher objects for JavaScript.

All Python lovers out there will probably notice that the website was created with Sphinx, a very popular documentation tool in the Python world.

This is very interesting by itself; Sphinx can be used to document softwares written in a wide range of programming languages, not just Python! In fact, our experience using it to document a JavaScript project couldn’t be better.

Of course there’s a lot of room for improvements, but we think we’re getting there. Hopefully. :-)

]]> http://weblog.destaquenet.com/2009/11/23/jshamcrest-website-launched/feed/ 0 Using web scraping to follow your orders on Ticketmaster http://weblog.destaquenet.com/2009/10/12/using-web-scraping-to-follow-your-orders-on-ticketmaster/ http://weblog.destaquenet.com/2009/10/12/using-web-scraping-to-follow-your-orders-on-ticketmaster/#comments Mon, 12 Oct 2009 16:07:10 +0000 Daniel Martins http://weblog.destaquenet.com/?p=760 The legendary rock’n'roll band AC/DC will land on brazilian soil for the second time in November, for what is considered to be the show of the decade around here! The tickets for their single concert, sold by the brazilian Ticketmaster, ran out in less than 48 hours. This concert is going to be amazing!

A lot of things happened during those 48 hous. The Ticketmaster staff had trouble to keep the website on-line, and due to the enormous load, it’s possible that only a few thousands of people had enough luck to buy their tickets via the website.

Also, Ticketmaster admits that the notification e-mails may not reach, which means we cannot rely on those to follow our orders. In fact, they recomend that customers check their orders manually once a day. Oh boy…

I hate to do certain tasks manually, specially the ones that can be automated. So, in this post I’ll show you a very simple Python-based command-line tool that displays the status of your Ticketmaster1 orders on the screen2, using a technique known as web scraping.

The code, which is also on Github, can be seen below:

#!/usr/bin/env python
#-*- coding:utf-8 -*-
 
import urllib
import urllib2
import pynotify
 
 
_BASE_URL  = 'https://ticketing.ticketmaster.com.br'
_LOGIN_URI = '%s/shwLogin.cfm' % _BASE_URL
_ORDER_URI = '%s/shwCompraDetalhe.cfm?pedidoID=%%s' % _BASE_URL
 
_ORDERS_LINK = '<a href="%s">More...</a>' % _LOGIN_URI
 
_PRIORITY_LOW      = pynotify.URGENCY_LOW
_PRIORITY_NORMAL   = pynotify.URGENCY_NORMAL
_PRIORITY_CRITICAL = pynotify.URGENCY_CRITICAL
 
_NOTIFICATION_TITLE = 'Ticketmaster Order %s'
_STATUS_CODES = {
    'Livre'      : ('Not processed yet'      , _PRIORITY_LOW),
    'StdReserva' : ('Reserving your tickets' , _PRIORITY_NORMAL),
    'StdCobranca': ('Charging your tickets'  , _PRIORITY_NORMAL),
    'VendaOk'    : ('Billed'                 , _PRIORITY_CRITICAL),
    'Recusada'   : ('Rejected'               , _PRIORITY_CRITICAL)
}
 
 
def initialize_notification_system(app_title):
    if not pynotify.init(app_title):
        import sys
        sys.exit(1)
 
 
def display_message(title, message, priority=_PRIORITY_CRITICAL):
    message = pynotify.Notification(title, message)
    message.set_urgency(priority)
    message.show()
 
 
def check_orders(email, password, order_ids):
    try:
        opener = urllib2.build_opener(urllib2.HTTPCookieProcessor())
        login(opener, email, password)
        try:
            for order_id in order_ids:
                show_order_status(opener, order_id)
        except:
            title = _NOTIFICATION_TITLE % order_id
            display_message(title, 'Cannot check status')
    except:
        display_message('Ticketmaster', 'Login failed')
 
 
def login(opener, email, password):
    params = urllib.urlencode({'email': email, 'senha': password})
    response = opener.open('%s?tentaLogin=1' % _LOGIN_URI, params)
 
    # Invalid credentials check
    if response.read().find('senha incorreta') >= 0:
        raise Exception
 
 
def show_order_status(opener, order_id):
    response = opener.open(_ORDER_URI % order_id)
    content = response.read()
 
    # Search for the order status codes
    for key, value in _STATUS_CODES.items():
        if content.find(key) >= 0:
            title = _NOTIFICATION_TITLE % order_id
            message = '%s. %s' % (value[0], _ORDERS_LINK)
            display_message(title, message, value[1])
            break
    else:
        display_message(_NOTIFICATION_TITLE % order_id, 'Status not found')
 
 
def main():
    initialize_notification_system("Ticketmaster Order Status")
 
    import optparse
    p = optparse.OptionParser()
 
    # Required command line options
    p.add_option('--email'    , '-e',
        help='E-mail address used in your Ticketmaster credentials.')
    p.add_option('--password' , '-p',
        help='Password used in your Ticketmaster credentials.')
    p.add_option('--order-ids', '-o',
        help='Order IDs to be checked, separated by collons.')
 
    options = p.parse_args()[0]
    if not options.email or not options.password or not options.order_ids:
        p.print_help()
    else:
        order_ids = map(lambda s: s.strip(), options.order_ids.split(','))
        check_orders(options.email, options.password, order_ids)
 
 
if __name__ == '__main__':
    main()

The reason I’ve used web scrapping is because the brazilian Ticketmaster doesn’t seem to provide an API the way Flickr does, for example. Nevertheless, the code is quite simple.

As you can see, it first fires a HTTP request to the login URI in order to validate the user credentials. If the authentication succeeds, our cookie-aware opener will get the session cookies from the server and use them on the following requests, which extract the current order status for each order ID.

Now, let’s give it a spin:

Current order status

Current order status

Finally, add a new entry to your crontab to run the script whenever you want (e.g. every 10 minutes):

*/10 * * * * python ticketmaster_order_status.py --email=your@email.com --password=passwd --order-ids=1234

Good luck and let there be rock! :D

  1. The script only works for the brazilian Ticketmaster website. ↩
  2. The script uses libnotify to display notifications on the screen, so don’t forget to install it. ↩
]]> http://weblog.destaquenet.com/2009/10/12/using-web-scraping-to-follow-your-orders-on-ticketmaster/feed/ 2 Use web scraping para acompanhar seus pedidos na Ticketmaster http://weblog.destaquenet.com/2009/10/05/use-web-scraping-para-acompanhar-seus-pedidos-na-ticketmaster/ http://weblog.destaquenet.com/2009/10/05/use-web-scraping-para-acompanhar-seus-pedidos-na-ticketmaster/#comments Mon, 05 Oct 2009 12:30:43 +0000 Daniel Martins http://weblog.destaquenet.com/?p=710 A legendária banda de rock’n'roll AC/DC irá pousar em solo brasileiro pela segunda vez em Novembro, para o que é considerado o show da década por aqui! Os ingressos para a única apresentação, vendidos pela Ticketmaster, se esgotaram em menos de 48 horas. Esse show será incrível!

Muita coisa aconteceu nessas 48 horas. O pessoal da Ticketmaster teve trabalho para manter o website no ar e, em razão da enorme carga, é possível que apenas poucos milhares de fãs tenham sido sortudos o bastante para comprar seus ingressos através da internet.

Além disso, a Ticketmaster admite que os e-mails de notificação podem não ser enviados, o que significa que não podemos depender deles para acompanhar nossos pedidos. Na verdade, eles até recomendam que seus clientes chequem os pedidos diariamente, na mão. Caramba…

Eu odeio fazer certas tarefas manualmente, especialmente as que podem ser automatizadas. Então, neste post eu mostrarei uma ferramenta escrita em Python que mostra a situação dos seus pedidos Ticketmaster na tela1, usando uma técnica conhecida como web scraping.

O código, que também está disponível no Github, pode ser visto abaixo:

#!/usr/bin/env python
#-*- coding:utf-8 -*-
 
import urllib
import urllib2
import pynotify
 
 
_BASE_URL  = 'https://ticketing.ticketmaster.com.br'
_LOGIN_URI = '%s/shwLogin.cfm' % _BASE_URL
_ORDER_URI = '%s/shwCompraDetalhe.cfm?pedidoID=%%s' % _BASE_URL
 
_ORDERS_LINK = '<a href="%s">More...</a>' % _LOGIN_URI
 
_PRIORITY_LOW      = pynotify.URGENCY_LOW
_PRIORITY_NORMAL   = pynotify.URGENCY_NORMAL
_PRIORITY_CRITICAL = pynotify.URGENCY_CRITICAL
 
_NOTIFICATION_TITLE = 'Ticketmaster Order %s'
_STATUS_CODES = {
    'Livre'      : ('Not processed yet'      , _PRIORITY_LOW),
    'StdReserva' : ('Reserving your tickets' , _PRIORITY_NORMAL),
    'StdCobranca': ('Charging your tickets'  , _PRIORITY_NORMAL),
    'VendaOk'    : ('Billed'                 , _PRIORITY_CRITICAL),
    'Recusada'   : ('Rejected'               , _PRIORITY_CRITICAL)
}
 
 
def initialize_notification_system(app_title):
    if not pynotify.init(app_title):
        import sys
        sys.exit(1)
 
 
def display_message(title, message, priority=_PRIORITY_CRITICAL):
    message = pynotify.Notification(title, message)
    message.set_urgency(priority)
    message.show()
 
 
def check_orders(email, password, order_ids):
    try:
        opener = urllib2.build_opener(urllib2.HTTPCookieProcessor())
        login(opener, email, password)
        try:
            for order_id in order_ids:
                show_order_status(opener, order_id)
        except:
            title = _NOTIFICATION_TITLE % order_id
            display_message(title, 'Cannot check status')
    except:
        display_message('Ticketmaster', 'Login failed')
 
 
def login(opener, email, password):
    params = urllib.urlencode({'email': email, 'senha': password})
    response = opener.open('%s?tentaLogin=1' % _LOGIN_URI, params)
 
    # Invalid credentials check
    if response.read().find('senha incorreta') >= 0:
        raise Exception
 
 
def show_order_status(opener, order_id):
    response = opener.open(_ORDER_URI % order_id)
    content = response.read()
 
    # Search for the order status codes
    for key, value in _STATUS_CODES.items():
        if content.find(key) >= 0:
            title = _NOTIFICATION_TITLE % order_id
            message = '%s. %s' % (value[0], _ORDERS_LINK)
            display_message(title, message, value[1])
            break
    else:
        display_message(_NOTIFICATION_TITLE % order_id, 'Status not found')
 
 
def main():
    initialize_notification_system("Ticketmaster Order Status")
 
    import optparse
    p = optparse.OptionParser()
 
    # Required command line options
    p.add_option('--email'    , '-e', \
        help='E-mail address used in your Ticketmaster credentials.')
    p.add_option('--password' , '-p', \
        help='Password used in your Ticketmaster credentials.')
    p.add_option('--order-ids', '-o', \
        help='Order IDs to be checked, separated by collons.')
 
    options = p.parse_args()[0]
    if not options.email or not options.password or not options.order_ids:
        p.print_help()
    else:
        order_ids = map(lambda s: s.strip(), options.order_ids.split(','))
        check_orders(options.email, options.password, order_ids)
 
 
if __name__ == '__main__':
    main()

A razão pela qual eu optei por web scrapping é porque a Ticketmaster não fornece uma API da mesma forma que o Flickr fornece, por exemplo. Ainda assim, o código é bastante simples.

Como você pode ver, ele primeiro envia uma requisição HTTP para a URI de login com o objetivo de validar as credenciais do usuário. Se a autenticação for bem sucedida, nosso opener receberá os cookies de sessão do servidor e os usará nas requisições seguintes, que buscam a situação de cada um dos pedidos informados.

Rodando o script agora:

Current order status

Current order status

Finalmente, inclua uma nova entrada no seu crontab para que o script rode sempre que necessário (ex: a cada 10 minutos):

*/10 * * * * python ticketmaster_order_status.py --email=seu@email.com --password=senha --order-ids=1234

Boa sorte e let there be rock! :D

  1. O script usa a biblioteca libnotify para mostrar as notificações na tela, portanto não esqueça de instalá-la. ↩
]]> http://weblog.destaquenet.com/2009/10/05/use-web-scraping-para-acompanhar-seus-pedidos-na-ticketmaster/feed/ 0 Linux + Python: Script para checar o status dos seus sites http://weblog.destaquenet.com/2009/07/20/linux-python-script-para-checar-o-status-dos-seus-sites/ http://weblog.destaquenet.com/2009/07/20/linux-python-script-para-checar-o-status-dos-seus-sites/#comments Mon, 20 Jul 2009 16:54:01 +0000 Daniel Martins http://weblog.destaquenet.com/?p=624 Os serviços de hosting que você utiliza estão meio ruim das pernas? Vez ou outra você descobre que seus sites estão fora do ar e ninguém te notificou a respeito?

Infelizmente, coisas assim estão acontecendo por aqui com uma certa frequência. Por isso, resolvi escrever o script abaixo, cuja função é mostrar uma mensagem de notificação sempre que algum dos sites pré-determinados saiam do ar: 1

#!/usr/bin/env python
# -*- coding: utf-8 -*-
 
import httplib
import pynotify
 
def display_message(title, message):
    if pynotify.init('Website Status'):
        n = pynotify.Notification(title, message)
        n.show()
 
def check_status(*websites, **kwargs):
    timeout = kwargs.get('timeout', 5)
    for website in websites:
        conn = httplib.HTTPConnection(website, timeout=timeout)
        try:
            conn.request('GET', '/')
            response = conn.getresponse()
            if response.status != 200:
                raise Error()
        except:
           display_message(website, 'Web site could not be reached!')
 
if __name__ == '__main__':
    check_status('www.awebsite.com', 'www.anotherwebsite.com')

O script em funcionamento:

Exemplo de notificação

Exemplo de notificação

Para completar, se você deseja que esse script seja executado uma vez a cada 5 minutos, basta inserir a linha abaixo no seu crontab:

*/5 * * * * /path/to/script.py

Pronto! Agora, se o seu serviço de hosting continuar deixando a desejar, talvez a melhor solução seja mesmo mudar para outro lugar…

  1. A biblioteca python-notify precisa estar instalada para que o script funcione. ↩
]]> http://weblog.destaquenet.com/2009/07/20/linux-python-script-para-checar-o-status-dos-seus-sites/feed/ 5 JsHamcrest: um alívio à dor de se testar código JavaScript http://weblog.destaquenet.com/2009/07/13/jshamcrest-um-alivio-a-dor-de-se-testar-codigo-javascript/ http://weblog.destaquenet.com/2009/07/13/jshamcrest-um-alivio-a-dor-de-se-testar-codigo-javascript/#comments Mon, 13 Jul 2009 14:10:21 +0000 Daniel Martins http://weblog.destaquenet.com/?p=584 Há não muito tempo atrás, escrever testes automatizados era coisa para poucos. Nem tanto por obstáculos técnicos, mas porque, na verdade, ninguém se importava muito com isso.

A boa notícia é que a importância dos testes automatizados vem aumentando com o tempo e hoje, felizmente, já não é mais necessário “vender” a idéia. O aumento absurdo de ferramentas destinadas a facilitar a aplicação desta prática é uma prova disso.

Falando em ferramentas, neste texto mostrarei o JsHamcrest, um projeto open source desenvolvido pela Destaquenet cujo objetivo é fornecer uma versão incrementada, em JavaScript, da biblioteca Hamcrest. Para quem não conhece, Hamcrest é uma biblioteca de matchers que permite que regras sejam definidas declarativamente para uso em outros frameworks e bibliotecas.

Para apreciar é preciso antes viver sem

Para dar uma idéia do quão útil JsHamcrest pode ser, segue abaixo um exemplo de suite de testes criado com QUnit, ainda sem apoio do JsHamcrest, onde testamos o funcionamento de algumas funcionalidades da classe Array:

$(document).ready(function(){
    test("Literal", function() {
        var arr = [];
        ok(arr instanceof Array);
        equals(arr.length, 0);
    });
 
    test("Reverse", function() {
        var arr = [1, 2, 3, 4, 5].reverse();
        equals(arr.length, 5);
 
        // This assertion fails
        // equals(arr, [5, 4, 3, 2, 1]);
 
        // These assertions work, but in an ideal world you shouldn't do such a thing
        for (var i = 0, j = 5; i < arr.length; i++, j--) {
            equals(arr[i], j);
        }
    });
 
    test("Slice", function() {
        var arr = [1, 2, 3, 4, 5, 6, 7].slice(2, 5);
        equals(arr.length, 3);
 
        // This assertion fails
        // equals(arr, [3, 4, 5]);
 
        // These assertions work, but in an ideal world you shouldn't do such a thing
        for (var i = 0; i < arr.length; i++) {
            equals(arr[i], i+3);
        }
 
        // Another example of complex assertion
        for (var i = 0; i < arr.length; i++) {
            ok(arr[i] >= 3 && arr[i] <= 5);
        }
    });
});

O código, mesmo sendo feio e confuso, funciona:

Primeira versão da suite de testes

Primeira versão da suite de testes

O código desta suite de testes está disponível para download.

(Muitas) Limitações

O primeiro teste, que verifica o funcionamento do literal [], foi muito simples de implementar até porque não há praticamente nada a ser testado. Mas não fique feliz; no mundo real, as chances de seus testes serem assim tão simples são muito baixas.

Isso começa a ficar evidente à partir do segundo teste, onde é preciso apelar para o bom (?) e velho for para conferir o conteúdo do array, uma vez que QUnit não os suporta em comparações de igualdade.

Obviamente a mesma coisa também acontece no terceiro teste. E para mostrar que a a sitiuação só tende a piorar, ainda no terceiro teste temos um outro exemplo de asserção (tão feio quanto) que verifica se todos os elementos do array estão num determinado intervalo.

Infelizmente, a “feiura” não é a única coisa que incomoda nesse código. Para ilustrar, suponha que o terceiro teste estivesse quebrado:

test("Slice", function() {
    var arr = [1, 2, 3, 4, 5, 6, 7].slice(2, 5);
    equals(arr.length, 3);
 
    // ...
 
    // Another example of complex assertion
    for (var i = 0; i <= arr.length; i++) {
        ok(arr[i] >= 3 && arr[i] <= 5);
    }
});

Como esperado, ao rodar os testes, o relatório mostra a ocorrência de um erro. O problema é que esse relatório faz um péssimo trabalho ao tentar mostrar o que de fato falhou:

Relatório de erro não muito amigável

Relatório de erro não muito amigável

Uma forma de se amenizar este problema é passar um texto descritivo aos métodos ok() e equals():

ok(num1 >= 3 && num1 <= 5, "Expected num1 between 3 and 5");
equals(num2, 10, "Checking value of num2");

O problema é que, ao fazer isso, passa a ser necessário um certo cuidado para manter os textos descritivos em sincronia com o código das asserções.

Se QUnit é assim tão ruim…

…por que não o trocar por outra coisa?

Apesar de existirem várias alternativas ao QUnit, nenhuma delas parece ser capaz de resolver problemas como os mostrados aqui. Portanto, trocar de framework, por enquanto, não é a solução.

Mas nem tudo está perdido.

Viva melhor com JsHamcrest

O código mostrado anteriormente pode ser facilmente adaptado para usar JsHamcrest:

// Integrates JsHamcrest with QUnit
JsHamcrest.Integration.QUnit();
 
$(document).ready(function(){
    test("Literal", function() {
        var arr = [];
        assertThat(arr, instanceOf(Array));
        assertThat(arr, empty());
    });
 
    test("Reverse", function() {
        var arr = [1, 2, 3, 4, 5].reverse();
        assertThat(arr, hasSize(5));
        assertThat(arr, equalTo([5, 4, 3, 2, 1]));
    });
 
    test("Slice", function() {
        var arr = [1, 2, 3, 4, 5, 6, 7].slice(2, 5);
        assertThat(arr, hasSize(3));
        assertThat(arr, equalTo([3, 4, 5]));
        assertThat(arr, everyItem(between(3).and(5)));
    });
});

Gostou? :-)

A primeira coisa que salta aos olhos é a simplicidade do código. Basta uma olhada rápida para saber exatamente o que ele faz. Note que mesmo asserções mais complexas como as mostradas nos dois últimos testes são implementadas com facilidade.

O resultado:

Testes com dados detalhados das asserções

Relatório com dados detalhados das asserções

O código desta suite de testes está disponível para download.

E não é só isso. Ao mesmo tempo em que temos um vocabulário riquíssimo de asserções, JsHamcrest também fornece informações detalhadas sobre as mesmas, numa linguagem fácil de entender. E isso tudo isso sem nenhum esforço!

Mais informações sobre a API podem ser encontradas no pacote de documentação do projeto, também disponível para download.

Mas, e quanto ao problema do relatório de erro? Vamos quebrar uma asserção e  ver o que acontece:

test("Slice", function() {
    var arr = [1, 2, 3, 4, 5, 6, 7].slice(2, 5);
    assertThat(arr, hasSize(3));
    assertThat(arr, equalTo([3, 4, 5]));
    assertThat(arr, everyItem(between(3).and(4)));
});

O resultado:

Mensagem de erro amigável

Mensagem de erro amigável

Muito melhor! Basta olhar a mensagem de erro para descobrir o que está errado.

Posso usar JsHamcrest com outro framework?

Atualmente, JsHamcrest integra com cinco frameworks: JsTestDriver, JsUnitTest, jsUnity, YUITest e QUnit.

Outra coisa legal é que integração feita pelo JsHamcrest leva em conta as convenções definidas pelo framework escolhido. Veja, por exemplo, como ficaria o código se tivéssemos optado pelo YUITest em vez do QUnit:

// Integrates JsHamcrest and YUITest
JsHamcrest.Integration.YUITest();
 
YAHOO.namespace("array");
YAHOO.array.TestCase = new YAHOO.tool.TestCase({
    name : "Array tests",
 
    testLiteral: function() {
        var arr = [];
        Assert.that(arr, instanceOf(Array));
        Assert.that(arr, empty());
    },
 
    testReverse: function() {
        var arr = [1, 2, 3, 4, 5].reverse();
        Assert.that(arr, hasSize(5));
        Assert.that(arr, equalTo([5, 4, 3, 2, 1]));
    },
 
    testSlice: function() {
        var arr = [1, 2, 3, 4, 5, 6, 7].slice(2, 5);
        Assert.that(arr, hasSize(3));
        Assert.that(arr, equalTo([3, 4, 5]));
        Assert.that(arr, everyItem(between(3).and(5)));
    }
});

Mas meu framework predileto não está nessa lista…

JsHamcrest pode vir a suportar outros frameworks no futuro. Se seu framework predileto não está na lista dos atualmente suportados, entre em contato conosco.

E aí, o que achou?

Gostou? Odiou? Tem sugestões de melhorias? Gostaríamos muito de ouvir sua opinião!

]]> http://weblog.destaquenet.com/2009/07/13/jshamcrest-um-alivio-a-dor-de-se-testar-codigo-javascript/feed/ 0 Estou no Twitter! http://weblog.destaquenet.com/2009/07/10/no-twitter/ http://weblog.destaquenet.com/2009/07/10/no-twitter/#comments Fri, 10 Jul 2009 13:30:46 +0000 Daniel Martins http://weblog.destaquenet.com/?p=578 Pois é, vai chover dinheiro. :)

Sempre achei — e devo frisar que ainda acho — o Twitter um troço bastante inútil, mas resolvi abrir uma conta mesmo assim e testar a coisa durante alguns dias, só para ver como é. E não é que eu gostei? É, eu sei, pode bater.

Aparentemente, eu tenho uma certa tendência a gostar de coisas inúteis. Mas, hoje em dia, quem não tem?

Enfim, se você gosta de sofrer, não deixe de visitar o meu perfil no Twitter!

]]> http://weblog.destaquenet.com/2009/07/10/no-twitter/feed/ 0 Fabric + VirtualEnv: uma combinação explosiva (no bom sentido) http://weblog.destaquenet.com/2009/07/01/fabric-virtualenv-uma-combinacao-explosiva-no-bom-sentido/ http://weblog.destaquenet.com/2009/07/01/fabric-virtualenv-uma-combinacao-explosiva-no-bom-sentido/#comments Wed, 01 Jul 2009 04:20:01 +0000 Daniel Martins http://weblog.destaquenet.com/?p=554 Escreveu uma super-hiper-biblioteca ou aplicação em Python mas quer se certificar de que ela funciona em diferentes versões do interpretador? Embora isso possa ser resolvido através da execução manual dos testes com os vários interpretadores, isso é chato e improdutivo. Além do mais, cada versão do Python pode ter diferentes bibliotecas instaladas, o que pode acabar influenciando no resultado dos testes.

Temos portanto dois problemas a serem resolvidos. O primeiro problema, relacionado a automatização de tarefas repetitivas, pode ser facilmente solucionado com Fabric, uma ferramenta muito útil para criação de scripts de build e deployment de aplicações. Já escrevemos um texto introdutório sobre a mesma, não deixe de conferir.

O segundo problema, entretanto, é um pouco mais complicado de se resolver, mas não é nenhum bicho de sete cabeças. Com VirtualEnv, é possível criar ambientes Python isolados com o objetivo de testar e executar aplicações em uma espécie de sandbox onde temos total controle sobre as bibliotecas ali instaladas.

Instalando as diferentes versões do Python

O primeiro passo é instalar as versões do Python a serem usadas nos testes. Rode o comando abaixo para instalar os diferentes interpretadores, supondo que você utilize Debian e sua aplicação precise funcionar nas versões 2.4, 2.5 e 2.6 do Python:

$ sudo apt-get install python2.4 python2.4-dev \
    python2.5 python2.5-dev \
    python2.6 python2.6-dev

A versão atual do Ubuntu já inclui o Python 2.6 por padrão. Veja também que aproveitamos para instalar os arquivos de desenvolvimento para cada versão, pois eventualmente precisamos deles para compilar bibliotecas com extensões escritas em C.

Instalando Fabric e VirtualEnv

Da mesma forma:

$ sudo apt-get install python-setuptools

Após a instalação do SetupTools, execute o seguinte comando para instalar o Fabric e o VirtualEnv:

$ sudo easy_install Fabric virtualenv

Configurando ambientes isolados para sua aplicação

O próximo passo é criar ambientes de execução isolados para sua aplicação, sendo que cada ambiente deve usar uma versão diferente do interpretador do Python. Para fazer isso, execute os comandos abaixo, substituindo o APP pelo nome da sua aplicação ou biblioteca:

$ mkdir ~/.virtualenvs
$ cd ~/.virtualenvs
$ virtualenv --python=/usr/bin/python2.6 --no-site-packages APP-py2.6
$ virtualenv --python=/usr/bin/python2.5 --no-site-packages APP-py2.5
$ virtualenv --python=/usr/bin/python2.4 --no-site-packages APP-py2.4

Primeiramente criamos o diretório ~/.virtualenvs, que é por convenção o diretório padrão para armazenamento dos ambientes. Em seguida, criamos três ambientes para nossa aplicação APP. A flag --no-site-packages é opcional e indica que as bibliotecas instaladas no diretório site-packages do Python em questão não devem ser visíveis ao ambiente sendo criado.

Finalmente, não esqueça de instalar, em cada um dos ambientes, as dependências exigidas pela sua aplicação:

$ source ~/.virtualenvs/APP-py2.6/bin/activate
(APP-py2.6) $ easy_install biblioteca1 biblioteca2 ... bibliotecaN
(APP-py2.6) $ source ~/.virtualenvs/APP-py2.5/bin/activate
(APP-py2.5) $ easy_install biblioteca1 biblioteca2 ... bibliotecaN
(APP-py2.5) $ source ~/.virtualenvs/APP-py2.4/bin/activate
(APP-py2.4) $ easy_install biblioteca1 biblioteca2 ... bibliotecaN

Supondo que sua aplicação utilize o SetupTools para a configuração dos metadados do projeto (através do script setup.py), os comandos abaixo devem indicar se a aplicação funciona nos ambientes que criamos:

$ source ~/.virtualenvs/APP-py2.6/bin/activate
(APP-py2.6) $ python setup.py test
...
(APP-py2.6) $ source ~/.virtualenvs/APP-py2.5/bin/activate
(APP-py2.5) $ python setup.py test
...
(APP-py2.5) $ source ~/.virtualenvs/APP-py2.4/bin/activate
(APP-py2.4) $ python setup.py test
...

Automatizando!

Se tudo funcionou até aqui, estamos prontos para criar um script que nos permita rodar os testes de forma automática, nos diferentes ambientes.

Supondo que sua aplicação utilize o SetupTools para a configuração dos metadados do projeto, o exemplo abaixo resolve o problema:

# -*- coding: utf-8 -*-
 
# Environment info
config.project = 'APP'
config.virtualenv_dir = '~/.virtualenvs'
 
# Supported Python versions
config.versions = ('2.4', '2.5', '2.6',)
config.default_version = '2.6'
 
def setup(command, version=config.default_version):
    """Executes the given setup command with a virtual Python installation.
    """
    local('%s/%s-py%s/bin/python setup.py %s' % (config.virtualenv_dir, config.project, version, command))
 
def test():
    """Runs all tests in different Python versions.
    """
    for version in config.versions:
        setup('test', version)

Agora é só alegria:

$ fab test
Fabric v. 0.1.1.
Running test...
[localhost] run: ~/.virtualenvs/APP-py2.4/bin/python setup.py test
...
[localhost] run: ~/.virtualenvs/APP-py2.5/bin/python setup.py test
...
[localhost] run: ~/.virtualenvs/APP-py2.6/bin/python setup.py test
...

Devo lembrar que o script mostrado é só um exemplo. Você pode (e deve) modificá-lo para que este atenda às suas necessidades.

(Bônus!) Distribuindo sua aplicação para diferentes versões do Python

Com mais algumas linhas de código, podemos criar tasks que nos permitam gerar arquivos para distribuição da aplicação para diferentes versões do Python:

def dist_src():
    """Create source archive.
    """
    setup('sdist')
 
def dist_eggs():
    """Create binary archives, one for each Python version.
    """
    for version in config.versions:
        setup('bdist_egg', version)

(Bônus!) Automatizando geração de documentação e upload para o PyPI

Ainda acha pouco? Este outro exemplo de script vai além e mostra, numa aplicação real, como automatizar o registro e upload dos pacotes para o PyPI, atualizar site de documentação, entre outras coisas.

]]> http://weblog.destaquenet.com/2009/07/01/fabric-virtualenv-uma-combinacao-explosiva-no-bom-sentido/feed/ 0